Frontend: handle modals in separate component

pull/36/head
Paulus Schoutsen 2015-02-15 21:53:40 -08:00
parent b6a3524e9b
commit d81723c8fc
8 changed files with 135 additions and 133 deletions

View File

@ -1,2 +1,2 @@
""" DO NOT MODIFY. Auto-generated by build_frontend script """
VERSION = "58bc00ea51f4f274240d9db1a0fec705"
VERSION = "14fb39cdbc1c103611d2c3d81558737d"

File diff suppressed because one or more lines are too long

View File

@ -0,0 +1,25 @@
<link rel="import" href="../bower_components/polymer/polymer.html">
<link rel="import" href="../dialogs/more-info-dialog.html">
<polymer-element name="ha-modals">
<template>
<more-info-dialog id="moreInfoDialog"></more-info-dialog>
</template>
<script>
var uiActions = window.hass.uiActions,
dispatcher = window.hass.dispatcher;
Polymer({
ready: function() {
dispatcher.register(function(payload) {
switch (payload.actionType) {
case uiActions.ACTION_SHOW_DIALOG_MORE_INFO:
this.$.moreInfoDialog.show(payload.entityId);
break;
}
}.bind(this));
},
});
</script>
</polymer-element>

View File

@ -4,7 +4,7 @@
<polymer-element name="relative-ha-datetime" attributes="datetime">
<template>
<span>{{ relativeTime }}</span>
{{ relativeTime }}
</template>
<script>
var UPDATE_INTERVAL = 60000; // 60 seconds

View File

@ -1,95 +0,0 @@
<link rel="import" href="./bower_components/polymer/polymer.html">
<script src="./home-assistant-js/dist/homeassistant.min.js"></script>
<link rel="import" href="./dialogs/more-info-dialog.html">
<script>
var DOMAINS_WITH_CARD = ['thermostat', 'configurator'];
var DOMAINS_WITH_MORE_INFO = ['light', 'group', 'sun', 'configurator'];
// Register some polymer filters
PolymerExpressions.prototype.HATimeToDate = function(timeString) {
if (!timeString) return;
return window.hass.util.parseDateTime(timeString);
};
PolymerExpressions.prototype.HATimeStripDate = function(timeString) {
return (timeString || "").split(' ')[0];
};
// Add some frontend specific helpers to the models
Object.defineProperties(window.hass.stateModel.prototype, {
// how to render the card for this state
cardType: {
get: function() {
if(DOMAINS_WITH_CARD.indexOf(this.domain) !== -1) {
return this.domain;
} else if(this.canToggle) {
return "toggle";
} else {
return "display";
}
}
},
// how to render the more info of this state
moreInfoType: {
get: function() {
if(DOMAINS_WITH_MORE_INFO.indexOf(this.domain) !== -1) {
return this.domain;
} else {
return 'default';
}
}
},
});
var state,
constants = window.hass.constants,
dispatcher = window.hass.dispatcher,
preferenceStore = window.hass.preferenceStore;
var uiActions = window.hass.uiActions = {
ACTION_SHOW_TOAST: constants.ACTION_SHOW_TOAST,
ACTION_SHOW_DIALOG_MORE_INFO: 'ACTION_SHOW_DIALOG_MORE_INFO',
showMoreInfoDialog: function(entityId) {
dispatcher.dispatch({
actionType: this.ACTION_SHOW_DIALOG_MORE_INFO,
entityId: entityId,
});
},
validateAuth: function(authToken) {
window.hass.authActions.validate(authToken, preferenceStore.useStreaming());
},
};
</script>
<polymer-element name="home-assistant-api" attributes="auth">
<template>
<more-info-dialog id="moreInfoDialog"></more-info-dialog>
</template>
<script>
Polymer({
ready: function() {
dispatcher.register(function(payload) {
switch (payload.actionType) {
case uiActions.ACTION_SHOW_DIALOG_MORE_INFO:
this.$.moreInfoDialog.show(payload.entityId);
break;
}
}.bind(this));
// if auth was given, tell the backend
if(this.auth) {
window.hass.uiActions.validateAuth(this.auth);
}
},
});
</script>
</polymer-element>

View File

@ -2,8 +2,8 @@
<link rel="import" href="bower_components/font-roboto/roboto.html">
<link rel="import" href="resources/home-assistant-style.html">
<link rel="import" href="resources/home-assistant-js.html">
<link rel="import" href="home-assistant-api.html">
<link rel="import" href="layouts/login-form.html">
<link rel="import" href="layouts/home-assistant-main.html">
@ -40,6 +40,11 @@
document.getElementById('init').remove();
this.listenToStores(true);
// if auth was given, tell the backend
if(this.auth) {
window.hass.uiActions.validateAuth(this.auth);
}
},
detached: function() {

View File

@ -15,6 +15,7 @@
<link rel="import" href="../layouts/partial-dev-set-state.html">
<link rel="import" href="../components/ha-notifications.html">
<link rel="import" href="../components/ha-modals.html">
<link rel="import" href="../components/stream-status.html">
<polymer-element name="home-assistant-main">
@ -66,6 +67,7 @@
</style>
<ha-notifications></ha-notifications>
<ha-modals></ha-modals>
<core-drawer-panel id="drawer" on-core-responsive-change="{{responsiveChanged}}">
<core-header-panel mode="scroll" drawer>

View File

@ -0,0 +1,67 @@
<script src="../home-assistant-js/dist/homeassistant.min.js"></script>
<script>
(function() {
var DOMAINS_WITH_CARD = ['thermostat', 'configurator'];
var DOMAINS_WITH_MORE_INFO = ['light', 'group', 'sun', 'configurator'];
// Register some polymer filters
PolymerExpressions.prototype.HATimeToDate = function(timeString) {
if (!timeString) return;
return window.hass.util.parseDateTime(timeString);
};
PolymerExpressions.prototype.HATimeStripDate = function(timeString) {
return (timeString || "").split(' ')[0];
};
// Add some frontend specific helpers to the models
Object.defineProperties(window.hass.stateModel.prototype, {
// how to render the card for this state
cardType: {
get: function() {
if(DOMAINS_WITH_CARD.indexOf(this.domain) !== -1) {
return this.domain;
} else if(this.canToggle) {
return "toggle";
} else {
return "display";
}
}
},
// how to render the more info of this state
moreInfoType: {
get: function() {
if(DOMAINS_WITH_MORE_INFO.indexOf(this.domain) !== -1) {
return this.domain;
} else {
return 'default';
}
}
},
});
var dispatcher = window.hass.dispatcher,
constants = window.hass.constants,
preferenceStore = window.hass.preferenceStore,
authActions = window.hass.authActions;
window.hass.uiActions = {
ACTION_SHOW_DIALOG_MORE_INFO: 'ACTION_SHOW_DIALOG_MORE_INFO',
showMoreInfoDialog: function(entityId) {
dispatcher.dispatch({
actionType: this.ACTION_SHOW_DIALOG_MORE_INFO,
entityId: entityId,
});
},
validateAuth: function(authToken) {
authActions.validate(authToken, preferenceStore.useStreaming());
},
};
})();
</script>