Add polymer 1.0 to npm_modules

polymer_1.0.4/bower_components/google-calendar/google-calendar.html

+<link rel="import" href="../polymer/polymer.html">
+<link rel="import" href="../google-signin/google-signin-aware.html">
+<link rel="import" href="../google-apis/google-client-loader.html">
+
+
+<!--
+Element providing a list of Google Calendars for a signed in user.
+Needs a google-signin element included somewhere on the same page
+that handles authentication.
+
+##### Example
+
+    <google-calendar-list title="What I'm up to"></google-calendar-list>
+
+@demo
+-->
+<dom-module id="google-calendar-list">
+  <style>
+    :host, span {
+      display: inline-block;
+    }
+    ul {
+      list-style: none;
+      padding: 0;
+    }
+
+    li {
+      font-family: Arial, sans-serif;
+      display: block;
+      list-style: none;
+      width: 300px;
+      border-radius: .2em;
+      padding: .2em;
+      margin: .2em;
+      overflow: hidden;
+    }
+
+    li a {
+      color: inherit;
+      display: block;
+      text-decoration: none;
+    }
+  </style>
+  <template>
+    <google-client-loader id="calendar" name="calendar" version="v3"
+      on-google-api-load="displayCalendars"></google-client-loader>
+    <google-signin-aware
+      scopes="https://www.googleapis.com/auth/calendar.readonly"
+      is-authorized="{{_signedIn}}"></google-signin-aware>
+
+    <ul id="calendars">
+      <li>{{title}}</li>
+      <template is="dom-repeat" items="{{calendars}}">
+        <li style$="{{_computeCalStyle(item.backgroundColor)}}">
+          <a href="{{_computeCalHref(item.id, item.timeZone)}}" target="_blank">{{item.summary}}</a>
+        </li>
+      </template>
+    </ul>
+  </template>
+</dom-module>
+
+<script>
+  Polymer({
+
+    is: 'google-calendar-list',
+
+    properties: {
+      _signedIn: {
+        type: Boolean,
+        value: false,
+        observer: '_signInChanged'
+      },
+      /**
+       * A title to be displayed on top of the calendar list.
+       */
+      title: {
+        type: String,
+        value: 'My calendars'
+      },
+      /**
+       * List of calendars
+       */
+      calendars: {
+        type: Array,
+        value: function() { return []; },
+        readOnly: true
+      }
+    },
+
+    _signInChanged: function(val) {
+      if (val) {
+        this.displayCalendars();
+      }
+      else {
+        this._setCalendars([]);
+      }
+    },
+
+    _computeCalStyle: function(backgroundColor) {
+      return 'background-color:' + (backgroundColor || 'gray');
+    },
+    _computeCalHref: function(calId, calTimeZone) {
+      return 'https://www.google.com/calendar/embed?src=' + calId + '&ctz=' + calTimeZone;
+    },
+    /**
+     * Displays the calendar list if the user is signed in to Google.
+     */
+    displayCalendars: function() {
+      if (this._signedIn && this.$.calendar.api) {
+          var request = this.$.calendar.api.calendarList.list({"key": ""});
+
+        // var request = this.$.calendar.api.calendarList.list({"key": ""});
+        request.execute(function(resp) {
+          if (resp.error) {
+            console.error("Error with calendarList.list", resp.message)
+          } else {
+            this._setCalendars(resp.items);
+          }
+        }.bind(this));
+      }
+    }
+  });
+</script>
+
+
+<dom-module id="google-calendar-busy-now">
+  <style>
+    span {
+      font-family: Arial, sans-serif;
+      display: inline-block;
+      border-radius: .2em;
+      padding: .2em;
+      margin: .2em;
+      overflow: hidden;
+    }
+
+    .busy {
+      background-color: #FA573C;
+    }
+
+    .free {
+      background-color: #7BD148;
+    }
+
+    .na {
+      background-color: #999;
+    }
+  </style>
+  <template>
+      <google-client-loader id="calendar" name="calendar" version="v3"
+        on-google-api-load="displayBusy"></google-client-loader>
+      <google-signin-aware
+        scopes="https://www.googleapis.com/auth/calendar.readonly"
+        is-authorized="{{_isAuthorized}}"></google-signin-aware>
+
+    <span class$="{{_labelClass}}">{{_label}}</span>
+  </template>
+</dom-template>
+<script>
+  (function() {
+    var MS_PER_MINUTE = 60000;
+    var TIME_SPAN = 30;
+
+/**
+A badge showing the free/busy status based on the events in a given calendar.
+
+##### Example
+
+    <google-calendar-busy-now
+        calendarId="YOUR_CAL_ID"
+        apiKey="YOUR_API_KEY"
+        busyLabel="Do not disturb"
+        freeLabel="I'm free, talk to me!">
+    </google-calendar-busy-now>
+
+*/
+    Polymer({
+      is: 'google-calendar-busy-now',
+
+      properties: {
+        /**
+         * Event from this calendar decide whether the status is free/busy.
+         */
+        calendarId: {
+          type: String,
+          value: null,
+          observer: '_calendarIdChanged'
+        },
+        /**
+         * API key to use with Calendar API requests.
+         */
+        apiKey: {
+          type: String,
+          value: null
+        },
+        /**
+         * Label to be displayed if the status is busy.
+         */
+        busyLabel: {
+          type: String,
+          value: "I'm busy"
+        },
+        /**
+         * Label to be displayed if the status is free.
+         */
+        freeLabel: {
+          type: String,
+          value: "I'm free"
+        },
+
+        _labelClass: {
+          type: String,
+          value: ''
+        },
+
+        _label: {
+          type: String,
+          value: ''
+        },
+
+        _isAuthorized: {
+          type: Boolean,
+          value: false,
+          observer: '_isAuthorizedChanged'
+        }
+      },
+
+      _calendarIdChanged: function() {
+        this.displayBusy();
+      },
+
+      _isAuthorizedChanged: function() {
+        this.displayBusy();
+      },
+
+      _setState: function(state) {
+        switch(state) {
+          case 'free':
+            this._label = this.freeLabel;
+            this._labelClass = 'free';
+            break;
+          case 'busy':
+            this._label = this.busyLabel;
+            this._labelClass = 'busy';
+            break;
+          case 'na':
+            this._label = 'n/a';
+            this._labelClass = 'na';
+            break;
+        };
+      },
+      /**
+        * Displays the busy/free status. Use it to refresh label state
+        */
+      displayBusy: function() {
+        if (!this.calendarId) {
+          console.log('CalendarId is required for this component');
+          return;
+        }
+        if (!this._isAuthorized) {
+          this._setState('na');
+          return;
+        }
+        if (this.$.calendar.api) {
+          if (this.apiKey) {
+            gapi.client.setApiKey(this.apiKey);
+          }
+          var now = new Date();
+          var query = {
+            timeMin: now.toISOString(),
+            timeMax: new Date(now.valueOf() + TIME_SPAN * MS_PER_MINUTE).toISOString(),
+            items: [
+              {
+                id: this.calendarId
+              }
+            ]
+          }
+          var request = this.$.calendar.api.freebusy.query(query);
+          request.execute(function(resp) {
+            if (!resp.calendars) {
+              if (resp.error) {
+                this._setState('na');
+              } else {
+                this._setState('free');
+              }
+              return;
+            }
+            if (resp.calendars[this.calendarId].errors) {
+              this._setState('na');
+              return;
+            }
+            var now = new Date();
+            var busyTimes = resp.calendars[this.calendarId];
+            for (var i = 0, busyTime; busyTime = busyTimes.busy[i]; i++) {
+              var start = new Date(busyTime.start);
+              var end = new Date(busyTime.end);
+              var busy = start < now && now < end;
+              this._setState( busy ? 'busy': 'free');
+              if (busy) {
+                break;
+              }
+            }
+          }.bind(this));
+        }
+      }
+    });
+  })();
+</script>
+