20190202.0

gulp/tasks/translations.js

@@ -1,20 +1,27 @@
+const del = require("del");
 const path = require("path");
 const gulp = require("gulp");
 const foreach = require("gulp-foreach");
 const hash = require("gulp-hash");
+const hashFilename = require("gulp-hash-filename");
 const merge = require("gulp-merge-json");
 const minify = require("gulp-jsonminify");
 const rename = require("gulp-rename");
 const transform = require("gulp-json-transform");
 
-const isDemo = process.env.DEMO === "1";
-
 const inDir = "translations";
 const workDir = "build-translations";
 const fullDir = workDir + "/full";
 const coreDir = workDir + "/core";
 const outDir = workDir + "/output";
 
+String.prototype.rsplit = function(sep, maxsplit) {
+  var split = this.split(sep);
+  return maxsplit
+    ? [split.slice(0, -maxsplit).join(sep)].concat(split.slice(-maxsplit))
+    : split;
+};
+
 // Panel translations which should be split from the core translations. These
 // should mirror the fragment definitions in polymer.json, so that we load
 // additional resources at equivalent points.
@@ -95,6 +102,12 @@ function lokalise_transform(data, original) {
   return output;
 }
 
+let taskName = "clean-translations";
+gulp.task(taskName, function() {
+  return del([`${outDir}/**/*.json`]);
+});
+tasks.push(taskName);
+
 /**
  * This task will build a master translation file, to be used as the base for
  * all languages. This starts with src/translations/en.json, and replaces all
@@ -104,8 +117,8 @@ function lokalise_transform(data, original) {
  * project is buildable immediately after merging new translation keys, since
  * the Lokalise update to translations/en.json will not happen immediately.
  */
