From dcffd102cc7969b572bc7b447a3ddbf1569ec208 Mon Sep 17 00:00:00 2001
From: Paulus Schoutsen <paulus@paulusschoutsen.nl>
Date: Sat, 14 Feb 2015 00:11:23 -0800
Subject: [PATCH] Migrate more components to use mixin

---
 .../www_static/polymer/home-assistant.html    | 19 +++++++-----
 .../polymer/layouts/partial-history.html      | 29 +++++++++----------
 2 files changed, 26 insertions(+), 22 deletions(-)

diff --git a/homeassistant/components/frontend/www_static/polymer/home-assistant.html b/homeassistant/components/frontend/www_static/polymer/home-assistant.html
index a69b8363a8c..b66cad7c79b 100644
--- a/homeassistant/components/frontend/www_static/polymer/home-assistant.html
+++ b/homeassistant/components/frontend/www_static/polymer/home-assistant.html
@@ -30,20 +30,25 @@
 
   </template>
   <script>
-  Polymer({
-    loaded: window.hass.syncStore.initialLoadDone(),
+  var storeListenerMixIn = window.hass.storeListenerMixIn;
+
+  Polymer(Polymer.mixin({
+    loaded: false,
 
     ready: function() {
       // remove the HTML init message
       document.getElementById('init').remove();
 
-      // listen if we are fully loaded
-      window.hass.syncStore.addChangeListener(this.updateLoadStatus.bind(this));
+      this.listenToStores(true);
     },
 
-    updateLoadStatus: function() {
-      this.loaded = window.hass.syncStore.initialLoadDone();
+    detached: function() {
+      this.stopListeningToStores();
     },
-  });
+
+    syncStoreChanged: function(syncStore) {
+      this.loaded = syncStore.initialLoadDone();
+    },
+  }, storeListenerMixIn));
   </script>  
 </polymer-element>
diff --git a/homeassistant/components/frontend/www_static/polymer/layouts/partial-history.html b/homeassistant/components/frontend/www_static/polymer/layouts/partial-history.html
index 11a94dc3835..f676d47278e 100644
--- a/homeassistant/components/frontend/www_static/polymer/layouts/partial-history.html
+++ b/homeassistant/components/frontend/www_static/polymer/layouts/partial-history.html
@@ -31,32 +31,31 @@
   </partial-base>
 </template>
 <script>
-  Polymer({
+  var storeListenerMixIn = window.hass.storeListenerMixIn;
+  var stateHistoryActions = window.hass.stateHistoryActions;
+
+  Polymer(Polymer.mixin({
     stateHistory: null,
 
     ready: function() {
-      this.stateHistoryStoreChanged = this.stateHistoryStoreChanged.bind(this);
-
-      window.hass.stateHistoryStore.addChangeListener(this.stateHistoryStoreChanged);
-
-      if (window.hass.stateHistoryStore.isStale()) {
-        window.hass.stateHistoryActions.fetchAll();
-      }
-
-      this.stateHistoryStoreChanged();
+      this.listenToStores(true);
     },
 
     detached: function() {
-      window.hass.stateHistoryStore.removeChangeListener(this.stateHistoryStoreChanged);
+      this.stopListeningToStores();
     },
 
-    stateHistoryStoreChanged: function() {
-      this.stateHistory = window.hass.stateHistoryStore.all();
+    stateHistoryStoreChanged: function(stateHistoryStore) {
+      if (stateHistoryStore.isStale()) {
+        stateHistoryActions.fetchAll();
+      }
+
+      this.stateHistory = stateHistoryStore.all();
     },
 
     handleRefreshClick: function() {
-      window.hass.stateHistoryActions.fetchAll();
+      stateHistoryActions.fetchAll();
     },
-  });
+  }, storeListenerMixIn));
 </script>
 </polymer>