Hass-Custom-Alarm
Hass-Custom-Alarm copied to clipboard
Published
20 hours ago •
akasma74
akasma74
Panel in Spanish
First of all, thank you for this incredible work. I translated the panel.html into Spanish in case it can integrate languages, I pass the file to you, thank you very much panel.zip
Thanks for doing that. Unfortunately, I currently don't have time to look into translation side of this project and it will be changed significantly in the future. When I come round to it, I'll try using your work and maybe will ask you to help with some translation. Adios!
no problem, whenever you make changes I translate it, the day you can count on me
El lun., 23 mar. 2020 10:29, akasma74 [email protected] escribió:
Thanks for doing that. Unfortunately, I currently don't have time to look into translation side of this project and it will be changed significantly in the future. When I come round to it, I'll try using your work and maybe will ask you to help with some translation. Adios!
— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub https://github.com/akasma74/Hass-Custom-Alarm/issues/85#issuecomment-602480352, or unsubscribe https://github.com/notifications/unsubscribe-auth/AHQGKFWT6SUMOZM6DGEXLXLRI4TXHANCNFSM4LPPB7OA .
no problem, whenever you make changes I translate it, the day you can count on me El lun., 23 mar. 2020 10:29, akasma74 [email protected] escribió: … Thanks for doing that. Unfortunately, I currently don't have time to look into translation side of this project and it will be changed significantly in the future. When I come round to it, I'll try using your work and maybe will ask you to help with some translation. Adios! — You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub <#85 (comment)>, or unsubscribe https://github.com/notifications/unsubscribe-auth/AHQGKFWT6SUMOZM6DGEXLXLRI4TXHANCNFSM4LPPB7OA .
Hola. He remplazado el ultimo panel.html por el traducido al español y no cargan los botones de abajo del panel.
Aquí tienes el último, hubo actualización Enviado desde Correo para Windows 10 De: alb147Enviado: domingo, 14 de junio de 2020 17:22Para: akasma74/Hass-Custom-AlarmCC: javiges; AuthorAsunto: Re: [akasma74/Hass-Custom-Alarm] Panel in Spanish (#85) no problem, whenever you make changes I translate it, the day you can count on me El lun., 23 mar. 2020 10:29, akasma74 [email protected] escribió:…Thanks for doing that. Unfortunately, I currently don't have time to look into translation side of this project and it will be changed significantly in the future. When I come round to it, I'll try using your work and maybe will ask you to help with some translation. Adios! — You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub , or unsubscribe https://github.com/notifications/unsubscribe-auth/AHQGKFWT6SUMOZM6DGEXLXLRI4TXHANCNFSM4LPPB7OA .Hola.He remplazado el ultimo panel.html por el traducido al español y no cargan los botones de abajo del panel.—You are receiving this because you authored the thread.Reply to this email directly, view it on GitHub, or unsubscribe.
{ // show the version of your custom UI in the HA dev info panel (HA 0.66.0+): const _NAME = 'Alarm Panel'; const _URL = 'https://github.com/akasma74/Hass-Custom-Alarm'; // don't forget to change HaPanelAlarm.version below! var _VERSION = 'v1.12.6';
if (!window.CUSTOM_UI_LIST) window.CUSTOM_UI_LIST = [];
window.CUSTOM_UI_LIST.push({
name: _NAME,
url: _URL,
version: _VERSION
});
if (!customElements.get("ha-switch") && customElements.get("paper-toggle-button")) {
customElements.define("ha-switch", class extends customElements.get("paper-toggle-button") {})
}
if (!customElements.get("ha-icon-button") && customElements.get("paper-icon-button")) {
customElements.define("ha-icon-button", class extends customElements.get("paper-icon-button") {})
}
if (!customElements.get("ha-icon") && customElements.get("iron-icon")) {
customElements.define("ha-icon", class extends customElements.get("iron-icon") {})
}
}
@font-face {
font-family: 'Lobster';
font-style: normal;
font-weight: 400;
src: local('Lobster Regular'), local('Lobster-Regular'), url(/bwalarm/alarm/lobster.woff2) format('woff2');
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2212, U+2215;
}
@import url('./bwalarm/alarm/alarm.css');
[[time]]
[[_alarmStatus(alarm_state, panel_title)]]
PANEL BLOQUEADO
[[temp]] °C
[[temp]] °F
[[weather.state]]
1
2
3
Borrar
4
5
6
0
7
8
9
desarmar
,,
Borrar
0
desarmar
Sensores activos encontrados
override
cancelar
Error
Por favor introduce código para armar.
ok
Verano
Casa
Fuera
Plano de casa
Sensores Activos
Sensores retrasados
Sensores Inmediatos
Sensores Inactivos
Todos los sensores
Cámaras
Cámaras actualizadas cada [[alarm.attributes.panel.camera_update_interval]] segundos
[[computeFriendlyName(camera)]]
Actividad
[[computeLog(entry,'name')]]
[[computeLog(entry,'message')]]
[[computeLog(entry,'time')]]
Ajustes
Información
Diseño
Alarma
Sensores
Plano de casa
Cámaras
MQTT
Personalización
Salir
Info
Diseño
Alarma
Sensores
Plano de Casa
Cámaras
MQTT
Personalización
Ajustes
Ayuda a apoyar este trabajo
Gracias a la comunidad por todos los aportes. Considera apoyar este proyecto y dona. Todos los ingresos se destinarán a nuevas actividades, hardware y correción de errores! Hay un esfuerzo de la comunidad para mejorar la alarma y el panel. Necesitamos toda la ayuda que podamos recibir!
Paypal:
Donar
Bitcoin (BTC):
1MkVDAknwXcV3FeoQpDCCPSSzmpAxpgQ6g
Bitcoin Cash (BCH):
qr3ehu6vdqje76m6w4ppn6sh0j9gwnfxfqymzalkrc
Litecoin (LTC):
ltc1qvdd488jpus0gkncm8qemhjlettz6ye9253aex0
Contribuye
Has encontrado un fallo o tienes una idea? Cuéntanoslo en Github
TCuéntale a tus amigos y compañeros lo increíble que es este panel inteligente de alarma
Tu versión:
Este Panel: [[version]]
Home Assistant: v[[hass.config.version]]
Python: v([[alarm.attributes.py_version]])
Cuestiones:
• [[entity]]
Reiniciar Home Assistant
Relacionado con la interfaz del panel:
Password de administrador:
Resetea el password usado para acceder al panel de configuración.
Nombre del panel de la alarma:
Texto que se muestra en el encabezado.Por defecto: Panel Alarma
Habilita el widget de reloj en este panel. Un sensor de tiempo llamado: 'sensor.time' debe existir en un configuración de Home Assistant
Reloj en modo 12H?:
Cambia el modo de reloj a 12 horas cuando se habilita.Por defecto: Desactivado (i.e modo 24 horas)
Tiempo:
Habilita el widget del tiempo en este panel. Debes tener un sensor de clima llamado: 'sensor.weather_summary' o 'sensor.dark_sky_summary' en la configuración de tu Home Assistant
Tª en Fahrenheit:
Habilita esto para mostrar la temperatura en Fahrenheit
Ocultar código:
Oculta el código de desactivación cuando lo tecleas en el panel
Ocultar barra lateral de HA cuando la alarma está armada:
Cuando la alarma está armada, la barra lateral de Home Assistant se deshabilitará por defecto. Esto previene que un intruso pueda desactivar la alarma desde el menú de configuración. Para que esto sea realmente efectivo, usa un explorador que bloquee el acceso a la función URL. Aviso: si la versión de tu HA es 96.3 o posterior, ve a los ajustes de tu perfil en HA y selecciona “Oculta siempres la barra lateral” para que esta opción funcione correctamente.
Ocultar Sensores cuando esten armados:
Cuando se activa la alarma, el panel de sensores estará oculto.
Botones Redondeados:
Selecciona si los botones de alarma deben ser redondos o no.
Efecto sombra en el texto:
Enables the shadow text effect in this panel.Por defecto: Desactivado
Fuente Serif:
Habilita la fuente 'lobster' en el título, el tiempo y el clima en este panel..Por defecto: Desactivado
Temas
Te permite modificar los colores por defecto de Home Assistant.
[[item.name]]
Activated?
New
Actualizar Tema
Tema:
Nombre del tema.
[[color.header]]:
Clear?
[[color.description]]
Alarma
Persistencia de la alarma:
Cuando se habilita, la persistencia del estado de la alarma es guardado a pesar de un reinicio de Home Assistant o el servidor. Esto es útil en caso de fallos en la electricidad.Por defecto: Desactivado
Código maestro:
Fija o resetea el código maestro para armar o desarmar tu alarma
Código del pánico:
Fija o resetea el código del pánico para armar o desarmar tu alarma. Este es un código especial que desarma la alarma y activa un modo de pánico en HA. Puede ser usado junto a otras automatizaciones por ejemplo para avisar a emergencias o un familiar. Para el intruso aparece como desactivada en modo normal.
Requerir un código para armar la alarma:
Si se habilita será necesario un código para armar la alarma. Si se usa 'anular' como código de acceso, configure la alarma inmediatamente (ignora el tiempo pendiente apropiado) independientemente de esta configuración
Ignorar sensores abiertos durante el armado de la alarma:
Cuando esta deshabilitado, configure la alarma solo si no se detectan sensores activos (seguro), de lo contrario, siempre configure. Por defecto: Desactivado
Intentos permitidos:
Número de intentos permitidos antes de que el panel se bloquee.Por defecto: -1 (sin limites)
Tiempo de bloqueo del panel:
Tiempo, en segundos, para poder volver a intentar desbloquear el panel.Por defecto: 15 minutos
Habilitar Log:
Cuando se habilita, la alarma guarda un historial. Se debe dar permisos a HA para guardar el archivo alarm_log.json en el directorio de configuración.Por defecto: Desactivado
Tamaño del log:
Tamacute;mero de grabaciones que pueden ser guardadas y mostradas.Por defecto: 10 grabaciones
Códigos específicos de usuario
Estos ajustes proporcionan la capacidad deconfigurar cuentas específicas capaces de controlar la alarma. Si el historial está activo, los usuarios será añadidos como parte del historial. Los usuarios de Home Assistant usados en el sistema de de atutenticación introducido en v0.70 serán automáticamente importados.
Enable
[[user.name]]
Borrar
Añadir Nuevo Usuario
Actualización de usuario
Nombre:
Pon el nombre de tu usuario.
Activar Usuario:
¿Habilitar este usuario para controlar la alarma?
Código:
Pon un nuevo código para el usuario.
Distintivo:
Indica la localizacion y nombre de tu imagen. Puedes usar imágenes estándar de [[alarm.attributes.default_images_path]] o los tuyos de [[alarm.attributes.override_images_path]]
Guardar Usuario
Cancelar
Sensores
Habilita el panel de sensores:
Habilitando esto podrás ver tus sensores en un panel
Modo Fuera
Tiempo de salida:
Tiempo de cortesía que se concede antes de que se arme la alarma. Ningún sensor disparará la alarma durante ese tiempo. Conocido como 'Tiempo de Salida'.Por defecto: 25 segundos
Tiempo de aviso:
Tiempo de cortesía que se concede antes de que se dispare la alarma. Ningún sensor disparará la alarma durante ese tiempo. Conocido como 'Teimpo de Entrada'.Por defecto: 25 segundos
Tiempo de disparo:
Tiempo que la alarma permanece disparada antes de que vuelva a su estado previo.Por defecto: 300 segundos
Immediatos
[[computeFriendlyName(sensor)]]
Retrasados
[[computeFriendlyName(sensor)]]
Anulados
[[computeFriendlyName(sensor)]]
Modo en Casa
Tiempo de salida:
Tiempo de cortesía que se concede antes de que se arme la alarma. Ningún sensor disparará la alarma durante ese tiempo. Conocido como 'Tiempo de Salida'.Por defecto: 25 segundos
Tiempo de aviso:
Tiempo de cortesía que se concede antes de que se dispare la alarma. Ningún sensor disparará la alarma durante ese tiempo. Conocido como 'Tiempo de Entrada'.Por defecto: 25 segundos
Tiempo disparada:
Tiempo que la alarma permanece disparada antes de que vuelva a su estado previo.Por defecto: 300 segundos
Immediatos
[[computeFriendlyName(sensor)]]
Retrasados
[[computeFriendlyName(sensor)]]
Anulados
[[computeFriendlyName(sensor)]]
Modo Verano
Habilita modo verano:
Habilita modo verano.Por defecto: Desactivado
Tiempo de salida:
GTiempo de cortesía que se concede antes de que se arme la alarma. Ningún sensor disparará la alarma durante ese tiempo. Conocido como 'Tiempo de Salida'.Por Defecto: 25 segundos
Tiempo de aviso:
Tiempo de cortesía que se concede antes de que se dispare la alarma. Ningún sensor disparará la alarma durante ese tiempo. Conocido como 'Tiempo de Entrada''.Por defecto: 25 segundos
Tiempo de disparo:
Tiempo que la alarma permanece disparada antes de que vuelva a su estado previo.Por Defecto: 300 segundos
Immediatos
[[computeFriendlyName(sensor)]]
Retrasados
[[computeFriendlyName(sensor)]]
Anulados
[[computeFriendlyName(sensor)]]
Plano de casa
Habilita el panel del plano de casa:
Habilitando esto te permitirá configurar tu plano de casa personalizado para que se muestre como panel
Entidad plano:
Elije el binary_sensor relacionado con la configuración del plano de casa
[[computeFriendlyName(bs)]]
Cámaras
Habilita panel de cámaras:
Habilitando esto, te permite añadir cámaras de las listadas a continuación para ser mostradas como panel
Intervalo de actualización:
Tiempo en segundos para que la imagen de la cámara se actualice.Por Defecto: 5 segundos
[[computeFriendlyName(camera)]]
MQTT
Habilita MQTT:
Reinicio necesario) Habilitando MQTT podrás enviar y recibir mensajes MQTT para interactuar con tu alarma.Por defecto: Desactivado
QOS:
Calidad de servicio.El máximo nivel de QOS para suscribir y publicar mensajes MQTT.Por defecto: 0
State Topic:
El MQTT topic para publicar actualizaciones y cambios de estado en HA.Por defecto: home/alarm
Command Topic:
El MQTT topic al que HA se suscribirá, para recibir comandos de dispositivos remotos para cambiar el estado de la alarma.Por defecto: home/alarm/set
Comando para configurar el modo armado verano en este panel de alarma.Por defecto: ARM_NIGHT
Comando Armado Modo Casa:
Comando para configurar el modo casa.Por defecto: ARM_HOME
Comando Armar Modo Fuera:
Comando parar configurar Modo Fuera.Por defecto: ARM_AWAY
Comando Desarmar:
Comando para desarmar el Panel de Alarma.Por defecto: DISARM
Desarmar sin código:
Si se activa permite a comandos MQTT desarmar la alarma sin un código válido.Por defecto: Desactivado
Pendiente en Aviso:
Emite estado Pending cuando se dispara la alarma a pesar de que el estado por defecto es Warning. Esto es para permitir la integración con otros paneles MQTT que usan este estado.Por defecto: Desactivado
Personalización
Habilitar panel personalizado:
Habilitando esto, podrás añadir tu propio panel a esta interfaz. Para que funcione, mira la plantilla del archivo custom-element.html. Necesitarás modificar esto con tu propio código HTML. Usando esto podrás incorporar actividades personalizadas adicionales como información extra de Home Assistant o una página de terceros. Podrías conectar cámaras externas o tener un ticker de acciones y compartido.
Este componente no funciona
[[item.message]]
[[formatTime(item.timestamp)]] [[item.source]] ([[item.level]])
([[item.source]])
Mira el log de Home Assistant para ver detalles.
Este Panel: [[version]]
Home Assistant: v[[hass.config.version]]
{
class HaPanelAlarm extends Polymer.Element {
static get is(){ return 'ha-panel-alarm'; }
static get properties(){
return {
hass: { type: Object },
alarm: { type: Object, observer: 'monitorAlarm' },
platform: { type: String, value: 'bwalarm' },
resources_prefix: { type: String },
image_path: { type: String },
default_icon_name: { type: String },
default_icon_path: { type: String },
panel: { type: Object },
narrow: { type: Boolean, value: false },
showMenu: { type: Boolean, value: false },
settingsUnlock: { type: Boolean, value: false },
alarm_state: { type: String, value: 'Disarmed'},
panel_title: { type: String, value: ''},
carouselMainSelected: { type: Object },
carouselSettings: { type: Object },
controls: { type: Object },
controlsLoaded: { type: Boolean, value: false },
attemptArmMode: { type: String, value: ''},
// Sensor Groups
immediate: { type: Array, computed: 'computeSensors(hass, alarm.attributes.immediate)' },
delayed: { type: Array, computed: 'computeSensors(hass, alarm.attributes.delayed)' },
allsensors: { type: Array, computed: 'computeSensors(hass, alarm.attributes.allsensors)'},
ignored: { type: Array, computed: 'computeSensors(hass, alarm.attributes.ignored)' },
opencount: { type: Number, value: 0 },
time: { type: Object },
weather: { type: Object },
temp: { type: String },
code: { type: String, value: '' },
display_code: { type: String, value: '' },
timeoutID: { type: Number },
sidebarTimerId: { type: Number },
cleanup: { type: Array, value: [] },
attemptedArm: { type: Boolean, value: false },
attemptedArmWithoutCode: { type: Boolean, value: false },
settings: { type: Boolean, value: false },
panel_locked: { type: Boolean, value: false },
cameraFeedSrc: { type: String },
camera_time: { type: String },
cameras: { type: Array, value: [] },
sensors: { type: Array, value: [] },
// internal ones, here to have them created only once instead of on every function call
binary_sensors: { type: Array, value: [] },
switches: { type: Array, value: [] },
errors: { type: Array },
version: { type: String, value: 'v1.12.4'},
camera_update_interval: { type: Number, value: 5000 }, // ms
settingColors: { type: Array, value: [] },
selectedUser: { type: Object, value: null},
viewport_width: Number,
viewport_height: Number,
// viewport orientation
orientationLandscape: { type: Boolean },
buttonsShape: { type: String }, // valid options are: circle, square or rectangle
buttonWidthToHeightRatio: { type: Number, computed: '_computeButtonWidthToHeightRatio(buttonsShape)'},
// internal constants
INT_ATTR_STATE_CHECK_BEFORE_ARM: { type: String, value: 'check_before_arm'},
__mwc_button_wrapper_class: { type: String, value: "mdc-touch-target-wrapper"},
__mwc_button__base_style: { type: String, value: "mdc-button mdc-button__ripple mdc-button--touch"},
__mwc_button__outlined: { type: String, value: " mdc-button--outlined"},
__mwc_button__raised: { type: String, value: " mdc-button--raised"},
}
}
_computeButtonWidthToHeightRatio(buttonsShape) {
if (buttonsShape != undefined) {
switch(buttonsShape) {
case 'circle':
case 'square':
return 1;
case 'rectangle':
return 2;
default:
console.error('_computeButtonWidthToHeightRatio: invalid parameter ' + buttonsShape);
}
}
else {
console.error('_computeButtonWidthToHeightRatio: buttonsShape undefined, returning 0');
return 0;
}
}
// Polymer observers definition
static get observers() {
return [
'onPanelUpdate(hass, panel)',
'updateTime(hass)',
'_round_buttons(alarm.attributes.panel.round_buttons)',
'_code_to_arm(alarm.attributes.code_arm_required)',
'_viewport_changed(viewport_height, viewport_width)'
]
}
_viewport_changed(viewport_height, viewport_width) {
this._updateButtonsStyles();
}
_code_to_arm(code_arm_required) {
this._updateButtonsStyles();
}
_round_buttonsTobuttonsShape(round_buttons) {
// temporarily!
if ( this.isChecked(round_buttons) )
this.buttonsShape = 'circle';
else
this.buttonsShape = 'rectangle'; // should be square!
console.log('_round_buttonsTobuttonsShape: round_buttons=' + round_buttons + ' => buttonsShape=' + this.buttonsShape);
}
_round_buttons(round_buttons) {
console.log('_round_buttons: ' + round_buttons);
this._round_buttonsTobuttonsShape(round_buttons);
this._updateButtonsStyles();
}
connectedCallback() {
super.connectedCallback();
}
disconnectedCallback() {
super.disconnectedCallback();
clearInterval(this.camTimer);
}
//Page ready
ready(){
console.log('ready()');
super.ready();
// Check the alarm component successfully loaded if not then display an error
if (this.alarm){
// TODO!!
this.platform = this.alarm.attributes.platform;
this.resources_prefix = "/" + this.platform + "/";
// TODO: replace hardcoded "images/"
this.image_path = this.resources_prefix + "images/";
this.default_icon_name = this.alarm.attributes.default_icon_name;
this.default_icon_path = this.image_path + this.default_icon_name;
//console.log("platform: ", this.platform);
//console.log("resources_prefix: ", this.resources_prefix);
//console.log("image_path: ", this.image_path);
//console.log("default_icon_path: ", this.default_icon_path);
//Countdown360
var script = document.createElement('script');
var c360 = this.resources_prefix + 'lib/countdown360.js';
//console.log("c360: ", c360);
script.setAttribute('src', c360);
document.body.appendChild(script);
this.loadSettings();
this.controls = this.$.controls;
if (this.isChecked(this.alarm.attributes.hide_sidebar)) this.closeSidebar();
//Determine screensize and set appropriate controls
this.setupUI();
this._loadData();
}
// Display the error
else {
console.log("Esta integración está rota. Revise su Log de Home Assistant");
this.updating = true;
this.hass.callApi("get", "error/all").then((items) => {
this.errorItems = items;
this.updating = false;
this.items = [];
for (var item in this.errorItems) {
if (this.errorItems[item].level.includes("ERROR") && this.errorItems[item].message.includes(this.platform)) {
this.items.push(this.errorItems[item]);
}
}
});
}
}
getKeys(obj){
if (obj != null) {
return Object.keys(obj);
}
else return false;
}
defineColors(ev){
this.unhideDiv('#themeDetail');
var theme = null;
if (ev != null){
ev.stopPropagation();
var themeName = ev.target.getAttribute('data-theme');
if (this.alarm.attributes.themes)
for (var x in this.alarm.attributes.themes)
if (this.alarm.attributes.themes[x].name == themeName){
theme = this.alarm.attributes.themes[x];
this.shadowRoot.querySelector('#theme-name').value = themeName;
this.shadowRoot.querySelector('#theme-name-button').setAttribute('name', themeName);
}
}
this.settingColors = [{}];
this.settingColors[0] = {
'name':'warning_color', 'header':'Warning', 'theme':themeName,
'description':'If a sensor is tripped when the alarm is armed the panel will display this color in both the top header background and the centre panel background',
'color': (theme != null && theme.warning_color != null) ? theme.warning_color : 'black'};
this.settingColors[1] = {
'name':'pending_color', 'header':'Pending', 'theme':themeName,
'description':'When the alarm is arming the panel will display this color in both the top header background and the centre panel background',
'color': (theme != null && theme.pending_color != null) ? theme.pending_color : 'black'};
this.settingColors[2] = {
'name':'disarmed_color', 'header':'Disarmed', 'theme':themeName,
'description':'When the alarm is disarmed the panel will display this color in both the top header background and the centre panel background',
'color': (theme != null && theme.disarmed_color != null) ? theme.disarmed_color : 'black'};
this.settingColors[3] = {
'name':'triggered_color', 'header':'Triggered', 'theme':themeName,
'description':'When the alarm has been triggered the panel will display this color in both the top header background and the centre panel background',
'color': (theme != null && theme.triggered_color != null) ? theme.triggered_color : 'black'};
this.settingColors[4] = {
'name':'armed_home_color', 'header':'Armed in \'Home\' Mode', 'theme':themeName,
'description':'When the alarm is set in \'Home Mode\' the panel will display this color in both the top header background and the centre panel background',
'color': (theme != null && theme.armed_home_color != null) ? theme.armed_home_color : 'black'};
this.settingColors[5] = {
'name':'armed_away_color', 'header':'Armed in \'Away\' Mode', 'theme':themeName,
'description':'When the alarm is set in \'Away Mode\' the panel will display this color in both the top header background and the centre panel background',
'color': (theme != null && theme.armed_away_color != null) ? theme.armed_away_color : 'black'};
this.settingColors[6] = {
'name':'armed_night_color', 'header':'Armed in \'Night\' Mode', 'theme':themeName,
'description':'When the alarm is set in \'Night Mode\' the panel will display this color in both the top header background and the centre panel background',
'color': (theme != null && theme.armed_night_color != null) ? theme.armed_night_color : 'black'};
this.settingColors[7] = {
'name':'panel_background_color', 'header':'Panel Background', 'theme':themeName,
'description':'The background color of the main content section.',
'color': (theme != null && theme.panel_background_color != null) ? theme.panel_background_color : 'black'};
this.settingColors[8] = {
'name':'panel_outer_background_color', 'header':'Panel Outer Background', 'theme':themeName,
'description':'The background color of both the status bar and the menu bar.',
'color': (theme != null && theme.panel_outer_background_color != null) ? theme.panel_outer_background_color : 'black'};
this.settingColors[9] = {
'name':'panel_text_color', 'header':'Panel Text', 'theme':themeName,
'description':'The color of the general text within the panel.',
'color': (theme != null && theme.panel_text_color != null) ? theme.panel_text_color : 'black'};
this.settingColors[10] = {
'name':'header_background_color', 'header':'Header Background', 'theme':themeName,
'description':'The background color of very top header bar.',
'color': (theme != null && theme.header_background_color != null) ? theme.header_background_color : 'black'};
this.settingColors[11] = {
'name':'header_text_color', 'header':'Header Text', 'theme':themeName,
'description':'The text color on very top header bar.',
'color': (theme != null && theme.header_text_color != null) ? theme.header_text_color : 'black'};
this.settingColors[12] = {
'name':'alarmstatus_text_color', 'header':'Alarm Status Text', 'theme':themeName,
'description':'The text color of the Alarm Status.',
'color': (theme != null && theme.alarmstatus_text_color != null) ? theme.alarmstatus_text_color : 'black'};
this.settingColors[13] = {
'name':'time_text_color', 'header':'Time Text', 'theme':themeName,
'description':'The text color of the Time label.',
'color': (theme != null && theme.time_text_color != null) ? theme.time_text_color : 'black'};
this.settingColors[14] = {
'name':'weather_text_color', 'header':'Weather Text', 'theme':themeName,
'description':'The text color of the Weather label.',
'color': (theme != null && theme.weather_text_color != null) ? theme.weather_text_color : 'black'};
this.settingColors[15] = {
'name':'weather_image_color', 'header':'Weather Image', 'theme':themeName,
'description':'The color of the Weather image.',
'color': (theme != null && theme.weather_image_color != null) ? theme.weather_image_color : 'black'};
this.settingColors[16] = {
'name':'info_header_text_color', 'header':'Information Header Text', 'theme':themeName,
'description':'The color of the Heading within a particular Section.',
'color': (theme != null && theme.info_header_text_color != null) ? theme.info_header_text_color : 'black'};
this.settingColors[17] = {
'name':'info_detail_text_color', 'header':'Information Detail Text', 'theme':themeName,
'description':'The color of the descriptive text within a particular Section.',
'color': (theme != null && theme.info_detail_text_color != null) ? theme.info_detail_text_color : 'black'};
this.settingColors[18] = {
'name':'title_text_color', 'header':'Title (Content) Text', 'theme':themeName,
'description':'The color of the Title text within a particular section.',
'color': (theme != null && theme.title_text_color!= null) ? theme.title_text_color : 'black'};
this.settingColors[19] = {
'name':'subtitle_text_color', 'header':'Subtitle (Content) Text', 'theme':themeName,
'description':'The color of the Subtitle text within a particular section.',
'color': (theme != null && theme.subtitle_text_color!= null) ? theme.subtitle_text_color : 'black'};
this.settingColors[20] = {
'name':'openSensors_title_color', 'header':'Open Sensors Title', 'theme':themeName,
'description':'The color of the Open Sensors Title to draw attention to the open sensor.',
'color': (theme != null && theme.opensensors_title_color != null) ? theme.opensensors_title_color : 'black'};
this.settingColors[21] = {
'name':'button_background_color', 'header':'Button Background Color', 'theme':themeName,
'description':'The background color of the alarm buttons.',
'color': (theme != null && theme.button_background_color != null) ? theme.button_background_color : 'black'};
this.settingColors[22] = {
'name':'cancel_color', 'header':'Cancel Button Background', 'theme':themeName,
'description':'The background color of the cancel button.',
'color': (theme != null && theme.cancel_color != null) ? theme.cancel_color : 'black'};
this.settingColors[23] = {
'name':'override_color', 'header':'Override Button Background', 'theme':themeName,
'description':'The background color of the override button.',
'color': (theme != null && theme.override_color != null) ? theme.override_color : 'black'};
this.settingColors[24] = {
'name':'info_panel_buttons_color', 'header':'Menu Buttons', 'theme':themeName,
'description':'The color of the menu buttons.',
'color': (theme != null && theme.info_panel_buttons_color != null) ? theme.info_panel_buttons_color : 'black'};
this.settingColors[25] = {
'name':'arm_button_border_color', 'header':'Alarm Button Border', 'theme':themeName,
'description':'The border color of the alarm buttons.',
'color': (theme != null && theme.arm_button_border_color != null) ? theme.arm_button_border_color : 'black'};
this.settingColors[26] = {
'name':'arm_button_text_color', 'header':'Alarm Button Text', 'theme':themeName,
'description':'The color of the text within the alarm buttons.',
'color': (theme != null && theme.arm_button_text_color != null) ? theme.arm_button_text_color : 'black'};
this.settingColors[27] = {
'name':'paper_listbox_background_color', 'header':'Listbox background', 'theme':themeName,
'description':'The background color of the listboxes.',
'color': (theme != null && theme.paper_listbox_background_color != null) ? theme.paper_listbox_background_color : 'black'};
this.settingColors[28] = {
'name':'paper_listbox_color', 'header':'Listbox text', 'theme':themeName,
'description':'The text color within the listboxes.',
'color': (theme != null && theme.paper_listbox_color != null) ? theme.paper_listbox_color : 'black'};
this.settingColors[29] = {
'name':'paper_item_selected___color', 'header':'Item Selected', 'theme':themeName,
'description':'The text color of the item selected within a selection box.',
'color': (theme != null && theme.paper_item_selected___color != null) ? theme.paper_item_selected___color : 'black'};
this.settingColors[30] = {
'name':'action_button_border_color', 'header':'Action button border', 'theme':themeName,
'description':'The color of the border surrounding the action buttons',
'color': (theme != null && theme.action_button_border_color != null) ? theme.action_button_border_color : 'black'};
this.addColorPicker();
}
addColorPicker(){
setTimeout(function(instance) {
var colorPickers = instance.shadowRoot.querySelectorAll('.colPicker');
for (var i = 0; i <= colorPickers.length - 1; i++) {
var input = document.createElement('INPUT');
input.id = colorPickers[i].id.replace('_span','');
var picker = new jscolor(input)
picker.fromString(colorPickers[i].value);
//clear previous pickers
while (colorPickers[i].firstChild)
colorPickers[i].removeChild(colorPickers[i].firstChild);
//var clearBox = colorPickers[i];
if (colorPickers[i] != null)
colorPickers[i].appendChild(input);
}
instance.setCarouselHeight(instance.carouselMainSelected);
}, 200, this);
}
toUpper(text){
return text.charAt(0).toUpperCase() + text.slice(1);
}
unhideDiv(ev){
var el = null;
if (ev.target) el = ev.target.getAttribute('data-div');
else el = ev;
var element = this.shadowRoot.querySelector(el);
if (element) element.classList.remove('remove');
//this.setCarouselHeight(this.carouselMainSelected);
}
hideDiv(ev){
var el = null;
if (ev.target) el = ev.target.getAttribute('data-div');
else el = ev;
var element = this.shadowRoot.querySelector(el);
if (element) element.classList.add('remove');
//this.setCarouselHeight(this.carouselMainSelected);
}
updateTheme(){
if (this.alarm.attributes.themes)
for (var x in this.alarm.attributes.themes)
if (this.isChecked(this.alarm.attributes.themes[x].active)){
var theme = this.alarm.attributes.themes[x];
if (typeof theme.name == 'string'){
var styles = {};
for (var cssVar in theme){
if (cssVar != 'name' && cssVar != 'active'){
var style = '--' + cssVar.replace(new RegExp('_', 'g'), '-');
styles[style] = this.alarm.attributes.themes[x][cssVar];
}
}
this.updateStyles(styles);
var color = styles['--' + this.alarm.state.replace(new RegExp('_', 'g'), '-') + '-color'];
if (color)
this.updateStyles({'--panel-outer-background-color': color});
}
}
}
// Log an error
error(message){
if (this.errors == null) this.errors = [];
this.errors.push(message);
console.log(message);
}
exists(entity){
if (entity) return true;
else return false;
}
getObject(entity){
return this.hass.states[entity];
}
getPanelTitle(){
if (this.alarm && this.alarm.attributes.panel && this.alarm.attributes.panel.panel_title != null )
this.panel_title = this.alarm.attributes.panel.panel_title.trim();
}
// returns combined (title and state) status
// depending on title and status content
_alarmStatus(state, title) {
// if state starts with _ - don't prefix it with anything
if (state.match(/^_.+/))
return state.slice(1);
// if it's a number - they're disarming
// prefix with title if it isn't empty
else {
var prefix = state.match(/\d+/)? (this.isDisarmed(this.alarm)? 'Arm with ' : 'Disarm with ') : (title.length? title + ': ' : '');