Add support for kiosk mode (#332)

* Add support for kiosk mode

* Implement kiosk mode as a panel

panels/kiosk/ha-panel-kiosk.html

@@ -0,0 +1,26 @@
+<link rel="import" href="../../bower_components/polymer/polymer.html">
+
+<link rel='import' href='../../src/layouts/partial-cards.html'>
+
+<dom-module id="ha-panel-kiosk">
+  <template>
+    <partial-cards
+            id='kiosk-states'
+            hass='[[hass]]'
+            show-menu
+            route='[[route]]'
+            panel-visible
+    ></partial-cards>
+  </template>
+</dom-module>
+
+<script>
+Polymer({
+  is: 'ha-panel-kiosk',
+
+  properties: {
+    hass: Object,
+    route: Object,
+  },
+});
+</script>

src/layouts/home-assistant-main.html

@@ -26,6 +26,11 @@
       data="{{routeData}}"
       tail="{{routeTail}}"
     ></app-route>
+    <app-route
+      route="{{route}}"
+      pattern="/states"
+      tail="{{statesRouteTail}}"
+    ></app-route>
     <ha-voice-command-dialog
       hass='[[hass]]'
       id='voiceDialog'
@@ -56,7 +61,8 @@
           narrow='[[narrow]]'
           hass='[[hass]]'
           show-menu='[[dockedSidebar]]'
-          route='[[route]]'
+          route='[[statesRouteTail]]'
+          show-tabs
         ></partial-cards>
 
         <partial-panel-resolver
@@ -88,6 +94,7 @@ Polymer({
     },
     routeData: Object,
     routeTail: Object,
+    statesRouteTail: Object,
 
     dockedSidebar: {
       type: Boolean,

src/layouts/partial-cards.html

@@ -38,7 +38,7 @@
     </style>
     <app-route
       route="{{route}}"
-      pattern="/states/:view"
+      pattern="/:view"
       data="{{routeData}}"
       active="{{routeMatch}}"
     ></app-route>
@@ -50,7 +50,7 @@
           <ha-start-voice-button hass='[[hass]]'></ha-start-voice-button>
         </app-toolbar>
 
-        <div sticky hidden$='[[!views.length]]'>
+        <div sticky hidden$='[[areTabsHidden(views, showTabs)]]'>
           <paper-tabs
             scrollable
             selected='[[currentView]]'
@@ -195,6 +195,11 @@ Polymer({
       type: Object,
       computed: 'computeViewStates(currentView, hass, defaultView)',
     },
+
+    showTabs: {
+      type: Boolean,
+      value: false,
+    },
   },
 
   created: function () {
@@ -220,6 +225,10 @@ Polymer({
     this._columns = Math.max(1, matchColumns - (!this.narrow && this.showMenu));
   },
 
+  areTabsHidden: function (views, showTabs) {
+    return !views.length || !showTabs;
+  },
+
   /**
    * Scroll to a specific y coordinate.
    *
@@ -305,6 +314,7 @@ Polymer({
   },
 
   hassChanged: function (hass) {
+    if (!hass) return;
     var views = window.HAWS.extractViews(hass.states);
     // If default view present, it's in first index.
     if (views.length > 0 && views[0].entity_id === this.DEFAULT_VIEW_ENTITY_ID) {

src/util/hass-util.html

@@ -466,11 +466,11 @@ window.hassUtil.computeStateState = function (stateObj) {
 };
 
 window.hassUtil.isComponentLoaded = function (hass, component) {
-  return hass.config.core.components.indexOf(component) !== -1;
+  return hass && hass.config.core.components.indexOf(component) !== -1;
 };
 
 window.hassUtil.computeLocationName = function (hass) {
-  return hass.config.core.location_name;
+  return hass && hass.config.core.location_name;
 };
 
 </script>