Run Hass.io panel in an iframe (#678)

* Run Hass.io in an iframe

* Update hass.io build script

* Lint

* Lint

* Fix build script

* Lint
This commit is contained in:
Paulus Schoutsen 2018-01-21 00:39:56 -08:00 committed by GitHub
parent 3c95559f33
commit 9c2f6e591d
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
29 changed files with 318 additions and 171 deletions

1
.gitignore vendored
View File

@ -3,6 +3,7 @@ build-temp/*
build-es5/* build-es5/*
build-temp-es5/* build-temp-es5/*
build-translations/* build-translations/*
build-hassio/*
node_modules/* node_modules/*
bower_components/* bower_components/*
npm-debug.log npm-debug.log

View File

@ -1,5 +1,9 @@
const del = require('del');
const gulp = require('gulp'); const gulp = require('gulp');
const rename = require('gulp-rename'); const rename = require('gulp-rename');
const gzip = require('gulp-gzip');
const path = require('path');
const runSequence = require('run-sequence');
const { const {
stripImportsStrategy, stripImportsStrategy,
@ -7,39 +11,44 @@ const {
const minifyStream = require('../common/transform').minifyStream; const minifyStream = require('../common/transform').minifyStream;
const { const {
bundledStreamFromHTML, bundledStreamFromHTML,
findDependencies
} = require('../common/html'); } = require('../common/html');
const { polymer_dir } = require('../config'); const OUTPUT_DIR = 'build-hassio/';
const DEPS_TO_STRIP = [ const DEPS_TO_STRIP = [
'bower_components/font-roboto/roboto.html', 'bower_components/font-roboto/roboto.html',
'bower_components/paper-styles/color.html', 'bower_components/paper-styles/color.html',
'bower_components/iron-meta/iron-meta.html',
];
const DEPS_TO_STRIP_RECURSIVELY = [
'bower_components/polymer/polymer.html',
]; ];
async function buildHassioPanel(es6) { async function buildHassioPanel() {
const toStrip = [...DEPS_TO_STRIP]; const stream = await bundledStreamFromHTML('hassio/hassio-app.html', {
strategy: stripImportsStrategy(DEPS_TO_STRIP)
for (const dep of DEPS_TO_STRIP_RECURSIVELY) {
toStrip.push(dep);
const deps = await findDependencies(polymer_dir, dep);
for (const importUrl of deps) {
toStrip.push(importUrl);
}
}
const stream = await bundledStreamFromHTML('panels/hassio/hassio-main.html', {
strategy: stripImportsStrategy(toStrip)
}); });
return minifyStream(stream, es6) return minifyStream(stream, /* es6= */ false)
.pipe(rename('hassio-main.html')) .pipe(rename('hassio-app.html'))
.pipe(gulp.dest(es6 ? 'build-temp' : 'build-temp-es5')); .pipe(gulp.dest(OUTPUT_DIR));
} }
gulp.task('hassio-panel-es5', buildHassioPanel.bind(null, /* es6= */ false)); function copyHassioIndex() {
gulp.task('hassio-panel', buildHassioPanel.bind(null, /* es6= */ true)); return gulp.src('hassio/index.html')
.pipe(gulp.dest(OUTPUT_DIR));
}
function gzipOutput() {
return gulp.src(path.resolve(OUTPUT_DIR, '*.html'))
.pipe(gzip({ skipGrowingFiles: true }))
.pipe(gulp.dest(OUTPUT_DIR));
}
gulp.task('hassio-clean', () => del([OUTPUT_DIR]));
gulp.task('hassio-panel-es5', buildHassioPanel);
gulp.task('hassio-index-es5', copyHassioIndex);
gulp.task('hassio-gzip-es5', gzipOutput);
gulp.task('hassio-es5', () => runSequence.use(gulp)(
'hassio-clean',
'hassio-panel-es5',
'hassio-index-es5',
'hassio-gzip-es5',
));

View File

@ -1,9 +1,9 @@
<link rel="import" href="../../../bower_components/polymer/polymer-element.html"> <link rel="import" href="../../bower_components/polymer/polymer-element.html">
<link rel="import" href="../../../bower_components/paper-card/paper-card.html"> <link rel="import" href="../../bower_components/paper-card/paper-card.html">
<link rel="import" href="../../../bower_components/paper-item/paper-item.html"> <link rel="import" href="../../bower_components/paper-item/paper-item.html">
<link rel="import" href="../../../bower_components/paper-item/paper-item-body.html"> <link rel="import" href="../../bower_components/paper-item/paper-item-body.html">
<link rel='import' href='../../../src/util/hass-mixins.html'> <link rel='import' href='../../src/util/hass-mixins.html'>
<dom-module id="hassio-addon-repository"> <dom-module id="hassio-addon-repository">
<template> <template>

