More re-org

home-assistant-js

@@ -1 +1 @@
-Subproject commit 0209bcdd0b7491d539f05887347d66a63e0da42c
+Subproject commit b7ac88af0bf5a6065c021e47dc6af0f7006b187b

panels/logbook/ha-logbook.html

@@ -1,21 +1,69 @@
 <link rel="import" href="../../bower_components/polymer/polymer.html">
 
-<link rel="import" href="./logbook-entry.html">
+<link rel="import" href="../../src/components/domain-icon.html">
+<link rel="import" href="../../src/components/display-time.html">
+<link rel="import" href="../../src/components/relative-ha-datetime.html">
+
 
 <dom-module id="ha-logbook">
   <template>
+    <style is="custom-style" include="iron-flex"></style>
     <style>
       :host {
         display: block;
         padding: 16px;
       }
+
+      .entry {
+        @apply(--paper-font-body1);
+
+        display: block;
+        line-height: 2em;
+      }
+
+      display-time {
+        width: 55px;
+        font-size: .8em;
+        color: var(--secondary-text-color);
+      }
+
+      domain-icon {
+        margin: 0 8px 0 16px;
+        color: var(--primary-text-color);
+      }
+
+      .name {
+        text-transform: capitalize;
+      }
+
+      .message {
+        color: var(--primary-text-color);
+      }
+
+      a {
+        color: var(--primary-color);
+      }
     </style>
 
     <template is='dom-if' if='[[!entries.length]]'>
       No logbook entries found.
     </template>
+
     <template is='dom-repeat' items="[[entries]]">
-      <logbook-entry entry-obj="[[item]]" hass='[[hass]]'></logbook-entry>
+      <div class='horizontal layout entry'>
+        <display-time date-obj="[[item.when]]"></display-time>
+        <domain-icon domain="[[item.domain]]" class='icon'></domain-icon>
+        <div class='message' flex>
+          <template is='dom-if' if="[[!item.entityId]]">
+            <span class='name'>[[item.name]]</span>
+          </template>
+          <template is='dom-if' if="[[item.entityId]]">
+            <a href='#' on-click="entityClicked" class='name'>[[item.name]]</a>
+          </template>
+          <span> </span>
+          <span>[[item.message]]</span>
+        </div>
+      </div>
     </template>
   </template>
 </dom-module>

panels/logbook/ha-panel-logbook.html

@@ -20,6 +20,10 @@
     paper-input {
       max-width: 200px;
     }
+
+    [hidden] {
+      display: none !important;
+    }
     </style>
 
     <partial-base narrow="[[narrow]]" show-menu='[[showMenu]]'>
@@ -30,8 +34,12 @@
 
       <div>
         <div class='selected-date-container'>
-          <paper-input label='Showing entries for' id='datePicker'
-            value='[[selectedDate]]' on-focus='datepickerFocus'></paper-input>
+          <paper-input
+            label='Showing entries for'
+            id='datePicker'
+            value='[[selectedDate]]'
+            on-focus='datepickerFocus'
+          ></paper-input>
 
           <loading-box hidden$='[[!isLoading]]'>Loading logbook entries</loading-box>
         </div>
