lighthouse-labs/laser_shark

View on GitHub
app/assets/javascripts/calendar_index.js

Summary

Maintainability
B
4 hrs
Test Coverage
(function($) {

  $.fn.gCalReader = function(options) {
    var $div = $(this);

    var defaults = $.extend({
        calendarId: 'en.canadian#holiday@group.v.calendar.google.com',
        apiKey: '',
        startDate: new Date().toISOString(),
        endDate: new Date().toISOString(),
        tag: ['#web']
      },
      options);

    var appendDetails = function(item) {
      var link = item.htmlLink;
      var location = item.location;

      // Create the event holder
      var holderDiv = getEventHolder();

      var activityDiv = document.createElement('div')
      activityDiv.className = "activity";
      
      // Add the icon to the holder
      activityDiv.appendChild(getEventIcon());

      // Add the location 
      activityDiv.appendChild(getEventLocation(item));

      if (item.start.dateTime) {
        activityDiv.appendChild(getStartTime(item));
      }

      // Append all the information before the description
      holderDiv.appendChild(activityDiv);

      if (item.description) {
        getDescription(holderDiv, activityDiv, item);
      }

      // Add the event to the event div
      $($div).append(holderDiv);
    }

    var feedUrl = 'https://www.googleapis.com/calendar/v3/calendars/' +
      encodeURIComponent(defaults.calendarId.trim()) +'/events?key=' + defaults.apiKey +
      '&orderBy=startTime&singleEvents=true' + '&timeMin=' + defaults.startDate + '&timeMax=' + defaults.endDate;

    var eventsHeader = $div.prev();
    eventsHeader.hide();
    eventsHeader.prev().hide();

    function getEventHolder() {
      var holderDiv = document.createElement('div')
      holderDiv.className = "calendar"

      return holderDiv;
    }

    function getEventIcon() {
      var iconDiv = document.createElement('div');
      iconDiv.className = "icon icon-type";

      var iEle = document.createElement('i');
      iEle.className = "fa fa-calendar";

      iconDiv.appendChild(iEle);
      return iconDiv;
    }

    function getEventLocation(eventData) {
      var locationDiv = document.createElement('div');
      var textNode = document.createTextNode(eventData.summary);
      locationDiv.appendChild(textNode);

      if (eventData.location) {
        locationDiv.className = "calendar-event-name-with-location";

        var innerLocationDiv = document.createElement('div');
        innerLocationDiv.className = "calendar-event-location";
        innerLocationDiv.innerHTML = eventData.location;

        locationDiv.appendChild(innerLocationDiv);
      }
      else
        locationDiv.className = "calendar-event-name";

      return locationDiv;
    }

    function getStartTime(eventData) {
      var startTime = eventData.start.dateTime.substring(11,16);
      var endTime = eventData.end.dateTime.substring(11,16);

      var timeDiv = document.createElement('div');
      timeDiv.className = "time"
      timeDiv.innerHTML = startTime + '<br> to ' + endTime + '<br>';

      return timeDiv;
    }

    function getDescription(eventHolder, activityDiv, eventData) {
      var showDescriptionDiv = document.createElement('div');
      showDescriptionDiv.className = "icon icon-calendar-description-button";

      var iEle = document.createElement('i');
      iEle.className = "fa fa-chevron-down";

      showDescriptionDiv.appendChild(iEle);
      activityDiv.appendChild(showDescriptionDiv);

      var descriptionHolder = document.createElement('div');
      descriptionHolder.className = "description-container";

      var descriptionContentDiv = document.createElement('div');
      descriptionContentDiv.className = "description-details";
      descriptionContentDiv.innerHTML = eventData.description;

      $(showDescriptionDiv).click(function() {
        $(descriptionHolder).toggle();
        $(activityDiv).toggleClass('description-open');
      })

      descriptionHolder.appendChild(descriptionContentDiv);
      eventHolder.appendChild(descriptionHolder);
    }

    var getDetails = function(item) {
      var summary = item.summary || '';
      var itemTags = summary.match(/#\w+/g);
      var downcasedItemTags = [];
      if(itemTags) {
        for (var i = 0; i < itemTags.length; i++) {
            downcasedItemTags.push(itemTags[i].toLowerCase());
        }
        var intersection = downcasedItemTags.indexOf(defaults.tag.toLowerCase());
        // Only append the calendar event if the program's tag is part of the events tag
        if(intersection > -1) {
          eventsHeader.show();
          eventsHeader.prev().show();
          appendDetails(item);
        }
      }
      // If it doesn't have hashtags, assume it is event for all
      else {
        eventsHeader.show();
        eventsHeader.prev().show();
        appendDetails(item);
      }
    }
      
    $.ajax({
      url: feedUrl,
      dataType: 'json',
      success: function(data) {
        // If there are events that day, show events section
        if (data.items.length > 0) {
          $.each(data.items, function(e, item){
            getDetails(item);
          });
        }
      }
    });

  };

}(jQuery));