mirror of
https://github.com/home-assistant/frontend.git
synced 2025-07-10 19:06:36 +00:00
Upgrade core config panels to ES6 classes (#438)
This commit is contained in:
parent
91c8b4eb23
commit
d1a194a147
@ -1,4 +1,4 @@
|
|||||||
<link rel="import" href="../../../bower_components/polymer/polymer.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">
|
||||||
@ -74,33 +74,38 @@
|
|||||||
</dom-module>
|
</dom-module>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
Polymer({
|
class HaConfigCore extends Polymer.Element {
|
||||||
is: 'ha-config-core',
|
|
||||||
|
|
||||||
properties: {
|
static get is() { return 'ha-config-core'; }
|
||||||
|
|
||||||
|
static get properties() {
|
||||||
|
return {
|
||||||
hass: Object,
|
hass: Object,
|
||||||
isWide: Boolean,
|
isWide: Boolean,
|
||||||
},
|
};
|
||||||
|
}
|
||||||
|
|
||||||
computeClasses: function (isWide) {
|
computeClasses(isWide) {
|
||||||
return isWide ? 'content' : 'content narrow';
|
return isWide ? 'content' : 'content narrow';
|
||||||
},
|
}
|
||||||
|
|
||||||
computeIsHassbianLoaded: function (hass) {
|
computeIsHassbianLoaded(hass) {
|
||||||
return window.hassUtil.isComponentLoaded(hass, 'config.hassbian');
|
return window.hassUtil.isComponentLoaded(hass, 'config.hassbian');
|
||||||
},
|
}
|
||||||
|
|
||||||
computeIsZwaveLoaded: function (hass) {
|
computeIsZwaveLoaded(hass) {
|
||||||
return window.hassUtil.isComponentLoaded(hass, 'config.zwave');
|
return window.hassUtil.isComponentLoaded(hass, 'config.zwave');
|
||||||
},
|
}
|
||||||
|
|
||||||
computeIsThemesLoaded: function (hass) {
|
computeIsThemesLoaded(hass) {
|
||||||
return hass.themes && hass.themes.themes &&
|
return hass.themes && hass.themes.themes &&
|
||||||
Object.keys(hass.themes.themes).length;
|
Object.keys(hass.themes.themes).length;
|
||||||
},
|
}
|
||||||
|
|
||||||
_backTapped: function () {
|
_backTapped() {
|
||||||
history.back();
|
history.back();
|
||||||
},
|
}
|
||||||
});
|
}
|
||||||
|
|
||||||
|
customElements.define(HaConfigCore.is, HaConfigCore);
|
||||||
</script>
|
</script>
|
||||||
|
@ -1,4 +1,4 @@
|
|||||||
<link rel="import" href="../../../bower_components/polymer/polymer.html">
|
<link rel="import" href="../../../bower_components/polymer/polymer-element.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="../../../bower_components/paper-button/paper-button.html">
|
<link rel="import" href="../../../bower_components/paper-button/paper-button.html">
|
||||||
@ -129,10 +129,12 @@
|
|||||||
</dom-module>
|
</dom-module>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
Polymer({
|
class HaConfigSectionCore extends Polymer.Element {
|
||||||
is: 'ha-config-section-core',
|
|
||||||
|
|
||||||
properties: {
|
static get is() { return 'ha-config-section-core'; }
|
||||||
|
|
||||||
|
static get properties() {
|
||||||
|
return {
|
||||||
hass: {
|
hass: {
|
||||||
type: Object,
|
type: Object,
|
||||||
},
|
},
|
||||||
@ -156,21 +158,22 @@ Polymer({
|
|||||||
type: String,
|
type: String,
|
||||||
value: '',
|
value: '',
|
||||||
},
|
},
|
||||||
},
|
};
|
||||||
|
}
|
||||||
|
|
||||||
groupLoaded: function (hass) {
|
groupLoaded(hass) {
|
||||||
return window.hassUtil.isComponentLoaded(hass, 'group');
|
return window.hassUtil.isComponentLoaded(hass, 'group');
|
||||||
},
|
}
|
||||||
|
|
||||||
automationLoaded: function (hass) {
|
automationLoaded(hass) {
|
||||||
return window.hassUtil.isComponentLoaded(hass, 'automation');
|
return window.hassUtil.isComponentLoaded(hass, 'automation');
|
||||||
},
|
}
|
||||||
|
|
||||||
scriptLoaded: function (hass) {
|
scriptLoaded(hass) {
|
||||||
return window.hassUtil.isComponentLoaded(hass, 'script');
|
return window.hassUtil.isComponentLoaded(hass, 'script');
|
||||||
},
|
}
|
||||||
|
|
||||||
validateConfig: function () {
|
validateConfig() {
|
||||||
this.validating = true;
|
this.validating = true;
|
||||||
this.validateLog = '';
|
this.validateLog = '';
|
||||||
this.validateResult = '';
|
this.validateResult = '';
|
||||||
@ -189,5 +192,7 @@ Polymer({
|
|||||||
}
|
}
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
});
|
}
|
||||||
|
|
||||||
|
customElements.define(HaConfigSectionCore.is, HaConfigSectionCore);
|
||||||
</script>
|
</script>
|
||||||
|
@ -1,4 +1,4 @@
|
|||||||
<link rel="import" href="../../../bower_components/polymer/polymer.html">
|
<link rel="import" href="../../../bower_components/polymer/polymer-element.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-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">
|
||||||
@ -35,10 +35,12 @@
|
|||||||
</dom-module>
|
</dom-module>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
Polymer({
|
class HaConfigSectionGroup extends Polymer.Element {
|
||||||
is: 'ha-config-section-group',
|
|
||||||
|
|
||||||
properties: {
|
static get is() { return 'ha-config-section-group'; }
|
||||||
|
|
||||||
|
static get properties() {
|
||||||
|
return {
|
||||||
hass: {
|
hass: {
|
||||||
type: Object,
|
type: Object,
|
||||||
},
|
},
|
||||||
@ -63,9 +65,10 @@ Polymer({
|
|||||||
},
|
},
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
},
|
};
|
||||||
|
}
|
||||||
|
|
||||||
computeEntities: function (hass) {
|
computeEntities(hass) {
|
||||||
return Object.keys(hass.states)
|
return Object.keys(hass.states)
|
||||||
.map(function (key) { return hass.states[key]; })
|
.map(function (key) { return hass.states[key]; })
|
||||||
.filter(function (entity) {
|
.filter(function (entity) {
|
||||||
@ -73,6 +76,8 @@ Polymer({
|
|||||||
!entity.attributes.auto);
|
!entity.attributes.auto);
|
||||||
})
|
})
|
||||||
.sort(window.hassUtil.sortByName);
|
.sort(window.hassUtil.sortByName);
|
||||||
},
|
}
|
||||||
});
|
}
|
||||||
|
|
||||||
|
customElements.define(HaConfigSectionGroup.is, HaConfigSectionGroup);
|
||||||
</script>
|
</script>
|
||||||
|
@ -1,4 +1,4 @@
|
|||||||
<link rel="import" href="../../../bower_components/polymer/polymer.html">
|
<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/iron-media-query/iron-media-query.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-input/paper-input.html">
|
<link rel="import" href="../../../bower_components/paper-input/paper-input.html">
|
||||||
@ -65,10 +65,12 @@
|
|||||||
</dom-module>
|
</dom-module>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
Polymer({
|
class HaConfigSectionHassbian extends Polymer.Element {
|
||||||
is: 'ha-config-section-hassbian',
|
|
||||||
|
|
||||||
properties: {
|
static get is() { return 'ha-config-section-hassbian'; }
|
||||||
|
|
||||||
|
static get properties() {
|
||||||
|
return {
|
||||||
hass: {
|
hass: {
|
||||||
type: Object,
|
type: Object,
|
||||||
},
|
},
|
||||||
@ -81,9 +83,10 @@ Polymer({
|
|||||||
type: Object,
|
type: Object,
|
||||||
value: null,
|
value: null,
|
||||||
},
|
},
|
||||||
},
|
};
|
||||||
|
}
|
||||||
|
|
||||||
updateStatus: function () {
|
updateStatus() {
|
||||||
// TODO tapping install while something is installing triggers a second
|
// TODO tapping install while something is installing triggers a second
|
||||||
// update loop to start.
|
// update loop to start.
|
||||||
this.hass.callApi('GET', 'config/hassbian/suites').then(function (suites) {
|
this.hass.callApi('GET', 'config/hassbian/suites').then(function (suites) {
|
||||||
@ -102,14 +105,14 @@ Polymer({
|
|||||||
this.async(this.updateStatus, 5000);
|
this.async(this.updateStatus, 5000);
|
||||||
}
|
}
|
||||||
}.bind(this));
|
}.bind(this));
|
||||||
},
|
}
|
||||||
|
|
||||||
attached: function () {
|
attached() {
|
||||||
this.updateStatus = this.updateStatus.bind(this);
|
this.updateStatus = this.updateStatus.bind(this);
|
||||||
this.updateStatus();
|
this.updateStatus();
|
||||||
},
|
}
|
||||||
|
|
||||||
computeSuiteKeys: function (suiteStatus) {
|
computeSuiteKeys(suiteStatus) {
|
||||||
// Prioritize installing packages
|
// Prioritize installing packages
|
||||||
return Object.keys(suiteStatus).sort(function (keyA, keyB) {
|
return Object.keys(suiteStatus).sort(function (keyA, keyB) {
|
||||||
var installingA = suiteStatus[keyA].state === 'installing';
|
var installingA = suiteStatus[keyA].state === 'installing';
|
||||||
@ -131,37 +134,39 @@ Polymer({
|
|||||||
}
|
}
|
||||||
return 0;
|
return 0;
|
||||||
});
|
});
|
||||||
},
|
}
|
||||||
|
|
||||||
computeSuiteDescription: function (suiteStatus, suiteKey) {
|
computeSuiteDescription(suiteStatus, suiteKey) {
|
||||||
return suiteStatus[suiteKey].description;
|
return suiteStatus[suiteKey].description;
|
||||||
},
|
}
|
||||||
|
|
||||||
computeTitle: function (suiteKey) {
|
computeTitle(suiteKey) {
|
||||||
return suiteKey.substr(0, 1).toUpperCase() + suiteKey.substr(1);
|
return suiteKey.substr(0, 1).toUpperCase() + suiteKey.substr(1);
|
||||||
},
|
}
|
||||||
|
|
||||||
computeSuiteStatus: function (suiteStatus, suiteKey) {
|
computeSuiteStatus(suiteStatus, suiteKey) {
|
||||||
var state = suiteStatus[suiteKey].state.replace(/_/, ' ');
|
var state = suiteStatus[suiteKey].state.replace(/_/, ' ');
|
||||||
return state.substr(0, 1).toUpperCase() + state.substr(1);
|
return state.substr(0, 1).toUpperCase() + state.substr(1);
|
||||||
},
|
}
|
||||||
|
|
||||||
computeShowStatus: function (suiteStatus, suiteKey) {
|
computeShowStatus(suiteStatus, suiteKey) {
|
||||||
var state = suiteStatus[suiteKey].state;
|
var state = suiteStatus[suiteKey].state;
|
||||||
return state !== 'installing' && state !== 'not_installed';
|
return state !== 'installing' && state !== 'not_installed';
|
||||||
},
|
}
|
||||||
|
|
||||||
computeShowInstall: function (suiteStatus, suiteKey) {
|
computeShowInstall(suiteStatus, suiteKey) {
|
||||||
return suiteStatus[suiteKey].state === 'not_installed';
|
return suiteStatus[suiteKey].state === 'not_installed';
|
||||||
},
|
}
|
||||||
|
|
||||||
suiteMoreInfoTapped: function () {
|
suiteMoreInfoTapped() {
|
||||||
// console.log('learn more', ev.model.item);
|
// console.log('learn more', ev.model.item);
|
||||||
},
|
}
|
||||||
|
|
||||||
suiteActionTapped: function () {
|
suiteActionTapped() {
|
||||||
// TODO install tapped suite
|
// TODO install tapped suite
|
||||||
this.hass.callApi('POST', 'config/hassbian/suites/openzwave/install').then(this.updateStatus);
|
this.hass.callApi('POST', 'config/hassbian/suites/openzwave/install').then(this.updateStatus);
|
||||||
},
|
}
|
||||||
});
|
}
|
||||||
|
|
||||||
|
customElements.define(HaConfigSectionHassbian.is, HaConfigSectionHassbian);
|
||||||
</script>
|
</script>
|
||||||
|
@ -1,4 +1,4 @@
|
|||||||
<link rel="import" href="../../../bower_components/polymer/polymer.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-dropdown-menu/paper-dropdown-menu.html">
|
<link rel="import" href="../../../bower_components/paper-dropdown-menu/paper-dropdown-menu.html">
|
||||||
<link rel='import' href='../../../bower_components/paper-listbox/paper-listbox.html'>
|
<link rel='import' href='../../../bower_components/paper-listbox/paper-listbox.html'>
|
||||||
@ -33,10 +33,12 @@
|
|||||||
</dom-module>
|
</dom-module>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
Polymer({
|
class HaConfigSectionThemes extends window.hassMixins.EventsMixin(Polymer.Element) {
|
||||||
is: 'ha-config-section-themes',
|
|
||||||
|
|
||||||
properties: {
|
static get is() { return 'ha-config-section-themes'; }
|
||||||
|
|
||||||
|
static get properties() {
|
||||||
|
return {
|
||||||
hass: {
|
hass: {
|
||||||
type: Object,
|
type: Object,
|
||||||
},
|
},
|
||||||
@ -53,26 +55,30 @@ Polymer({
|
|||||||
selectedTheme: {
|
selectedTheme: {
|
||||||
type: Number,
|
type: Number,
|
||||||
},
|
},
|
||||||
},
|
};
|
||||||
|
}
|
||||||
|
|
||||||
ready: function () {
|
static get observers() {
|
||||||
|
return [
|
||||||
|
'selectionChanged(hass, selectedTheme)',
|
||||||
|
];
|
||||||
|
}
|
||||||
|
|
||||||
|
ready() {
|
||||||
|
super.ready();
|
||||||
if (this.hass.selectedTheme && this.themes.indexOf(this.hass.selectedTheme) > 0) {
|
if (this.hass.selectedTheme && this.themes.indexOf(this.hass.selectedTheme) > 0) {
|
||||||
this.selectedTheme = this.themes.indexOf(this.hass.selectedTheme);
|
this.selectedTheme = this.themes.indexOf(this.hass.selectedTheme);
|
||||||
} else if (!this.hass.selectedTheme) {
|
} else if (!this.hass.selectedTheme) {
|
||||||
this.selectedTheme = 0;
|
this.selectedTheme = 0;
|
||||||
}
|
}
|
||||||
},
|
}
|
||||||
|
|
||||||
observers: [
|
computeThemes(hass) {
|
||||||
'selectionChanged(hass, selectedTheme)',
|
|
||||||
],
|
|
||||||
|
|
||||||
computeThemes: function (hass) {
|
|
||||||
if (!hass) return [];
|
if (!hass) return [];
|
||||||
return ['Backend-selected', 'default'].concat(Object.keys(hass.themes.themes).sort());
|
return ['Backend-selected', 'default'].concat(Object.keys(hass.themes.themes).sort());
|
||||||
},
|
}
|
||||||
|
|
||||||
selectionChanged: function (hass, selection) {
|
selectionChanged(hass, selection) {
|
||||||
if (selection > 0 && selection < this.themes.length) {
|
if (selection > 0 && selection < this.themes.length) {
|
||||||
if (hass.selectedTheme !== this.themes[selection]) {
|
if (hass.selectedTheme !== this.themes[selection]) {
|
||||||
this.fire('settheme', this.themes[selection]);
|
this.fire('settheme', this.themes[selection]);
|
||||||
@ -81,5 +87,7 @@ Polymer({
|
|||||||
this.fire('settheme', '');
|
this.fire('settheme', '');
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
});
|
}
|
||||||
|
|
||||||
|
customElements.define(HaConfigSectionThemes.is, HaConfigSectionThemes);
|
||||||
</script>
|
</script>
|
||||||
|
@ -1,4 +1,4 @@
|
|||||||
<link rel="import" href="../../../bower_components/polymer/polymer.html">
|
<link rel="import" href="../../../bower_components/polymer/polymer-element.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-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-menu-button/paper-menu-button.html">
|
<link rel="import" href="../../../bower_components/paper-menu-button/paper-menu-button.html">
|
||||||
@ -131,10 +131,12 @@
|
|||||||
</dom-module>
|
</dom-module>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
Polymer({
|
class HaFormGroup extends Polymer.Element {
|
||||||
is: 'ha-form-group',
|
|
||||||
|
|
||||||
properties: {
|
static get is() { return 'ha-form-group'; }
|
||||||
|
|
||||||
|
static get properties() {
|
||||||
|
return {
|
||||||
hass: {
|
hass: {
|
||||||
type: Object,
|
type: Object,
|
||||||
},
|
},
|
||||||
@ -155,17 +157,18 @@ Polymer({
|
|||||||
entityChildren: {
|
entityChildren: {
|
||||||
type: Object,
|
type: Object,
|
||||||
},
|
},
|
||||||
},
|
};
|
||||||
|
}
|
||||||
|
|
||||||
handleRowChosen: function (ev) {
|
handleRowChosen(ev) {
|
||||||
// Polymer element and sortablejs both fire the same events, filter one out
|
// Polymer element and sortablejs both fire the same events, filter one out
|
||||||
if (!ev.detail || !window.navigator.vibrate) return;
|
if (!ev.detail || !window.navigator.vibrate) return;
|
||||||
|
|
||||||
// Tell the user that moving his finger now will start dragging.
|
// Tell the user that moving his finger now will start dragging.
|
||||||
window.navigator.vibrate(50);
|
window.navigator.vibrate(50);
|
||||||
},
|
}
|
||||||
|
|
||||||
loadEntity: function (entity) {
|
loadEntity(entity) {
|
||||||
var states = this.hass.states;
|
var states = this.hass.states;
|
||||||
this.entity = entity;
|
this.entity = entity;
|
||||||
this.entityName = entity.attributes.friendly_name || '';
|
this.entityName = entity.attributes.friendly_name || '';
|
||||||
@ -175,9 +178,9 @@ Polymer({
|
|||||||
return states[ent] || { state: false, entity_id: ent, attributes: {} };
|
return states[ent] || { state: false, entity_id: ent, attributes: {} };
|
||||||
});
|
});
|
||||||
return Promise.resolve();
|
return Promise.resolve();
|
||||||
},
|
}
|
||||||
|
|
||||||
saveEntity: function () {
|
saveEntity() {
|
||||||
var data = {
|
var data = {
|
||||||
name: this.entityName,
|
name: this.entityName,
|
||||||
view: this.entityType === 'view',
|
view: this.entityType === 'view',
|
||||||
@ -186,10 +189,8 @@ Polymer({
|
|||||||
|
|
||||||
var objectId = this.entity.entity_id.split('.')[1];
|
var objectId = this.entity.entity_id.split('.')[1];
|
||||||
return this.hass.callApi('POST', 'config/group/config/' + objectId, data);
|
return this.hass.callApi('POST', 'config/group/config/' + objectId, data);
|
||||||
},
|
}
|
||||||
|
}
|
||||||
|
|
||||||
// deleteEntity: function () {
|
customElements.define(HaFormGroup.is, HaFormGroup);
|
||||||
// return new Promise.resolve();
|
|
||||||
// }
|
|
||||||
});
|
|
||||||
</script>
|
</script>
|
||||||
|
Loading…
x
Reference in New Issue
Block a user