View File

@ -1,10 +1,10 @@
<link rel="import" href="../../../bower_components/polymer/polymer-element.html"> <link rel="import" href="../../bower_components/polymer/polymer-element.html">
<link rel="import" href="../../../bower_components/app-layout/app-header-layout/app-header-layout.html"> <link rel="import" href="../../bower_components/app-layout/app-header-layout/app-header-layout.html">
<link rel="import" href="../../../bower_components/app-layout/app-header/app-header.html"> <link rel="import" href="../../bower_components/app-layout/app-header/app-header.html">
<link rel="import" href="../../../bower_components/app-layout/app-toolbar/app-toolbar.html"> <link rel="import" href="../../bower_components/app-layout/app-toolbar/app-toolbar.html">
<link rel="import" href="../../../bower_components/paper-icon-button/paper-icon-button.html"> <link rel="import" href="../../bower_components/paper-icon-button/paper-icon-button.html">
<link rel='import' href='../../../src/util/hass-mixins.html'> <link rel='import' href='../../src/util/hass-mixins.html'>
<link rel="import" href="./hassio-repositories-editor.html"> <link rel="import" href="./hassio-repositories-editor.html">
<link rel="import" href="./hassio-addon-repository.html"> <link rel="import" href="./hassio-addon-repository.html">

View File

@ -1,11 +1,11 @@
<link rel="import" href="../../../bower_components/polymer/polymer-element.html"> <link rel="import" href="../../bower_components/polymer/polymer-element.html">
<link rel="import" href="../../../bower_components/app-layout/app-header-layout/app-header-layout.html"> <link rel="import" href="../../bower_components/app-layout/app-header-layout/app-header-layout.html">
<link rel="import" href="../../../bower_components/app-layout/app-header/app-header.html"> <link rel="import" href="../../bower_components/app-layout/app-header/app-header.html">
<link rel="import" href="../../../bower_components/app-layout/app-toolbar/app-toolbar.html"> <link rel="import" href="../../bower_components/app-layout/app-toolbar/app-toolbar.html">
<link rel="import" href="../../../bower_components/paper-card/paper-card.html"> <link rel="import" href="../../bower_components/paper-card/paper-card.html">
<link rel='import' href='../../../src/util/hass-mixins.html'> <link rel='import' href='../../src/util/hass-mixins.html'>
<link rel="import" href="../../../src/components/buttons/ha-call-api-button.html"> <link rel="import" href="../../src/components/buttons/ha-call-api-button.html">
<dom-module id="hassio-addon-store-view"> <dom-module id="hassio-addon-store-view">
<template> <template>

View File

@ -1,11 +1,11 @@
<link rel="import" href="../../../bower_components/polymer/polymer-element.html"> <link rel="import" href="../../bower_components/polymer/polymer-element.html">
<link rel="import" href="../../../bower_components/app-layout/app-header-layout/app-header-layout.html"> <link rel="import" href="../../bower_components/app-layout/app-header-layout/app-header-layout.html">
<link rel="import" href="../../../bower_components/app-layout/app-header/app-header.html"> <link rel="import" href="../../bower_components/app-layout/app-header/app-header.html">
<link rel="import" href="../../../bower_components/app-layout/app-toolbar/app-toolbar.html"> <link rel="import" href="../../bower_components/app-layout/app-toolbar/app-toolbar.html">
<link rel="import" href="../../../bower_components/paper-icon-button/paper-icon-button.html"> <link rel="import" href="../../bower_components/paper-icon-button/paper-icon-button.html">
<link rel="import" href="../../../bower_components/app-route/app-route.html"> <link rel="import" href="../../bower_components/app-route/app-route.html">
<link rel="import" href="../../../src/components/ha-menu-button.html"> <link rel="import" href="../../src/components/ha-menu-button.html">
<link rel="import" href="./hassio-repositories-editor.html"> <link rel="import" href="./hassio-repositories-editor.html">
<link rel="import" href="./hassio-addon-repository.html"> <link rel="import" href="./hassio-addon-repository.html">

View File

@ -1,8 +1,8 @@
<link rel="import" href="../../../bower_components/polymer/polymer-element.html"> <link rel="import" href="../../bower_components/polymer/polymer-element.html">
<link rel="import" href="../../../bower_components/paper-card/paper-card.html"> <link rel="import" href="../../bower_components/paper-card/paper-card.html">
<link rel="import" href="../../../bower_components/iron-autogrow-textarea/iron-autogrow-textarea.html"> <link rel="import" href="../../bower_components/iron-autogrow-textarea/iron-autogrow-textarea.html">
<link rel="import" href="../../../src/components/buttons/ha-call-api-button.html"> <link rel="import" href="../../src/components/buttons/ha-call-api-button.html">
<dom-module id="hassio-repositories-editor"> <dom-module id="hassio-repositories-editor">
<template> <template>