@@ -106,7 +114,7 @@ Polymer({
   },
 
   datepickerFocus: function () {
-    this.datePicker.adjustPosition();
+    // this.datePicker.adjustPosition();
   },
 
   attached: function () {

panels/logbook/logbook-entry.html

@@ -1,78 +0,0 @@
-<link rel="import" href="../../bower_components/polymer/polymer.html">
-
-<link rel="import" href="../../src/components/domain-icon.html">
-<link rel="import" href="../../src/components/display-time.html">
-<link rel="import" href="../../src/components/relative-ha-datetime.html">
-
-<dom-module id="logbook-entry">
-  <template>
-    <style is="custom-style" include="iron-flex"></style>
-    <style>
-      :host {
-        @apply(--paper-font-body1);
-
-        display: block;
-        line-height: 2em;
-      }
-
-      display-time {
-        width: 55px;
-        font-size: .8em;
-        color: var(--secondary-text-color);
-      }
-
-      domain-icon {
-        margin: 0 8px 0 16px;
-        color: var(--primary-text-color);
-      }
-
-      .name {
-        text-transform: capitalize;
-      }
-
-      .message {
-        color: var(--primary-text-color);
-      }
-
-      a {
-        color: var(--primary-color);
-      }
-    </style>
-
-    <div class='horizontal layout'>
-      <display-time date-obj="[[entryObj.when]]"></display-time>
-      <domain-icon domain="[[entryObj.domain]]" class='icon'></domain-icon>
-      <div class='message' flex>
-        <template is='dom-if' if="[[!entryObj.entityId]]">
-          <span class='name'>[[entryObj.name]]</span>
-        </template>
-        <template is='dom-if' if="[[entryObj.entityId]]">
-          <a href='#' on-click="entityClicked" class='name'>[[entryObj.name]]</a>
-        </template>
-        <span> </span>
-        <span>[[entryObj.message]]</span>
-      </div>
-    </div>
-  </template>
-</dom-module>
-
-<script>
-Polymer({
-  is: 'logbook-entry',
-
-  properties: {
-    hass: {
-      type: Object,
-    },
-
-    entryObj: {
-      type: Object,
-    },
-  },
-
-  entityClicked: function (ev) {
-    ev.preventDefault();
-    this.hass.moreInfoActions.selectEntity(this.entryObj.entityId);
-  },
-});
-</script>

src/app-core.js

@@ -31,5 +31,11 @@ hass.reactor.batch(function () {
 
 setTimeout(hass.startLocalStoragePreferencesSync, 5000);
 
+if ('serviceWorker' in navigator) {
+  window.addEventListener('load', function() {
+    navigator.serviceWorker.register('/service-worker.js');
+  });
+}
+
 // While we figure out how ha-entity-marker can keep it's references
 window.hass = hass;

src/components/entity/state-info.html

@@ -1,7 +1,7 @@
-<link rel="import" href="../../bower_components/polymer/polymer.html">
+<link rel="import" href="../../../bower_components/polymer/polymer.html">
 
-<link rel="import" href="./entity/state-badge.html">
-<link rel="import" href="relative-ha-datetime.html">
+<link rel="import" href="./state-badge.html">
+<link rel="import" href="../relative-ha-datetime.html">
 
 <dom-module id="state-info">
   <template>

src/components/ha-label-badge.html

@@ -70,6 +70,10 @@
     iron-image {
       border-radius: 50%;
     }
+
+    [hidden] {
+      display: none !important;
+    }
     </style>
 
     <div class='badge-container'>

src/components/stream-status.html

@@ -8,18 +8,22 @@
 <dom-module id="stream-status">
   <template>
     <style>
-    :host {
-      display: inline-block;
-      height: 24px;
-    }
+      :host {
+        display: inline-block;
+        height: 24px;
+      }
 
-    paper-toggle-button {
-      vertical-align: middle;
-    }
+      paper-toggle-button {
+        vertical-align: middle;
+      }
 
-    iron-icon {
-      opacity: var(--dark-primary-opacity);
-    }
+      iron-icon {
+        opacity: var(--dark-primary-opacity);
+      }
+
+      [hidden] {
+        display: none !important;
+      }
     </style>
 
     <iron-icon icon="mdi:alert" hidden$="[[!hasError]]"></iron-icon>

src/home-assistant.html

@@ -82,14 +82,6 @@ Polymer({
                     });
   },
 
-  created: function () {
-    if (!('serviceWorker' in navigator)) {
-      return;
-    }
-
-    navigator.serviceWorker.register('/service_worker.js');
-  },
-
   ready: function () {
     this.loadIcons();
   },

src/layouts/partial-panel-resolver.html

@@ -34,29 +34,17 @@ Polymer({
   },
 
   panelChanged: function (panel) {
-    if (!panel) {
-      // while (rootEl.lastChild) {
-      //   rootEl.removeChild(rootEl.lastChild);
-      // }
-      return;
-    }
-
-    const rootEl = Polymer.dom(this);
-    const tag = 'ha-panel-' + panel.get('component_name');
+    if (!panel) return;
 
     this.importHref(panel.get('url'));
 
-    while (rootEl.lastChild) {
-      rootEl.removeChild(rootEl.lastChild);
-    }
-
-    const customEl = document.createElement(tag);
-
-    customEl.hass = this.hass;
-    customEl.narrow = this.narrow;
-    customEl.showMenu = this.showMenu;
-    customEl.panel = panel.toJS();
-    rootEl.appendChild(customEl);
+    window.hassUtil.dynamicContentUpdater(
+      this, 'ha-panel-' + panel.get('component_name'), {
+        hass: this.hass,
+        narrow: this.narrow,
+        showMenu: this.showMenu,
+        panel: panel,
+      })
   },
 
   updateAttributes: function () {

src/polymer.js

@@ -1 +0,0 @@
-export default window.Polymer;

src/state-summary/state-card-configurator.html

@@ -1,7 +1,7 @@
 <link rel='import' href='../../bower_components/polymer/polymer.html'>
 <link rel="import" href="../../bower_components/paper-button/paper-button.html">
 
-<link rel="import" href="../components/state-info.html">
+<link rel="import" href="../components/entity/state-info.html">
 
 <dom-module id='state-card-configurator'>
   <template>

src/state-summary/state-card-display.html

@@ -1,6 +1,6 @@
 <link rel="import" href="../../bower_components/polymer/polymer.html">
 
-<link rel="import" href="../components/state-info.html">
+<link rel="import" href="../components/entity/state-info.html">
 
 <dom-module id="state-card-display">
   <template>

src/state-summary/state-card-hvac.html

@@ -1,6 +1,6 @@
 <link rel="import" href="../../bower_components/polymer/polymer.html">
 
-<link rel="import" href="../components/state-info.html">
+<link rel="import" href="../components/entity/state-info.html">
 
 <dom-module id="state-card-hvac">
   <template>

src/state-summary/state-card-input_slider.html

@@ -1,7 +1,7 @@
 <link rel="import" href="../../bower_components/polymer/polymer.html">
 <link rel="import" href="../../bower_components/paper-slider/paper-slider.html">
 
-<link rel="import" href="../components/state-info.html">
+<link rel="import" href="../components/entity/state-info.html">
 
 <dom-module id="state-card-input_slider">
   <template>

src/state-summary/state-card-media_player.html

@@ -1,6 +1,6 @@
 <link rel="import" href="../../bower_components/polymer/polymer.html">
 
-<link rel="import" href="../components/state-info.html">
+<link rel="import" href="../components/entity/state-info.html">
 
 <dom-module id="state-card-media_player">
   <template>

src/state-summary/state-card-rollershutter.html

@@ -1,7 +1,7 @@
 <link rel="import" href="../../bower_components/polymer/polymer.html">
 <link rel="import" href="../../bower_components/paper-icon-button/paper-icon-button.html">
 
-<link rel="import" href="../components/state-info.html">
+<link rel="import" href="../components/entity/state-info.html">
 
 <dom-module id="state-card-rollershutter">
   <template>

src/state-summary/state-card-scene.html

@@ -1,7 +1,7 @@
 <link rel="import" href="../../bower_components/polymer/polymer.html">
 <link rel="import" href="../../bower_components/paper-button/paper-button.html">
 
-<link rel="import" href="../components/state-info.html">
+<link rel="import" href="../components/entity/state-info.html">
 
 <dom-module id="state-card-scene">
   <template>

src/state-summary/state-card-script.html

@@ -1,7 +1,7 @@
 <link rel="import" href="../../bower_components/polymer/polymer.html">
 <link rel="import" href="../../bower_components/paper-button/paper-button.html">
 
-<link rel="import" href="../components/state-info.html">
+<link rel="import" href="../components/entity/state-info.html">
 <link rel="import" href="../components/entity/ha-entity-toggle.html">
 
 <dom-module id="state-card-script">

src/state-summary/state-card-thermostat.html

@@ -1,6 +1,6 @@
 <link rel="import" href="../../bower_components/polymer/polymer.html">
 
-<link rel="import" href="../components/state-info.html">
+<link rel="import" href="../components/entity/state-info.html">
 
 <dom-module id="state-card-thermostat">
   <template>

src/state-summary/state-card-toggle.html

@@ -1,6 +1,6 @@
 <link rel="import" href="../../bower_components/polymer/polymer.html">
 
-<link rel="import" href="../components/state-info.html">
+<link rel="import" href="../components/entity/state-info.html">
 <link rel="import" href="../components/entity/ha-entity-toggle.html">
 
 <dom-module id="state-card-toggle">