Support for locks that need code to lock/unlock in frontend

More fixes, Code input is now available in more-info card for lock

Fix

If code not needed, do not show lock and unlock buttons
This commit is contained in:
turbokongen@hotmail.com 2016-01-30 16:32:55 +01:00
parent 472f485a7e
commit 9a81c557f6
5 changed files with 93 additions and 1 deletions

View File

@ -11,6 +11,7 @@
<link rel='import' href='more-info-camera.html'>
<link rel='import' href='more-info-updater.html'>
<link rel='import' href='more-info-alarm_control_panel.html'>
<link rel='import' href='more-info-lock.html'>
<dom-module id='more-info-content'>
<style>

View File

@ -12,6 +12,7 @@ require('./more-info-media_player');
require('./more-info-camera');
require('./more-info-updater');
require('./more-info-alarm_control_panel');
require('./more-info-lock');
export default new Polymer({
is: 'more-info-content',

View File

@ -0,0 +1,16 @@
<link rel='import' href='../../bower_components/polymer/polymer.html'>
<link rel='import' href='../../bower_components/paper-button/paper-button.html'>
<link rel='import' href='../../bower_components/paper-input/paper-input.html'>
<dom-module id='more-info-lock'>
<template>
<div class='layout horizontal'>
<paper-input label='code' value='{{enteredCode}}' pattern='[[codeFormat]]' type='password' hidden='[[!codeInputVisible]]' disabled='[[!codeInputEnabled]]'></paper-input>
</div>
<div class='layout horizontal'>
<paper-button on-tap='handleUnlockTap' hidden='[[!codeInputVisible]]' disabled='[[!unlockButtonVisible]]'>Unlock</paper-button>
<paper-button on-tap='handleLockTap' hidden='[[!codeInputVisible]]' disabled=[[!lockButtonVisible]]>Lock</paper-button>
</div>
</template>
</dom-module>

View File

@ -0,0 +1,74 @@
import hass from '../util/home-assistant-js-instance';
import Polymer from '../polymer';
const { serviceActions } = hass;
export default new Polymer({
is: 'more-info-lock',
properties: {
stateObj: {
type: Object,
observer: 'stateObjChanged',
},
enteredCode: {
type: String,
value: '',
},
unlockButtonVisible: {
type: Boolean,
value: false,
},
lockButtonVisible: {
type: Boolean,
value: false,
},
codeInputVisible: {
type: Boolean,
value: false,
},
codeInputEnabled: {
type: Boolean,
value: false,
},
codeFormat: {
type: String,
value: '',
},
codeValid: {
type: Boolean,
computed: 'validateCode(enteredCode, codeFormat)',
},
},
handleUnlockTap() {
this.callService('unlock', { code: this.enteredCode });
},
handleLockTap() {
this.callService('lock', { code: this.enteredCode });
},
validateCode(code, format) {
const re = new RegExp(format);
if (format === null) {
return true;
}
return re.test(code);
},
stateObjChanged(newVal) {
if (newVal) {
this.codeFormat = newVal.attributes.code_format;
this.codeInputVisible = this.codeFormat !== null;
this.codeInputEnabled = (
newVal.state === 'locked' ||
newVal.state === 'unlocked');
this.unlockButtonVisible = (
newVal.state === 'locked');
this.lockButtonVisible = newVal.state === 'unlocked';
}
this.async(() => this.fire('iron-resize'), 500);
},
callService(service, data) {
const serviceData = data || {};
serviceData.entity_id = this.stateObj.entityId;
serviceActions.callService('lock', service, serviceData);
},
});

View File

@ -1,6 +1,6 @@
const DOMAINS_WITH_MORE_INFO = [
'light', 'group', 'sun', 'configurator', 'thermostat', 'script',
'media_player', 'camera', 'updater', 'alarm_control_panel',
'media_player', 'camera', 'updater', 'alarm_control_panel', 'lock',
];
export default function stateMoreInfoType(state) {