Frontend: handle modals in separate component

homeassistant/components/frontend/version.py

@@ -1,2 +1,2 @@
 """ DO NOT MODIFY. Auto-generated by build_frontend script """
-VERSION = "58bc00ea51f4f274240d9db1a0fec705"
+VERSION = "14fb39cdbc1c103611d2c3d81558737d"

homeassistant/components/frontend/www_static/polymer/components/ha-modals.html

@@ -0,0 +1,25 @@
+<link rel="import" href="../bower_components/polymer/polymer.html">
+
+<link rel="import" href="../dialogs/more-info-dialog.html">
+
+<polymer-element name="ha-modals">
+  <template>
+    <more-info-dialog id="moreInfoDialog"></more-info-dialog>
+  </template>
+  <script>
+  var uiActions = window.hass.uiActions,
+      dispatcher = window.hass.dispatcher;
+
+  Polymer({
+    ready: function() {
+      dispatcher.register(function(payload) {
+        switch (payload.actionType) {
+          case uiActions.ACTION_SHOW_DIALOG_MORE_INFO:
+            this.$.moreInfoDialog.show(payload.entityId);
+            break;
+        }  
+      }.bind(this));
+    },
+  });
+  </script>
+</polymer-element>

homeassistant/components/frontend/www_static/polymer/components/relative-ha-datetime.html

@@ -4,7 +4,7 @@
 
 <polymer-element name="relative-ha-datetime" attributes="datetime">
   <template>
-    <span>{{ relativeTime }}</span>
+    {{ relativeTime }}
   </template>
   <script>
   var UPDATE_INTERVAL = 60000; // 60 seconds

homeassistant/components/frontend/www_static/polymer/home-assistant-api.html

@@ -1,95 +0,0 @@
-<link rel="import" href="./bower_components/polymer/polymer.html">
-
-<script src="./home-assistant-js/dist/homeassistant.min.js"></script>
-
-<link rel="import" href="./dialogs/more-info-dialog.html">
-
-<script>
-  var DOMAINS_WITH_CARD = ['thermostat', 'configurator'];
-  var DOMAINS_WITH_MORE_INFO = ['light', 'group', 'sun', 'configurator'];
-
-  // Register some polymer filters
-
-  PolymerExpressions.prototype.HATimeToDate = function(timeString) {
-    if (!timeString) return;
-
-    return window.hass.util.parseDateTime(timeString);
-  };
-
-  PolymerExpressions.prototype.HATimeStripDate = function(timeString) {
-    return (timeString || "").split(' ')[0];
-  };
-
-  // Add some frontend specific helpers to the models
-  Object.defineProperties(window.hass.stateModel.prototype, {
-    // how to render the card for this state
-    cardType: {
-      get: function() {
-        if(DOMAINS_WITH_CARD.indexOf(this.domain) !== -1) {
-          return this.domain;
-        } else if(this.canToggle) {
-          return "toggle";
-        } else {
-          return "display";
-        }
-      }
-    },
-
-    // how to render the more info of this state
-    moreInfoType: {
-      get: function() {
-        if(DOMAINS_WITH_MORE_INFO.indexOf(this.domain) !== -1) {
-          return this.domain;
-        } else {
-          return 'default';
-        }
-      }
-    },
-  });
-
-  var state,
-      constants = window.hass.constants,
-      dispatcher = window.hass.dispatcher,
-      preferenceStore = window.hass.preferenceStore;
-
-  var uiActions = window.hass.uiActions = {
-    ACTION_SHOW_TOAST: constants.ACTION_SHOW_TOAST,
-    ACTION_SHOW_DIALOG_MORE_INFO: 'ACTION_SHOW_DIALOG_MORE_INFO',
-
-    showMoreInfoDialog: function(entityId) {
-      dispatcher.dispatch({
-        actionType: this.ACTION_SHOW_DIALOG_MORE_INFO,
-        entityId: entityId,
-      });
-    },
-
-    validateAuth: function(authToken) {
-      window.hass.authActions.validate(authToken, preferenceStore.useStreaming());  
-    },
-
-  };
-</script>
-
-<polymer-element name="home-assistant-api" attributes="auth">
-  <template>
-    <more-info-dialog id="moreInfoDialog"></more-info-dialog>
-  </template>
-  <script>
-  Polymer({
-    ready: function() {
-      dispatcher.register(function(payload) {
-        switch (payload.actionType) {
-          case uiActions.ACTION_SHOW_DIALOG_MORE_INFO:
-            this.$.moreInfoDialog.show(payload.entityId);
-            break;
-        }  
-      }.bind(this));
-
-      // if auth was given, tell the backend
-      if(this.auth) {
-        window.hass.uiActions.validateAuth(this.auth);    
-      }
-    },
-  });
-  </script>
-</polymer-element>