View File

@ -1,16 +1,16 @@
<link rel="import" href="../../../bower_components/polymer/polymer-element.html"> <link rel="import" href="../../bower_components/polymer/polymer-element.html">
<link rel="import" href="../../../bower_components/app-layout/app-header-layout/app-header-layout.html"> <link rel="import" href="../../bower_components/app-layout/app-header-layout/app-header-layout.html">
<link rel="import" href="../../../bower_components/app-layout/app-header/app-header.html"> <link rel="import" href="../../bower_components/app-layout/app-header/app-header.html">
<link rel="import" href="../../../bower_components/app-layout/app-toolbar/app-toolbar.html"> <link rel="import" href="../../bower_components/app-layout/app-toolbar/app-toolbar.html">
<link rel="import" href="../../../bower_components/paper-icon-button/paper-icon-button.html"> <link rel="import" href="../../bower_components/paper-icon-button/paper-icon-button.html">
<link rel="import" href="../../../bower_components/iron-icon/iron-icon.html"> <link rel="import" href="../../bower_components/iron-icon/iron-icon.html">
<link rel="import" href="../../../bower_components/paper-card/paper-card.html"> <link rel="import" href="../../bower_components/paper-card/paper-card.html">
<link rel="import" href="../../../bower_components/paper-checkbox/paper-checkbox.html"> <link rel="import" href="../../bower_components/paper-checkbox/paper-checkbox.html">
<link rel="import" href="../../../bower_components/paper-button/paper-button.html"> <link rel="import" href="../../bower_components/paper-button/paper-button.html">
<link rel="import" href="../../../src/components/ha-icon-check.html"> <link rel="import" href="../../src/components/ha-icon-check.html">
<link rel="import" href="../../../src/components/buttons/ha-call-api-button.html"> <link rel="import" href="../../src/components/buttons/ha-call-api-button.html">
<dom-module id="hassio-addon-info"> <dom-module id="hassio-addon-info">
<template> <template>

View File

@ -1,6 +1,6 @@
<link rel="import" href="../../../bower_components/polymer/polymer-element.html"> <link rel="import" href="../../bower_components/polymer/polymer-element.html">
<link rel="import" href="../../../bower_components/paper-card/paper-card.html"> <link rel="import" href="../../bower_components/paper-card/paper-card.html">
<link rel="import" href="../../../bower_components/paper-button/paper-button.html"> <link rel="import" href="../../bower_components/paper-button/paper-button.html">
<dom-module id="hassio-addon-logs"> <dom-module id="hassio-addon-logs">
<template> <template>

View File

@ -1,10 +1,10 @@
<link rel="import" href="../../../bower_components/polymer/polymer-element.html"> <link rel="import" href="../../bower_components/polymer/polymer-element.html">
<link rel="import" href="../../../bower_components/paper-card/paper-card.html"> <link rel="import" href="../../bower_components/paper-card/paper-card.html">
<link rel="import" href="../../../bower_components/paper-input/paper-input.html"> <link rel="import" href="../../bower_components/paper-input/paper-input.html">
<link rel='import' href='../../../src/util/hass-mixins.html'> <link rel='import' href='../../src/util/hass-mixins.html'>
<link rel="import" href="../../../src/components/buttons/ha-call-api-button.html"> <link rel="import" href="../../src/components/buttons/ha-call-api-button.html">
<dom-module id="hassio-addon-network"> <dom-module id="hassio-addon-network">
<template> <template>

View File

@ -1,10 +1,10 @@
<link rel="import" href="../../../bower_components/polymer/polymer-element.html"> <link rel="import" href="../../bower_components/polymer/polymer-element.html">
<link rel="import" href="../../../bower_components/paper-card/paper-card.html"> <link rel="import" href="../../bower_components/paper-card/paper-card.html">
<link rel="import" href="../../../bower_components/iron-autogrow-textarea/iron-autogrow-textarea.html"> <link rel="import" href="../../bower_components/iron-autogrow-textarea/iron-autogrow-textarea.html">
<link rel="import" href="../../../bower_components/iron-flex-layout/iron-flex-layout.html"> <link rel="import" href="../../bower_components/iron-flex-layout/iron-flex-layout.html">
<link rel="import" href="../../../bower_components/paper-button/paper-button.html"> <link rel="import" href="../../bower_components/paper-button/paper-button.html">
<link rel="import" href="../../../src/components/buttons/ha-call-api-button.html"> <link rel="import" href="../../src/components/buttons/ha-call-api-button.html">
<dom-module id="hassio-addon-options"> <dom-module id="hassio-addon-options">
<template> <template>

View File

