mirror of
https://github.com/home-assistant/core.git
synced 2025-07-17 02:07:09 +00:00
Squashed bugs in frontend
This commit is contained in:
parent
1d0657ff54
commit
82b2b9cb94
@ -1,2 +1,2 @@
|
|||||||
""" DO NOT MODIFY. Auto-generated by build_polymer script """
|
""" DO NOT MODIFY. Auto-generated by build_polymer script """
|
||||||
VERSION = "57f41262ccbd90c2e988e5be0a5dab59"
|
VERSION = "b476e6588846c1ce0e194dfec06da78e"
|
||||||
|
File diff suppressed because one or more lines are too long
@ -20,7 +20,6 @@
|
|||||||
<state-set-dialog id="stateDialog" api={{api}}></state-set-dialog>
|
<state-set-dialog id="stateDialog" api={{api}}></state-set-dialog>
|
||||||
|
|
||||||
<core-ajax id="statesAjax"
|
<core-ajax id="statesAjax"
|
||||||
auto
|
|
||||||
method="GET"
|
method="GET"
|
||||||
url="/api/states"
|
url="/api/states"
|
||||||
headers="{{ha_headers}}"
|
headers="{{ha_headers}}"
|
||||||
@ -29,7 +28,6 @@
|
|||||||
</core-ajax>
|
</core-ajax>
|
||||||
|
|
||||||
<core-ajax id="eventsAjax"
|
<core-ajax id="eventsAjax"
|
||||||
auto
|
|
||||||
method="GET"
|
method="GET"
|
||||||
url="/api/events"
|
url="/api/events"
|
||||||
headers="{{ha_headers}}"
|
headers="{{ha_headers}}"
|
||||||
@ -38,7 +36,6 @@
|
|||||||
</core-ajax>
|
</core-ajax>
|
||||||
|
|
||||||
<core-ajax id="servicesAjax"
|
<core-ajax id="servicesAjax"
|
||||||
auto
|
|
||||||
method="GET"
|
method="GET"
|
||||||
url="/api/services"
|
url="/api/services"
|
||||||
headers="{{ha_headers}}"
|
headers="{{ha_headers}}"
|
||||||
@ -67,6 +64,22 @@
|
|||||||
this.turn_off = this.turn_off.bind(this);
|
this.turn_off = this.turn_off.bind(this);
|
||||||
},
|
},
|
||||||
|
|
||||||
|
// local methods
|
||||||
|
getState: function(entityId) {
|
||||||
|
for(var i = 0; i < this.states.length; i++) {
|
||||||
|
if(this.states[i].entity_id == entityId) {
|
||||||
|
return this.states[i];
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
getCustomGroups: function() {
|
||||||
|
return this.states.filter(function(state) {
|
||||||
|
return (state.entity_id.lastIndexOf("group.") == 0 &&
|
||||||
|
!state.attributes.auto);
|
||||||
|
})
|
||||||
|
},
|
||||||
|
|
||||||
_laterFetchStates: function() {
|
_laterFetchStates: function() {
|
||||||
if(this.stateUpdateTimeout) {
|
if(this.stateUpdateTimeout) {
|
||||||
clearTimeout(this.stateUpdateTimeout);
|
clearTimeout(this.stateUpdateTimeout);
|
||||||
@ -88,29 +101,6 @@
|
|||||||
})
|
})
|
||||||
},
|
},
|
||||||
|
|
||||||
statesLoaded: function() {
|
|
||||||
// Make a copy of the loaded data
|
|
||||||
this.states = this._sortStates(this.$.statesAjax.response.slice(0));
|
|
||||||
|
|
||||||
this.fire('states-updated')
|
|
||||||
|
|
||||||
this._laterFetchStates();
|
|
||||||
},
|
|
||||||
|
|
||||||
eventsLoaded: function() {
|
|
||||||
// Make a copy of the loaded data
|
|
||||||
this.events = this.$.eventsAjax.response;
|
|
||||||
|
|
||||||
this.fire('events-updated')
|
|
||||||
},
|
|
||||||
|
|
||||||
servicesLoaded: function() {
|
|
||||||
// Make a copy of the loaded data
|
|
||||||
this.services = this.$.servicesAjax.response;
|
|
||||||
|
|
||||||
this.fire('services-updated')
|
|
||||||
},
|
|
||||||
|
|
||||||
_pushNewState: function(new_state) {
|
_pushNewState: function(new_state) {
|
||||||
var state;
|
var state;
|
||||||
var stateFound = false;
|
var stateFound = false;
|
||||||
@ -131,32 +121,54 @@
|
|||||||
this.states.push(new_state);
|
this.states.push(new_state);
|
||||||
this._sortStates(this.states);
|
this._sortStates(this.states);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
this.fire('states-updated')
|
||||||
},
|
},
|
||||||
|
|
||||||
fetchState: function(entity_id) {
|
// call api methods
|
||||||
|
fetchState: function(entityId) {
|
||||||
var successStateUpdate = function(new_state) {
|
var successStateUpdate = function(new_state) {
|
||||||
this._pushNewState(new_state);
|
this._pushNewState(new_state);
|
||||||
}
|
}
|
||||||
|
|
||||||
this.call_api("GET", "states/" + entity_id, null, successStateUpdate.bind(this));
|
this.call_api("GET", "states/" + entityId, null, successStateUpdate.bind(this));
|
||||||
},
|
},
|
||||||
|
|
||||||
fetchStates: function() {
|
fetchStates: function(onSuccess, onError) {
|
||||||
this.$.statesAjax.go();
|
var successStatesUpdate = function(newStates) {
|
||||||
},
|
this.states = this._sortStates(newStates);
|
||||||
|
|
||||||
getState: function(entityId) {
|
this.fire('states-updated')
|
||||||
for(var i = 0; i < this.states.length; i++) {
|
|
||||||
if(this.states[i].entity_id == entityId) {
|
this._laterFetchStates();
|
||||||
return this.states[i];
|
|
||||||
|
if(onSuccess) {
|
||||||
|
onSuccess(newStates);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
this.call_api("GET", "states", null, successStatesUpdate.bind(this), onError);
|
||||||
},
|
},
|
||||||
|
|
||||||
getCustomGroups: function() {
|
fetchEvents: function() {
|
||||||
return this.states.filter(function(state) {
|
var successEventsUpdated = function(events) {
|
||||||
return state.entity_id.lastIndexOf("group.") == 0;
|
this.events = events;
|
||||||
})
|
|
||||||
|
this.fire('events-updated')
|
||||||
|
}
|
||||||
|
|
||||||
|
this.call_api("GET", "events", null, successEventsUpdated.bind(this));
|
||||||
|
},
|
||||||
|
|
||||||
|
fetchServices: function() {
|
||||||
|
var successServicesUpdated = function(services) {
|
||||||
|
this.services = services;
|
||||||
|
|
||||||
|
this.fire('services-updated')
|
||||||
|
}
|
||||||
|
|
||||||
|
this.call_api("GET", "services", null,
|
||||||
|
successServicesUpdated.bind(this));
|
||||||
},
|
},
|
||||||
|
|
||||||
turn_on: function(entity_id) {
|
turn_on: function(entity_id) {
|
||||||
@ -186,6 +198,22 @@
|
|||||||
call_service: function(domain, service, parameters) {
|
call_service: function(domain, service, parameters) {
|
||||||
var successToast = function() {
|
var successToast = function() {
|
||||||
this.showToast("Service "+domain+"/"+service+" successful called.");
|
this.showToast("Service "+domain+"/"+service+" successful called.");
|
||||||
|
|
||||||
|
// if we call a service on an entity_id, update the state
|
||||||
|
if(parameters && parameters.entity_id) {
|
||||||
|
var update_func;
|
||||||
|
|
||||||
|
// if entity_id is a string, update 1 state, else all.
|
||||||
|
if(typeof(parameters.entity_id === "string")) {
|
||||||
|
update_func = function() {
|
||||||
|
this.fetchState(parameters.entity_id);
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
update_func = this.fetchStates
|
||||||
|
}
|
||||||
|
|
||||||
|
setTimeout(update_func.bind(this), 1000);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
this.call_api("POST", "services/" + domain + "/" + service,
|
this.call_api("POST", "services/" + domain + "/" + service,
|
||||||
@ -203,34 +231,26 @@
|
|||||||
eventData, successToast.bind(this));
|
eventData, successToast.bind(this));
|
||||||
},
|
},
|
||||||
|
|
||||||
call_api: function(method, path, parameters, callback) {
|
call_api: function(method, path, parameters, onSuccess, onError) {
|
||||||
var req = new XMLHttpRequest();
|
var req = new XMLHttpRequest();
|
||||||
req.open(method, "/api/" + path, true)
|
req.open(method, "/api/" + path, true)
|
||||||
req.setRequestHeader("HA-access", this.auth);
|
req.setRequestHeader("HA-access", this.auth);
|
||||||
|
|
||||||
req.onreadystatechange = function() {
|
req.onreadystatechange = function() {
|
||||||
|
|
||||||
if(req.readyState == 4 && req.status > 199 && req.status < 300) {
|
if(req.readyState == 4) {
|
||||||
|
if(req.status > 199 && req.status < 300) {
|
||||||
if(callback) {
|
if(onSuccess) {
|
||||||
callback(JSON.parse(req.responseText))
|
onSuccess(JSON.parse(req.responseText));
|
||||||
}
|
}
|
||||||
// if we targetted an entity id, update state after 2 seconds
|
} else {
|
||||||
if(parameters && parameters.entity_id) {
|
if(onError) {
|
||||||
var updateCallback;
|
var data = req.responseText ? JSON.parse(req.responseText) : {};
|
||||||
|
onError(data);
|
||||||
// if a string, update just that entity, otherwise update all
|
|
||||||
if(typeof(parameters.entity_id) == "string") {
|
|
||||||
updateCallback = function() {
|
|
||||||
this.fetchState(parameters.entity_id);
|
|
||||||
}
|
|
||||||
|
|
||||||
} else {
|
|
||||||
updateCallback = this.fetchStates();
|
|
||||||
}
|
}
|
||||||
|
|
||||||
setTimeout(updateCallback.bind(this), 2000);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
}
|
}
|
||||||
}.bind(this)
|
}.bind(this)
|
||||||
|
|
||||||
@ -241,6 +261,7 @@
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
|
// show dialogs
|
||||||
showEditStateDialog: function(entityId) {
|
showEditStateDialog: function(entityId) {
|
||||||
var state = this.getState(entityId);
|
var state = this.getState(entityId);
|
||||||
|
|
||||||
|
@ -5,10 +5,9 @@
|
|||||||
<link rel="import" href="bower_components/paper-tabs/paper-tabs.html">
|
<link rel="import" href="bower_components/paper-tabs/paper-tabs.html">
|
||||||
<link rel="import" href="bower_components/paper-tabs/paper-tab.html">
|
<link rel="import" href="bower_components/paper-tabs/paper-tab.html">
|
||||||
|
|
||||||
<link rel="import" href="home-assistant-api.html">
|
|
||||||
<link rel="import" href="states-cards.html">
|
<link rel="import" href="states-cards.html">
|
||||||
|
|
||||||
<polymer-element name="home-assistant-main" attributes="auth">
|
<polymer-element name="home-assistant-main" attributes="api">
|
||||||
<template>
|
<template>
|
||||||
<style type="text/css">
|
<style type="text/css">
|
||||||
|
|
||||||
@ -42,7 +41,6 @@
|
|||||||
|
|
||||||
</style>
|
</style>
|
||||||
|
|
||||||
<home-assistant-api auth="{{auth}}" id="api"></home-assistant-api>
|
|
||||||
|
|
||||||
<core-header-panel unresolved fullbleed>
|
<core-header-panel unresolved fullbleed>
|
||||||
|
|
||||||
@ -82,10 +80,6 @@
|
|||||||
Polymer({
|
Polymer({
|
||||||
selectedTab: null,
|
selectedTab: null,
|
||||||
|
|
||||||
ready: function() {
|
|
||||||
this.api = this.$.api;
|
|
||||||
},
|
|
||||||
|
|
||||||
isCustomGroup: function(state) {
|
isCustomGroup: function(state) {
|
||||||
return (state.entity_id.lastIndexOf('group.') == 0 &&
|
return (state.entity_id.lastIndexOf('group.') == 0 &&
|
||||||
!state.attributes.auto);
|
!state.attributes.auto);
|
||||||
|
@ -1,8 +1,10 @@
|
|||||||
<link rel="import" href="bower_components/font-roboto/roboto.html">
|
<link rel="import" href="bower_components/font-roboto/roboto.html">
|
||||||
<link rel="import" href="home-assistant-main.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="home-assistant-main.html">
|
||||||
|
<link rel="import" href="home-assistant-api.html">
|
||||||
|
|
||||||
<polymer-element name="splash-login" attributes="auth">
|
<polymer-element name="splash-login" attributes="auth">
|
||||||
<template>
|
<template>
|
||||||
<style type="text/css">
|
<style type="text/css">
|
||||||
@ -23,6 +25,8 @@
|
|||||||
|
|
||||||
</style>
|
</style>
|
||||||
|
|
||||||
|
<home-assistant-api auth="{{auth}}" id="api"></home-assistant-api>
|
||||||
|
|
||||||
<template if="{{state == 'no_auth'}}">
|
<template if="{{state == 'no_auth'}}">
|
||||||
<div layout horizontal center fit class='login'>
|
<div layout horizontal center fit class='login'>
|
||||||
<div layout vertical center flex>
|
<div layout vertical center flex>
|
||||||
@ -31,7 +35,10 @@
|
|||||||
|
|
||||||
<div class='interact' layout vertical>
|
<div class='interact' layout vertical>
|
||||||
<div id='loginform'>
|
<div id='loginform'>
|
||||||
<paper-input id="passwordInput" label="Password" type="password" value="{{auth}}"></paper-input>
|
<paper-input
|
||||||
|
id="passwordInput" label="Password" type="password"
|
||||||
|
value="{{auth}}" on-keyup="{{passwordKeyup}}" autofocus>
|
||||||
|
</paper-input>
|
||||||
<paper-button on-click={{validatePassword}}>Log In</paper-button>
|
<paper-button on-click={{validatePassword}}>Log In</paper-button>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
@ -41,18 +48,19 @@
|
|||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<template if="{{state == 'valid_auth'}}">
|
<template if="{{state == 'valid_auth'}}">
|
||||||
<home-assistant-main auth="{{auth}}"></home-assistant-main>
|
<home-assistant-main api="{{api}}"></home-assistant-main>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
</template>
|
</template>
|
||||||
<script>
|
<script>
|
||||||
Polymer({
|
Polymer({
|
||||||
|
|
||||||
// can be no_auth, test_auth, valid_auth
|
// can be no_auth, valid_auth
|
||||||
state: "no_auth",
|
state: "no_auth",
|
||||||
auth: "",
|
auth: "",
|
||||||
|
|
||||||
ready: function() {
|
ready: function() {
|
||||||
|
this.api = this.$.api;
|
||||||
},
|
},
|
||||||
|
|
||||||
domReady: function() {
|
domReady: function() {
|
||||||
@ -61,35 +69,39 @@
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
|
passwordKeyup: function(ev) {
|
||||||
|
if(ev.keyCode == 13) {
|
||||||
|
this.validatePassword();
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
validatePassword: function() {
|
validatePassword: function() {
|
||||||
this.$.passwordInput.commit();
|
this.$.passwordInput.commit();
|
||||||
this.$.loginform.setAttribute('hidden', null)
|
this.$.loginform.setAttribute('hidden', null);
|
||||||
this.$.validateMessage.removeAttribute('hidden')
|
this.$.validateMessage.removeAttribute('hidden');
|
||||||
|
|
||||||
var req = new XMLHttpRequest();
|
var passwordValid = function(result) {
|
||||||
req.open("GET", "/api/", true);
|
this.api.fetchServices();
|
||||||
req.setRequestHeader("HA-access", this.auth);
|
this.api.fetchEvents();
|
||||||
|
|
||||||
req.onreadystatechange = function() {
|
this.state = "valid_auth";
|
||||||
if(req.readyState == 4) {
|
}
|
||||||
if(req.status == 200) {
|
|
||||||
this.state = 'valid_auth'
|
|
||||||
} else {
|
|
||||||
this.auth = "";
|
|
||||||
|
|
||||||
this.$.passwordInput.error = "Invalid Password";
|
var passwordInvalid = function(result) {
|
||||||
this.$.passwordInput.required = 1;
|
if(result && result.message) {
|
||||||
|
this.$.passwordInput.error = result.message;
|
||||||
this.$.loginform.removeAttribute('hidden');
|
} else {
|
||||||
this.$.validateMessage.setAttribute('hidden', null);
|
this.$.passwordInput.error = "Unexpected result from API";
|
||||||
|
|
||||||
this.state = 'no_auth'
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}.bind(this)
|
this.auth = null;
|
||||||
|
this.$.passwordInput.setAttribute('required', true);
|
||||||
|
this.$.loginform.removeAttribute('hidden');
|
||||||
|
this.$.validateMessage.setAttribute('hidden', null);
|
||||||
|
this.$.passwordInput.focus();
|
||||||
|
}
|
||||||
|
|
||||||
req.send();
|
this.api.fetchStates(passwordValid.bind(this), passwordInvalid.bind(this));
|
||||||
},
|
}
|
||||||
|
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
|
@ -26,6 +26,12 @@
|
|||||||
|
|
||||||
state-badge {
|
state-badge {
|
||||||
float: left;
|
float: left;
|
||||||
|
cursor: pointer;
|
||||||
|
transition: background-color .2s;
|
||||||
|
}
|
||||||
|
|
||||||
|
state-badge:hover {
|
||||||
|
background-color: #039be5;
|
||||||
}
|
}
|
||||||
|
|
||||||
.name, .state.text {
|
.name, .state.text {
|
||||||
@ -54,12 +60,14 @@
|
|||||||
|
|
||||||
/* filling of circle when checked */
|
/* filling of circle when checked */
|
||||||
paper-toggle-button::shadow paper-radio-button::shadow #onRadio {
|
paper-toggle-button::shadow paper-radio-button::shadow #onRadio {
|
||||||
background-color: #0091ea;
|
background-color: #039be5;
|
||||||
|
transition: background-color .2s;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* line when checked */
|
/* line when checked */
|
||||||
paper-toggle-button::shadow #toggleBar[checked] {
|
paper-toggle-button::shadow #toggleBar[checked] {
|
||||||
background-color: #0091ea;
|
background-color: #039be5;
|
||||||
|
transition: background-color .2s;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
||||||
@ -87,20 +95,26 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<template if="{{state == 'on' || state == 'off'}}">
|
<template if="{{!state_unknown}}">
|
||||||
<div class='state toggle' self-center flex>
|
<template if="{{state == 'on' || state == 'off'}}">
|
||||||
<paper-toggle-button
|
<div class='state toggle' self-center flex>
|
||||||
id="toggleButton"
|
<paper-toggle-button
|
||||||
on-change="{{toggle}}">
|
id="toggleButton"
|
||||||
</paper-toggle-button>
|
on-change="{{toggle}}">
|
||||||
</div>
|
</paper-toggle-button>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<template if="{{state != 'on' && state != 'off'}}">
|
||||||
|
<div class='state text'>
|
||||||
|
{{state | makeReadable}}
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
</template>
|
</template>
|
||||||
<template if="{{state != 'on' && state != 'off'}}">
|
|
||||||
<div class='state text'>
|
<template if="{{state_unknown}}">
|
||||||
{{state | makeReadable}}
|
<div class="state" self-center flex>Updating..</div>
|
||||||
</div>
|
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
</template>
|
</template>
|
||||||
@ -114,12 +128,15 @@
|
|||||||
cb_turn_on: null,
|
cb_turn_on: null,
|
||||||
cb_turn_off: null,
|
cb_turn_off: null,
|
||||||
cb_edit: null,
|
cb_edit: null,
|
||||||
|
state_unknown: false,
|
||||||
|
|
||||||
// computed
|
// computed
|
||||||
domain: "",
|
domain: "",
|
||||||
entity_id: "",
|
entity_id: "",
|
||||||
|
|
||||||
stateChanged: function() {
|
stateChanged: function(oldVal, newVal) {
|
||||||
|
this.state_unknown = newVal == "";
|
||||||
|
|
||||||
if(this.$.toggleButton) {
|
if(this.$.toggleButton) {
|
||||||
this.$.toggleButton.checked = this.state == 'on';
|
this.$.toggleButton.checked = this.state == 'on';
|
||||||
}
|
}
|
||||||
@ -147,6 +164,11 @@
|
|||||||
} else {
|
} else {
|
||||||
this.turn_off();
|
this.turn_off();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
var delayUnsetSate = function() {
|
||||||
|
this.state = "";
|
||||||
|
}
|
||||||
|
setTimeout(delayUnsetSate.bind(this), 500);
|
||||||
},
|
},
|
||||||
|
|
||||||
turn_on: function() {
|
turn_on: function() {
|
||||||
|
@ -65,9 +65,11 @@
|
|||||||
},
|
},
|
||||||
|
|
||||||
domReady: function() {
|
domReady: function() {
|
||||||
this.states = this.api.states
|
this.raw_states = this.api.states
|
||||||
|
|
||||||
this.api.addEventListener('states-updated', this.statesUpdated.bind(this))
|
this.api.addEventListener('states-updated', this.statesUpdated.bind(this))
|
||||||
|
|
||||||
|
this.refilterStates();
|
||||||
},
|
},
|
||||||
|
|
||||||
statesUpdated: function() {
|
statesUpdated: function() {
|
||||||
|
Loading…
x
Reference in New Issue
Block a user