FIx ESlint warnings

package.json

@@ -25,6 +25,7 @@
     "babel-eslint": "^4.0.5",
     "babel-loader": "^5.3.2",
     "bower": "^1.4.1",
+    "eslint": "^1.1.0",
     "eslint-config-airbnb": "0.0.7",
     "eslint-plugin-react": "^3.2.1",
     "html-minifier": "^0.7.2",

src/cards/state-card-configurator.js

@@ -3,7 +3,7 @@ import Polymer from '../polymer';
 require('../components/state-info');
 require('./state-card-display');
 
-export default Polymer({
+export default new Polymer({
   is: 'state-card-configurator',
 
   properties: {

src/cards/state-card-content.js

@@ -9,18 +9,18 @@ require('./state-card-configurator');
 require('./state-card-scene');
 require('./state-card-media_player');
 
-export default Polymer({
+export default new Polymer({
   is: 'state-card-content',
 
   properties: {
     stateObj: {
       type: Object,
       observer: 'stateObjChanged',
-    }
+    },
   },
 
-  stateObjChanged: function(newVal, oldVal) {
+  stateObjChanged(newVal, oldVal) {
-    var root = Polymer.dom(this);
+    const root = Polymer.dom(this);
 
     if (!newVal) {
       if (root.lastChild) {
@@ -29,14 +29,14 @@ export default Polymer({
       return;
     }
 
-    var newCardType = stateCardType(newVal);
+    const newCardType = stateCardType(newVal);
 
-    if (!oldVal || stateCardType(oldVal) != newCardType) {
+    if (!oldVal || stateCardType(oldVal) !== newCardType) {
       if (root.lastChild) {
         root.removeChild(root.lastChild);
       }
 
-      var stateCard = document.createElement("state-card-" + newCardType);
+      const stateCard = document.createElement(`state-card-${newCardType}`);
       stateCard.stateObj = newVal;
       root.appendChild(stateCard);
     } else {

src/cards/state-card-display.js

@@ -2,7 +2,7 @@ import Polymer from '../polymer';
 
 require('../components/state-info');
 
-export default Polymer({
+export default new Polymer({
   is: 'state-card-display',
 
   properties: {
@@ -10,4 +10,4 @@ export default Polymer({
       type: Object,
     },
   },
-});
+});

src/cards/state-card-media_player.html

@@ -34,7 +34,7 @@
       <state-info state-obj="[[stateObj]]"></state-info>
       <div class='state'>
         <div class='main-text'>[[computePrimaryText(stateObj, isPlaying)]]</div>
-        <div class='secondary-text'>[[computeSecondaryText(stateObj, isPlaying)]]</div>
+        <div class='secondary-text'>[[computeSecondaryText(stateObj)]]</div>
       </div>
     </div>
   </template>

src/cards/state-card-media_player.js

@@ -4,7 +4,7 @@ require('../components/state-info');
 
 const PLAYING_STATES = ['playing', 'paused'];
 
-export default Polymer({
+export default new Polymer({
   is: 'state-card-media_player',
 
   properties: {
@@ -18,33 +18,29 @@ export default Polymer({
     },
   },
 
-  computeIsPlaying: function(stateObj) {
+  computeIsPlaying(stateObj) {
     return PLAYING_STATES.indexOf(stateObj.state) !== -1;
   },
 
-  computePrimaryText: function(stateObj, isPlaying) {
+  computePrimaryText(stateObj, isPlaying) {
     return isPlaying ? stateObj.attributes.media_title : stateObj.stateDisplay;
   },
 
-  computeSecondaryText: function(stateObj, isPlaying) {
+  computeSecondaryText(stateObj) {
-    var text;
+    let text;
 
-    if (stateObj.attributes.media_content_type == 'music') {
+    if (stateObj.attributes.media_content_type === 'music') {
       return stateObj.attributes.media_artist;
-
+    } else if (stateObj.attributes.media_content_type === 'tvshow') {
-    } else if (stateObj.attributes.media_content_type == 'tvshow') {
       text = stateObj.attributes.media_series_title;
 
       if (stateObj.attributes.media_season && stateObj.attributes.media_episode) {
         text += ` S${stateObj.attributes.media_season}E${stateObj.attributes.media_episode}`;
       }
       return text;
-
     } else if (stateObj.attributes.app_name) {
       return stateObj.attributes.app_name;
-
-    } else {
-      return '';
     }
+    return '';
   },
 });

src/cards/state-card-scene.js

@@ -3,7 +3,7 @@ import Polymer from '../polymer';
 require('./state-card-display');
 require('./state-card-toggle');
 
-export default Polymer({
+export default new Polymer({
   is: 'state-card-scene',
 
   properties: {
@@ -18,7 +18,7 @@ export default Polymer({
     },
   },
 
-  computeAllowToggle: function(stateObj) {
+  computeAllowToggle(stateObj) {
     return stateObj.state === 'off' || stateObj.attributes.active_requested;
   },
 });

src/cards/state-card-thermostat.js

@@ -2,7 +2,7 @@ import Polymer from '../polymer';
 
 require('../components/state-info');
 
-export default Polymer({
+export default new Polymer({
   is: 'state-card-thermostat',
 
   properties: {

src/cards/state-card-toggle.js

@@ -4,7 +4,7 @@ import Polymer from '../polymer';
 
 require('../components/state-info');
 
-export default Polymer({
+export default new Polymer({
   is: 'state-card-toggle',
 
   properties: {
@@ -28,11 +28,11 @@ export default Polymer({
   },
 
   toggleChanged(ev) {
-    var newVal = ev.target.checked;
+    const newVal = ev.target.checked;
 
-    if(newVal && this.stateObj.state === "off") {
+    if (newVal && this.stateObj.state === 'off') {
       this.turn_on();
-    } else if(!newVal && this.stateObj.state === "on") {
+    } else if (!newVal && this.stateObj.state === 'on') {
       this.turn_off();
     }
   },
@@ -44,7 +44,7 @@ export default Polymer({
   },
 
   updateToggle(stateObj) {
-    this.toggleChecked = stateObj && stateObj.state === "on";
+    this.toggleChecked = stateObj && stateObj.state === 'on';
   },
 
   forceStateChange() {

src/cards/state-card.js

@@ -4,7 +4,7 @@ import Polymer from '../polymer';
 
 require('./state-card-content');
 
-export default Polymer({
+export default new Polymer({
   is: 'state-card',
 
   properties: {

src/components/display-time.js

@@ -2,7 +2,7 @@ import Polymer from '../polymer';
 
 import formatTime from '../util/format-time';
 
-export default Polymer({
+export default new Polymer({
   is: 'display-time',
 
   properties: {

src/components/domain-icon.js

@@ -2,7 +2,7 @@ import Polymer from '../polymer';
 
 import domainIcon from '../util/domain-icon';
 
-export default Polymer({
+export default new Polymer({
   is: 'domain-icon',
 
   properties: {

src/components/entity-list.js

@@ -3,7 +3,7 @@ import { entityGetters } from 'home-assistant-js';
 import Polymer from '../polymer';
 import nuclearObserver from '../util/bound-nuclear-behavior';
 
-export default Polymer({
+export default new Polymer({
   is: 'entity-list',
 
   behaviors: [nuclearObserver],
@@ -13,7 +13,7 @@ export default Polymer({
       type: Array,
       bindNuclear: [
         entityGetters.entityMap,
-        (map) => map.valueSeq().sortBy((entity) => entity.entityId).toArray()
+        (map) => map.valueSeq().sortBy((entity) => entity.entityId).toArray(),
       ],
     },
   },

src/components/events-list.js

@@ -3,7 +3,7 @@ import { eventGetters } from 'home-assistant-js';
 import Polymer from '../polymer';
 import nuclearObserver from '../util/bound-nuclear-behavior';
 
-export default Polymer({
+export default new Polymer({
   is: 'events-list',
 
   behaviors: [nuclearObserver],
@@ -13,7 +13,7 @@ export default Polymer({
       type: Array,
       bindNuclear: [
         eventGetters.entityMap,
-        (map) => map.valueSeq().sortBy((event) => event.event).toArray()
+        (map) => map.valueSeq().sortBy((event) => event.event).toArray(),
       ],
     },
   },

src/components/ha-color-picker.js

@@ -11,140 +11,141 @@ import Polymer from '../polymer';
  * given red, green, blue values, return the equivalent hexidecimal value
  * base source: http://stackoverflow.com/a/5624139
  */
-var componentToHex = function(c) {
+function componentToHex(c) {
-  var hex = c.toString(16);
+  const hex = c.toString(16);
-  return hex.length === 1 ? "0" + hex : hex;
+  return hex.length === 1 ? '0' + hex : hex;
-};
+}
 
-var rgbToHex = function(color) {
+function rgbToHex(color) {
-  return "#" + componentToHex(color.r) + componentToHex(color.g) +
+  return '#' + componentToHex(color.r) + componentToHex(color.g) +
          componentToHex(color.b);
-};
+}
 
-export default Polymer({
+export default new Polymer({
-    is: 'ha-color-picker',
+  is: 'ha-color-picker',
 
-    properties: {
+  properties: {
-        width: {
+    width: {
-            type: Number,
+      type: Number,
-            value: 300,
+      value: 300,
-        },
-        height: {
-            type: Number,
-            value: 300,
-        },
-        color: {
-          type: Object,
-        },
     },
-
+    height: {
-    listeners: {
+      type: Number,
-      'mousedown': 'onMouseDown',
+      value: 300,
-      'mouseup': 'onMouseUp',
-      'touchstart': 'onTouchStart',
-      'touchend': 'onTouchEnd',
-      'tap': 'onTap',
     },
-
+    color: {
-    onMouseDown(e) {
+      type: Object,
-        this.onMouseMove(e);
-        this.addEventListener('mousemove', this.onMouseMove);
     },
+  },
 
-    onMouseUp(e) {
+  listeners: {
-        this.removeEventListener('mousemove', this.onMouseMove);
+    'mousedown': 'onMouseDown',
-    },
+    'mouseup': 'onMouseUp',
+    'touchstart': 'onTouchStart',
+    'touchend': 'onTouchEnd',
+    'tap': 'onTap',
+  },
 
-    onTouchStart(e) {
+  onMouseDown(e) {
-        this.onTouchMove(e);
+    this.onMouseMove(e);
-        this.addEventListener('touchmove', this.onTouchMove);
+    this.addEventListener('mousemove', this.onMouseMove);
-    },
+  },
 
-    onTouchEnd(e) {
+  onMouseUp() {
-        this.removeEventListener('touchmove', this.onTouchMove);
+    this.removeEventListener('mousemove', this.onMouseMove);
-    },
+  },
 
-    onTap(e) {
+  onTouchStart(e) {
-      e.stopPropagation();
+    this.onTouchMove(e);
-    },
+    this.addEventListener('touchmove', this.onTouchMove);
+  },
 
-    onTouchMove(e) {
+  onTouchEnd() {
-      var touch = e.touches[0];
+    this.removeEventListener('touchmove', this.onTouchMove);
-      this.onColorSelect(e, {x: touch.clientX, y: touch.clientY});
+  },
-    },
 
-    onMouseMove(e) {
+  onTap(e) {
-      e.preventDefault();
+    e.stopPropagation();
-      if (this.mouseMoveIsThrottled) {
+  },
-        this.mouseMoveIsThrottled = false;
-        this.onColorSelect(e);
-        this.async(() => this.mouseMoveIsThrottled = true, 100);
-      }
-    },
 
-    onColorSelect(e, coords) {
+  onTouchMove(e) {
-      if (this.context) {
+    const touch = e.touches[0];
-        coords = coords || this.relativeMouseCoordinates(e);
+    this.onColorSelect(e, {x: touch.clientX, y: touch.clientY});
-        var data = this.context.getImageData(coords.x, coords.y, 1, 1).data;
+  },
 
-        this.setColor({r: data[0], g: data[1], b: data[2]});
+  onMouseMove(e) {
-      }
+    e.preventDefault();
-    },
+    if (this.mouseMoveIsThrottled) {
+      this.mouseMoveIsThrottled = false;
+      this.onColorSelect(e);
+      this.async(() => this.mouseMoveIsThrottled = true, 100);
+    }
+  },
 
-    setColor(rgb) {
+  onColorSelect(e, coords) {
-      //save calculated color
+    if (this.context) {
-      this.color = {hex: rgbToHex(rgb), rgb: rgb};
+      const colorCoords = coords || this.relativeMouseCoordinates(e);
+      const data = this.context.getImageData(colorCoords.x, colorCoords.y, 1, 1).data;
 
-      this.fire('colorselected', {
+      this.setColor({r: data[0], g: data[1], b: data[2]});
-        rgb: this.color.rgb,
+    }
-        hex: this.color.hex
+  },
-      });
-    },
 
-    /**
+  setColor(rgb) {
-     * given a mouse click event, return x,y coordinates relative to the clicked target
+    // save calculated color
-     * @returns object with x, y values
+    this.color = {hex: rgbToHex(rgb), rgb: rgb};
-     */
-    relativeMouseCoordinates(e) {
-      var x = 0, y = 0;
 
-      if (this.canvas) {
+    this.fire('colorselected', {
-        var rect = this.canvas.getBoundingClientRect();
+      rgb: this.color.rgb,
-        x = e.clientX - rect.left;
+      hex: this.color.hex,
-        y = e.clientY - rect.top;
+    });
-      }
+  },
 
-      return {
+  /**
-          x: x,
+   * given a mouse click event, return x,y coordinates relative to the clicked target
-          y: y
+   * @returns object with x, y values
-      };
+   */
-    },
+  relativeMouseCoordinates(e) {
+    let x = 0;
+    let y = 0;
 
-    ready() {
+    if (this.canvas) {
-      this.setColor = this.setColor.bind(this);
+      const rect = this.canvas.getBoundingClientRect();
-      this.mouseMoveIsThrottled = true;
+      x = e.clientX - rect.left;
-      this.canvas = this.children[0];
+      y = e.clientY - rect.top;
-      this.context = this.canvas.getContext('2d');
+    }
 
-      var colorGradient = this.context.createLinearGradient(0, 0, this.width, 0);
+    return {
-      colorGradient.addColorStop(0, "rgb(255,0,0)");
+      x: x,
-      colorGradient.addColorStop(0.16, "rgb(255,0,255)");
+      y: y,
-      colorGradient.addColorStop(0.32, "rgb(0,0,255)");
+    };
-      colorGradient.addColorStop(0.48, "rgb(0,255,255)");
+  },
-      colorGradient.addColorStop(0.64, "rgb(0,255,0)");
-      colorGradient.addColorStop(0.80, "rgb(255,255,0)");
-      colorGradient.addColorStop(1, "rgb(255,0,0)");
-      this.context.fillStyle = colorGradient;
-      this.context.fillRect(0, 0, this.width, this.height);
 
-      var bwGradient = this.context.createLinearGradient(0, 0, 0, this.height);
+  ready() {
-      bwGradient.addColorStop(0, "rgba(255,255,255,1)");
+    this.setColor = this.setColor.bind(this);
-      bwGradient.addColorStop(0.5, "rgba(255,255,255,0)");
+    this.mouseMoveIsThrottled = true;
-      bwGradient.addColorStop(0.5, "rgba(0,0,0,0)");
+    this.canvas = this.children[0];
-      bwGradient.addColorStop(1, "rgba(0,0,0,1)");
+    this.context = this.canvas.getContext('2d');
 
-      this.context.fillStyle = bwGradient;
+    const colorGradient = this.context.createLinearGradient(0, 0, this.width, 0);
-      this.context.fillRect(0, 0, this.width, this.height);
+    colorGradient.addColorStop(0, 'rgb(255,0,0)');
-    },
+    colorGradient.addColorStop(0.16, 'rgb(255,0,255)');
+    colorGradient.addColorStop(0.32, 'rgb(0,0,255)');
+    colorGradient.addColorStop(0.48, 'rgb(0,255,255)');
+    colorGradient.addColorStop(0.64, 'rgb(0,255,0)');
+    colorGradient.addColorStop(0.80, 'rgb(255,255,0)');
+    colorGradient.addColorStop(1, 'rgb(255,0,0)');
+    this.context.fillStyle = colorGradient;
+    this.context.fillRect(0, 0, this.width, this.height);
+
+    const bwGradient = this.context.createLinearGradient(0, 0, 0, this.height);
+    bwGradient.addColorStop(0, 'rgba(255,255,255,1)');
+    bwGradient.addColorStop(0.5, 'rgba(255,255,255,0)');
+    bwGradient.addColorStop(0.5, 'rgba(0,0,0,0)');
+    bwGradient.addColorStop(1, 'rgba(0,0,0,1)');
+
+    this.context.fillStyle = bwGradient;
+    this.context.fillRect(0, 0, this.width, this.height);
+  },
 
 });

src/components/ha-logbook.js

@@ -2,7 +2,7 @@ import Polymer from '../polymer';
 
 require('./logbook-entry');
 
-Polymer({
+export default new Polymer({
   is: 'ha-logbook',
 
   properties: {
@@ -14,5 +14,5 @@ Polymer({
 
   noEntries(entries) {
     return !entries.length;
-  }
+  },
 });

src/components/ha-sidebar.js

@@ -14,7 +14,7 @@ require('./stream-status');
 
 const { entityDomainFilters } = util;
 
-Polymer({
+export default new Polymer({
   is: 'ha-sidebar',
 
   behaviors: [nuclearObserver],
@@ -36,7 +36,7 @@ Polymer({
       value: [],
       bindNuclear: [
         navigationGetters.possibleEntityDomainFilters,
-        (domains) => domains.toArray()
+        (domains) => domains.toArray(),
       ],
     },
 
@@ -61,10 +61,10 @@ Polymer({
     // if (this.menuSelected !== newVal) {
     //   this.menuSelected = newVal;
     // }
-    var menuItems = this.querySelectorAll('.menu [data-panel]');
+    const menuItems = this.querySelectorAll('.menu [data-panel]');
 
-    for (var i = 0; i < menuItems.length; i++) {
+    for (let i = 0; i < menuItems.length; i++) {
-      if(menuItems[i].getAttribute('data-panel') === newVal) {
+      if (menuItems[i].getAttribute('data-panel') === newVal) {
         menuItems[i].classList.add('selected');
       } else {
         menuItems[i].classList.remove('selected');
@@ -73,11 +73,11 @@ Polymer({
   },
 
   menuClicked(ev) {
-    var target = ev.target;
+    let target = ev.target;
-    var checks = 5;
+    let checks = 5;
 
     // find panel to select
-    while(checks && !target.getAttribute('data-panel')) {
+    while (checks && !target.getAttribute('data-panel')) {
       target = target.parentElement;
       checks--;
     }
@@ -94,9 +94,9 @@ Polymer({
   },
 
   selectPanel(newChoice) {
-    if(newChoice === this.selected) {
+    if (newChoice === this.selected) {
       return;
-    } else if (newChoice == 'logout') {
+    } else if (newChoice === 'logout') {
       this.handleLogOut();
       return;
     }

src/components/ha-voice-command-progress.js

@@ -3,7 +3,7 @@ import { voiceGetters } from 'home-assistant-js';
 import Polymer from '../polymer';
 import nuclearObserver from '../util/bound-nuclear-behavior';
 
-export default Polymer({
+export default new Polymer({
   is: 'ha-voice-command-progress',
 
   behaviors: [nuclearObserver],

src/components/loading-box.js

@@ -1,5 +1,5 @@
 import Polymer from '../polymer';
 
-export default Polymer({
+export default new Polymer({
   is: 'loading-box',
 });

src/components/logbook-entry.js

@@ -6,11 +6,11 @@ require('./domain-icon');
 require('./display-time');
 require('./relative-ha-datetime');
 
-export default Polymer({
+export default new Polymer({
   is: 'logbook-entry',
 
-  entityClicked: function(ev) {
+  entityClicked(ev) {
     ev.preventDefault();
     moreInfoActions.selectEntity(this.entryObj.entityId);
-  }
+  },
 });

src/components/relative-ha-datetime.js

@@ -6,7 +6,7 @@ const UPDATE_INTERVAL = 60000; // 60 seconds
 
 const { parseDateTime } = util;
 
-export default Polymer({
+export default new Polymer({
   is: 'relative-ha-datetime',
 
   properties: {
@@ -56,6 +56,6 @@ export default Polymer({
 
   updateRelative() {
     this.relativeTime = this.parsedDateTime ?
-      moment(this.parsedDateTime).fromNow() : "";
+      moment(this.parsedDateTime).fromNow() : '';
   },
 });

src/components/services-list.js

@@ -5,7 +5,7 @@ import nuclearObserver from '../util/bound-nuclear-behavior';
 
 require('./domain-icon');
 
-export default Polymer({
+export default new Polymer({
   is: 'services-list',
 
   behaviors: [nuclearObserver],
@@ -15,7 +15,7 @@ export default Polymer({
       type: Array,
       bindNuclear: [
         serviceGetters.entityMap,
-        (map) => map.valueSeq().sortBy((domain) => domain.domain).toJS()
+        (map) => map.valueSeq().sortBy((domain) => domain.domain).toJS(),
       ],
     },
   },

src/components/state-badge.js

@@ -4,7 +4,7 @@ import xyBriToRgb from '../util/xybri-to-rgb';
 
 require('./domain-icon');
 
-export default Polymer({
+export default new Polymer({
   is: 'state-badge',
 
   properties: {
@@ -19,13 +19,12 @@ export default Polymer({
    */
   updateIconColor(newVal) {
     // for domain light, set color of icon to light color if available
-    if(newVal.domain == "light" && newVal.state == "on" &&
+    if (newVal.domain === 'light' && newVal.state === 'on' &&
        newVal.attributes.brightness && newVal.attributes.xy_color) {
-
+      const rgb = xyBriToRgb(newVal.attributes.xy_color[0],
-      var rgb = xyBriToRgb(newVal.attributes.xy_color[0],
+                             newVal.attributes.xy_color[1],
-                           newVal.attributes.xy_color[1],
+                             newVal.attributes.brightness);
-                           newVal.attributes.brightness);
+      this.$.icon.style.color = 'rgb(' + rgb.map(Math.floor).join(',') + ')';
-      this.$.icon.style.color = "rgb(" + rgb.map(Math.floor).join(",") + ")";
     } else {
       this.$.icon.style.color = null;
     }

src/components/state-cards.js

@@ -2,7 +2,7 @@ import Polymer from '../polymer';
 
 require('../cards/state-card');
 
-Polymer({
+export default new Polymer({
   is: 'state-cards',
 
   properties: {

src/components/state-history-chart-line.js

@@ -5,7 +5,7 @@ import sortBy from 'lodash/collection/sortBy';
 
 import Polymer from '../polymer';
 
-export default Polymer({
+export default new Polymer({
   is: 'state-history-chart-line',
 
   properties: {
@@ -42,7 +42,7 @@ export default Polymer({
     this.drawChart();
   },
 
-  /**************************************************
+  /* *************************************************
   The following code gererates line graphs for devices with continuous
   values(which are devices that have a unit_of_measurement values defined).
   On each graph the devices are grouped by their unit of measurement, eg. all
@@ -66,9 +66,9 @@ export default Polymer({
       return;
     }
 
-    var root = Polymer.dom(this);
+    const root = Polymer.dom(this);
-    var unit = this.unit;
+    const unit = this.unit;
-    var deviceStates = this.data;
+    const deviceStates = this.data;
 
     while (root.lastChild) {
       root.removeChild(root.lastChild);
@@ -78,32 +78,32 @@ export default Polymer({
       return;
     }
 
-    var chart = new google.visualization.LineChart(this);
+    const chart = new google.visualization.LineChart(this);
-    var dataTable = new google.visualization.DataTable();
+    const dataTable = new google.visualization.DataTable();
 
     dataTable.addColumn({ type: 'datetime', id: 'Time' });
 
-    var options = {
+    const options = {
-        legend: { position: 'top' },
+      legend: { position: 'top' },
-        titlePosition: 'none',
+      titlePosition: 'none',
-        vAxes: {
+      vAxes: {
-          // Adds units to the left hand side of the graph
+        // Adds units to the left hand side of the graph
-          0: {title: unit}
+        0: {title: unit},
-        },
+      },
-        hAxis: {
+      hAxis: {
-          format: 'H:mm'
+        format: 'H:mm',
-        },
+      },
-        lineWidth: 1,
+      lineWidth: 1,
-        chartArea:{left:'60',width:"95%"},
+      chartArea: { left: '60', width: '95%'},
-        explorer: {
+      explorer: {
-          actions: ['dragToZoom', 'rightClickToReset', 'dragToPan'],
+        actions: ['dragToZoom', 'rightClickToReset', 'dragToPan'],
-           keepInBounds: true,
+        keepInBounds: true,
-          axis: 'horizontal',
+        axis: 'horizontal',
-          maxZoomIn: 0.1
+        maxZoomIn: 0.1,
-        }
+      },
-      };
+    };
 
-    if(this.isSingleDevice) {
+    if (this.isSingleDevice) {
       options.legend.position = 'none';
       options.vAxes[0].title = null;
       options.chartArea.left = 40;
@@ -114,54 +114,51 @@ export default Polymer({
 
     // Get a unique list of times of state changes for all the device
     // for a particular unit of measureent.
-    var times = pluck(flatten(deviceStates), "lastChangedAsDate");
+    let times = pluck(flatten(deviceStates), 'lastChangedAsDate');
     times = sortBy(uniq(times, (e) => e.getTime()));
 
-    var data = [];
+    const data = [];
-    var empty = new Array(deviceStates.length);
+    const empty = new Array(deviceStates.length);
-    for(var i = 0; i < empty.length; i++) {
+    for (let i = 0; i < empty.length; i++) {
       empty[i] = 0;
     }
 
-    var timeIndex = 1;
+    let timeIndex = 1;
-    var endDate = new Date();
+    const endDate = new Date();
-    var prevDate = times[0];
 
-    for(i = 0; i < times.length; i++) {
+    for (i = 0; i < times.length; i++) {
       // because we only have state changes we add an extra point at the same time
       // that holds the previous state which makes the line display correctly
-      var beforePoint = new Date(times[i]);
+      const beforePoint = new Date(times[i]);
       data.push([beforePoint].concat(empty));
 
       data.push([times[i]].concat(empty));
-      prevDate = times[i];
       timeIndex++;
     }
     data.push([endDate].concat(empty));
 
-    var deviceCount = 0;
+    let deviceCount = 0;
     deviceStates.forEach((device) => {
-      var attributes = device[device.length - 1].attributes;
+      const attributes = device[device.length - 1].attributes;
       dataTable.addColumn('number', attributes.friendly_name);
 
-      var currentState = 0;
+      let currentState = 0;
-      var previousState = 0;
+      let previousState = 0;
-      var lastIndex = 0;
+      let lastIndex = 0;
-      var count = 0;
+      let count = 0;
-      var prevTime = data[0][0];
+      let prevTime = data[0][0];
       device.forEach((state) => {
-
         currentState = state.state;
-        var start = state.lastChangedAsDate;
+        const start = state.lastChangedAsDate;
-        if(state.state == 'None') {
+        if (state.state === 'None') {
           currentState = previousState;
         }
-        for(var i = lastIndex; i < data.length; i++) {
+        for (let i = lastIndex; i < data.length; i++) {
           data[i][1 + deviceCount] = parseFloat(previousState);
           // this is where data gets filled in for each time for the particular device
           // because for each time two entries were create we fill the first one with the
           // previous value and the second one with the new value
-          if(prevTime.getTime() == data[i][0].getTime() && data[i][0].getTime() == start.getTime()) {
+          if (prevTime.getTime() === data[i][0].getTime() && data[i][0].getTime() === start.getTime()) {
             data[i][1 + deviceCount] = parseFloat(currentState);
             lastIndex = i;
             prevTime = data[i][0];
@@ -175,8 +172,8 @@ export default Polymer({
         count++;
       });
 
-      //fill in the rest of the Array
+      // fill in the rest of the Array
-      for(var i = lastIndex; i < data.length; i++) {
+      for (let i = lastIndex; i < data.length; i++) {
         data[i][1 + deviceCount] = parseFloat(previousState);
       }
 

src/components/state-history-chart-timeline.js

@@ -1,6 +1,6 @@
 import Polymer from '../polymer';
 
-export default Polymer({
+export default new Polymer({
   is: 'state-history-chart-timeline',
 
   properties: {
@@ -28,8 +28,8 @@ export default Polymer({
     if (!this.isAttached) {
       return;
     }
-    var root = Polymer.dom(this);
+    const root = Polymer.dom(this);
-    var stateHistory = this.data;
+    const stateHistory = this.data;
 
     while (root.node.lastChild) {
       root.node.removeChild(root.node.lastChild);
@@ -39,38 +39,40 @@ export default Polymer({
       return;
     }
 
-    var chart = new google.visualization.Timeline(this);
+    const chart = new google.visualization.Timeline(this);
-    var dataTable = new google.visualization.DataTable();
+    const dataTable = new google.visualization.DataTable();
 
     dataTable.addColumn({ type: 'string', id: 'Entity' });
     dataTable.addColumn({ type: 'string', id: 'State' });
     dataTable.addColumn({ type: 'date', id: 'Start' });
     dataTable.addColumn({ type: 'date', id: 'End' });
 
-    var addRow = function(entityDisplay, stateStr, start, end) {
+    function addRow(entityDisplay, stateStr, start, end) {
-      stateStr = stateStr.replace(/_/g, ' ');
+      const stateDisplay = stateStr.replace(/_/g, ' ');
-      dataTable.addRow([entityDisplay, stateStr, start, end]);
+      dataTable.addRow([entityDisplay, stateDisplay, start, end]);
-    };
+    }
 
-    var startTime = new Date(
+    const startTime = new Date(
       stateHistory.reduce((minTime, stateInfo) => Math.min(
           minTime, stateInfo[0].lastChangedAsDate), new Date())
     );
 
     // end time is Math.min(curTime, start time + 1 day)
-    var endTime = new Date(startTime);
+    let endTime = new Date(startTime);
-    endTime.setDate(endTime.getDate()+1);
+    endTime.setDate(endTime.getDate() + 1);
     if (endTime > new Date()) {
       endTime = new Date();
     }
 
-    var numTimelines = 0;
+    let numTimelines = 0;
     // stateHistory is a list of lists of sorted state objects
     stateHistory.forEach((stateInfo) => {
-      if(stateInfo.length === 0) return;
+      if (stateInfo.length === 0) return;
 
-      var entityDisplay = stateInfo[0].entityDisplay;
+      const entityDisplay = stateInfo[0].entityDisplay;
-      var newLastChanged, prevState = null, prevLastChanged = null;
+      let newLastChanged;
+      let prevState = null;
+      let prevLastChanged = null;
 
       stateInfo.forEach((state) => {
         if (prevState !== null && state.state !== prevState) {
@@ -94,11 +96,11 @@ export default Polymer({
       height: 55 + numTimelines * 42,
 
       timeline: {
-        showRowLabels: stateHistory.length > 1
+        showRowLabels: stateHistory.length > 1,
       },
 
       hAxis: {
-        format: 'H:mm'
+        format: 'H:mm',
       },
     });
   },

src/components/state-history-charts.js

@@ -4,7 +4,7 @@ require('./loading-box');
 require('./state-history-chart-timeline');
 require('./state-history-chart-line');
 
-export default Polymer({
+export default new Polymer({
   is: 'state-history-charts',
 
   properties: {
@@ -39,7 +39,7 @@ export default Polymer({
   },
 
   computeIsSingleDevice(stateHistory) {
-    return stateHistory && stateHistory.size == 1;
+    return stateHistory && stateHistory.size === 1;
   },
 
   computeGroupedStateHistory(isLoading, stateHistory) {
@@ -47,23 +47,23 @@ export default Polymer({
       return {line: [], timeline: []};
     }
 
-    var lineChartDevices = {};
+    const lineChartDevices = {};
-    var timelineDevices = [];
+    let timelineDevices = [];
 
     stateHistory.forEach((stateInfo) => {
       if (!stateInfo || stateInfo.size === 0) {
         return;
       }
 
-      var stateWithUnit = stateInfo.find(
+      const stateWithUnit = stateInfo.find(
         (state) => 'unit_of_measurement' in state.attributes);
 
-      var unit = stateWithUnit ?
+      const unit = stateWithUnit ?
         stateWithUnit.attributes.unit_of_measurement : false;
 
       if (!unit) {
         timelineDevices.push(stateInfo.toArray());
-      } else if(unit in lineChartDevices) {
+      } else if (unit in lineChartDevices) {
         lineChartDevices[unit].push(stateInfo.toArray());
       } else {
         lineChartDevices[unit] = [stateInfo.toArray()];
@@ -72,16 +72,16 @@ export default Polymer({
 
     timelineDevices = timelineDevices.length > 0 && timelineDevices;
 
-    var unitStates = Object.keys(lineChartDevices).map(
+    const unitStates = Object.keys(lineChartDevices).map(
       (unit) => [unit, lineChartDevices[unit]]);
 
     return {line: unitStates, timeline: timelineDevices};
   },
 
   googleApiLoaded() {
-    google.load("visualization", "1", {
+    google.load('visualization', '1', {
-      packages: ["timeline", "corechart"],
+      packages: ['timeline', 'corechart'],
-      callback: () => this.apiLoaded = true
+      callback: () => this.apiLoaded = true,
     });
   },
 

src/components/state-info.js

@@ -3,7 +3,7 @@ import Polymer from '../polymer';
 require('./state-badge');
 require('./relative-ha-datetime');
 
-export default Polymer({
+export default new Polymer({
   is: 'state-info',
 
   properties: {

src/components/stream-status.js

@@ -3,7 +3,7 @@ import { streamGetters, streamActions } from 'home-assistant-js';
 import Polymer from '../polymer';
 import nuclearObserver from '../util/bound-nuclear-behavior';
 
-export default Polymer({
+export default new Polymer({
   is: 'stream-status',
 
   behaviors: [nuclearObserver],
@@ -20,7 +20,7 @@ export default Polymer({
     },
   },
 
-  toggleChanged: function() {
+  toggleChanged() {
     if (this.isStreaming) {
       streamActions.stop();
     } else {

src/dialogs/more-info-dialog.js

@@ -16,7 +16,7 @@ require('../more-infos/more-info-content');
 // if you don't want the history component to show add the domain to this array
 const DOMAINS_WITH_NO_HISTORY = ['camera'];
 
-export default Polymer({
+export default new Polymer({
   is: 'more-info-dialog',
 
   behaviors: [nuclearObserver],
@@ -32,7 +32,7 @@ export default Polymer({
       type: Object,
       bindNuclear: [
         moreInfoGetters.currentEntityHistory,
-        (history) => history ? [history] : false
+        (history) => history ? [history] : false,
       ],
     },
 
@@ -88,7 +88,7 @@ export default Polymer({
       this.fetchHistoryData();
       // allow dialog to render content before showing it so it is
       // positioned correctly.
-      this.dialogOpen = true
+      this.dialogOpen = true;
     }, 10);
   },
 

src/home-assistant.js

@@ -2,7 +2,8 @@ import Polymer from './polymer';
 
 import {
   syncGetters,
-  localStoragePreferences
+  localStoragePreferences,
+  startLocalStoragePreferencesSync
 } from 'home-assistant-js';
 
 import nuclearObserver from './util/bound-nuclear-behavior';
@@ -11,7 +12,7 @@ import validateAuth from './util/validate-auth';
 require('./layouts/login-form');
 require('./layouts/home-assistant-main');
 
-export default Polymer({
+export default new Polymer({
   is: 'home-assistant',
 
   hostAttributes: {
@@ -32,16 +33,16 @@ export default Polymer({
 
   ready() {
     // remove the HTML init message
-    var initMsg = document.getElementById('init');
+    const initMsg = document.getElementById('init');
     initMsg.parentElement.removeChild(initMsg);
 
     // if auth was given, tell the backend
-    if(this.auth) {
+    if (this.auth) {
       validateAuth(this.auth, false);
     } else if (localStoragePreferences.authToken) {
       validateAuth(localStoragePreferences.authToken, true);
     }
 
-    localStoragePreferences.startSync();
+    startLocalStoragePreferencesSync();
   },
 });

src/layouts/home-assistant-main.js

@@ -1,11 +1,7 @@
 import {
-  configGetters,
-  entityGetters,
   navigationGetters,
-  authActions,
+  startUrlSync,
-  navigationActions,
+  stopUrlSync,
-  urlSync,
-  util
 } from 'home-assistant-js';
 
 import nuclearObserver from '../util/bound-nuclear-behavior';
@@ -20,7 +16,7 @@ require('../layouts/partial-dev-set-state');
 require('../managers/notification-manager');
 require('../dialogs/more-info-dialog');
 
-export default Polymer({
+export default new Polymer({
   is: 'home-assistant-main',
 
   behaviors: [nuclearObserver],
@@ -71,19 +67,19 @@ export default Polymer({
     'open-menu': 'openDrawer',
   },
 
-  openDrawer: function() {
+  openDrawer() {
     this.$.drawer.openDrawer();
   },
 
-  activePageChanged: function() {
+  activePageChanged() {
     this.$.drawer.closeDrawer();
   },
 
-  attached: function() {
+  attached() {
-    urlSync.startSync();
+    startUrlSync();
   },
 
-  detached: function() {
+  detached() {
-    urlSync.stopSync();
+    stopUrlSync();
   },
 });

src/layouts/login-form.js

@@ -5,7 +5,7 @@ import { authGetters } from 'home-assistant-js';
 import nuclearObserver from '../util/bound-nuclear-behavior';
 import validateAuth from '../util/validate-auth';
 
-export default Polymer({
+export default new Polymer({
   is: 'login-form',
 
   behaviors: [nuclearObserver],
@@ -37,31 +37,31 @@ export default Polymer({
     'validatingChanged(isValidating, isInvalid)',
   ],
 
-  validatingChanged: function(isValidating, isInvalid) {
+  validatingChanged(isValidating, isInvalid) {
     if (!isValidating && !isInvalid) {
       this.$.passwordInput.value = '';
     }
   },
 
-  isValidatingChanged: function(newVal) {
+  isValidatingChanged(newVal) {
     if (!newVal) {
       this.async(() => this.$.passwordInput.focus(), 10);
     }
   },
 
-  passwordKeyDown: function(ev) {
+  passwordKeyDown(ev) {
     // validate on enter
-    if(ev.keyCode === 13) {
+    if (ev.keyCode === 13) {
       this.validatePassword();
       ev.preventDefault();
 
     // clear error after we start typing again
-    } else if(this.isInvalid) {
+    } else if (this.isInvalid) {
       this.isInvalid = false;
     }
   },
 
-  validatePassword: function() {
+  validatePassword() {
     this.$.hideKeyboardOnFocus.focus();
 
     validateAuth(this.$.passwordInput.value, this.$.rememberLogin.checked);

src/layouts/partial-base.js

@@ -1,6 +1,6 @@
 import Polymer from '../polymer';
 
-export default Polymer({
+export default new Polymer({
   is: 'partial-base',
 
   properties: {
@@ -10,7 +10,7 @@ export default Polymer({
     },
   },
 
-  toggleMenu: function() {
+  toggleMenu() {
     this.fire('open-menu');
   },
 });

src/layouts/partial-dev-call-service.js

@@ -5,7 +5,7 @@ import Polymer from '../polymer';
 require('./partial-base');
 require('../components/services-list');
 
-export default Polymer({
+export default new Polymer({
   is: 'partial-dev-call-service',
 
   properties: {
@@ -36,12 +36,13 @@ export default Polymer({
   },
 
   callService() {
-    var serviceData;
+    let serviceData;
-
     try {
-      serviceData = this.serviceData ? JSON.parse(this.serviceData): {};
+      serviceData = this.serviceData ? JSON.parse(this.serviceData) : {};
     } catch (err) {
-      alert("Error parsing JSON: " + err);
+      /* eslint-disable no-alert */
+      alert(`Error parsing JSON: ${err}`);
+      /* eslint-enable no-alert */
       return;
     }
 

src/layouts/partial-dev-fire-event.js

@@ -5,7 +5,7 @@ import Polymer from '../polymer';
 require('./partial-base');
 require('../components/events-list');
 
-export default Polymer({
+export default new Polymer({
   is: 'partial-dev-fire-event',
 
   properties: {
@@ -25,12 +25,14 @@ export default Polymer({
   },
 
   fireEvent() {
-    var eventData;
+    let eventData;
 
     try {
       eventData = this.eventData ? JSON.parse(this.eventData) : {};
     } catch (err) {
-      alert("Error parsing JSON: " + err);
+      /* eslint-disable no-alert */
+      alert(`Error parsing JSON: ${err}`);
+      /* eslint-enable no-alert */
       return;
     }
 

src/layouts/partial-dev-set-state.js

@@ -5,7 +5,7 @@ import Polymer from '../polymer';
 require('./partial-base');
 require('../components/entity-list');
 
-export default Polymer({
+export default new Polymer({
   is: 'partial-dev-set-state',
 
   properties: {
@@ -26,7 +26,7 @@ export default Polymer({
   },
 
   setStateData(stateData) {
-    var value = stateData ? JSON.stringify(stateData, null, '  ') : "";
+    const value = stateData ? JSON.stringify(stateData, null, '  ') : '';
 
     this.$.inputData.value = value;
 
@@ -35,7 +35,7 @@ export default Polymer({
   },
 
   entitySelected(ev) {
-    var state = reactor.evaluate(entityGetters.byId(ev.detail.entityId));
+    const state = reactor.evaluate(entityGetters.byId(ev.detail.entityId));
 
     this.entityId = state.entityId;
     this.state = state.state;
@@ -43,11 +43,13 @@ export default Polymer({
   },
 
   handleSetState() {
-    var attr;
+    let attr;
     try {
       attr = this.stateAttributes ? JSON.parse(this.stateAttributes) : {};
     } catch (err) {
-      alert("Error parsing JSON: " + err);
+      /* eslint-disable no-alert */
+      alert(`Error parsing JSON: ${err}`);
+      /* eslint-enable no-alert */
       return;
     }
 

src/layouts/partial-history.js

@@ -1,5 +1,4 @@
 import {
-  uiActions,
   entityHistoryGetters,
   entityHistoryActions
 } from 'home-assistant-js';
@@ -10,7 +9,7 @@ import nuclearObserver from '../util/bound-nuclear-behavior';
 require('./partial-base');
 require('../components/state-history-charts');
 
-export default Polymer({
+export default new Polymer({
   is: 'partial-history',
 
   behaviors: [nuclearObserver],
@@ -45,7 +44,7 @@ export default Polymer({
 
   isDataLoadedChanged(newVal) {
     if (!newVal) {
-      entityHistoryActions.fetchSelectedDate();
+      this.async(() => entityHistoryActions.fetchSelectedDate(), 1);
     }
   },
 
@@ -55,7 +54,6 @@ export default Polymer({
 
   datepickerFocus() {
     this.datePicker.adjustPosition();
-    this.datePicker.gotoDate(moment('2015-06-30').toDate());
   },
 
   attached() {
@@ -72,4 +70,4 @@ export default Polymer({
   computeContentClasses(narrow) {
     return 'flex content ' + (narrow ? 'narrow' : 'wide');
   },
-});
+});

src/layouts/partial-logbook.js

@@ -1,4 +1,3 @@
-import moment from 'moment';
 import { logbookGetters, logbookActions } from 'home-assistant-js';
 
 import Polymer from '../polymer';
@@ -8,7 +7,7 @@ require('./partial-base');
 require('../components/ha-logbook');
 require('../components/loading-box');
 
-export default Polymer({
+export default new Polymer({
   is: 'partial-logbook',
 
   behaviors: [nuclearObserver],
@@ -50,8 +49,7 @@ export default Polymer({
 
   isStaleChanged(newVal) {
     if (newVal) {
-      // isLoading wouldn't update without async <_<
+      this.async(() => logbookActions.fetchDate(this.selectedDate), 1);
-      this.async(() => logbookActions.fetchDate(this.selectedDate), 10);
     }
   },
 
@@ -61,7 +59,6 @@ export default Polymer({
 
   datepickerFocus() {
     this.datePicker.adjustPosition();
-    this.datePicker.gotoDate(moment('2015-06-30').toDate());
   },
 
   attached() {

src/layouts/partial-states.js

@@ -19,7 +19,7 @@ require('./partial-base');
 require('../components/state-cards');
 require('../components/ha-voice-command-progress');
 
-export default Polymer({
+export default new Polymer({
   is: 'partial-states',
 
   behaviors: [nuclearObserver],
@@ -50,8 +50,8 @@ export default Polymer({
       bindNuclear: [
         voiceGetters.isVoiceSupported,
         configGetters.isComponentLoaded('conversation'),
-        (isVoiceSupported, componentLoaded) => isVoiceSupported && componentLoaded
+        (isVoiceSupported, componentLoaded) => isVoiceSupported && componentLoaded,
-      ]
+      ],
     },
 
     isListening: {
@@ -64,7 +64,7 @@ export default Polymer({
       bindNuclear: [
         voiceGetters.isListening,
         voiceGetters.isTransmitting,
-        (isListening, isTransmitting) => isListening || isTransmitting
+        (isListening, isTransmitting) => isListening || isTransmitting,
       ],
     },
 

src/managers/notification-manager.js

@@ -3,7 +3,7 @@ import { notificationGetters } from 'home-assistant-js';
 import Polymer from '../polymer';
 import nuclearObserver from '../util/bound-nuclear-behavior';
 
-export default Polymer({
+export default new Polymer({
   is: 'notification-manager',
 
   behaviors: [nuclearObserver],
@@ -20,5 +20,5 @@ export default Polymer({
     if (newText) {
       this.$.toast.show();
     }
-  }
+  },
 });

src/more-infos/more-info-camera.js

@@ -1,6 +1,6 @@
 import Polymer from '../polymer';
 
-export default Polymer({
+export default new Polymer({
   is: 'more-info-camera',
 
   properties: {
@@ -21,9 +21,8 @@ export default Polymer({
       return 'http://194.218.96.92/jpg/image.jpg';
     } else if (dialogOpen) {
       return '/api/camera_proxy_stream/' + this.stateObj.entityId;
-    } else {
-      // Return an empty image if dialog is not open
-      return 'data:image/gif;base64,R0lGODlhAQABAAAAACw=';
     }
+    // Return an empty image if dialog is not open
+    return 'data:image/gif;base64,R0lGODlhAQABAAAAACw=';
   },
 });

src/more-infos/more-info-configurator.js

@@ -9,7 +9,7 @@ import nuclearObserver from '../util/bound-nuclear-behavior';
 
 require('../components/loading-box');
 
-export default Polymer({
+export default new Polymer({
   is: 'more-info-configurator',
 
   behaviors: [nuclearObserver],
@@ -46,7 +46,7 @@ export default Polymer({
   },
 
   computeIsConfigurable(stateObj) {
-    return stateObj.state == 'configure';
+    return stateObj.state === 'configure';
   },
 
   computeSubmitCaption(stateObj) {
@@ -56,8 +56,8 @@ export default Polymer({
   submitClicked() {
     this.isConfiguring = true;
 
-    var data = {
+    const data = {
-      configure_id: this.stateObj.attributes.configure_id
+      configure_id: this.stateObj.attributes.configure_id,
     };
 
     serviceActions.callService('configurator', 'configure', data).then(

src/more-infos/more-info-content.js

@@ -12,7 +12,7 @@ require('./more-info-media_player');
 require('./more-info-camera');
 require('./more-info-updater');
 
-export default Polymer({
+export default new Polymer({
   is: 'more-info-content',
 
   properties: {
@@ -28,8 +28,8 @@ export default Polymer({
     },
   },
 
-  dialogOpenChanged(newVal, oldVal) {
+  dialogOpenChanged(newVal) {
-    var root = Polymer.dom(this);
+    const root = Polymer.dom(this);
 
     if (root.lastChild) {
       root.lastChild.dialogOpen = newVal;
@@ -37,7 +37,7 @@ export default Polymer({
   },
 
   stateObjChanged(newVal, oldVal) {
-    var root = Polymer.dom(this);
+    const root = Polymer.dom(this);
 
     if (!newVal) {
       if (root.lastChild) {
@@ -46,24 +46,20 @@ export default Polymer({
       return;
     }
 
-    var newMoreInfoType = stateMoreInfoType(newVal);
+    const newMoreInfoType = stateMoreInfoType(newVal);
-
-    if (!oldVal || stateMoreInfoType(oldVal) != newMoreInfoType) {
 
+    if (!oldVal || stateMoreInfoType(oldVal) !== newMoreInfoType) {
       if (root.lastChild) {
         root.removeChild(root.lastChild);
       }
 
-      var moreInfo = document.createElement('more-info-' + newMoreInfoType);
+      const moreInfo = document.createElement('more-info-' + newMoreInfoType);
       moreInfo.stateObj = newVal;
       moreInfo.dialogOpen = this.dialogOpen;
       root.appendChild(moreInfo);
-
     } else {
-
       root.lastChild.dialogOpen = this.dialogOpen;
       root.lastChild.stateObj = newVal;
-
     }
   },
 });

src/more-infos/more-info-default.js

@@ -2,7 +2,7 @@ import Polymer from '../polymer';
 
 const FILTER_KEYS = ['entity_picture', 'friendly_name', 'unit_of_measurement'];
 
-export default Polymer({
+export default new Polymer({
   is: 'more-info-default',
 
   properties: {

src/more-infos/more-info-group.js

@@ -8,7 +8,7 @@ import nuclearObserver from '../util/bound-nuclear-behavior';
 
 require('../cards/state-card-content');
 
-export default Polymer({
+export default new Polymer({
   is: 'more-info-group',
 
   behaviors: [nuclearObserver],
@@ -26,7 +26,7 @@ export default Polymer({
         (currentEntity, entities) => {
           // weird bug??
           if (!currentEntity) {
-            return;
+            return [];
           }
           return currentEntity.attributes.entity_id.map(
             entities.get.bind(entities));

src/more-infos/more-info-light.js

@@ -7,7 +7,7 @@ require('../components/ha-color-picker');
 
 const ATTRIBUTE_CLASSES = ['brightness', 'xy_color'];
 
-export default Polymer({
+export default new Polymer({
   is: 'more-info-light',
 
   properties: {
@@ -19,10 +19,10 @@ export default Polymer({
     brightnessSliderValue: {
       type: Number,
       value: 0,
-    }
+    },
   },
 
-  stateObjChanged(newVal, oldVal) {
+  stateObjChanged(newVal) {
     if (newVal && newVal.state === 'on') {
       this.brightnessSliderValue = newVal.attributes.brightness;
     }
@@ -35,27 +35,27 @@ export default Polymer({
   },
 
   brightnessSliderChanged(ev) {
-    var bri = parseInt(ev.target.value);
+    const bri = parseInt(ev.target.value, 10);
 
-    if(isNaN(bri)) return;
+    if (isNaN(bri)) return;
 
-    if(bri === 0) {
+    if (bri === 0) {
       serviceActions.callTurnOff(this.stateObj.entityId);
     } else {
       serviceActions.callService('light', 'turn_on', {
         entity_id: this.stateObj.entityId,
-        brightness: bri
+        brightness: bri,
       });
     }
   },
 
   colorPicked(ev) {
-    var color = ev.detail.rgb;
+    const color = ev.detail.rgb;
 
     serviceActions.callService('light', 'turn_on', {
       entity_id: this.stateObj.entityId,
-      rgb_color: [color.r, color.g, color.b]
+      rgb_color: [color.r, color.g, color.b],
     });
-  }
+  },
 
 });

src/more-infos/more-info-media_player.js

@@ -5,7 +5,7 @@ import attributeClassNames from '../util/attribute-class-names';
 
 const ATTRIBUTE_CLASSES = ['volume_level'];
 
-export default Polymer({
+export default new Polymer({
   is: 'more-info-media_player',
 
   properties: {
@@ -26,7 +26,7 @@ export default Polymer({
 
     isMuted: {
       type: Boolean,
-      value: false
+      value: false,
     },
 
     volumeSliderValue: {
@@ -73,8 +73,8 @@ export default Polymer({
 
   stateObjChanged(newVal) {
     if (newVal) {
-      this.isOff = newVal.state == 'off';
+      this.isOff = newVal.state === 'off';
-      this.isPlaying = newVal.state == 'playing';
+      this.isPlaying = newVal.state === 'playing';
       this.volumeSliderValue = newVal.attributes.volume_level * 100;
       this.isMuted = newVal.attributes.is_volume_muted;
       this.supportsPause = (newVal.attributes.supported_media_commands & 1) !== 0;
@@ -94,14 +94,14 @@ export default Polymer({
   },
 
   computeIsOff(stateObj) {
-    return stateObj.state == 'off';
+    return stateObj.state === 'off';
   },
 
   computeMuteVolumeIcon(isMuted) {
     return isMuted ? 'av:volume-off' : 'av:volume-up';
   },
 
-  computePlaybackControlIcon(stateObj) {
+  computePlaybackControlIcon() {
     if (this.isPlaying) {
       return this.supportsPause ? 'av:pause' : 'av:stop';
     }
@@ -121,9 +121,6 @@ export default Polymer({
   },
 
   handlePlaybackControl() {
-    if (this.isPlaying && !this.supportsPause) {
-      alert('This case is not supported yet');
-    }
     this.callService('media_play_pause');
   },
 
@@ -139,14 +136,14 @@ export default Polymer({
   },
 
   volumeSliderChanged(ev) {
-    var volPercentage = parseFloat(ev.target.value);
+    const volPercentage = parseFloat(ev.target.value);
-    var vol = volPercentage > 0 ? volPercentage / 100 : 0;
+    const vol = volPercentage > 0 ? volPercentage / 100 : 0;
     this.callService('volume_set', { volume_level: vol });
   },
 
   callService(service, data) {
-    data = data || {};
+    const serviceData = data || {};
-    data.entity_id = this.stateObj.entityId;
+    serviceData.entity_id = this.stateObj.entityId;
-    serviceActions.callService('media_player', service, data);
+    serviceActions.callService('media_player', service, serviceData);
   },
 });

src/more-infos/more-info-script.js

@@ -1,6 +1,6 @@
 import Polymer from '../polymer';
 
-export default Polymer({
+export default new Polymer({
   is: 'more-info-script',
 
   properties: {

src/more-infos/more-info-sun.js

@@ -4,7 +4,7 @@ import formatTime from '../util/format-time';
 
 const { parseDateTime } = util;
 
-export default Polymer({
+export default new Polymer({
   is: 'more-info-sun',
 
   properties: {
@@ -37,12 +37,12 @@ export default Polymer({
     this.settingDate = parseDateTime(this.stateObj.attributes.next_setting);
     this.settingTime = formatTime(this.settingDate);
 
-    var root = Polymer.dom(this);
+    const root = Polymer.dom(this);
 
-    if(self.risingDate > self.settingDate) {
+    if (self.risingDate > self.settingDate) {
       root.appendChild(this.$.rising);
     } else {
       root.appendChild(this.$.setting);
     }
-  }
+  },
 });

src/more-infos/more-info-thermostat.js

@@ -1,12 +1,11 @@
-import { util, serviceActions } from 'home-assistant-js';
+import { serviceActions } from 'home-assistant-js';
 
 import Polymer from '../polymer';
 import attributeClassNames from '../util/attribute-class-names';
 
-const { temperatureUnits } = util;
 const ATTRIBUTE_CLASSES = ['away_mode'];
 
-export default Polymer({
+export default new Polymer({
   is: 'more-info-thermostat',
 
   properties: {
@@ -32,12 +31,12 @@ export default Polymer({
     },
   },
 
-  stateObjChanged(newVal, oldVal) {
+  stateObjChanged(newVal) {
-    this.targetTemperatureSliderValue = this.stateObj.state;
+    this.targetTemperatureSliderValue = newVal.state;
-    this.awayToggleChecked = this.stateObj.attributes.away_mode == 'on';
+    this.awayToggleChecked = newVal.attributes.away_mode === 'on';
 
-    this.tempMin = this.stateObj.attributes.min_temp;
+    this.tempMin = newVal.attributes.min_temp;
-    this.tempMax = this.stateObj.attributes.max_temp;
+    this.tempMax = newVal.attributes.max_temp;
   },
 
   computeClassNames(stateObj) {
@@ -45,34 +44,34 @@ export default Polymer({
   },
 
   targetTemperatureSliderChanged(ev) {
-    var temp = parseInt(ev.target.value);
+    const temp = parseInt(ev.target.value, 10);
 
-    if(isNaN(temp)) return;
+    if (isNaN(temp)) return;
 
     serviceActions.callService('thermostat', 'set_temperature', {
       entity_id: this.stateObj.entityId,
-      temperature: temp
+      temperature: temp,
     });
   },
 
   toggleChanged(ev) {
-    var newVal = ev.target.checked;
+    const newVal = ev.target.checked;
 
-    if(newVal && this.stateObj.attributes.away_mode === 'off') {
+    if (newVal && this.stateObj.attributes.away_mode === 'off') {
       this.service_set_away(true);
-    } else if(!newVal && this.stateObj.attributes.away_mode === 'on') {
+    } else if (!newVal && this.stateObj.attributes.away_mode === 'on') {
       this.service_set_away(false);
     }
   },
 
-  service_set_away(away_mode) {
+  service_set_away(awayMode) {
     // We call stateChanged after a successful call to re-sync the toggle
     // with the state. It will be out of sync if our service call did not
     // result in the entity to be turned on. Since the state is not changing,
     // the resync is not called automatic.
     serviceActions.callService(
       'thermostat', 'set_away_mode',
-      { away_mode, entity_id: this.stateObj.entityId })
+      { away_mode: awayMode, entity_id: this.stateObj.entityId })
 
     .then(() => this.stateObjChanged(this.stateObj));
   },

src/more-infos/more-info-updater.js

@@ -1,7 +1,6 @@
-import { util } from 'home-assistant-js';
 import { serviceActions } from 'home-assistant-js';
 
-export default Polymer({
+export default new Polymer({
   is: 'more-info-updater',
 
   properties: {
@@ -10,11 +9,11 @@ export default Polymer({
     },
   },
 
-  updateTapped(stateObj) {
+  updateTapped() {
-    serviceActions.callService('updater', 'update', {})
+    serviceActions.callService('updater', 'update', {});
   },
 
-  linkTapped(stateObj) {
+  linkTapped() {
     window.open(this.stateObj.attributes.link, '_blank');
   },
 });

src/util/bound-nuclear-behavior.js

@@ -1,5 +1,5 @@
 import { reactor } from 'home-assistant-js';
 
-import NuclearObserver from './nuclear-behavior';
+import nuclearObserver from './nuclear-behavior';
 
-export default NuclearObserver(reactor);
+export default nuclearObserver(reactor);

src/util/domain-icon.js

@@ -1,64 +1,61 @@
 export default function domainIcon(domain, state) {
-  switch(domain) {
+  switch (domain) {
-    case "homeassistant":
+  case 'homeassistant':
-      return "home";
+    return 'home';
 
-    case "group":
+  case 'group':
-      return "homeassistant-24:group";
+    return 'homeassistant-24:group';
 
-    case "device_tracker":
+  case 'device_tracker':
-      return "social:person";
+    return 'social:person';
 
-    case "switch":
+  case 'switch':
-      return "image:flash-on";
+    return 'image:flash-on';
 
-    case "media_player":
+  case 'media_player':
-      var icon = "hardware:cast";
+    let icon = 'hardware:cast';
 
-      if (state && state !== "off" && state !== 'idle') {
+    if (state && state !== 'off' && state !== 'idle') {
-        icon += "-connected";
+      icon += '-connected';
-      }
+    }
 
-      return icon;
+    return icon;
 
-    case "sun":
+  case 'sun':
-      return "image:wb-sunny";
+    return 'image:wb-sunny';
 
-    case "light":
+  case 'light':
-      return "image:wb-incandescent";
+    return 'image:wb-incandescent';
 
-    case "simple_alarm":
+  case 'simple_alarm':
-      return "social:notifications";
+    return 'social:notifications';
 
-    case "notify":
+  case 'notify':
-      return "announcement";
+    return 'announcement';
 
-    case "thermostat":
+  case 'thermostat':
-      return "homeassistant-100:thermostat";
+    return 'homeassistant-100:thermostat';
 
-    case "sensor":
+  case 'sensor':
-      return "visibility";
+    return 'visibility';
 
-    case "configurator":
+  case 'configurator':
-      return "settings";
+    return 'settings';
 
-    case "conversation":
+  case 'conversation':
-      return "av:hearing";
+    return 'av:hearing';
 
-    case "script":
+  case 'script':
-      return "description";
+    return 'description';
 
-    case 'scene':
+  case 'scene':
-      return 'social:pages';
+    return 'social:pages';
 
-    case 'updater':
+  case 'updater':
-      if(state == "update_available") {
+    return state === 'update_available' ?
-        return 'icons:cloud-download';
+      'icons:cloud-download' : 'icons:cloud-done';
-      } else {
-        return 'icons:cloud-done';
-      }
 
-    default:
+  default:
-      return "bookmark";
+    return 'bookmark';
   }
-};
+}

src/util/format-date-time.js

@@ -2,4 +2,4 @@ import moment from 'moment';
 
 export default function formatDateTime(dateObj) {
   return moment(dateObj).format('lll');
-};
+}

src/util/format-date.js

@@ -2,4 +2,4 @@ import moment from 'moment';
 
 export default function formatDate(dateObj) {
   return moment(dateObj).format('ll');
-};
+}

src/util/format-time.js

@@ -2,4 +2,4 @@ import moment from 'moment';
 
 export default function formatTime(dateObj) {
   return moment(dateObj).format('LT');
-};
+}

src/util/nuclear-behavior.js

@@ -1,34 +1,34 @@
 export default function NuclearObserver(reactor) {
   return {
 
-    attached: function() {
+    attached() {
       this.__unwatchFns = Object.keys(this.properties).reduce(
         (unwatchFns, key) => {
           if (!('bindNuclear' in this.properties[key])) {
             return unwatchFns;
           }
-          var getter = this.properties[key].bindNuclear;
+          const getter = this.properties[key].bindNuclear;
-
           if (!getter) {
-            throw 'Undefined getter specified for key ' + key;
+            throw new Error(`Undefined getter specified for key ${key}`);
           }
-
           this[key] = reactor.evaluate(getter);
 
           return unwatchFns.concat(reactor.observe(getter, (val) => {
             if (__DEV__) {
+              /* eslint-disable no-console */
               console.log(this, key, val);
+              /* eslint-enable no-console */
             }
             this[key] = val;
           }));
-      }, []);
+        }, []);
     },
 
-    detached: function() {
+    detached() {
       while (this.__unwatchFns.length) {
         this.__unwatchFns.shift()();
       }
     },
 
   };
-};
+}

src/util/state-card-type.js

@@ -4,11 +4,10 @@ const DOMAINS_WITH_CARD = [
   'thermostat', 'configurator', 'scene', 'media_player'];
 
 export default function stateCardType(state) {
-  if(DOMAINS_WITH_CARD.indexOf(state.domain) !== -1) {
+  if (DOMAINS_WITH_CARD.indexOf(state.domain) !== -1) {
     return state.domain;
-  } else if(reactor.evaluate(serviceGetters.canToggle(state.entityId))) {
+  } else if (reactor.evaluate(serviceGetters.canToggle(state.entityId))) {
-    return "toggle";
+    return 'toggle';
-  } else {
-    return "display";
   }
+  return 'display';
 }

src/util/state-more-info-type.js

@@ -1,12 +1,11 @@
 const DOMAINS_WITH_MORE_INFO = [
   'light', 'group', 'sun', 'configurator', 'thermostat', 'script',
-  'media_player', 'camera', 'updater'
+  'media_player', 'camera', 'updater',
 ];
 
 export default function stateMoreInfoType(state) {
-  if(DOMAINS_WITH_MORE_INFO.indexOf(state.domain) !== -1) {
+  if (DOMAINS_WITH_MORE_INFO.indexOf(state.domain) !== -1) {
     return state.domain;
-  } else {
-    return 'default';
   }
+  return 'default';
 }