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-temp-es5/*
build-translations/*
build-hassio/*
node_modules/*
bower_components/*
npm-debug.log

View File

@ -1,5 +1,9 @@
const del = require('del');
const gulp = require('gulp');
const rename = require('gulp-rename');
const gzip = require('gulp-gzip');
const path = require('path');
const runSequence = require('run-sequence');
const {
stripImportsStrategy,
@ -7,39 +11,44 @@ const {
const minifyStream = require('../common/transform').minifyStream;
const {
bundledStreamFromHTML,
findDependencies
} = require('../common/html');
const { polymer_dir } = require('../config');
const OUTPUT_DIR = 'build-hassio/';
const DEPS_TO_STRIP = [
'bower_components/font-roboto/roboto.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) {
const toStrip = [...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)
async function buildHassioPanel() {
const stream = await bundledStreamFromHTML('hassio/hassio-app.html', {
strategy: stripImportsStrategy(DEPS_TO_STRIP)
});
return minifyStream(stream, es6)
.pipe(rename('hassio-main.html'))
.pipe(gulp.dest(es6 ? 'build-temp' : 'build-temp-es5'));
return minifyStream(stream, /* es6= */ false)
.pipe(rename('hassio-app.html'))
.pipe(gulp.dest(OUTPUT_DIR));
}
gulp.task('hassio-panel-es5', buildHassioPanel.bind(null, /* es6= */ false));
gulp.task('hassio-panel', buildHassioPanel.bind(null, /* es6= */ true));
function copyHassioIndex() {
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/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-body.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-item/paper-item.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">
<template>

View File

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

View File

@ -1,11 +1,11 @@
<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/app-header.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/app-route/app-route.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/app-header.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/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-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/paper-card/paper-card.html">
<link rel="import" href="../../../bower_components/iron-autogrow-textarea/iron-autogrow-textarea.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/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">
<template>

View File

@ -1,16 +1,16 @@
<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/app-header.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/iron-icon/iron-icon.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-button/paper-button.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/app-header.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/iron-icon/iron-icon.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-button/paper-button.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/ha-icon-check.html">
<link rel="import" href="../../src/components/buttons/ha-call-api-button.html">
<dom-module id="hassio-addon-info">
<template>

View File

@ -1,6 +1,6 @@
<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-button/paper-button.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-button/paper-button.html">
<dom-module id="hassio-addon-logs">
<template>

View File

@ -1,10 +1,10 @@
<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-input/paper-input.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-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">
<template>

View File

@ -1,10 +1,10 @@
<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/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/paper-button/paper-button.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/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/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">
<template>

View File

@ -1,10 +1,10 @@
<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/app-header.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/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/app-header.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="../../../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-options.html">

View File

@ -1,11 +1,11 @@
<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/app-header.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/paper-icon-button/paper-icon-button.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/app-header.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/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-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/paper-card/paper-card.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="../../../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-api-button.html">
<link rel="import" href="../../src/components/buttons/ha-call-service-button.html">
<dom-module id="hassio-hass-info">
<template>

View File

@ -1,7 +1,7 @@
<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/polymer/polymer-element.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">
<template>

View File

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

View File

@ -1,9 +1,9 @@
<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-item/paper-item.html">
<link rel="import" href="../../../bower_components/paper-item/paper-item-body.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-item/paper-item.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">
<template>

View File

@ -1,17 +1,17 @@
<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/app-header.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/paper-icon-button/paper-icon-button.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/app-header.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/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-listbox/paper-listbox.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-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-menu-button/paper-menu-button.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/components/ha-menu-button.html">
<link rel='import' href='../../src/util/hass-mixins.html'>
<link rel="import" href="../../src/components/ha-menu-button.html">
<link rel="import" href="./hassio-addons.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/paper-card/paper-card.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="../../../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-api-button.html">
<link rel="import" href="../../src/components/buttons/ha-call-service-button.html">
<dom-module id="hassio-hass-update">
<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>
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/app-route/app-route.html">
<link rel="import" href="../../bower_components/iron-pages/iron-pages.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/iron-pages/iron-pages.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/util/hass-mixins.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/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="./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/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-toolbar/app-toolbar.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-button/paper-button.html">
<link rel="import" href="../../../bower_components/paper-input/paper-input.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/app-header.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-card/paper-card.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='../../../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/buttons/ha-call-api-button.html">
<link rel="import" href="../../src/components/ha-menu-button.html">
<link rel="import" href="../../src/components/buttons/ha-call-api-button.html">
<dom-module id="hassio-snapshot">
<template>

View File

@ -1,10 +1,10 @@
<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/app-header.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/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/app-header.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="../../../src/components/ha-menu-button.html">
<link rel="import" href="../../src/components/ha-menu-button.html">
<dom-module id="hassio-supervisor">
<template>

View File

@ -15,7 +15,7 @@
"dev-watch": "npm run gulp watch_ru_all gen-service-worker",
"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",
"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",
"mocha": "node_modules/.bin/mocha --opts test-mocha/mocha.opts",
"test": "npm run lint_js && npm run lint_html && npm run mocha"
@ -50,6 +50,7 @@
"gulp-file": "^0.3.0",
"gulp-filter": "^5.0.1",
"gulp-foreach": "^0.1.0",
"gulp-gzip": "^1.4.0",
"gulp-hash": "^4.0.1",
"gulp-html-minifier": "^0.1.8",
"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="./hassio-main.html">
<link rel='import' href='../../src/util/hass-mixins.html'>
<dom-module id="ha-panel-hassio">
<template>
<style>
[hidden] {
display: none !important;
iframe {
border: 0;
width: 100%;
height: 100%;
}
</style>
<hassio-main
hass='[[hass]]'
narrow='[[narrow]]'
show-menu='[[showMenu]]'
route='[[route]]'
></hassio-main>
<iframe
id='iframe'
src="[[iframeUrl]]"
></iframe>
</template>
</dom-module>
<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 properties() {
@ -29,21 +29,50 @@ class HaPanelHassio extends Polymer.Element {
showMenu: Boolean,
route: Object,
loaded: {
type: Boolean,
value: false,
},
iframeUrl: {
type: String,
value: window.HASS_DEV ?
'/home-assistant-polymer/hassio/index.html' : '/api/hassio/app-es5/index.html',
}
};
}
connectedCallback() {
super.connectedCallback();
if (!window.HASS_DEV) {
Polymer.importHref(`/api/hassio/panel_${window.HASS_BUILD}`, null, () => {
// eslint-disable-next-line
alert('Failed to load the Hass.io panel from supervisor.');
});
static get observers() {
return [
'_dataChanged(hass, narrow, showMenu, route)'
];
}
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 style = document.createElement('link');
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');
style.setAttribute('rel', 'stylesheet');
this.$.map.parentNode.appendChild(style);

View File

@ -1637,6 +1637,10 @@ bytes@3.0.0:
version "3.0.0"
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:
version "1.0.0"
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"
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:
version "4.1.1"
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:
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:
version "1.0.5"
resolved "https://registry.yarnpkg.com/streamfilter/-/streamfilter-1.0.5.tgz#87507111beb8e298451717b511cfed8f002abf53"