iobroker.lovelace
Version:
With this adapter you can build visualization for ioBroker with Home Assistant Lovelace UI
1 lines • 16.5 kB
JavaScript
"use strict";(self.rspackChunkhome_assistant_frontend=self.rspackChunkhome_assistant_frontend||[]).push([[12122],{80804:function(t,e,i){i.d(e,{H:function(){return a}});i(16280),i(18111),i(61701),i(3362),i(62953);const a=async(t,e)=>{if(!t.parentNode)throw new Error("Cannot setup Leaflet map on disconnected element");const a=(await Promise.resolve().then(i.t.bind(i,78572,23))).default;a.Icon.Default.imagePath="/static/images/leaflet/images/",await i.e(83757).then(i.t.bind(i,17948,23));const o=a.map(t),r=document.createElement("link");r.setAttribute("href","/static/images/leaflet/leaflet.css"),r.setAttribute("rel","stylesheet"),t.parentNode.appendChild(r);const n=document.createElement("link");var l;(n.setAttribute("href","/static/images/leaflet/MarkerCluster.css"),n.setAttribute("rel","stylesheet"),t.parentNode.appendChild(n),e)&&o.setView([e.latitude,e.longitude],null!==(l=e.zoom)&&void 0!==l?l:13);return[o,a,s(a).addTo(o)]},s=t=>t.tileLayer("https://basemaps.cartocdn.com/rastertiles/voyager/{z}/{x}/{y}"+(t.Browser.retina?"@2x.png":".png"),{attribution:'© <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a>, © <a href="https://carto.com/attributions">CARTO</a>',subdomains:"abcd",minZoom:0,maxZoom:20})},3894:function(t,e,i){i.d(e,{q:function(){return s}});var a=i(78572);class s extends a.Marker{onAdd(t){var e;return super.onAdd(t),null===(e=this.decorationLayer)||void 0===e||e.addTo(t),this}onRemove(t){var e;return null===(e=this.decorationLayer)||void 0===e||e.remove(),super.onRemove(t)}constructor(t,e,i){super(t,i),this.decorationLayer=e}}},75428:function(t,e,i){i.d(e,{D:function(){return o}});var a=i(75158),s=i.n(a);const o=t=>s()(t,{whiteList:{},stripIgnoreTag:!0,stripIgnoreTagBody:!0})},30219:function(t,e,i){i.a(t,async function(t,e){try{i(62953);var a=i(40445),s=i(5124),o=i(67576),r=i(89784),n=i(1087),l=i(93367),h=t([l]);l=(h.then?(await h)():h)[0];let c,d,p,u,m,g=t=>t;class y extends s.WF{render(){var t;return(0,s.qy)(c||(c=g` <div class="marker ${0}" style="${0}" ="${0}"> ${0} </div> `),this.entityPicture?"picture":"",(0,r.W)({"border-color":this.entityColor}),this._badgeTap,this.entityPicture?(0,s.qy)(d||(d=g`<div class="entity-picture" style="${0}"></div>`),(0,r.W)({"background-image":`url(${this.entityPicture})`})):this.showIcon&&this.entityId?(0,s.qy)(p||(p=g`<ha-state-icon .stateObj="${0}"></ha-state-icon>`),null===(t=this.hass)||void 0===t?void 0:t.states[this.entityId]):this.entityUnit?(0,s.qy)(u||(u=g` ${0} <span class="unit" style="display:${0}">${0}</span> `),this.entityName,this.entityUnit?"initial":"none",this.entityUnit):this.entityName)}_badgeTap(t){t.stopPropagation(),this.entityId&&(0,n.r)(this,"hass-more-info",{entityId:this.entityId})}constructor(...t){super(...t),this.showIcon=!1}}y.styles=(0,s.AH)(m||(m=g`.marker{display:flex;justify-content:center;text-align:center;align-items:center;box-sizing:border-box;width:var(--ha-marker-size,48px);height:var(--ha-marker-size,48px);font-size:var(--ha-marker-font-size, var(--ha-font-size-xl));border-radius:var(--ha-marker-border-radius,50%);border:1px solid var(--ha-marker-color,var(--primary-color));color:var(--primary-text-color);background-color:var(--card-background-color)}.marker.picture{overflow:hidden}.entity-picture{background-size:cover;height:100%;width:100%}.unit{margin-left:2px}`)),(0,a.Cg)([(0,o.MZ)({attribute:!1})],y.prototype,"hass",void 0),(0,a.Cg)([(0,o.MZ)({attribute:"entity-id",reflect:!0})],y.prototype,"entityId",void 0),(0,a.Cg)([(0,o.MZ)({attribute:"entity-name"})],y.prototype,"entityName",void 0),(0,a.Cg)([(0,o.MZ)({attribute:"entity-unit"})],y.prototype,"entityUnit",void 0),(0,a.Cg)([(0,o.MZ)({attribute:"entity-picture"})],y.prototype,"entityPicture",void 0),(0,a.Cg)([(0,o.MZ)({attribute:"entity-color"})],y.prototype,"entityColor",void 0),(0,a.Cg)([(0,o.MZ)({attribute:"show-icon",type:Boolean})],y.prototype,"showIcon",void 0),y=(0,a.Cg)([(0,o.EM)("ha-entity-marker")],y),e()}catch(c){e(c)}})},22273:function(t,e,i){i.a(t,async function(t,a){try{i.d(e,{$:function(){return P}});var s=i(69235),o=(i(44114),i(18111),i(7588),i(61701),i(3362),i(62953),i(40445)),r=i(73684),n=i(5124),l=i(67576),h=i(95747),c=i(30162),d=i(1087),p=i(80804),u=i(69093),m=i(28978),g=i(3894),y=i(75428),f=i(88438),v=i(26300),_=i(30219),b=t([s,v,_,h,c]);[s,v,_,h,c]=b.then?(await b)():b;let k,M=t=>t;const C=250,z=t=>"string"==typeof t?t:t.entity_id,P=["name","state","attribute","icon"];class w extends n.mN{connectedCallback(){this._pauseAutoFit=!1,document.addEventListener("visibilitychange",this._handleVisibilityChange),this._handleVisibilityChange(),super.connectedCallback(),this._loadMap(),this._attachObserver()}disconnectedCallback(){super.disconnectedCallback(),document.removeEventListener("visibilitychange",this._handleVisibilityChange),this.leafletMap&&(this.leafletMap.remove(),this.leafletMap=void 0,this.Leaflet=void 0),this._loaded=!1,this._resizeObserver&&this._resizeObserver.unobserve(this)}update(t){var e,i;if(super.update(t),!this._loaded)return;let a=!1;const s=t.get("hass");if(t.has("_loaded")||t.has("entities"))this._drawEntities(),a=!this._pauseAutoFit;else if(this._loaded&&s&&this.entities)for(const o of this.entities)if(s.states[z(o)]!==this.hass.states[z(o)]){this._drawEntities(),a=!this._pauseAutoFit;break}t.has("clusterMarkers")&&this._drawEntities(),(t.has("_loaded")||t.has("paths"))&&this._drawPaths(),(t.has("_loaded")||t.has("layers"))&&(this._drawLayers(t.get("layers")),a=!0),(t.has("_loaded")||this.autoFit&&a)&&this.fitMap(),t.has("zoom")&&(this._isProgrammaticFit=!0,this.leafletMap.setZoom(this.zoom),setTimeout(()=>{this._isProgrammaticFit=!1},C)),(t.has("themeMode")||t.has("hass")&&(!s||(null===(e=s.themes)||void 0===e?void 0:e.darkMode)!==(null===(i=this.hass.themes)||void 0===i?void 0:i.darkMode)))&&this._updateMapStyle()}get _darkMode(){return"dark"===this.themeMode||"auto"===this.themeMode&&Boolean(this.hass.themes.darkMode)}_updateMapStyle(){const t=this._mapElement;t.classList.toggle("clickable",this.clickable),t.classList.toggle("dark",this._darkMode),t.classList.toggle("forced-dark","dark"===this.themeMode),t.classList.toggle("forced-light","light"===this.themeMode)}async _loadMap(){if(this._loading)return;let t=this.shadowRoot.getElementById("map");t||(t=document.createElement("div"),t.id="map",this.shadowRoot.append(t)),this._loading=!0;try{var e,i,a,s;[this.leafletMap,this.Leaflet]=await(0,p.H)(t,{latitude:null!==(e=null===(i=this.hass)||void 0===i?void 0:i.config.latitude)&&void 0!==e?e:52.3731339,longitude:null!==(a=null===(s=this.hass)||void 0===s?void 0:s.config.longitude)&&void 0!==a?a:4.8903147,zoom:this.zoom}),this._updateMapStyle(),this.leafletMap.on("click",t=>{0===this._clickCount&&setTimeout(()=>{1===this._clickCount&&(0,d.r)(this,"map-clicked",{location:[t.latlng.lat,t.latlng.lng]}),this._clickCount=0},250),this._clickCount++}),this.leafletMap.on("zoomstart",()=>{this._isProgrammaticFit||(this._pauseAutoFit=!0)}),this.leafletMap.on("movestart",()=>{this._isProgrammaticFit||(this._pauseAutoFit=!0)}),this._loaded=!0}finally{this._loading=!1}}fitMap(t){var e,i,a,s;if(null!=t&&t.unpause_autofit&&(this._pauseAutoFit=!1),!this.leafletMap||!this.Leaflet||!this.hass)return;if(!(this._mapFocusItems.length||this._mapFocusZones.length||null!==(e=this.layers)&&void 0!==e&&e.length))return this._isProgrammaticFit=!0,this.leafletMap.setView(new this.Leaflet.LatLng(this.hass.config.latitude,this.hass.config.longitude),(null==t?void 0:t.zoom)||this.zoom),void setTimeout(()=>{this._isProgrammaticFit=!1},C);let o=this.Leaflet.latLngBounds(this._mapFocusItems?this._mapFocusItems.map(t=>t.getLatLng()):[]);null===(i=this._mapFocusZones)||void 0===i||i.forEach(t=>{o.extend("getBounds"in t?t.getBounds():t.getLatLng())}),null===(a=this.layers)||void 0===a||a.forEach(t=>{o.extend("getBounds"in t?t.getBounds():t.getLatLng())}),o=o.pad(null!==(s=null==t?void 0:t.pad)&&void 0!==s?s:.5),this._isProgrammaticFit=!0,this.leafletMap.fitBounds(o,{maxZoom:(null==t?void 0:t.zoom)||this.zoom}),setTimeout(()=>{this._isProgrammaticFit=!1},C)}fitBounds(t,e){var i;if(!this.leafletMap||!this.Leaflet||!this.hass)return;const a=this.Leaflet.latLngBounds(t).pad(null!==(i=null==e?void 0:e.pad)&&void 0!==i?i:.5);this._isProgrammaticFit=!0,this.leafletMap.fitBounds(a,{maxZoom:(null==e?void 0:e.zoom)||this.zoom}),setTimeout(()=>{this._isProgrammaticFit=!1},C)}_drawLayers(t){if(t&&t.forEach(t=>t.remove()),!this.layers)return;const e=this.leafletMap;this.layers.forEach(t=>{e.addLayer(t)})}_computePathTooltip(t,e){var i;let a;return a=t.fullDatetime?(0,h.r6)(e.timestamp,this.hass.locale,this.hass.config):(0,r.c)(e.timestamp)?(0,c.ie)(e.timestamp,this.hass.locale,this.hass.config):(0,c.Xs)(e.timestamp,this.hass.locale,this.hass.config),`${(0,y.D)(null!==(i=t.name)&&void 0!==i?i:"")}<br>${a}`}_drawPaths(){const t=this.hass,e=this.leafletMap,i=this.Leaflet;if(!t||!e||!i)return;if(this._mapPaths.length&&(this._mapPaths.forEach(t=>t.remove()),this._mapPaths=[]),!this.paths)return;const a=getComputedStyle(this).getPropertyValue("--dark-primary-color");this.paths.forEach(t=>{let s,o;t.gradualOpacity&&(s=t.gradualOpacity/(t.points.length-2),o=1-t.gradualOpacity);for(let e=0;e<t.points.length-1;e++){const r=t.gradualOpacity?o+e*s:void 0,n=t.points[e],l=t.points[e+1];if(this._mapPaths.push(i.circleMarker(n.point,{radius:f.C?8:3,color:t.color||a,opacity:r,fillOpacity:r,interactive:!0}).bindTooltip(this._computePathTooltip(t,n),{direction:"top"})),Math.abs(n.point[1]-l.point[1])<=180)this._mapPaths.push(i.polyline([n.point,l.point],{color:t.color||a,opacity:r,interactive:!1}));else{const e=(l.point[1]-n.point[1]+540)%360-180;let s;s=0===e?(n.point[0]+l.point[0])/2:n.point[0]+(l.point[0]-n.point[0])*(n.point[1]>0?180-n.point[1]:-180-n.point[1])/e;const o=[s,n.point[1]>0?180:-180],h=[s,l.point[1]>0?180:-180];this._mapPaths.push(i.polyline([n.point,o],{color:t.color||a,opacity:r,interactive:!1})),this._mapPaths.push(i.polyline([h,l.point],{color:t.color||a,opacity:r,interactive:!1}))}}const r=t.points.length-1;if(r>=0){const e=t.gradualOpacity?o+r*s:void 0;this._mapPaths.push(i.circleMarker(t.points[r].point,{radius:f.C?8:3,color:t.color||a,opacity:e,fillOpacity:e,interactive:!0}).bindTooltip(this._computePathTooltip(t,t.points[r]),{direction:"top"}))}this._mapPaths.forEach(t=>e.addLayer(t))})}_drawEntities(){const t=this.hass,e=this.leafletMap,i=this.Leaflet;if(!t||!e||!i)return;if(this._mapItems.length&&(this._mapItems.forEach(t=>t.remove()),this._mapItems=[],this._mapFocusItems=[]),this._mapZones.length&&(this._mapZones.forEach(t=>t.remove()),this._mapZones=[],this._mapFocusZones=[]),this._mapCluster&&(this._mapCluster.remove(),this._mapCluster=void 0),!this.entities)return;const a=getComputedStyle(this),s=a.getPropertyValue("--accent-color"),o=a.getPropertyValue("--secondary-text-color"),r=a.getPropertyValue("--dark-primary-color"),n=this._darkMode?"dark":"light";for(const l of this.entities){const e=t.states[z(l)];if(!e)continue;const h="string"!=typeof l?l.name:void 0,c=null!=h?h:(0,m.u)(e),{latitude:d,longitude:p,passive:y,icon:f,radius:v,entity_picture:_,gps_accuracy:b}=e.attributes;if(!d||!p)continue;if("zone"===(0,u.t)(e)){if(y&&!this.renderPassive)continue;let t;if(f){const e=document.createElement("ha-icon");e.setAttribute("icon",f),t=e.outerHTML}else{const e=document.createElement("span");e.textContent=c,t=e.outerHTML}const e=i.circle([d,p],{interactive:!1,color:y?o:s,radius:v}),r=this._getMarkerSize(a)/2,h=new g.q([d,p],e,{icon:i.divIcon({html:t,iconSize:[r,r],className:n}),interactive:this.interactiveZones,title:c});this._mapZones.push(h),!this.fitZones||"string"!=typeof l&&!1===l.focus||this._mapFocusZones.push(e);continue}const k="string"!=typeof l&&"state"===l.label_mode?this.hass.formatEntityState(e):"string"!=typeof l&&"attribute"===l.label_mode&&void 0!==l.attribute?this.hass.formatEntityAttributeValue(e,l.attribute):null!=h?h:c.split(" ").map(t=>t[0]).join("").substr(0,3),M=document.createElement("ha-entity-marker");M.hass=this.hass,M.showIcon="string"!=typeof l&&"icon"===l.label_mode,M.entityId=z(l),M.entityName=k,M.entityUnit="string"!=typeof l&&l.unit&&"attribute"===l.label_mode?l.unit:"",M.entityPicture=!_||"string"!=typeof l&&l.label_mode?"":this.hass.hassUrl(_),"string"!=typeof l&&(M.entityColor=l.color);const C=this._getMarkerSize(a),P=new g.q([d,p],void 0,{icon:i.divIcon({html:M,iconSize:[C,C],className:""}),title:c});"string"!=typeof l&&!1===l.focus||this._mapFocusItems.push(P),b&&(P.decorationLayer=i.circle([d,p],{interactive:!1,color:r,radius:b})),this._mapItems.push(P)}this.clusterMarkers?(this._mapCluster=i.markerClusterGroup({showCoverageOnHover:!1,removeOutsideVisibleBounds:!1,maxClusterRadius:40}),this._mapCluster.addLayers(this._mapItems),e.addLayer(this._mapCluster)):this._mapItems.forEach(t=>e.addLayer(t)),this._mapZones.forEach(t=>e.addLayer(t))}_getMarkerSize(t){const e=t.getPropertyValue("--ha-marker-size"),i=parseFloat(e);return Number.isNaN(i)?48:i}async _attachObserver(){this._resizeObserver||(this._resizeObserver=new ResizeObserver(()=>{var t;null===(t=this.leafletMap)||void 0===t||t.invalidateSize({debounceMoveend:!0})})),this._resizeObserver.observe(this)}constructor(...t){super(...t),this.clickable=!1,this.autoFit=!1,this.renderPassive=!1,this.interactiveZones=!1,this.fitZones=!1,this.themeMode="auto",this.zoom=14,this.clusterMarkers=!0,this._loaded=!1,this._mapItems=[],this._mapFocusItems=[],this._mapZones=[],this._mapFocusZones=[],this._mapPaths=[],this._clickCount=0,this._isProgrammaticFit=!1,this._pauseAutoFit=!1,this._handleVisibilityChange=async()=>{document.hidden||setTimeout(()=>{this._pauseAutoFit=!1},500)},this._loading=!1}}w.styles=(0,n.AH)(k||(k=M`:host{display:block;height:300px}#map{height:100%}#map.clickable{cursor:pointer}#map.dark{background:#090909}#map.forced-dark{color:#fff;--map-filter:invert(0.9) hue-rotate(170deg) brightness(1.5) contrast(1.2) saturate(0.3)}#map.forced-light{background:#fff;color:#000;--map-filter:invert(0)}#map.clickable:active,#map:active{cursor:grabbing;cursor:-moz-grabbing;cursor:-webkit-grabbing}.leaflet-tile-pane{filter:var(--map-filter)}.dark .leaflet-bar a{background-color:#1c1c1c;color:#fff}.dark .leaflet-bar a:hover{background-color:#313131}.leaflet-marker-draggable{cursor:move!important}.leaflet-edit-resize{border-radius:var(--ha-border-radius-circle);cursor:nesw-resize!important}.named-icon{display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center;color:var(--primary-text-color)}.leaflet-pane{z-index:0!important}.leaflet-bottom,.leaflet-control,.leaflet-top{z-index:1!important}.leaflet-tooltip{padding:8px;font-size:var(--ha-font-size-s);background:rgba(80,80,80,.9)!important;color:#fff!important;border-radius:var(--ha-border-radius-sm);box-shadow:none!important;text-align:center}ha-icon{--mdc-icon-size:calc(var(--ha-marker-size, 48px) / 2)}.marker-cluster div{background-clip:padding-box;background-color:var(--primary-color);border:3px solid rgba(var(--rgb-primary-color),.2);width:calc(var(--ha-marker-size,48px) * .667);height:calc(var(--ha-marker-size,48px) * .667);border-radius:50%;text-align:center;align-content:center;color:var(--text-primary-color);font-size:var(--ha-font-size-m)}.marker-cluster span{line-height:var(--ha-line-height-expanded)}`)),(0,o.Cg)([(0,l.MZ)({attribute:!1})],w.prototype,"hass",void 0),(0,o.Cg)([(0,l.MZ)({attribute:!1})],w.prototype,"entities",void 0),(0,o.Cg)([(0,l.MZ)({attribute:!1})],w.prototype,"paths",void 0),(0,o.Cg)([(0,l.MZ)({attribute:!1})],w.prototype,"layers",void 0),(0,o.Cg)([(0,l.MZ)({type:Boolean})],w.prototype,"clickable",void 0),(0,o.Cg)([(0,l.MZ)({attribute:"auto-fit",type:Boolean})],w.prototype,"autoFit",void 0),(0,o.Cg)([(0,l.MZ)({attribute:"render-passive",type:Boolean})],w.prototype,"renderPassive",void 0),(0,o.Cg)([(0,l.MZ)({attribute:"interactive-zones",type:Boolean})],w.prototype,"interactiveZones",void 0),(0,o.Cg)([(0,l.MZ)({attribute:"fit-zones",type:Boolean})],w.prototype,"fitZones",void 0),(0,o.Cg)([(0,l.MZ)({attribute:"theme-mode",type:String})],w.prototype,"themeMode",void 0),(0,o.Cg)([(0,l.MZ)({type:Number})],w.prototype,"zoom",void 0),(0,o.Cg)([(0,l.MZ)({attribute:"cluster-markers",type:Boolean})],w.prototype,"clusterMarkers",void 0),(0,o.Cg)([(0,l.wk)()],w.prototype,"_loaded",void 0),(0,o.Cg)([(0,l.P)("#map")],w.prototype,"_mapElement",void 0),w=(0,o.Cg)([(0,l.EM)("ha-map")],w),a()}catch(k){a(k)}})}}]);