Rip out paper-menu because it is broken

pull/199/head
Paulus Schoutsen 2015-06-30 22:55:12 -07:00
parent d4e9f26983
commit 9cfefb64dd
3 changed files with 123 additions and 40 deletions

View File

@ -1,2 +1,2 @@
""" DO NOT MODIFY. Auto-generated by build_frontend script """
VERSION = "fe75bfc72100af74c19fa02c000f6f63"
VERSION = "5fe3c81071fb3a771d93105eb9b911ed"

View File

@ -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) {

View File

@ -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) {