jsyeo · February 28, 2021 18:32 · ghost · Jan 31, 2017 · Smittey · Mar 22, 2017
diff --git a/README.md b/README.md
diff --git a/google_calendar.coffee b/google_calendar.coffee
 class Dashing.GoogleCalendar extends Dashing.Widget

  onData: (data) =>
    event = rest = null
    getEvents = (first, others...) ->
      event = first
      rest = others

    getEvents data.events...

    start = moment(event.start)
    end = moment(event.end)

    @set('event',event)
    @set('event_date', start.format('dddd Do MMMM'))
    @set('event_times', start.format('HH:mm') + " - " + end.format('HH:mm'))

    next_events = []
    for next_event in rest
      start = moment(next_event.start)
      start_date = start.format('Do MMM')
      start_time = start.format('HH:mm')

      next_events.push { summary: next_event.summary, start_date: start_date, start_time: start_time }
    @set('next_events', next_events)
diff --git a/google_calendar.html b/google_calendar.html
 <h1 class="subtitle" >Next event:</h1>
 <h3 class="times" data-bind="event_date"></h3>
 <h2 class="title" data-bind="event.summary"></h2>
 <h3 class="times" data-bind="event_times"></h3>
 <h4 data-bind="next_count"></h4>

 <table class="next">
  <tr data-foreach-e='next_events'>
    <td data-bind="e.start_date"></td>
    <td data-bind="e.start_time"></td>
    <td data-bind="e.summary"></td>
  </tr>
 </table>

 <div class="updated-at" data-bind="updatedAtMessage"></div>
diff --git a/google_calendar.rb b/google_calendar.rb
 require 'icalendar'

 ical_url = 'https://www.google.com/calendar/ical/xxxxxxxx%40group.calendar.google.com/private-xxxxx/basic.ics'
 uri = URI ical_url

 SCHEDULER.every '15s', :first_in => 4 do |job|
  result = Net::HTTP.get uri
  calendars = Icalendar.parse(result)
  calendar = calendars.first

  events = calendar.events.map do |event|
    {
      start: event.dtstart,
      end: event.dtend,
      summary: event.summary
    }
  end.select { |event| event[:start] > DateTime.now }

  events = events.sort { |a, b| a[:start] <=> b[:start] }

  events = events[0..5]

  send_event('google_calendar', { events: events })
 end
diff --git a/google_calendar.scss b/google_calendar.scss
 // ----------------------------------------------------------------------------
 // Sass declarations
 // ----------------------------------------------------------------------------
 $background-color:  #47bbb3; //#ec663c;

 $title-color:       rgba(255, 255, 255, 1);
 $subtitle-color:    rgba(255, 255, 255, 0.7);
 $moreinfo-color:    rgba(255, 255, 255, 0.7);

 // ----------------------------------------------------------------------------
 // Widget-calendar styles
 // ----------------------------------------------------------------------------
 .widget-google-calendar {

  background-color: $background-color;
  .subtitle {
  color: $subtitle-color;
  font-size: 0.75em;
  margin: 15px 0;
  }
  .title {
    color: $title-color;
    font-size: 1.4em;
  }

  .times {
    font-size: 0.9em;
  }

  .next {
    font-size: 0.75em;
    margin-top: 30px;
    .tr {
      border-bottom: 1px solid $subtitle-color;
      .td {
        text-align: left;
      }
    }
  }
  .more-info {
    color: $moreinfo-color;
  }

  .updated-at {
    color: $subtitle-color;
    bottom: 5px;
    right: 5px;
    left: auto;
    font-size: 0.5em;
  }


  &.large h3 {
    font-size: 65px;
  }
 }
diff --git a/google_calendar_widget.png b/google_calendar_widget.png
	class Dashing.GoogleCalendar extends Dashing.Widget

	onData: (data) =>
	event = rest = null
	getEvents = (first, others...) ->
	event = first
	rest = others

	getEvents data.events...

	start = moment(event.start)
	end = moment(event.end)

	@set('event',event)
	@set('event_date', start.format('dddd Do MMMM'))
	@set('event_times', start.format('HH:mm') + " - " + end.format('HH:mm'))

	next_events = []
	for next_event in rest
	start = moment(next_event.start)
	start_date = start.format('Do MMM')
	start_time = start.format('HH:mm')

	next_events.push { summary: next_event.summary, start_date: start_date, start_time: start_time }
	@set('next_events', next_events)
	<h1 class="subtitle" >Next event:</h1>
	<h3 class="times" data-bind="event_date"></h3>
	<h2 class="title" data-bind="event.summary"></h2>
	<h3 class="times" data-bind="event_times"></h3>
	<h4 data-bind="next_count"></h4>

	<table class="next">
	<tr data-foreach-e='next_events'>
	<td data-bind="e.start_date"></td>
	<td data-bind="e.start_time"></td>
	<td data-bind="e.summary"></td>
	</tr>
	</table>

	<div class="updated-at" data-bind="updatedAtMessage"></div>
	require 'icalendar'

	ical_url = 'https://www.google.com/calendar/ical/xxxxxxxx%40group.calendar.google.com/private-xxxxx/basic.ics'
	uri = URI ical_url

	SCHEDULER.every '15s', :first_in => 4 do \|job\|
	result = Net::HTTP.get uri
	calendars = Icalendar.parse(result)
	calendar = calendars.first

	events = calendar.events.map do \|event\|
	{
	start: event.dtstart,
	end: event.dtend,
	summary: event.summary
	}
	end.select { \|event\| event[:start] > DateTime.now }

	events = events.sort { \|a, b\| a[:start] <=> b[:start] }

	events = events[0..5]

	send_event('google_calendar', { events: events })
	end
	// ----------------------------------------------------------------------------
	// Sass declarations
	// ----------------------------------------------------------------------------
	$background-color: #47bbb3; //#ec663c;

	$title-color: rgba(255, 255, 255, 1);
	$subtitle-color: rgba(255, 255, 255, 0.7);
	$moreinfo-color: rgba(255, 255, 255, 0.7);

	// ----------------------------------------------------------------------------
	// Widget-calendar styles
	// ----------------------------------------------------------------------------
	.widget-google-calendar {

	background-color: $background-color;
	.subtitle {
	color: $subtitle-color;
	font-size: 0.75em;
	margin: 15px 0;
	}
	.title {
	color: $title-color;
	font-size: 1.4em;
	}

	.times {
	font-size: 0.9em;
	}

	.next {
	font-size: 0.75em;
	margin-top: 30px;
	.tr {
	border-bottom: 1px solid $subtitle-color;
	.td {
	text-align: left;
	}
	}
	}
	.more-info {
	color: $moreinfo-color;
	}

	.updated-at {
	color: $subtitle-color;
	bottom: 5px;
	right: 5px;
	left: auto;
	font-size: 0.5em;
	}


	&.large h3 {
	font-size: 65px;
	}
	}