mirror of
https://github.com/home-assistant/frontend.git
synced 2025-07-19 15:26:36 +00:00
Merge navigation and panel modules in HA-JS
This commit is contained in:
parent
882ebfedd1
commit
56650a25df
@ -18,7 +18,6 @@
|
|||||||
"font-roboto-local": "^1.0.1",
|
"font-roboto-local": "^1.0.1",
|
||||||
"iron-flex-layout": "^1.3.1",
|
"iron-flex-layout": "^1.3.1",
|
||||||
"paper-scroll-header-panel": "1.0.16",
|
"paper-scroll-header-panel": "1.0.16",
|
||||||
"app-elements": "^0.9.0",
|
|
||||||
"app-layout": "^0.10.1"
|
"app-layout": "^0.10.1"
|
||||||
},
|
},
|
||||||
"_comment": "added to get min version for iron-flex-layout, paper-scroll-header-panel"
|
"_comment": "added to get min version for iron-flex-layout, paper-scroll-header-panel"
|
||||||
|
@ -1 +1 @@
|
|||||||
Subproject commit 11a648c2931f4f381af439b1c52d9ff028bd0626
|
Subproject commit adcbd4488dc31dbe422e971822c3036269c7f6b2
|
@ -147,27 +147,20 @@
|
|||||||
|
|
||||||
updateCards: function (columns, states, showIntroduction,
|
updateCards: function (columns, states, showIntroduction,
|
||||||
panelVisible, viewVisible) {
|
panelVisible, viewVisible) {
|
||||||
|
/* eslint-disable no-console */
|
||||||
if (!panelVisible || !viewVisible) {
|
if (!panelVisible || !viewVisible) {
|
||||||
console.log('cancelling update cards',
|
|
||||||
this.getAttribute('data-view') || 'default-view',
|
|
||||||
panelVisible, viewVisible);
|
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
console.log('updateCards', this.getAttribute('data-view') || 'default-view',
|
|
||||||
panelVisible, viewVisible);
|
|
||||||
this.debounce(
|
this.debounce(
|
||||||
'updateCards',
|
'updateCards', function () {
|
||||||
function () { this.cards = this.computeCards(columns, states,
|
// Things might have changed since it got scheduled.
|
||||||
showIntroduction); }
|
if (this.panelVisible && this.viewVisible) {
|
||||||
);
|
this.cards = this.computeCards(columns, states, showIntroduction);
|
||||||
|
}
|
||||||
|
}.bind(this));
|
||||||
},
|
},
|
||||||
|
|
||||||
computeCards: function (columns, states, showIntroduction) {
|
computeCards: function (columns, states, showIntroduction) {
|
||||||
// Things might have changed since it got scheduled.
|
|
||||||
if (!this.panelVisible || !this.viewVisible) {
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
console.error('computeCards', this.getAttribute('data-view') || 'default-view', states.size, this.viewVisible)
|
|
||||||
var hass = this.hass;
|
var hass = this.hass;
|
||||||
var byDomain = states.groupBy(function (entity) { return entity.domain; });
|
var byDomain = states.groupBy(function (entity) { return entity.domain; });
|
||||||
var hasGroup = {};
|
var hasGroup = {};
|
||||||
|
@ -175,7 +175,7 @@ Polymer({
|
|||||||
selected: {
|
selected: {
|
||||||
type: String,
|
type: String,
|
||||||
bindNuclear: function (hass) {
|
bindNuclear: function (hass) {
|
||||||
return hass.navigationGetters.activePane;
|
return hass.navigationGetters.activePanelName;
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
|
|
||||||
@ -197,7 +197,7 @@ Polymer({
|
|||||||
type: Array,
|
type: Array,
|
||||||
bindNuclear: function (hass) {
|
bindNuclear: function (hass) {
|
||||||
return [
|
return [
|
||||||
hass.panelGetters.panels,
|
hass.navigationGetters.panels,
|
||||||
function (res) { return res.toJS(); },
|
function (res) { return res.toJS(); },
|
||||||
];
|
];
|
||||||
},
|
},
|
||||||
|
@ -29,7 +29,7 @@
|
|||||||
main
|
main
|
||||||
attr-for-selected='id'
|
attr-for-selected='id'
|
||||||
fallback-selection='panel-resolver'
|
fallback-selection='panel-resolver'
|
||||||
selected='[[activePane]]'
|
selected='[[activePanel]]'
|
||||||
selected-attribute='panel-visible'
|
selected-attribute='panel-visible'
|
||||||
>
|
>
|
||||||
<partial-cards
|
<partial-cards
|
||||||
@ -68,12 +68,12 @@ Polymer({
|
|||||||
value: true,
|
value: true,
|
||||||
},
|
},
|
||||||
|
|
||||||
activePane: {
|
activePanel: {
|
||||||
type: String,
|
type: String,
|
||||||
bindNuclear: function (hass) {
|
bindNuclear: function (hass) {
|
||||||
return hass.navigationGetters.activePane;
|
return hass.navigationGetters.activePanelName;
|
||||||
},
|
},
|
||||||
observer: 'activePaneChanged',
|
observer: 'activePanelChanged',
|
||||||
},
|
},
|
||||||
|
|
||||||
showSidebar: {
|
showSidebar: {
|
||||||
@ -105,7 +105,7 @@ Polymer({
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
activePaneChanged: function () {
|
activePanelChanged: function () {
|
||||||
if (this.narrow) {
|
if (this.narrow) {
|
||||||
this.$.drawer.closeDrawer();
|
this.$.drawer.closeDrawer();
|
||||||
}
|
}
|
||||||
|
@ -1,5 +1,6 @@
|
|||||||
<link rel="import" href="../../bower_components/polymer/polymer.html">
|
<link rel="import" href="../../bower_components/polymer/polymer.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/iron-pages/iron-pages.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-tabs/paper-tabs.html">
|
<link rel="import" href="../../bower_components/paper-tabs/paper-tabs.html">
|
||||||
|
|
||||||
@ -10,6 +11,7 @@
|
|||||||
|
|
||||||
<link rel="import" href="../components/ha-menu-button.html">
|
<link rel="import" href="../components/ha-menu-button.html">
|
||||||
<link rel="import" href="../components/ha-cards.html">
|
<link rel="import" href="../components/ha-cards.html">
|
||||||
|
<link rel="import" href="../util/hass-behavior.html">
|
||||||
|
|
||||||
<dom-module id="partial-cards">
|
<dom-module id="partial-cards">
|
||||||
<template>
|
<template>
|
||||||
@ -55,12 +57,12 @@
|
|||||||
>
|
>
|
||||||
<paper-tab
|
<paper-tab
|
||||||
data-entity=''
|
data-entity=''
|
||||||
on-tap='handleViewTapped'
|
on-tap='scrollToTop'
|
||||||
>[[locationName]]</paper-tab>
|
>[[locationName]]</paper-tab>
|
||||||
<template is='dom-repeat' items='[[views]]'>
|
<template is='dom-repeat' items='[[views]]'>
|
||||||
<paper-tab
|
<paper-tab
|
||||||
data-entity$='[[item.entityId]]'
|
data-entity$='[[item.entityId]]'
|
||||||
on-tap='handleViewTapped'
|
on-tap='scrollToTop'
|
||||||
>
|
>
|
||||||
<template is='dom-if' if='[[item.attributes.icon]]'>
|
<template is='dom-if' if='[[item.attributes.icon]]'>
|
||||||
<iron-icon icon='[[item.attributes.icon]]'></iron-icon>
|
<iron-icon icon='[[item.attributes.icon]]'></iron-icon>
|
||||||
@ -211,10 +213,8 @@ Polymer({
|
|||||||
},
|
},
|
||||||
|
|
||||||
created: function () {
|
created: function () {
|
||||||
var sizes = [300, 600, 900, 1200];
|
|
||||||
var col;
|
|
||||||
this.handleWindowChange = this.handleWindowChange.bind(this);
|
this.handleWindowChange = this.handleWindowChange.bind(this);
|
||||||
this.mqls = sizes.map(function (width) {
|
this.mqls = [300, 600, 900, 1200].map(function (width) {
|
||||||
var mql = window.matchMedia('(min-width: ' + width + 'px)');
|
var mql = window.matchMedia('(min-width: ' + width + 'px)');
|
||||||
mql.addListener(this.handleWindowChange);
|
mql.addListener(this.handleWindowChange);
|
||||||
return mql;
|
return mql;
|
||||||
@ -287,16 +287,11 @@ Polymer({
|
|||||||
var current = this.currentView || null;
|
var current = this.currentView || null;
|
||||||
if (view !== current) {
|
if (view !== current) {
|
||||||
this.async(function () {
|
this.async(function () {
|
||||||
console.warn('changing view')
|
|
||||||
this.hass.viewActions.selectView(view);
|
this.hass.viewActions.selectView(view);
|
||||||
}.bind(this), 0);
|
}.bind(this), 0);
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
handleViewTapped: function (ev) {
|
|
||||||
this.scrollToTop();
|
|
||||||
},
|
|
||||||
|
|
||||||
computeRefreshButtonClass: function (isFetching) {
|
computeRefreshButtonClass: function (isFetching) {
|
||||||
return isFetching ? 'ha-spin' : '';
|
return isFetching ? 'ha-spin' : '';
|
||||||
},
|
},
|
||||||
|
@ -77,7 +77,7 @@ Polymer({
|
|||||||
panel: {
|
panel: {
|
||||||
type: Object,
|
type: Object,
|
||||||
bindNuclear: function (hass) {
|
bindNuclear: function (hass) {
|
||||||
return hass.panelGetters.activePanel;
|
return hass.navigationGetters.activePanel;
|
||||||
},
|
},
|
||||||
observer: 'panelChanged',
|
observer: 'panelChanged',
|
||||||
},
|
},
|
||||||
|
@ -19,7 +19,8 @@ window.hassBehavior = {
|
|||||||
getter = this.properties[key].bindNuclear(hass);
|
getter = this.properties[key].bindNuclear(hass);
|
||||||
|
|
||||||
if (!getter) {
|
if (!getter) {
|
||||||
throw new Error('Undefined getter specified for key ' + key);
|
throw new Error('Undefined getter specified for key ' + key +
|
||||||
|
' on ' + this.nodeName);
|
||||||
}
|
}
|
||||||
|
|
||||||
this[key] = hass.reactor.evaluate(getter);
|
this[key] = hass.reactor.evaluate(getter);
|
||||||
|
Loading…
x
Reference in New Issue
Block a user