Frontend: logbook - allow changing displayed day

This commit is contained in:
Paulus Schoutsen 2015-06-15 00:24:40 -07:00
parent 8a14f46595
commit 3381fff6bd
9 changed files with 2155 additions and 674 deletions

View File

@ -1,2 +1,2 @@
""" DO NOT MODIFY. Auto-generated by build_frontend script """ """ DO NOT MODIFY. Auto-generated by build_frontend script """
VERSION = "db1ec3e116565340804da0e590058d60" VERSION = "9472014df7b663c70bf33bb456bd8245"

File diff suppressed because one or more lines are too long

View File

@ -31,12 +31,13 @@
"paper-slider": "PolymerElements/paper-slider#^1.0.0", "paper-slider": "PolymerElements/paper-slider#^1.0.0",
"paper-checkbox": "PolymerElements/paper-checkbox#^1.0.0", "paper-checkbox": "PolymerElements/paper-checkbox#^1.0.0",
"paper-drawer-panel": "PolymerElements/paper-drawer-panel#^1.0.0", "paper-drawer-panel": "PolymerElements/paper-drawer-panel#^1.0.0",
"paper-scroll-header-panel": "polymerelements/paper-scroll-header-panel#~1.0", "paper-scroll-header-panel": "polymerelements/paper-scroll-header-panel#^1.0.0",
"google-apis": "GoogleWebComponents/google-apis#0.8-preview", "google-apis": "GoogleWebComponents/google-apis#0.8-preview",
"moment": "^2.10.3", "moment": "^2.10.3",
"layout": "Polymer/layout", "layout": "Polymer/layout",
"color-picker-element": "~0.0.3", "color-picker-element": "~0.0.3",
"paper-styles": "polymerelements/paper-styles#~1.0" "paper-styles": "polymerelements/paper-styles#^1.0.0",
"paper-date-picker": "vsimonian/paper-date-picker#master"
}, },
"resolutions": { "resolutions": {
"polymer": "^1.0.0", "polymer": "^1.0.0",

View File

@ -10,8 +10,13 @@
} }
</style> </style>
<template> <template>
<template is='dom-repeat' items="[[entries]]"> <template is='dom-if' if='[[!entries]]'>
<logbook-entry entry-obj="[[item]]"></logbook-entry> No logbook entries found.
</template>
<template is='dom-if' if='[[entries]]'>
<template is='dom-repeat' items="[[entries]]">
<logbook-entry entry-obj="[[item]]"></logbook-entry>
</template>
</template> </template>
</template> </template>
</dom-module> </dom-module>

@ -1 +1 @@
Subproject commit 015edf9c28a63122aa8f6bc153f0c0ddfaad1caa Subproject commit cec99925399b1c8e8cea15bbbba5d873522ccbd6

View File

@ -1,17 +1,18 @@
<link rel="import" href="../bower_components/polymer/polymer.html"> <link rel="import" href="../bower_components/polymer/polymer.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-input/paper-input.html">
<link rel="import" href="./partial-base.html"> <link rel="import" href="./partial-base.html">
<link rel="import" href="../components/ha-logbook.html"> <link rel="import" href="../components/ha-logbook.html">
<link rel="import" href="../components/loading-box.html">
<dom-module id="partial-logbook"> <dom-module id="partial-logbook">
<style> <style>
.content { .selected-date-container {
background-color: white; padding: 0 16px;
padding: 8px; }
}
</style> </style>
<template> <template>
<partial-base narrow="[[narrow]]"> <partial-base narrow="[[narrow]]">
@ -20,7 +21,15 @@
<paper-icon-button icon="refresh" header-buttons <paper-icon-button icon="refresh" header-buttons
on-click="handleRefresh"></paper-icon-button> on-click="handleRefresh"></paper-icon-button>
<ha-logbook entries="[[entries]]"></ha-logbook> <div>
<div class='selected-date-container'>
<paper-input label='Showing entries for' on-click='handleShowDatePicker'
value='[[computeDateCaption(selectedDate)]]'></paper-input>
<loading-box hidden$='[[!isLoading]]'>Loading logbook entries</loading-box>
</div>
<ha-logbook entries="[[entries]]" hidden$='[[isLoading]]'></ha-logbook>
</div>
</partial-base> </partial-base>
</template> </template>
</dom-module> </dom-module>
@ -29,6 +38,12 @@
(function() { (function() {
var storeListenerMixIn = window.hass.storeListenerMixIn; var storeListenerMixIn = window.hass.storeListenerMixIn;
var logbookActions = window.hass.logbookActions; var logbookActions = window.hass.logbookActions;
var logbookStore = window.hass.logbookStore;
var uiActions = window.hass.uiActions;
function date_to_str(date) {
return date.getFullYear() + '-' + (date.getMonth()+1) + '-' + date.getDate();
}
Polymer({ Polymer({
is: 'partial-logbook', is: 'partial-logbook',
@ -41,22 +56,50 @@
value: false, value: false,
}, },
selectedDate: {
type: String,
value: null,
observer: 'fetchIfNeeded',
},
isLoading: {
type: Boolean,
value: true,
},
entries: { entries: {
type: Array, type: Array,
value: [], value: null,
}, },
}, },
logbookStoreChanged: function(logbookStore) { logbookStoreChanged: function() {
if (logbookStore.isStale()) { this.isLoading = this.fetchIfNeeded();
logbookActions.fetch(); var entries = logbookStore.all.toArray();
} this.entries = entries.length > 0 ? entries : false;
},
this.entries = logbookStore.all.toArray(); computeDateCaption: function(selectedDate) {
return selectedDate || 'today';
},
fetchIfNeeded: function() {
if (logbookStore.shouldFetch(this.selectedDate)) {
this.isLoading = true;
logbookActions.fetch(this.selectedDate);
return true;
}
return false;
},
handleShowDatePicker: function() {
uiActions.showDatePicker(function(selectedDate) {
this.selectedDate = date_to_str(selectedDate);
}.bind(this), this.selectedDate);
}, },
handleRefresh: function() { handleRefresh: function() {
logbookActions.fetch(); logbookActions.fetch(this.selectedDate);
}, },
}); });
})(); })();