homeassistant/components/frontend/www_static/polymer/home-assistant.html

@@ -2,8 +2,8 @@
 <link rel="import" href="bower_components/font-roboto/roboto.html">
 
 <link rel="import" href="resources/home-assistant-style.html">
+<link rel="import" href="resources/home-assistant-js.html">
 
-<link rel="import" href="home-assistant-api.html">
 <link rel="import" href="layouts/login-form.html">
 <link rel="import" href="layouts/home-assistant-main.html">
 
@@ -40,6 +40,11 @@
       document.getElementById('init').remove();
 
       this.listenToStores(true);
+
+      // if auth was given, tell the backend
+      if(this.auth) {
+        window.hass.uiActions.validateAuth(this.auth);    
+      }
     },
 
     detached: function() {

homeassistant/components/frontend/www_static/polymer/layouts/home-assistant-main.html

@@ -15,6 +15,7 @@
 <link rel="import" href="../layouts/partial-dev-set-state.html">
 
 <link rel="import" href="../components/ha-notifications.html">
+<link rel="import" href="../components/ha-modals.html">
 <link rel="import" href="../components/stream-status.html">
 
 <polymer-element name="home-assistant-main">
@@ -66,6 +67,7 @@
   </style>
 
   <ha-notifications></ha-notifications>
+  <ha-modals></ha-modals>
 
   <core-drawer-panel id="drawer" on-core-responsive-change="{{responsiveChanged}}">
     <core-header-panel mode="scroll" drawer>

homeassistant/components/frontend/www_static/polymer/resources/home-assistant-js.html

@@ -0,0 +1,67 @@
+<script src="../home-assistant-js/dist/homeassistant.min.js"></script>
+
+<script>
+  (function() {
+    var DOMAINS_WITH_CARD = ['thermostat', 'configurator'];
+    var DOMAINS_WITH_MORE_INFO = ['light', 'group', 'sun', 'configurator'];
+
+    // Register some polymer filters
+
+    PolymerExpressions.prototype.HATimeToDate = function(timeString) {
+      if (!timeString) return;
+
+      return window.hass.util.parseDateTime(timeString);
+    };
+
+    PolymerExpressions.prototype.HATimeStripDate = function(timeString) {
+      return (timeString || "").split(' ')[0];
+    };
+
+    // Add some frontend specific helpers to the models
+    Object.defineProperties(window.hass.stateModel.prototype, {
+      // how to render the card for this state
+      cardType: {
+        get: function() {
+          if(DOMAINS_WITH_CARD.indexOf(this.domain) !== -1) {
+            return this.domain;
+          } else if(this.canToggle) {
+            return "toggle";
+          } else {
+            return "display";
+          }
+        }
+      },
+
+      // how to render the more info of this state
+      moreInfoType: {
+        get: function() {
+          if(DOMAINS_WITH_MORE_INFO.indexOf(this.domain) !== -1) {
+            return this.domain;
+          } else {
+            return 'default';
+          }
+        }
+      },
+    });
+
+    var dispatcher = window.hass.dispatcher,
+        constants = window.hass.constants,
+        preferenceStore = window.hass.preferenceStore,
+        authActions = window.hass.authActions;
+
+    window.hass.uiActions = {
+      ACTION_SHOW_DIALOG_MORE_INFO: 'ACTION_SHOW_DIALOG_MORE_INFO',
+
+      showMoreInfoDialog: function(entityId) {
+        dispatcher.dispatch({
+          actionType: this.ACTION_SHOW_DIALOG_MORE_INFO,
+          entityId: entityId,
+        });
+      },
+
+      validateAuth: function(authToken) {
+        authActions.validate(authToken, preferenceStore.useStreaming());  
+      },
+    };
+  })();
+</script>