iobroker.lovelace
Version:
With this adapter you can build visualization for ioBroker with Home Assistant Lovelace UI
1 lines • 9.82 kB
JavaScript
"use strict";(self.rspackChunkhome_assistant_frontend=self.rspackChunkhome_assistant_frontend||[]).push([[32527],{5127:function(e,t,s){s.a(e,async function(e,t){try{s(26910),s(13609),s(18111),s(61701),s(62953);var i=s(40445),a=s(5124),r=s(67576),o=s(89784),l=s(20058),n=s(67258),h=s(12587),c=s(36240),d=e([l]);l=(d.then?(await d)():d)[0];let u,g,p,v,_,b,m,y=e=>e;const f=(e,t,s)=>180*(0,c.NN)((0,c.S8)(e,t,s),t,s)/100;class k extends a.WF{connectedCallback(){super.connectedCallback(),this._rescaleOnConnect&&(this._rescaleSvg(),this._rescaleOnConnect=!1)}firstUpdated(e){super.firstUpdated(e),(0,h.m)(()=>{this._updated=!0,this.needle&&(this._angle=f(this.value,this.min,this.max)),this._segment_label=this._getSegmentLabel(),this._rescaleSvg()})}willUpdate(e){(e.has("levels")||e.has("min"))&&(this.levels?(this._sortedLevels=[...this.levels].sort((e,t)=>e.level-t.level),this._sortedLevels.length>0&&this._sortedLevels[0].level!==this.min&&this._sortedLevels.unshift({level:this.min,stroke:"var(--info-color)"})):this._sortedLevels=void 0)}updated(e){super.updated(e),this._updated&&(e.has("value")||e.has("valueText")||e.has("label")||e.has("_segment_label"))&&(this._angle=f(this.value,this.min,this.max),this._segment_label=this._getSegmentLabel(),this._rescaleSvg())}render(){var e;const t=40,s=Math.PI*t,i=f(this.value,this.min,this.max),r=this._updated?s*(1-i/180):s;return(0,a.JW)(u||(u=y` <svg viewBox="-50 -50 100 55" class="gauge"> <path class="levels-base" d="M -40 0 A 40 40 0 0 1 40 0"/> ${0} ${0} </svg> <svg class="text"> <text class="value-text" x="0" y="-5" dominant-baseline="middle" text-anchor="middle"> ${0}${0} </text> </svg> `),null===(e=this._sortedLevels)||void 0===e?void 0:e.map((e,s,i)=>{const r=e.level,o=s+1<i.length?i[s+1].level:this.max,l=f(r,this.min,this.max),n=f(o,this.min,this.max),h=n-l>180?1:0,c=-40*Math.cos(l*Math.PI/180),d=-40*Math.sin(l*Math.PI/180),u=0===s,_=s===i.length-1;if(u)return(0,a.JW)(g||(g=y` <path class="level" stroke="${0}" style="stroke-linecap:butt" d="M ${0} ${0} A ${0} ${0} 0 ${0} 1 40 0"/> `),e.stroke,c,d,t,t,h);if(_){const s=n-.5,i=-40*Math.cos(s*Math.PI/180),r=-40*Math.sin(s*Math.PI/180);return(0,a.JW)(p||(p=y` <path class="level" stroke="${0}" style="stroke-linecap:butt" d="M ${0} ${0} A ${0} ${0} 0 ${0} 1 40 0"/> <path class="level" stroke="${0}" style="stroke-linecap:butt" d="M ${0} ${0} A ${0} ${0} 0 0 1 40 0"/> `),e.stroke,c,d,t,t,h,e.stroke,i,r,t,t)}return(0,a.JW)(v||(v=y` <path class="level" stroke="${0}" style="stroke-linecap:butt" d="M ${0} ${0} A ${0} ${0} 0 ${0} 1 40 0"></path> `),e.stroke,c,d,t,t,h)}),this.needle?(0,a.JW)(_||(_=y` <path class="needle" d="M -34,-3 L -40,-1 A 1,1,0,0,0,-40,1 L -34,3 A 2,2,0,0,0,-34,-3 Z" style="${0}"/> `),(0,o.W)({transform:`rotate(${this._angle}deg)`})):(0,a.JW)(b||(b=y` <path class="value" d="M -40 0 A 40 40 0 0 1 40 0" stroke-dasharray="${0}" style="${0}"/> `),s,(0,o.W)({strokeDashoffset:`${r}`})),this._segment_label?this._segment_label:this.valueText||(0,l.ZV)(this.value,this.locale,this.formatOptions),this._segment_label?"":"%"===this.label?(0,n.d)(this.locale)+"%":` ${this.label}`)}_rescaleSvg(){if(!this.isConnected)return void(this._rescaleOnConnect=!0);const e=this.shadowRoot.querySelector(".text"),t=e.querySelector("text").getBBox();e.setAttribute("viewBox",`${t.x} ${t.y} ${t.width} ${t.height}`)}_getSegmentLabel(){if(this._sortedLevels)for(let e=this._sortedLevels.length-1;e>=0;e--)if(this.value>=this._sortedLevels[e].level)return this._sortedLevels[e].label;return""}constructor(...e){super(...e),this.min=0,this.max=100,this.value=0,this.needle=!1,this.label="",this._angle=0,this._updated=!1,this._segment_label="",this._rescaleOnConnect=!1}}k.styles=(0,a.AH)(m||(m=y`:host{position:relative}.levels-base{fill:none;stroke:var(--primary-background-color);stroke-width:12;stroke-linecap:butt}.level{fill:none;stroke-width:12;stroke-linecap:butt}.value{fill:none;stroke-width:12;stroke:var(--gauge-color);stroke-linecap:butt;transition:stroke-dashoffset 1s ease 0s}.needle{fill:var(--primary-text-color);stroke:var(--card-background-color);color:var(--primary-text-color);stroke-width:1;stroke-linecap:round;transform-origin:0 0;transition:all 1s ease 0s}.text{position:absolute;max-height:40%;max-width:55%;left:50%;bottom:10%;transform:translate(-50%,0%)}.value-text{font-size:var(--ha-font-size-l);fill:var(--primary-text-color);direction:ltr}`)),(0,i.Cg)([(0,r.MZ)({type:Number})],k.prototype,"min",void 0),(0,i.Cg)([(0,r.MZ)({type:Number})],k.prototype,"max",void 0),(0,i.Cg)([(0,r.MZ)({type:Number})],k.prototype,"value",void 0),(0,i.Cg)([(0,r.MZ)({attribute:!1})],k.prototype,"formatOptions",void 0),(0,i.Cg)([(0,r.MZ)({attribute:!1})],k.prototype,"valueText",void 0),(0,i.Cg)([(0,r.MZ)({attribute:!1})],k.prototype,"locale",void 0),(0,i.Cg)([(0,r.MZ)({type:Boolean})],k.prototype,"needle",void 0),(0,i.Cg)([(0,r.MZ)({type:Array})],k.prototype,"levels",void 0),(0,i.Cg)([(0,r.MZ)()],k.prototype,"label",void 0),(0,i.Cg)([(0,r.wk)()],k.prototype,"_angle",void 0),(0,i.Cg)([(0,r.wk)()],k.prototype,"_updated",void 0),(0,i.Cg)([(0,r.wk)()],k.prototype,"_segment_label",void 0),k=(0,i.Cg)([(0,r.EM)("ha-gauge")],k),t()}catch(u){t(u)}})},54706:function(e,t,s){s.d(t,{E:function(){return r}});s(74423),s(18111),s(13579),s(3362),s(62953);var i=s(40445),a=s(67576);const r=e=>{class t extends e{connectedCallback(){super.connectedCallback(),this._checkSubscribed()}disconnectedCallback(){if(super.disconnectedCallback(),this.__unsubs){for(;this.__unsubs.length;){const e=this.__unsubs.pop();e instanceof Promise?e.then(e=>e()):e()}this.__unsubs=void 0}}updated(e){if(super.updated(e),e.has("hass"))this._checkSubscribed();else if(this.hassSubscribeRequiredHostProps)for(const t of e.keys())if(this.hassSubscribeRequiredHostProps.includes(t))return void this._checkSubscribed()}hassSubscribe(){return[]}_checkSubscribed(){var e;void 0!==this.__unsubs||!this.isConnected||void 0===this.hass||null!==(e=this.hassSubscribeRequiredHostProps)&&void 0!==e&&e.some(e=>void 0===this[e])||(this.__unsubs=this.hassSubscribe())}}return(0,i.Cg)([(0,a.MZ)({attribute:!1})],t.prototype,"hass",void 0),t}},80449:function(e,t,s){s.a(e,async function(e,i){try{s.r(t);s(3362),s(62953);var a=s(40445),r=s(5124),o=s(67576),l=s(20058),n=(s(76776),s(5127)),h=(s(67094),s(34127)),c=s(38114),d=s(54706),u=s(784),g=e([n,h,c,l]);[n,h,c,l]=g.then?(await g)():g;let p,v,_,b,m=e=>e;const y="M11,9H13V7H11M12,20C7.59,20 4,16.41 4,12C4,7.59 7.59,4 12,4C16.41,4 20,7.59 20,12C20,16.41 16.41,20 12,20M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12A10,10 0 0,0 12,2M11,17H13V11H11V17Z",f=[{level:-1,stroke:"var(--energy-grid-consumption-color)"},{level:0,stroke:"var(--energy-grid-return-color)"}];class k extends((0,d.E)(r.WF)){static async getConfigElement(){return await s.e(79062).then(s.bind(s,54197)),document.createElement("hui-energy-graph-card-editor")}static getStubConfig(e,t,s){return{type:"energy-grid-neutrality-gauge"}}hassSubscribe(){var e;return[(0,c.tb)(this.hass,{key:null===(e=this._config)||void 0===e?void 0:e.collection_key}).subscribe(e=>{this._data=e})]}getCardSize(){return 4}setConfig(e){e.collection_key&&(0,c.s8)(e.collection_key),this._config=e}shouldUpdate(e){return(0,u.xP)(this,e)||e.size>1||!e.has("hass")}render(){var e,t;if(!this._config||!this.hass)return r.s6;if(!this._data)return(0,r.qy)(p||(p=m`${0}`),this.hass.localize("ui.panel.lovelace.cards.energy.loading"));const{summedData:s,compareSummedData:i}=(0,c.gv)(this._data);let a;if(!("from_grid"in s.total))return r.s6;const o=null!==(e=s.total.from_grid)&&void 0!==e?e:0,n=null!==(t=s.total.to_grid)&&void 0!==t?t:0;return null!==o&&null!==n&&(a=n>o?1-o/n:n<o?-1*(1-n/o):0),(0,r.qy)(v||(v=m` <ha-card> ${0} </ha-card> `),void 0!==a?(0,r.qy)(_||(_=m` <ha-gauge min="-1" max="1" .value="${0}" .valueText="${0}" .locale="${0}" .levels="${0}" label="kWh" needle></ha-gauge> <ha-svg-icon id="info" .path="${0}"></ha-svg-icon> <ha-tooltip for="info" placement="left"> ${0} <br><br> ${0} </ha-tooltip> <div class="name"> ${0} </div> `),a,(0,l.ZV)(Math.abs(n-o),this.hass.locale,{maximumFractionDigits:2}),this.hass.locale,f,y,this.hass.localize("ui.panel.lovelace.cards.energy.grid_neutrality_gauge.energy_dependency"),this.hass.localize("ui.panel.lovelace.cards.energy.grid_neutrality_gauge.color_explain"),n>=o?this.hass.localize("ui.panel.lovelace.cards.energy.grid_neutrality_gauge.net_returned_grid"):this.hass.localize("ui.panel.lovelace.cards.energy.grid_neutrality_gauge.net_consumed_grid")):this.hass.localize("ui.panel.lovelace.cards.energy.grid_neutrality_gauge.grid_neutrality_not_calculated"))}constructor(...e){super(...e),this.hassSubscribeRequiredHostProps=["_config"]}}k.styles=(0,r.AH)(b||(b=m`ha-card{height:100%;overflow:hidden;padding:16px;display:flex;align-items:center;justify-content:center;flex-direction:column;box-sizing:border-box}ha-gauge{width:100%;max-width:250px;direction:ltr}.name{text-align:center;line-height:initial;color:var(--primary-text-color);width:100%;font-size:var(--ha-font-size-m);margin-top:8px}ha-svg-icon{position:absolute;right:4px;inset-inline-end:4px;inset-inline-start:initial;top:4px;color:var(--secondary-text-color)}ha-tooltip::part(base__popup){margin-top:4px}`)),(0,a.Cg)([(0,o.MZ)({attribute:!1})],k.prototype,"hass",void 0),(0,a.Cg)([(0,o.wk)()],k.prototype,"_config",void 0),(0,a.Cg)([(0,o.wk)()],k.prototype,"_data",void 0),k=(0,a.Cg)([(0,o.EM)("hui-energy-grid-neutrality-gauge-card")],k),i()}catch(p){i(p)}})},36240:function(e,t,s){s.d(t,{NN:function(){return a},S8:function(){return i},gN:function(){return r}});const i=(e,t,s)=>isNaN(e)||isNaN(t)||isNaN(s)?0:e>s?s:e<t?t:e,a=(e,t,s)=>100*(e-t)/(s-t),r=e=>Math.round(10*e)/10},56434:function(e,t,s){s.d(t,{e:function(){return a}});var i=s(81977);function a(e,t,s){return(0,i.P)(e,12*t,s)}}}]);