View File

@ -1,10 +1,14 @@
<link rel="import" href="../bower_components/polymer/polymer.html"> <link rel="import" href="../bower_components/polymer/polymer.html">
<link rel="import" href="../bower_components/paper-date-picker/paper-date-picker-dialog.html">
<link rel="import" href="../dialogs/more-info-dialog.html"> <link rel="import" href="../dialogs/more-info-dialog.html">
<dom-module id="modal-manager"> <dom-module id="modal-manager">
<template> <template>
<more-info-dialog id="moreInfoDialog"></more-info-dialog> <more-info-dialog id="moreInfoDialog"></more-info-dialog>
<paper-date-picker-dialog id="datePicker"
on-value-changed='datePickerValueChanged'></paper-date-picker-dialog>
</template> </template>
</dom-module> </dom-module>
@ -16,15 +20,32 @@
Polymer({ Polymer({
is: 'modal-manager', is: 'modal-manager',
properties: {
datePickerCallback: {
type: Function,
value: null,
},
},
ready: function() { ready: function() {
dispatcher.register(function(payload) { dispatcher.register(function(payload) {
switch (payload.actionType) { switch (payload.actionType) {
case uiConstants.ACTION_SHOW_DIALOG_MORE_INFO: case uiConstants.ACTION_SHOW_DIALOG_MORE_INFO:
this.$.moreInfoDialog.show(payload.entityId); this.$.moreInfoDialog.show(payload.entityId);
break; break;
case uiConstants.ACTION_SHOW_DATE_PICKER:
this.datePickerCallback = payload.dateSelectedCallback;
this.$.date = payload.date;
this.$.datePicker.toggle();
break;
} }
}.bind(this)); }.bind(this));
}, },
datePickerValueChanged: function(ev) {
this.datePickerCallback(ev.target.value);
},
}); });
})(); })();
</script> </script>

View File

@ -36,6 +36,7 @@
window.hass.uiConstants = { window.hass.uiConstants = {
ACTION_SHOW_DIALOG_MORE_INFO: 'ACTION_SHOW_DIALOG_MORE_INFO', ACTION_SHOW_DIALOG_MORE_INFO: 'ACTION_SHOW_DIALOG_MORE_INFO',
ACTION_SHOW_DATE_PICKER: 'ACTION_SHOW_DATE_PICKER',
STATE_FILTERS: { STATE_FILTERS: {
'group': 'Groups', 'group': 'Groups',
@ -52,6 +53,16 @@
}); });
}, },
showDatePicker: function(dateSelectedCallback, startDate) {
startDate = startDate || null;
dispatcher.dispatch({
actionType: window.hass.uiConstants.ACTION_SHOW_DATE_PICKER,
dateSelectedCallback: dateSelectedCallback,
startDate: startDate,
});
},
validateAuth: function(authToken, rememberLogin) { validateAuth: function(authToken, rememberLogin) {
authActions.validate(authToken, { authActions.validate(authToken, {
useStreaming: preferenceStore.useStreaming, useStreaming: preferenceStore.useStreaming,

View File

@ -19,7 +19,7 @@ import homeassistant.components.sun as sun
DOMAIN = "logbook" DOMAIN = "logbook"
DEPENDENCIES = ['recorder', 'http'] DEPENDENCIES = ['recorder', 'http']
URL_LOGBOOK = re.compile(r'/api/logbook(?:/(?P<date>\d{4}-\d{2}-\d{2})|)') URL_LOGBOOK = re.compile(r'/api/logbook(?:/(?P<date>\d{4}-\d{1,2}-\d{1,2})|)')
QUERY_EVENTS_BETWEEN = """ QUERY_EVENTS_BETWEEN = """
SELECT * FROM events WHERE time_fired > ? AND time_fired < ? SELECT * FROM events WHERE time_fired > ? AND time_fired < ?