Nav fixes (#908)

* Fail if script is not editable

* Fix config nav

panels/config/cloud/ha-config-cloud.html

@@ -23,7 +23,7 @@
       tail="{{_routeTail}}"
     ></app-route>
 
-    <template is='dom-if' if='[[account]]' restamp>
+    <template is='dom-if' if='[[_equals(routeData.page, "account")]]' restamp>
       <ha-config-cloud-account
         hass='[[hass]]'
         account='[[account]]'
@@ -31,7 +31,6 @@
       ></ha-config-cloud-account>
     </template>
 
-    <template is='dom-if' if='[[!account]]' restamp>
     <template is='dom-if' if='[[_equals(_routeData.page, "login")]]' restamp>
       <ha-config-cloud-login
         page-name='login'
@@ -59,7 +58,6 @@
       ></ha-config-cloud-forgot-password>
     </template>
   </template>
-  </template>
 </dom-module>
 
 <script>
@@ -98,10 +96,10 @@
       if (!route || route.path.substr(0, 6) !== '/cloud') return;
 
       if (!account && ['/cloud/forgot-password', '/cloud/register'].indexOf(route.path) === -1) {
-        this.navigate('/config/cloud/login', true);
+        setTimeout(() => this.navigate('/config/cloud/login', true), 0);
       } else if (account &&
                  ['/cloud/login', '/cloud/register', '/cloud/forgot-password'].indexOf(route.path) !== -1) {
-        this.navigate('/config/cloud/account', true);
+        setTimeout(() => this.navigate('/config/cloud/account', true), 0);
       }
     }
 

panels/config/ha-panel-config.html

@@ -1,7 +1,6 @@
 <link rel="import" href='../../bower_components/polymer/polymer-element.html'>
 <link rel='import' href='../../bower_components/iron-media-query/iron-media-query.html'>
 <link rel='import' href='../../bower_components/app-route/app-route.html'>
-<link rel="import" href="../../bower_components/iron-pages/iron-pages.html">
 
 <link rel="import" href="../../src/layouts/hass-error-screen.html">
 <link rel="import" href="../../src/util/hass-mixins.html">
@@ -17,11 +16,6 @@
 
 <dom-module id="ha-panel-config">
   <template>
-    <style>
-      iron-pages {
-        height: 100%;
-      }
-    </style>
     <app-route
       route='[[route]]'
       pattern='/:page'
@@ -33,12 +27,6 @@
     <iron-media-query query="(min-width: 1296px)" query-matches="{{wideSidebar}}">
     </iron-media-query>
 
-    <iron-pages
-      selected='[[_routeData.page]]'
-      attr-for-selected='page-name'
-      fallback-selection='not-found'
-      selected-attribute='visible'
-    >
     <template is="dom-if" if='[[_equals(_routeData.page, "core")]]' restamp>
       <ha-config-core
         page-name='core'
@@ -57,6 +45,7 @@
       ></ha-config-cloud>
     </template>
 
+    <template is="dom-if" if='[[_equals(_routeData.page, "dashboard")]]'>
       <ha-config-dashboard
         page-name='dashboard'
         hass='[[hass]]'
@@ -65,6 +54,7 @@
         narrow='[[narrow]]'
         show-menu='[[showMenu]]'
       ></ha-config-dashboard>
+    </template>
 
     <template is="dom-if" if='[[_equals(_routeData.page, "automation")]]' restamp>
       <ha-config-automation
@@ -106,18 +96,11 @@
         hass='[[hass]]'
       ></ha-config-entries>
     </template>
-
-      <hass-error-screen
-        page-name='not-found'
-        error='Page not found.'
-        title='Configuration'
-      ></hass-error-screen>
-    </iron-pages>
   </template>
 </dom-module>
 
 <script>
-class HaPanelConfig extends window.hassMixins.EventsMixin(Polymer.Element) {
+class HaPanelConfig extends window.hassMixins.NavigateMixin(Polymer.Element) {
   static get is() { return 'ha-panel-config'; }
 
   static get properties() {
@@ -163,8 +146,7 @@ class HaPanelConfig extends window.hassMixins.EventsMixin(Polymer.Element) {
 
   _routeChanged(route) {
     if (route.path === '' && route.prefix === '/config') {
-      history.replaceState(null, null, '/config/dashboard');
+      this.navigate('/config/dashboard', true);
-      this.fire('location-changed');
     }
   }
 

panels/config/script/ha-script-editor.html

@@ -110,7 +110,7 @@
 </dom-module>
 
 <script>
-class HaScriptEditor extends window.hassMixins.EventsMixin(Polymer.Element) {
+class HaScriptEditor extends window.hassMixins.NavigateMixin(Polymer.Element) {
   static get is() { return 'ha-script-editor'; }
 
   static get properties() {
@@ -194,7 +194,7 @@ class HaScriptEditor extends window.hassMixins.EventsMixin(Polymer.Element) {
     this.config = config;
     this.errors = null;
     this.dirty = true;
-    this._updateComponent(config);
+    this._updateComponent();
   }
 
   scriptChanged(newVal, oldVal) {
@@ -207,7 +207,7 @@ class HaScriptEditor extends window.hassMixins.EventsMixin(Polymer.Element) {
       return;
     }
     this.hass.callApi('get', 'config/script/config/' + window.hassUtil.computeObjectId(newVal))
-      .then(function (config) {
+      .then((config) => {
         // Normalize data: ensure sequence is a list
         // Happens when people copy paste their scripts into the config
         var value = config.sequence;
@@ -218,7 +218,10 @@ class HaScriptEditor extends window.hassMixins.EventsMixin(Polymer.Element) {
         this.dirty = false;
         this.config = config;
         this._updateComponent();
-      }.bind(this));
+      }, () => {
+        alert('Only scripts inside scripts.yaml are editable.');
+        history.back();
+      });
   }
 
   creatingNewChanged(newVal) {
@@ -260,17 +263,16 @@ class HaScriptEditor extends window.hassMixins.EventsMixin(Polymer.Element) {
 
   saveScript() {
     var id = this.creatingNew ? '' + Date.now() : window.hassUtil.computeObjectId(this.script);
-    this.hass.callApi('post', 'config/script/config/' + id, this.config).then(function () {
+    this.hass.callApi('post', 'config/script/config/' + id, this.config).then(() => {
       this.dirty = false;
 
       if (this.creatingNew) {
-        history.replaceState(null, null, '/config/script/edit/' + id);
+        this.navigate(`/config/script/edit/${id}`, true);
-        this.fire('location-changed');
       }
-    }.bind(this), function (errors) {
+    }, (errors) => {
       this.errors = errors.body.message;
       throw errors;
-    }.bind(this));
+    });
   }
 
   computeName(script) {