-let taskName = "build-master-translation";
-gulp.task(taskName, function() {
+taskName = "build-master-translation";
+gulp.task(taskName, ["clean-translations"], function() {
   return gulp
     .src("src/translations/en.json")
     .pipe(
@@ -207,6 +220,7 @@ gulp.task(taskName, splitTasks, function() {
       })
     )
     .pipe(minify())
+    .pipe(hashFilename())
     .pipe(
       rename((filePath) => {
         if (filePath.dirname === "core") {
@@ -231,7 +245,7 @@ gulp.task(taskName, ["build-flattened-translations"], function() {
       hash({
         algorithm: "md5",
         hashLength: 32,
-        template: isDemo ? "<%= name %>.json" : "<%= name %>-<%= hash %>.json",
+        template: "<%= name %>.json",
       })
     )
     .pipe(hash.manifest("translationFingerprints.json"))
@@ -241,8 +255,10 @@ gulp.task(taskName, ["build-flattened-translations"], function() {
         // all translation fragment fingerprints under the translation name key
         const newData = {};
         Object.entries(data).forEach(([key, value]) => {
-          const parts = key.split("/");
-          let translation = key;
+          const [path, _md5] = key.rsplit("-", 1);
+          // let translation = key;
+          let translation = path;
+          const parts = translation.split("/");
           if (parts.length === 2) {
             translation = parts[1];
           }
@@ -251,7 +267,7 @@ gulp.task(taskName, ["build-flattened-translations"], function() {
               fingerprints: {},
             };
           }
-          newData[translation].fingerprints[key] = value;
+          newData[translation].fingerprints[path] = value;
         });
         return newData;
       })

package.json

@@ -73,6 +73,7 @@
     "es6-object-assign": "^1.1.0",
     "eslint-import-resolver-webpack": "^0.10.1",
     "fecha": "^3.0.0",
+    "gulp-hash-filename": "^2.0.1",
     "home-assistant-js-websocket": "^3.2.4",
     "intl-messageformat": "^2.2.0",
     "jquery": "^3.3.1",

setup.py

@@ -2,7 +2,7 @@
 
 setup(
     name="home-assistant-frontend",
-    version="20190201.0",
+    version="20190202.0",
     description="The Home Assistant frontend",
     url="https://github.com/home-assistant/home-assistant-polymer",
     author="The Home Assistant Authors",

src/components/ha-start-voice-button.js

@@ -5,6 +5,7 @@ import { PolymerElement } from "@polymer/polymer/polymer-element";
 import EventsMixin from "../mixins/events-mixin";
 
 import isComponentLoaded from "../common/config/is_component_loaded";
+import { fireEvent } from "../common/dom/fire_event";
 
 /*
  * @appliesMixin EventsMixin
@@ -43,7 +44,11 @@ class HaStartVoiceButton extends EventsMixin(PolymerElement) {
   }
 
   handleListenClick() {
-    this.fire("hass-start-voice");
+    fireEvent(this, "show-dialog", {
+      dialogImport: () =>
+        import(/* webpackChunkName: "voice-command-dialog" */ "../dialogs/ha-voice-command-dialog"),
+      dialogTag: "ha-voice-command-dialog",
+    });
   }
 }
 

src/data/ws-user.ts

@@ -1,20 +1,14 @@
 import {
-  createCollection,
   getUser,
   Connection,
+  getCollection,
 } from "home-assistant-js-websocket";
 import { User } from "../types";
 
+export const userCollection = (conn: Connection) =>
+  getCollection(conn, "_usr", () => getUser(conn) as Promise<User>, undefined);
+
 export const subscribeUser = (
   conn: Connection,
   onChange: (user: User) => void
-) =>
-  createCollection<User>(
-    "_usr",
-    // the getUser command is mistyped in current verrsion of HAWS.
-    // Fixed in 3.2.5
-    () => (getUser(conn) as unknown) as Promise<User>,
-    undefined,
-    conn,
-    onChange
-  );
+) => userCollection(conn).subscribe(onChange);

src/dialogs/ha-voice-command-dialog.js

@@ -159,6 +159,10 @@ class HaVoiceCommandDialog extends DialogMixin(PolymerElement) {
     return ["dialogOpenChanged(opened)"];
   }
 
+  showDialog() {
+    this.opened = true;
+  }
+
   initRecognition() {
     /* eslint-disable new-cap */
     this.recognition = new webkitSpeechRecognition();

src/entrypoints/app.js

@@ -1,9 +1,6 @@
 // Load polyfill first so HTML imports start resolving
 /* eslint-disable import/first */
 import "../resources/html-import/polyfill";
-import "@polymer/app-route/app-location";
-import "@polymer/app-route/app-route";
-import "@polymer/iron-flex-layout/iron-flex-layout-classes";
 import "@polymer/paper-styles/typography";
 import { setPassiveTouchGestures } from "@polymer/polymer/lib/utils/settings";
 
@@ -16,13 +13,6 @@ import "../components/ha-iconset-svg";
 
 import "../layouts/app/home-assistant";
 
-/* polyfill for paper-dropdown */
-setTimeout(
-  () =>
-    import(/* webpackChunkName: "polyfill-web-animations-next" */ "web-animations-js/web-animations-next-lite.min"),
-  2000
-);
-
 setPassiveTouchGestures(true);
 /* LastPass createElement workaround. See #428 */
 document.createElement = Document.prototype.createElement;

src/layouts/app/auth-mixin.ts

@@ -0,0 +1,55 @@
+import { clearState } from "../../util/ha-pref-storage";
+import { askWrite } from "../../common/auth/token_storage";
+import { subscribeUser, userCollection } from "../../data/ws-user";
+import { Constructor, LitElement } from "lit-element";
+import { HassBaseEl } from "./hass-base-mixin";
+
+declare global {
+  // for fire event
+  interface HASSDomEvents {
+    "hass-refresh-current-user": undefined;
+  }
+}
+
+export default (superClass: Constructor<LitElement & HassBaseEl>) =>
+  class extends superClass {
+    protected firstUpdated(changedProps) {
+      super.firstUpdated(changedProps);
+      this.addEventListener("hass-logout", () => this._handleLogout());
+      this.addEventListener("hass-refresh-current-user", () => {
+        userCollection(this.hass!.connection).refresh();
+      });
+    }
+
+    protected hassConnected() {
+      super.hassConnected();
+      subscribeUser(this.hass!.connection, (user) =>
+        this._updateHass({ user })
+      );
+
+      if (askWrite()) {
+        this.updateComplete
+          .then(() =>
+            import(/* webpackChunkName: "ha-store-auth-card" */ "../../dialogs/ha-store-auth-card")
+          )
+          .then(() => {
+            const el = document.createElement("ha-store-auth-card");
+            this.shadowRoot!.appendChild(el);
+            this.provideHass(el);
+          });
+      }
+    }
+
+    private async _handleLogout() {
+      try {
+        await this.hass!.auth.revoke();
+        this.hass!.connection.close();
+        clearState();
+        document.location.href = "/";
+      } catch (err) {
+        // tslint:disable-next-line
+        console.error(err);
+        alert("Log out failed");
+      }
+    }
+  };

src/layouts/app/home-assistant.ts

@@ -1,10 +1,10 @@
 import "@polymer/app-route/app-location";
-import "@polymer/iron-flex-layout/iron-flex-layout-classes";
 import {
   html,
   LitElement,
   PropertyDeclarations,
   PropertyValues,
+  css,
 } from "lit-element";
 
 import "../home-assistant-main";
@@ -27,6 +27,7 @@ import { Route, HomeAssistant } from "../../types";
 import { navigate } from "../../common/navigate";
 
 (LitElement.prototype as any).html = html;
+(LitElement.prototype as any).css = css;
 
 const ext = <T>(baseClass: T, mixins): T =>
   mixins.reduceRight((base, mixin) => mixin(base), baseClass);
@@ -82,6 +83,8 @@ export class HomeAssistantAppEl extends ext(HassBaseMixin(LitElement), [
   protected firstUpdated(changedProps) {
     super.firstUpdated(changedProps);
     setTimeout(registerServiceWorker, 1000);
+    /* polyfill for paper-dropdown */
+    import(/* webpackChunkName: "polyfill-web-animations-next" */ "web-animations-js/web-animations-next-lite.min");
   }
 
   protected updated(changedProps: PropertyValues): void {

src/layouts/app/more-info-mixin.ts

@@ -0,0 +1,34 @@
+import { Constructor, LitElement } from "lit-element";
+
+import { HassBaseEl } from "./hass-base-mixin";
+
+declare global {
+  // for fire event
+  interface HASSDomEvents {
+    "hass-more-info": {
+      entityId: string;
+    };
+  }
+}
+
+export default (superClass: Constructor<LitElement & HassBaseEl>) =>
+  class extends superClass {
+    private _moreInfoEl?: any;
+
+    protected firstUpdated(changedProps) {
+      super.firstUpdated(changedProps);
+      this.addEventListener("hass-more-info", (e) => this._handleMoreInfo(e));
+
+      // Load it once we are having the initial rendering done.
+      import(/* webpackChunkName: "more-info-dialog" */ "../../dialogs/ha-more-info-dialog");
+    }
+
+    private async _handleMoreInfo(ev) {
+      if (!this._moreInfoEl) {
+        this._moreInfoEl = document.createElement("ha-more-info-dialog");
+        this.shadowRoot!.appendChild(this._moreInfoEl);
+        this.provideHass(this._moreInfoEl);
+      }
+      this._updateHass({ moreInfoEntityId: ev.detail.entityId });
+    }
+  };