thomas/lovelace-state-switch
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Try to fix #14

Browse Source
This commit is contained in:
Thomas Lovén 2020-01-08 21:20:31 +01:00
parent e8227cefe6
commit fdcf2bd853
2 changed files with 36 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

26
src/main.js
View File

@ -120,21 +120,22 @@ class StateSwitch extends LitElement {
:host { :host {
perspective: 1000px; perspective: 1000px;
} }
#root {
display: grid;
}
#root * { #root * {
display: none; display: none;
grid-column: 1;
grid-row: 1;
} }
#root .visible { #root .visible {
display: block; display: block;
} }
#root.slide-right,
#root.slide-left {
display: grid;
}
#root.slide-right *, #root.slide-right *,
#root.slide-left * { #root.slide-left * {
grid-column: 1;
grid-row: 1;
display: block; display: block;
opacity: 0; opacity: 0;
height: 0; height: 0;
@ -163,8 +164,14 @@ class StateSwitch extends LitElement {
} }
#root.swap-right,
#root.swap-left {
display: grid;
}
#root.swap-right *, #root.swap-right *,
#root.swap-left * { #root.swap-left * {
grid-column: 1;
grid-row: 1;
display: block; display: block;
opacity: 0; opacity: 0;
height: 0; height: 0;
@ -190,13 +197,16 @@ class StateSwitch extends LitElement {
} }
#root.flip { #root.flip {
display: grid;
width: 100%; width: 100%;
height: 100%; height: 100%;
position: relative; position: relative;
} }
#root.flip * { #root.flip * {
grid-column: 1;
grid-row: 1;
display: block; display: block;
opacity: 0; opacity: 0;
height: 0; height: 0;
@ -226,7 +236,7 @@ class StateSwitch extends LitElement {
customElements.define("state-switch", StateSwitch); customElements.define("state-switch", StateSwitch);
// Monkey patch hui-view to avoid scroll bars in columns // Monkey patch hui-view to avoid scroll bars in columns
customElements.whenDefined("hui-view").then( () => { /*customElements.whenDefined("hui-view").then( () => {
const HuiView = customElements.get("hui-view").prototype; const HuiView = customElements.get("hui-view").prototype;
const oldRenderStyles = HuiView.renderStyles; const oldRenderStyles = HuiView.renderStyles;
HuiView.renderStyles = function() { HuiView.renderStyles = function() {
@ -241,4 +251,4 @@ HuiView.renderStyles = function() {
return original; return original;
} }
fireEvent('ll-rebuild', {}); fireEvent('ll-rebuild', {});
}); });*/

26
state-switch.js
View File

@ -1,4 +1,4 @@
!function(t){var e={};function i(s){if(e[s])return e[s].exports;var r=e[s]={i:s,l:!1,exports:{}};return t[s].call(r.exports,r,r.exports,i),r.l=!0,r.exports}i.m=t,i.c=e,i.d=function(t,e,s){i.o(t,e)||Object.defineProperty(t,e,{enumerable:!0,get:s})},i.r=function(t){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})},i.t=function(t,e){if(1&e&&(t=i(t)),8&e)return t;if(4&e&&"object"==typeof t&&t&&t.__esModule)return t;var s=Object.create(null);if(i.r(s),Object.defineProperty(s,"default",{enumerable:!0,value:t}),2&e&&"string"!=typeof t)for(var r in t)i.d(s,r,function(e){return t[e]}.bind(null,r));return s},i.n=function(t){var e=t&&t.__esModule?function(){return t.default}:function(){return t};return i.d(e,"a",e),e},i.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},i.p="",i(i.s=0)}([function(t,e,i){"use strict";i.r(e);const s=customElements.get("home-assistant-main")?Object.getPrototypeOf(customElements.get("home-assistant-main")):Object.getPrototypeOf(customElements.get("hui-view")),r=s.prototype.html,o=s.prototype.css;function a(){return document.querySelector("home-assistant").hass}function n(t,e,i=null){if((t=new Event(t,{bubbles:!0,cancelable:!1,composed:!0})).detail=e||{},i)i.dispatchEvent(t);else{var s=document.querySelector("home-assistant");(s=(s=(s=(s=(s=(s=(s=(s=(s=(s=(s=s&&s.shadowRoot)&&s.querySelector("home-assistant-main"))&&s.shadowRoot)&&s.querySelector("app-drawer-layout partial-panel-resolver"))&&s.shadowRoot||s)&&s.querySelector("ha-panel-lovelace"))&&s.shadowRoot)&&s.querySelector("hui-root"))&&s.shadowRoot)&&s.querySelector("ha-app-layout #view"))&&s.firstElementChild)&&s.dispatchEvent(t)}}const l="custom:";function c(t,e){const i=document.createElement("hui-error-card");return i.setConfig({type:"error",error:t,origConfig:e}),i}function d(t,e){if(!e||"object"!=typeof e||!e.type)return c(`No ${t} type configured`,e);let i=e.type;if(i=i.startsWith(l)?i.substr(l.length):`hui-${i}-${t}`,customElements.get(i))return function(t,e){const i=document.createElement(t);try{i.setConfig(e)}catch(t){return c(t,e)}return i}(i,e);const s=c(`Custom element doesn't exist: ${i}.`,e);s.style.display="None";const r=setTimeout(()=>{s.style.display=""},2e3);return customElements.whenDefined(i).then(()=>{clearTimeout(r),n("ll-rebuild",{},s)}),s}function u(t){return d("card",t)}let h=function(){if(window.fully&&"function"==typeof fully.getDeviceId)return fully.getDeviceId();if(!localStorage["lovelace-player-device-id"]){const t=()=>Math.floor(1e5*(1+Math.random())).toString(16).substring(1);localStorage["lovelace-player-device-id"]=`${t()}${t()}-${t()}${t()}`}return localStorage["lovelace-player-device-id"]}();customElements.define("state-switch",class extends s{static get properties(){return{hass:{},state:{}}}setConfig(t){this._config=t,this.state=void 0,this.cards={};for(let e in t.states)this.cards[e]=u(t.states[e]),this.cards[e].hass=a();if("hash"===t.entity&&window.addEventListener("location-changed",()=>this.updated(new Map)),"mediaquery"===t.entity)for(const t in this.cards)window.matchMedia(t).addEventListener("change",this.update_state.bind(this))}update_state(){let t=void 0;switch(this._config.entity){case"user":t=this.hass&&this.hass.user&&this.hass.user.name||void 0;break;case"group":t=this.hass&&this.hass.user&&this.hass.user.is_admin?"admin":"user";case"deviceID":case"browser":t=h;break;case"hash":t=location.hash.substr(1);break;case"mediaquery":for(const e in this.cards)if(window.matchMedia(e).matches){t=e;break}break;default:t=this.hass.states[this._config.entity],t=t?t.state:void 0}void 0!==t&&this.cards.hasOwnProperty(t)||(t=this._config.default),this.state=t}updated(t){if(t.has("hass"))for(let t in this.cards)this.cards[t].hass=this.hass;if(t.has("state")){const e=t.get("state");this.cards[e]&&(this.cards[e].classList.remove("visible"),this.cards[e].classList.add("out"),window.setTimeout(()=>{this.cards[e].classList.remove("out")},this._config.transition_time||500)),this.cards[this.state]&&this.cards[this.state].classList.add("visible")}else this.update_state()}render(){return r` !function(t){var e={};function i(s){if(e[s])return e[s].exports;var r=e[s]={i:s,l:!1,exports:{}};return t[s].call(r.exports,r,r.exports,i),r.l=!0,r.exports}i.m=t,i.c=e,i.d=function(t,e,s){i.o(t,e)||Object.defineProperty(t,e,{enumerable:!0,get:s})},i.r=function(t){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})},i.t=function(t,e){if(1&e&&(t=i(t)),8&e)return t;if(4&e&&"object"==typeof t&&t&&t.__esModule)return t;var s=Object.create(null);if(i.r(s),Object.defineProperty(s,"default",{enumerable:!0,value:t}),2&e&&"string"!=typeof t)for(var r in t)i.d(s,r,function(e){return t[e]}.bind(null,r));return s},i.n=function(t){var e=t&&t.__esModule?function(){return t.default}:function(){return t};return i.d(e,"a",e),e},i.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},i.p="",i(i.s=0)}([function(t,e,i){"use strict";i.r(e);const s=customElements.get("home-assistant-main")?Object.getPrototypeOf(customElements.get("home-assistant-main")):Object.getPrototypeOf(customElements.get("hui-view")),r=s.prototype.html,o=s.prototype.css;function a(){return document.querySelector("home-assistant").hass}const n="custom:";function l(t,e){const i=document.createElement("hui-error-card");return i.setConfig({type:"error",error:t,origConfig:e}),i}function c(t,e){if(!e||"object"!=typeof e||!e.type)return l(`No ${t} type configured`,e);let i=e.type;if(i=i.startsWith(n)?i.substr(n.length):`hui-${i}-${t}`,customElements.get(i))return function(t,e){const i=document.createElement(t);try{i.setConfig(e)}catch(t){return l(t,e)}return i}(i,e);const s=l(`Custom element doesn't exist: ${i}.`,e);s.style.display="None";const r=setTimeout(()=>{s.style.display=""},2e3);return customElements.whenDefined(i).then(()=>{clearTimeout(r),function(t,e,i=null){if((t=new Event(t,{bubbles:!0,cancelable:!1,composed:!0})).detail=e||{},i)i.dispatchEvent(t);else{var s=document.querySelector("home-assistant");(s=(s=(s=(s=(s=(s=(s=(s=(s=(s=(s=s&&s.shadowRoot)&&s.querySelector("home-assistant-main"))&&s.shadowRoot)&&s.querySelector("app-drawer-layout partial-panel-resolver"))&&s.shadowRoot||s)&&s.querySelector("ha-panel-lovelace"))&&s.shadowRoot)&&s.querySelector("hui-root"))&&s.shadowRoot)&&s.querySelector("ha-app-layout #view"))&&s.firstElementChild)&&s.dispatchEvent(t)}}("ll-rebuild",{},s)}),s}function d(t){return c("card",t)}let h=function(){if(window.fully&&"function"==typeof fully.getDeviceId)return fully.getDeviceId();if(!localStorage["lovelace-player-device-id"]){const t=()=>Math.floor(1e5*(1+Math.random())).toString(16).substring(1);localStorage["lovelace-player-device-id"]=`${t()}${t()}-${t()}${t()}`}return localStorage["lovelace-player-device-id"]}();customElements.define("state-switch",class extends s{static get properties(){return{hass:{},state:{}}}setConfig(t){this._config=t,this.state=void 0,this.cards={};for(let e in t.states)this.cards[e]=d(t.states[e]),this.cards[e].hass=a();if("hash"===t.entity&&window.addEventListener("location-changed",()=>this.updated(new Map)),"mediaquery"===t.entity)for(const t in this.cards)window.matchMedia(t).addEventListener("change",this.update_state.bind(this))}update_state(){let t=void 0;switch(this._config.entity){case"user":t=this.hass&&this.hass.user&&this.hass.user.name||void 0;break;case"group":t=this.hass&&this.hass.user&&this.hass.user.is_admin?"admin":"user";case"deviceID":case"browser":t=h;break;case"hash":t=location.hash.substr(1);break;case"mediaquery":for(const e in this.cards)if(window.matchMedia(e).matches){t=e;break}break;default:t=this.hass.states[this._config.entity],t=t?t.state:void 0}void 0!==t&&this.cards.hasOwnProperty(t)||(t=this._config.default),this.state=t}updated(t){if(t.has("hass"))for(let t in this.cards)this.cards[t].hass=this.hass;if(t.has("state")){const e=t.get("state");this.cards[e]&&(this.cards[e].classList.remove("visible"),this.cards[e].classList.add("out"),window.setTimeout(()=>{this.cards[e].classList.remove("out")},this._config.transition_time||500)),this.cards[this.state]&&this.cards[this.state].classList.add("visible")}else this.update_state()}render(){return r`
<div <div
id="root" id="root"
class="${this._config.transition}" class="${this._config.transition}"
@ -15,21 +15,22 @@
:host { :host {
perspective: 1000px; perspective: 1000px;
} }
#root {
display: grid;
}
#root * { #root * {
display: none; display: none;
grid-column: 1;
grid-row: 1;
} }
#root .visible { #root .visible {
display: block; display: block;
} }
#root.slide-right,
#root.slide-left {
display: grid;
}
#root.slide-right *, #root.slide-right *,
#root.slide-left * { #root.slide-left * {
grid-column: 1;
grid-row: 1;
display: block; display: block;
opacity: 0; opacity: 0;
height: 0; height: 0;
@ -58,8 +59,14 @@
} }
#root.swap-right,
#root.swap-left {
display: grid;
}
#root.swap-right *, #root.swap-right *,
#root.swap-left * { #root.swap-left * {
grid-column: 1;
grid-row: 1;
display: block; display: block;
opacity: 0; opacity: 0;
height: 0; height: 0;
@ -85,13 +92,16 @@
} }
#root.flip { #root.flip {
display: grid;
width: 100%; width: 100%;
height: 100%; height: 100%;
position: relative; position: relative;
} }
#root.flip * { #root.flip * {
grid-column: 1;
grid-row: 1;
display: block; display: block;
opacity: 0; opacity: 0;
height: 0; height: 0;
@ -114,4 +124,4 @@
height: auto; height: auto;
transform: rotateY(180deg); transform: rotateY(180deg);
} }
`}}),customElements.whenDefined("hui-view").then(()=>{const t=customElements.get("hui-view").prototype,e=t.renderStyles;t.renderStyles=function(){let t=e();return t.strings=[t.strings[0]+"\n <style>\n .column {\n overflow-y: hidden;\n }\n </style>\n "],t},n("ll-rebuild",{})})}]); `}})}]);