@ -1,10 +1,10 @@
<link rel="import" href="../../../bower_components/polymer/polymer-element.html"> <link rel="import" href="../../bower_components/polymer/polymer-element.html">
<link rel="import" href="../../../bower_components/app-layout/app-header-layout/app-header-layout.html"> <link rel="import" href="../../bower_components/app-layout/app-header-layout/app-header-layout.html">
<link rel="import" href="../../../bower_components/app-layout/app-header/app-header.html"> <link rel="import" href="../../bower_components/app-layout/app-header/app-header.html">
<link rel="import" href="../../../bower_components/app-layout/app-toolbar/app-toolbar.html"> <link rel="import" href="../../bower_components/app-layout/app-toolbar/app-toolbar.html">
<link rel="import" href="../../../bower_components/app-route/app-route.html"> <link rel="import" href="../../bower_components/app-route/app-route.html">
<link rel="import" href="../../../src/components/ha-menu-button.html"> <link rel="import" href="../../src/components/ha-menu-button.html">
<link rel="import" href="./hassio-addon-info.html"> <link rel="import" href="./hassio-addon-info.html">
<link rel="import" href="./hassio-addon-options.html"> <link rel="import" href="./hassio-addon-options.html">

View File

@ -1,11 +1,11 @@
<link rel="import" href="../../../bower_components/polymer/polymer-element.html"> <link rel="import" href="../../bower_components/polymer/polymer-element.html">
<link rel="import" href="../../../bower_components/app-layout/app-header-layout/app-header-layout.html"> <link rel="import" href="../../bower_components/app-layout/app-header-layout/app-header-layout.html">
<link rel="import" href="../../../bower_components/app-layout/app-header/app-header.html"> <link rel="import" href="../../bower_components/app-layout/app-header/app-header.html">
<link rel="import" href="../../../bower_components/app-layout/app-toolbar/app-toolbar.html"> <link rel="import" href="../../bower_components/app-layout/app-toolbar/app-toolbar.html">
<link rel="import" href="../../../bower_components/iron-flex-layout/iron-flex-layout-classes.html"> <link rel="import" href="../../bower_components/iron-flex-layout/iron-flex-layout-classes.html">
<link rel="import" href="../../../bower_components/paper-icon-button/paper-icon-button.html"> <link rel="import" href="../../bower_components/paper-icon-button/paper-icon-button.html">
<link rel="import" href="../../../src/components/ha-menu-button.html"> <link rel="import" href="../../src/components/ha-menu-button.html">
<link rel="import" href="./hassio-host-info.html"> <link rel="import" href="./hassio-host-info.html">
<link rel="import" href="./hassio-hass-info.html"> <link rel="import" href="./hassio-hass-info.html">

View File

@ -1,8 +1,8 @@
<link rel="import" href="../../../bower_components/polymer/polymer-element.html"> <link rel="import" href="../../bower_components/polymer/polymer-element.html">
<link rel="import" href="../../../bower_components/paper-card/paper-card.html"> <link rel="import" href="../../bower_components/paper-card/paper-card.html">
<link rel="import" href="../../../src/components/buttons/ha-call-api-button.html"> <link rel="import" href="../../src/components/buttons/ha-call-api-button.html">
<link rel="import" href="../../../src/components/buttons/ha-call-service-button.html"> <link rel="import" href="../../src/components/buttons/ha-call-service-button.html">
<dom-module id="hassio-hass-info"> <dom-module id="hassio-hass-info">
<template> <template>

View File

@ -1,7 +1,7 @@
<link rel="import" href="../../../bower_components/polymer/polymer-element.html"> <link rel="import" href="../../bower_components/polymer/polymer-element.html">
<link rel="import" href="../../../bower_components/paper-card/paper-card.html"> <link rel="import" href="../../bower_components/paper-card/paper-card.html">
<link rel="import" href="../../../src/components/buttons/ha-call-api-button.html"> <link rel="import" href="../../src/components/buttons/ha-call-api-button.html">
<dom-module id="hassio-host-info"> <dom-module id="hassio-host-info">
<template> <template>

View File

@ -1,8 +1,8 @@
<link rel="import" href="../../../bower_components/polymer/polymer-element.html"> <link rel="import" href="../../bower_components/polymer/polymer-element.html">
<link rel="import" href="../../../bower_components/paper-card/paper-card.html"> <link rel="import" href="../../bower_components/paper-card/paper-card.html">
<link rel='import' href='../../../src/util/hass-mixins.html'> <link rel='import' href='../../src/util/hass-mixins.html'>
<link rel="import" href="../../../src/components/buttons/ha-call-api-button.html"> <link rel="import" href="../../src/components/buttons/ha-call-api-button.html">
<dom-module id="hassio-supervisor-info"> <dom-module id="hassio-supervisor-info">
<template> <template>

