Rip out paper-menu because it is broken
parent
d4e9f26983
commit
9cfefb64dd
|
@ -1,2 +1,2 @@
|
|||
""" DO NOT MODIFY. Auto-generated by build_frontend script """
|
||||
VERSION = "fe75bfc72100af74c19fa02c000f6f63"
|
||||
VERSION = "5fe3c81071fb3a771d93105eb9b911ed"
|
||||
|
|
|
@ -14729,6 +14729,7 @@ document.registerElement('color-picker', { prototype: colorPickerPrototype });
|
|||
|
||||
|
||||
|
||||
|
||||
<style is="custom-style">
|
||||
:root {
|
||||
--dark-primary-color: #0288D1;
|
||||
|
@ -17689,10 +17690,20 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
|
|||
},
|
||||
|
||||
listeners: {
|
||||
'passwordInput.keydown': 'passwordKeyDown',
|
||||
'keydown': 'passwordKeyDown',
|
||||
'loginButton.click': 'validatePassword',
|
||||
},
|
||||
|
||||
observers: [
|
||||
'validatingChanged(isValidating, isInvalid)',
|
||||
],
|
||||
|
||||
validatingChanged: function(isValidating, isInvalid) {
|
||||
if (!isValidating && !isInvalid) {
|
||||
this.$.passwordInput.value = '';
|
||||
}
|
||||
},
|
||||
|
||||
isValidatingChanged: function(newVal) {
|
||||
if (!newVal) {
|
||||
this.debounce('focus-password', function() {
|
||||
|
@ -25097,15 +25108,24 @@ paper-ripple {
|
|||
overflow: hidden;
|
||||
}
|
||||
|
||||
.sidenav paper-menu {
|
||||
/*.sidenav paper-menu {
|
||||
--paper-menu-color: var(--secondary-text-color);
|
||||
--paper-menu-background-color: #fafafa;
|
||||
}*/
|
||||
|
||||
div.menu {
|
||||
color: var(--secondary-text-color);
|
||||
background-color: #fafafa;
|
||||
}
|
||||
|
||||
paper-icon-item {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
paper-icon-item.selected {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
paper-icon-item.logout {
|
||||
margin-top: 16px;
|
||||
}
|
||||
|
@ -25131,33 +25151,34 @@ paper-ripple {
|
|||
<paper-icon-button hidden=""></paper-icon-button>
|
||||
<div class="title">Home Assistant</div>
|
||||
</paper-toolbar>
|
||||
<paper-menu id="menu" selected="{{menuSelected}}" selectable="[data-panel]" attr-for-selected="data-panel">
|
||||
<paper-icon-item data-panel="states">
|
||||
|
||||
<div class="menu">
|
||||
<paper-icon-item on-click="menuClicked" data-panel="states">
|
||||
<iron-icon item-icon="" icon="apps"></iron-icon> States
|
||||
</paper-icon-item>
|
||||
|
||||
<template is="dom-repeat" items="{{possibleFilters}}">
|
||||
<paper-icon-item data-panel$="[[filterType(item)]]">
|
||||
<paper-icon-item on-click="menuClicked" data-panel$="[[filterType(item)]]">
|
||||
<iron-icon item-icon="" icon="[[filterIcon(item)]]"></iron-icon>
|
||||
<span>[[filterName(item)]]</span>
|
||||
</paper-icon-item>
|
||||
</template>
|
||||
|
||||
<template is="dom-if" if="[[hasHistoryComponent]]">
|
||||
<paper-icon-item data-panel="history">
|
||||
<paper-icon-item on-click="menuClicked" data-panel="history">
|
||||
<iron-icon item-icon="" icon="assessment"></iron-icon>
|
||||
History
|
||||
</paper-icon-item>
|
||||
</template>
|
||||
|
||||
<template is="dom-if" if="[[hasLogbookComponent]]">
|
||||
<paper-icon-item data-panel="logbook">
|
||||
<paper-icon-item on-click="menuClicked" data-panel="logbook">
|
||||
<iron-icon item-icon="" icon="list"></iron-icon>
|
||||
Logbook
|
||||
</paper-icon-item>
|
||||
</template>
|
||||
|
||||
<paper-icon-item data-panel="logout" class="logout">
|
||||
<paper-icon-item on-click="menuClicked" data-panel="logout" class="logout">
|
||||
<iron-icon item-icon="" icon="exit-to-app"></iron-icon>
|
||||
Log Out
|
||||
</paper-icon-item>
|
||||
|
@ -25173,7 +25194,8 @@ paper-ripple {
|
|||
<paper-icon-button icon="settings-ethernet" data-panel="devState" on-click="handleDevClick"></paper-icon-button>
|
||||
<paper-icon-button icon="settings-input-antenna" data-panel="devEvent" on-click="handleDevClick"></paper-icon-button>
|
||||
</div>
|
||||
</paper-menu>
|
||||
|
||||
</div>
|
||||
</paper-header-panel>
|
||||
|
||||
</template>
|
||||
|
@ -25198,7 +25220,7 @@ paper-ripple {
|
|||
properties: {
|
||||
menuSelected: {
|
||||
type: String,
|
||||
observer: 'menuSelectedChanged',
|
||||
// observer: 'menuSelectedChanged',
|
||||
},
|
||||
|
||||
selected: {
|
||||
|
@ -25227,22 +25249,46 @@ paper-ripple {
|
|||
},
|
||||
},
|
||||
|
||||
menuSelectedChanged: function(newVal) {
|
||||
if (this.selected !== newVal) {
|
||||
this.selectPanel(newVal);
|
||||
}
|
||||
},
|
||||
// menuSelectedChanged: function(newVal) {
|
||||
// if (this.selected !== newVal) {
|
||||
// this.selectPanel(newVal);
|
||||
// }
|
||||
// },
|
||||
|
||||
selectedChanged: function(newVal) {
|
||||
if (this.menuSelected !== newVal) {
|
||||
this.menuSelected = newVal;
|
||||
// if (this.menuSelected !== newVal) {
|
||||
// this.menuSelected = newVal;
|
||||
// }
|
||||
var menuItems = this.querySelectorAll('.menu [data-panel]');
|
||||
|
||||
for (var i = 0; i < menuItems.length; i++) {
|
||||
if(menuItems[i].dataset.panel === newVal) {
|
||||
menuItems[i].classList.add('selected');
|
||||
} else {
|
||||
menuItems[i].classList.remove('selected');
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
handleDevClick: function(ev, detail, sender) {
|
||||
menuClicked: function(ev) {
|
||||
var target = ev.target;
|
||||
var checks = 5;
|
||||
|
||||
// find panel to select
|
||||
while(checks && !target.dataset.panel) {
|
||||
target = target.parentElement;
|
||||
checks--;
|
||||
}
|
||||
|
||||
if (checks) {
|
||||
this.selectPanel(target.dataset.panel);
|
||||
}
|
||||
},
|
||||
|
||||
handleDevClick: function(ev) {
|
||||
// prevent it from highlighting first menu item
|
||||
document.activeElement.blur();
|
||||
this.selectPanel(ev.target.parentElement.dataset.panel);
|
||||
this.menuClicked(ev);
|
||||
},
|
||||
|
||||
selectPanel: function(newChoice) {
|
||||
|
|
|
@ -3,7 +3,9 @@
|
|||
|
||||
<link rel='import' href='../bower_components/paper-header-panel/paper-header-panel.html'>
|
||||
<link rel='import' href='../bower_components/paper-toolbar/paper-toolbar.html'>
|
||||
<link rel='import' href='../bower_components/paper-menu/paper-menu.html'>
|
||||
<!--
|
||||
Too broken for now.
|
||||
<link rel='import' href='../bower_components/paper-menu/paper-menu.html'> -->
|
||||
<link rel='import' href='../bower_components/iron-icon/iron-icon.html'>
|
||||
<link rel='import' href='../bower_components/paper-item/paper-item.html'>
|
||||
<link rel='import' href='../bower_components/paper-item/paper-icon-item.html'>
|
||||
|
@ -19,15 +21,24 @@
|
|||
overflow: hidden;
|
||||
}
|
||||
|
||||
.sidenav paper-menu {
|
||||
/*.sidenav paper-menu {
|
||||
--paper-menu-color: var(--secondary-text-color);
|
||||
--paper-menu-background-color: #fafafa;
|
||||
}*/
|
||||
|
||||
div.menu {
|
||||
color: var(--secondary-text-color);
|
||||
background-color: #fafafa;
|
||||
}
|
||||
|
||||
paper-icon-item {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
paper-icon-item.selected {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
paper-icon-item.logout {
|
||||
margin-top: 16px;
|
||||
}
|
||||
|
@ -53,34 +64,35 @@
|
|||
<paper-icon-button hidden></paper-icon-button>
|
||||
<div class="title">Home Assistant</div>
|
||||
</paper-toolbar>
|
||||
<paper-menu id='menu' selected='{{menuSelected}}'
|
||||
selectable='[data-panel]' attr-for-selected='data-panel'>
|
||||
<paper-icon-item data-panel='states'>
|
||||
<!-- <paper-menu id='menu' selected='{{menuSelected}}'
|
||||
selectable='[data-panel]' attr-for-selected='data-panel'> -->
|
||||
<div class='menu'>
|
||||
<paper-icon-item on-click='menuClicked' data-panel='states'>
|
||||
<iron-icon item-icon icon='apps'></iron-icon> States
|
||||
</paper-icon-item>
|
||||
|
||||
<template is='dom-repeat' items='{{possibleFilters}}'>
|
||||
<paper-icon-item data-panel$='[[filterType(item)]]'>
|
||||
<paper-icon-item on-click='menuClicked' data-panel$='[[filterType(item)]]'>
|
||||
<iron-icon item-icon icon='[[filterIcon(item)]]'></iron-icon>
|
||||
<span>[[filterName(item)]]</span>
|
||||
</paper-icon-item>
|
||||
</template>
|
||||
|
||||
<template is='dom-if' if='[[hasHistoryComponent]]'>
|
||||
<paper-icon-item data-panel='history'>
|
||||
<paper-icon-item on-click='menuClicked' data-panel='history'>
|
||||
<iron-icon item-icon icon='assessment'></iron-icon>
|
||||
History
|
||||
</paper-icon-item>
|
||||
</template>
|
||||
|
||||
<template is='dom-if' if='[[hasLogbookComponent]]'>
|
||||
<paper-icon-item data-panel='logbook'>
|
||||
<paper-icon-item on-click='menuClicked' data-panel='logbook'>
|
||||
<iron-icon item-icon icon='list'></iron-icon>
|
||||
Logbook
|
||||
</paper-icon-item>
|
||||
</template>
|
||||
|
||||
<paper-icon-item data-panel='logout' class='logout'>
|
||||
<paper-icon-item on-click='menuClicked' data-panel='logout' class='logout'>
|
||||
<iron-icon item-icon icon='exit-to-app'></iron-icon>
|
||||
Log Out
|
||||
</paper-icon-item>
|
||||
|
@ -102,7 +114,8 @@
|
|||
icon='settings-input-antenna' data-panel='devEvent'
|
||||
on-click='handleDevClick'></paper-icon-button>
|
||||
</div>
|
||||
</paper-menu>
|
||||
<!-- </paper-menu> -->
|
||||
</div>
|
||||
</paper-header-panel>
|
||||
|
||||
</template>
|
||||
|
@ -127,7 +140,7 @@
|
|||
properties: {
|
||||
menuSelected: {
|
||||
type: String,
|
||||
observer: 'menuSelectedChanged',
|
||||
// observer: 'menuSelectedChanged',
|
||||
},
|
||||
|
||||
selected: {
|
||||
|
@ -156,22 +169,46 @@
|
|||
},
|
||||
},
|
||||
|
||||
menuSelectedChanged: function(newVal) {
|
||||
if (this.selected !== newVal) {
|
||||
this.selectPanel(newVal);
|
||||
}
|
||||
},
|
||||
// menuSelectedChanged: function(newVal) {
|
||||
// if (this.selected !== newVal) {
|
||||
// this.selectPanel(newVal);
|
||||
// }
|
||||
// },
|
||||
|
||||
selectedChanged: function(newVal) {
|
||||
if (this.menuSelected !== newVal) {
|
||||
this.menuSelected = newVal;
|
||||
// if (this.menuSelected !== newVal) {
|
||||
// this.menuSelected = newVal;
|
||||
// }
|
||||
var menuItems = this.querySelectorAll('.menu [data-panel]');
|
||||
|
||||
for (var i = 0; i < menuItems.length; i++) {
|
||||
if(menuItems[i].dataset.panel === newVal) {
|
||||
menuItems[i].classList.add('selected');
|
||||
} else {
|
||||
menuItems[i].classList.remove('selected');
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
handleDevClick: function(ev, detail, sender) {
|
||||
menuClicked: function(ev) {
|
||||
var target = ev.target;
|
||||
var checks = 5;
|
||||
|
||||
// find panel to select
|
||||
while(checks && !target.dataset.panel) {
|
||||
target = target.parentElement;
|
||||
checks--;
|
||||
}
|
||||
|
||||
if (checks) {
|
||||
this.selectPanel(target.dataset.panel);
|
||||
}
|
||||
},
|
||||
|
||||
handleDevClick: function(ev) {
|
||||
// prevent it from highlighting first menu item
|
||||
document.activeElement.blur();
|
||||
this.selectPanel(ev.target.parentElement.dataset.panel);
|
||||
this.menuClicked(ev);
|
||||
},
|
||||
|
||||
selectPanel: function(newChoice) {
|
||||
|
|
Loading…
Reference in New Issue