Initial themes support (#331)

* Initial themes support

* Fix after merge

* Now UI autoresponds to backend theme change

* Move style udating logic to hass-util

* Revert unneeded change

* Switch to ES5 syntax
This commit is contained in:
Andrey 2017-07-13 19:10:59 +03:00 committed by Paulus Schoutsen
parent b08170e7ff
commit 7c079dc01f
2 changed files with 32 additions and 0 deletions

View File

@ -14,6 +14,7 @@
<link rel='import' href='../util/ha-url-sync.html'>
<link rel='import' href='../components/ha-sidebar.html'>
<link rel='import' href='../util/hass-util.html'>
<dom-module id='home-assistant-main'>
<template>
@ -108,6 +109,20 @@ Polymer({
'hass-start-voice': 'handleStartVoice',
},
ready: function () {
if (!this.hass) return;
var _this = this;
this.hass.callApi('get', 'themes').then(
function (themes) {
window.hassUtil.applyThemesOnElement(_this, themes);
});
this.hass.connection.subscribeEvents(
function (event) {
window.hassUtil.applyThemesOnElement(_this, event.data);
},
'themes_updated');
},
_routeChanged: function () {
if (this.narrow) {
this.$.drawer.closeDrawer();

View File

@ -473,4 +473,21 @@ window.hassUtil.computeLocationName = function (hass) {
return hass && hass.config.core.location_name;
};
window.hassUtil.applyThemesOnElement = function (element, themes) {
if (!element._themes) {
element._themes = {};
}
if (themes.default_theme === 'default') {
element.updateStyles(element._themes);
return;
}
var theme = themes.themes[themes.default_theme];
var styles = Object.assign({}, element._themes);
Object.keys(theme).forEach(function (key) {
var prefixedKey = '--' + key;
element._themes[prefixedKey] = '';
styles[prefixedKey] = theme[key];
});
element.updateStyles(styles);
};
</script>