View File

@ -1,9 +1,9 @@
<link rel="import" href="../../../bower_components/polymer/polymer-element.html"> <link rel="import" href="../../bower_components/polymer/polymer-element.html">
<link rel="import" href="../../../bower_components/paper-card/paper-card.html"> <link rel="import" href="../../bower_components/paper-card/paper-card.html">
<link rel="import" href="../../../bower_components/paper-item/paper-item.html"> <link rel="import" href="../../bower_components/paper-item/paper-item.html">
<link rel="import" href="../../../bower_components/paper-item/paper-item-body.html"> <link rel="import" href="../../bower_components/paper-item/paper-item-body.html">
<link rel='import' href='../../../src/util/hass-mixins.html'> <link rel='import' href='../../src/util/hass-mixins.html'>
<dom-module id="hassio-addons"> <dom-module id="hassio-addons">
<template> <template>

View File

@ -1,17 +1,17 @@
<link rel="import" href="../../../bower_components/polymer/polymer-element.html"> <link rel="import" href="../../bower_components/polymer/polymer-element.html">
<link rel="import" href="../../../bower_components/app-layout/app-header-layout/app-header-layout.html"> <link rel="import" href="../../bower_components/app-layout/app-header-layout/app-header-layout.html">
<link rel="import" href="../../../bower_components/app-layout/app-header/app-header.html"> <link rel="import" href="../../bower_components/app-layout/app-header/app-header.html">
<link rel="import" href="../../../bower_components/app-layout/app-toolbar/app-toolbar.html"> <link rel="import" href="../../bower_components/app-layout/app-toolbar/app-toolbar.html">
<link rel="import" href="../../../bower_components/iron-flex-layout/iron-flex-layout-classes.html"> <link rel="import" href="../../bower_components/iron-flex-layout/iron-flex-layout-classes.html">
<link rel="import" href="../../../bower_components/paper-icon-button/paper-icon-button.html"> <link rel="import" href="../../bower_components/paper-icon-button/paper-icon-button.html">
<link rel="import" href="../../../bower_components/paper-dropdown-menu/paper-dropdown-menu-light.html"> <link rel="import" href="../../bower_components/paper-dropdown-menu/paper-dropdown-menu-light.html">
<link rel="import" href="../../../bower_components/paper-listbox/paper-listbox.html"> <link rel="import" href="../../bower_components/paper-listbox/paper-listbox.html">
<link rel="import" href="../../../bower_components/paper-menu-button/paper-menu-button.html"> <link rel="import" href="../../bower_components/paper-menu-button/paper-menu-button.html">
<link rel="import" href="../../../bower_components/paper-item/paper-item.html"> <link rel="import" href="../../bower_components/paper-item/paper-item.html">
<link rel='import' href='../../../src/util/hass-mixins.html'> <link rel='import' href='../../src/util/hass-mixins.html'>
<link rel="import" href="../../../src/components/ha-menu-button.html"> <link rel="import" href="../../src/components/ha-menu-button.html">
<link rel="import" href="./hassio-addons.html"> <link rel="import" href="./hassio-addons.html">
<link rel="import" href="./hassio-hass-update.html"> <link rel="import" href="./hassio-hass-update.html">

View File

@ -1,8 +1,8 @@
<link rel="import" href="../../../bower_components/polymer/polymer-element.html"> <link rel="import" href="../../bower_components/polymer/polymer-element.html">
<link rel="import" href="../../../bower_components/paper-card/paper-card.html"> <link rel="import" href="../../bower_components/paper-card/paper-card.html">
<link rel="import" href="../../../src/components/buttons/ha-call-api-button.html"> <link rel="import" href="../../src/components/buttons/ha-call-api-button.html">
<link rel="import" href="../../../src/components/buttons/ha-call-service-button.html"> <link rel="import" href="../../src/components/buttons/ha-call-service-button.html">
<dom-module id="hassio-hass-update"> <dom-module id="hassio-hass-update">
<template> <template>

52
hassio/hassio-app.html Normal file
View File

@ -0,0 +1,52 @@
<link rel="import" href="../bower_components/polymer/polymer-element.html">
<link rel="import" href="./hassio-main.html">
<dom-module id="hassio-app">
<template>
<template is='dom-if' if='[[hass]]'>
<hassio-main
hass='[[hass]]'
narrow='[[narrow]]'
show-menu='[[showMenu]]'
route='[[route]]'
></hassio-main>
</template>
</template>
</dom-module>
<script>
class HassioApp extends Polymer.Element {
static get is() { return 'hassio-app'; }
static get properties() {
return {
hass: Object,
narrow: Boolean,
showMenu: Boolean,
route: Object,
hassioPanel: {
type: Object,
value: window.parent.hassioPanel,
},
};
}
ready() {
super.ready();
window.setProperties = this.setProperties.bind(this);
this.addEventListener('location-changed', () => this._locationChanged());
this.addEventListener('hass-open-menu', () => this._menuEvent(true));
this.addEventListener('hass-close-menu', () => this._menuEvent(false));
}
_menuEvent(shouldOpen) {
this.hassioPanel.fire(shouldOpen ? 'hass-open-menu' : 'hass-close-menu');
}
_locationChanged() {
this.hassioPanel.navigate(window.location.pathname);
}
}
customElements.define(HassioApp.is, HassioApp);
</script>

View File

@ -1,4 +1,4 @@
<link rel="import" href="../../bower_components/polymer/polymer-element.html"> <link rel="import" href="../bower_components/polymer/polymer-element.html">
<script> <script>
class HassioData extends Polymer.Element { class HassioData extends Polymer.Element {

View File

@ -1,10 +1,11 @@
<link rel="import" href="../../bower_components/polymer/polymer-element.html"> <link rel="import" href="../bower_components/polymer/polymer-element.html">
<link rel="import" href="../../bower_components/app-route/app-route.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="../bower_components/iron-pages/iron-pages.html">
<link rel="import" href="../../src/layouts/hass-loading-screen.html"> <link rel="import" href="../src/layouts/hass-loading-screen.html">
<link rel="import" href="../../src/layouts/hass-error-screen.html"> <link rel="import" href="../src/layouts/hass-error-screen.html">
<link rel='import' href='../../src/util/hass-mixins.html'> <link rel='import' href='../src/util/hass-mixins.html'>
<link rel='import' href='../src/resources/ha-style.html'>
<link rel="import" href="./dashboard/hassio-dashboard.html"> <link rel="import" href="./dashboard/hassio-dashboard.html">
<link rel="import" href="./advanced/hassio-advanced.html"> <link rel="import" href="./advanced/hassio-advanced.html">

37
hassio/index.html Normal file
View File

@ -0,0 +1,37 @@
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Hass.io</title>
<meta name='viewport' content='width=device-width, user-scalable=no'>
<style>
body {
height: 100vh;
margin: 0;
padding: 0;
}
</style>
</head>
<body>
<hassio-app></hassio-app>
<script>
function addScript(src) {
var e = document.createElement('script');
e.src = src;
document.head.appendChild(e);
}
if (!window.parent.HASS_DEV) {
addScript('/frontend_es5/custom-elements-es5-adapter.js');
}
var webComponentsSupported = (
'customElements' in window &&
'import' in document.createElement('link') &&
'content' in document.createElement('template'));
if (!webComponentsSupported) {
addScript('/static/webcomponents-lite.js');
}
</script>
<link rel='import' href='./hassio-app.html'>
<link rel='import' href='/static/mdi.html' async>
</body>
</html>

View File

@ -1,16 +1,16 @@
<link rel="import" href="../../../bower_components/polymer/polymer-element.html"> <link rel="import" href="../../bower_components/polymer/polymer-element.html">
<link rel="import" href="../../../bower_components/app-layout/app-header-layout/app-header-layout.html"> <link rel="import" href="../../bower_components/app-layout/app-header-layout/app-header-layout.html">
<link rel="import" href="../../../bower_components/app-layout/app-header/app-header.html"> <link rel="import" href="../../bower_components/app-layout/app-header/app-header.html">
<link rel="import" href="../../../bower_components/app-layout/app-toolbar/app-toolbar.html"> <link rel="import" href="../../bower_components/app-layout/app-toolbar/app-toolbar.html">
<link rel="import" href="../../../bower_components/paper-icon-button/paper-icon-button.html"> <link rel="import" href="../../bower_components/paper-icon-button/paper-icon-button.html">
<link rel="import" href="../../../bower_components/paper-card/paper-card.html"> <link rel="import" href="../../bower_components/paper-card/paper-card.html">
<link rel="import" href="../../../bower_components/paper-button/paper-button.html"> <link rel="import" href="../../bower_components/paper-button/paper-button.html">
<link rel="import" href="../../../bower_components/paper-input/paper-input.html"> <link rel="import" href="../../bower_components/paper-input/paper-input.html">
<link rel='import' href='../../../src/util/hass-mixins.html'> <link rel='import' href='../../src/util/hass-mixins.html'>
<link rel="import" href="../../../src/components/ha-menu-button.html"> <link rel="import" href="../../src/components/ha-menu-button.html">
<link rel="import" href="../../../src/components/buttons/ha-call-api-button.html"> <link rel="import" href="../../src/components/buttons/ha-call-api-button.html">
<dom-module id="hassio-snapshot"> <dom-module id="hassio-snapshot">
<template> <template>

View File

@ -1,10 +1,10 @@
<link rel="import" href="../../../bower_components/polymer/polymer-element.html"> <link rel="import" href="../../bower_components/polymer/polymer-element.html">
<link rel="import" href="../../../bower_components/app-layout/app-header-layout/app-header-layout.html"> <link rel="import" href="../../bower_components/app-layout/app-header-layout/app-header-layout.html">
<link rel="import" href="../../../bower_components/app-layout/app-header/app-header.html"> <link rel="import" href="../../bower_components/app-layout/app-header/app-header.html">
<link rel="import" href="../../../bower_components/app-layout/app-toolbar/app-toolbar.html"> <link rel="import" href="../../bower_components/app-layout/app-toolbar/app-toolbar.html">
<link rel="import" href="../../../bower_components/paper-icon-button/paper-icon-button.html"> <link rel="import" href="../../bower_components/paper-icon-button/paper-icon-button.html">
<link rel="import" href="../../../src/components/ha-menu-button.html"> <link rel="import" href="../../src/components/ha-menu-button.html">
<dom-module id="hassio-supervisor"> <dom-module id="hassio-supervisor">
<template> <template>

View File

@ -15,7 +15,7 @@
"dev-watch": "npm run gulp watch_ru_all gen-service-worker", "dev-watch": "npm run gulp watch_ru_all gen-service-worker",
"dev-es5": "npm run gulp ru_all_es5 gen-service-worker-es5", "dev-es5": "npm run gulp ru_all_es5 gen-service-worker-es5",
"dev-watch-es5": "npm run gulp watch_ru_all_es5 gen-service-worker-es5", "dev-watch-es5": "npm run gulp watch_ru_all_es5 gen-service-worker-es5",
"lint_js": "eslint src panels js test-mocha --ext js,html", "lint_js": "eslint src panels js hassio test-mocha --ext js,html",
"lint_html": "ls -1 src/home-assistant.html panels/**/ha-panel-*.html | xargs polymer lint --input", "lint_html": "ls -1 src/home-assistant.html panels/**/ha-panel-*.html | xargs polymer lint --input",
"mocha": "node_modules/.bin/mocha --opts test-mocha/mocha.opts", "mocha": "node_modules/.bin/mocha --opts test-mocha/mocha.opts",
"test": "npm run lint_js && npm run lint_html && npm run mocha" "test": "npm run lint_js && npm run lint_html && npm run mocha"
@ -50,6 +50,7 @@
"gulp-file": "^0.3.0", "gulp-file": "^0.3.0",
"gulp-filter": "^5.0.1", "gulp-filter": "^5.0.1",
"gulp-foreach": "^0.1.0", "gulp-foreach": "^0.1.0",
"gulp-gzip": "^1.4.0",
"gulp-hash": "^4.0.1", "gulp-hash": "^4.0.1",
"gulp-html-minifier": "^0.1.8", "gulp-html-minifier": "^0.1.8",
"gulp-if": "^2.0.2", "gulp-if": "^2.0.2",

View File

@ -1,25 +1,25 @@
<link rel="import" href="../../bower_components/polymer/polymer-element.html"> <link rel="import" href="../../bower_components/polymer/polymer-element.html">
<link rel="import" href="./hassio-main.html"> <link rel='import' href='../../src/util/hass-mixins.html'>
<dom-module id="ha-panel-hassio"> <dom-module id="ha-panel-hassio">
<template> <template>
<style> <style>
[hidden] { iframe {
display: none !important; border: 0;
width: 100%;
height: 100%;
} }
</style> </style>
<iframe
<hassio-main id='iframe'
hass='[[hass]]' src="[[iframeUrl]]"
narrow='[[narrow]]' ></iframe>
show-menu='[[showMenu]]'
route='[[route]]'
></hassio-main>
</template> </template>
</dom-module> </dom-module>
<script> <script>
class HaPanelHassio extends Polymer.Element { class HaPanelHassio extends
window.hassMixins.NavigateMixin(window.hassMixins.EventsMixin(Polymer.Element)) {
static get is() { return 'ha-panel-hassio'; } static get is() { return 'ha-panel-hassio'; }
static get properties() { static get properties() {
@ -29,21 +29,50 @@ class HaPanelHassio extends Polymer.Element {
showMenu: Boolean, showMenu: Boolean,
route: Object, route: Object,
loaded: { iframeUrl: {
type: Boolean, type: String,
value: false, value: window.HASS_DEV ?
}, '/home-assistant-polymer/hassio/index.html' : '/api/hassio/app-es5/index.html',
}
}; };
} }
connectedCallback() { static get observers() {
super.connectedCallback(); return [
if (!window.HASS_DEV) { '_dataChanged(hass, narrow, showMenu, route)'
Polymer.importHref(`/api/hassio/panel_${window.HASS_BUILD}`, null, () => { ];
// eslint-disable-next-line }
alert('Failed to load the Hass.io panel from supervisor.');
}); ready() {
super.ready();
// Make it available for the iframe to interact
window.hassioPanel = this;
}
_dataChanged(hass, narrow, showMenu, route) {
this._updateProperties({ hass, narrow, showMenu, route });
}
_updateProperties(data) {
const setProperties = this.$.iframe.contentWindow.setProperties;
// Delay calling setProperties until iframe loaded
if (!setProperties) {
// Check if we already have a setTimeout scheduled
const needTimeout = !this._dataToSet;
this._dataToSet = data;
if (needTimeout) {
setTimeout(() => {
const dataToSet = this._dataToSet;
this._dataToSet = null;
this._updateProperties(dataToSet);
}, 100);
}
return;
} }
setProperties(data);
} }
} }

View File

@ -59,7 +59,7 @@ class HaPanelMap extends window.hassMixins.LocalizeMixin(Polymer.Element) {
var map = this._map = window.L.map(this.$.map); var map = this._map = window.L.map(this.$.map);
var style = document.createElement('link'); var style = document.createElement('link');
style.setAttribute('href', window.HASS_DEV ? style.setAttribute('href', window.HASS_DEV ?
'/static/home-assistant-polymer/bower_components/leaflet/dist/leaflet.css' : '/home-assistant-polymer/bower_components/leaflet/dist/leaflet.css' :
'/static/images/leaflet/leaflet.css'); '/static/images/leaflet/leaflet.css');
style.setAttribute('rel', 'stylesheet'); style.setAttribute('rel', 'stylesheet');
this.$.map.parentNode.appendChild(style); this.$.map.parentNode.appendChild(style);

View File

@ -1637,6 +1637,10 @@ bytes@3.0.0:
version "3.0.0" version "3.0.0"
resolved "https://registry.yarnpkg.com/bytes/-/bytes-3.0.0.tgz#d32815404d689699f85a4ea4fa8755dd13a96048" resolved "https://registry.yarnpkg.com/bytes/-/bytes-3.0.0.tgz#d32815404d689699f85a4ea4fa8755dd13a96048"
bytes@^0.3.0:
version "0.3.0"
resolved "https://registry.yarnpkg.com/bytes/-/bytes-0.3.0.tgz#78e2e0e28c7f9c7b988ea8aee0db4d5fa9941935"
bytes@^1.0.0: bytes@^1.0.0:
version "1.0.0" version "1.0.0"
resolved "https://registry.yarnpkg.com/bytes/-/bytes-1.0.0.tgz#3569ede8ba34315fab99c3e92cb04c7220de1fa8" resolved "https://registry.yarnpkg.com/bytes/-/bytes-1.0.0.tgz#3569ede8ba34315fab99c3e92cb04c7220de1fa8"
@ -3713,6 +3717,15 @@ gulp-foreach@^0.1.0:
gulp-util "~2.2.14" gulp-util "~2.2.14"
through2 "~0.6.3" through2 "~0.6.3"
gulp-gzip@^1.4.0:
version "1.4.0"
resolved "https://registry.yarnpkg.com/gulp-gzip/-/gulp-gzip-1.4.0.tgz#5ff8dff837cac2ebc2c89743dc0ac76e2be5e6c2"
dependencies:
bytes "^0.3.0"
gulp-util "^2.2.14"
stream-to-array "~1.0.0"
through2 "^0.4.1"
gulp-hash@^4.0.1: gulp-hash@^4.0.1:
version "4.1.1" version "4.1.1"
resolved "https://registry.yarnpkg.com/gulp-hash/-/gulp-hash-4.1.1.tgz#7779910f6c378686b62f88abbb57ebeef20945d0" resolved "https://registry.yarnpkg.com/gulp-hash/-/gulp-hash-4.1.1.tgz#7779910f6c378686b62f88abbb57ebeef20945d0"
@ -7450,6 +7463,10 @@ stream-to-array@^2.0.2:
dependencies: dependencies:
any-promise "^1.1.0" any-promise "^1.1.0"
stream-to-array@~1.0.0:
version "1.0.0"
resolved "https://registry.yarnpkg.com/stream-to-array/-/stream-to-array-1.0.0.tgz#94166bb29f3ea24f082d2f8cd3ebb2cc0d6eca2c"
streamfilter@^1.0.5: streamfilter@^1.0.5:
version "1.0.5" version "1.0.5"
resolved "https://registry.yarnpkg.com/streamfilter/-/streamfilter-1.0.5.tgz#87507111beb8e298451717b511cfed8f002abf53" resolved "https://registry.yarnpkg.com/streamfilter/-/streamfilter-1.0.5.tgz#87507111beb8e298451717b511cfed8f002abf53"