diff --git a/honeycomb-menu.js b/honeycomb-menu.js index 24955b1..fc22b82 100644 --- a/honeycomb-menu.js +++ b/honeycomb-menu.js @@ -116,7 +116,7 @@ const st=n(25);function at(t,e,n={},o={}){const r=new Event(e,Object.assign({bub #joystick:active, :host([active]) #joystick { box-shadow: 0px 0px 2px 5px #fbfbfb; background: #c5c5c5; - }`}render(){return H`
`}get joystick(){return this.shadowRoot.querySelector("#joystick")}firstUpdated(){this.config.x||(this.clampX=0),this.config.y||(this.clampY=0),this._setInitCssPositions(),this._bindListeners(),this._reset()}_setInitCssPositions(){const t=this.joystick;t.style.width=this.size+"px",t.style.height=this.size+"px",t.style.left=`calc( 50% - (${this.size}px / 2) )`,t.style.top=`calc( 50% - (${this.size}px / 2) )`}_bindListeners(){this.addEventListener("touchstart",this._handleOnDragStart,!1),this.addEventListener("touchmove",this._handleOnDrag,!1),document.addEventListener("touchend",this._handleOnDragEnd.bind(this),!1),this.addEventListener("mousedown",this._handleOnDragStart,!1),this.addEventListener("mousemove",this._handleOnDrag,!1),document.addEventListener("mouseup",this._handleOnDragEnd.bind(this),!1)}_reset(){this.active=!1,this.style.zIndex=0,this.joystick.style.transform="translate3d(0, 0, 0)",this._current={x:0,y:0},this._interval&&(clearInterval(this._interval),this._interval=null)}_handleOnDragStart(t){this.active=!0,this.style.zIndex=100,this.dispatchEvent(this.__constructEvent("drag-start")),this.config.repeat&&(this._interval=setInterval(t=>{this.dispatchEvent(this.__constructEvent("drag-interval"))},this.config.repeat))}_setPosition(t,e){t=t-this.joystick.offsetLeft-this.size/2,e=e-this.joystick.offsetTop-this.size/2,this._current.x=xt(t,-this.clampX,this.clampX),this._current.y=xt(e,-this.clampY,this.clampY),this.joystick.style.transform=`translate3d(${this._current.x}px, ${this._current.y}px, 0)`,this.dispatchEvent(this.__constructEvent("drag"))}_handleOnDrag(t){if(this.active){if(t.cancelBubble=!0,"touchmove"===t.type){var e=t.target.getBoundingClientRect();t.offsetX=t.targetTouches[0].pageX-e.left,t.offsetY=t.targetTouches[0].pageY-e.top}this._setPosition(t.offsetX,t.offsetY)}}_handleOnDragEnd(t){this.dispatchEvent(this.__constructEvent("drag-end")),this._reset()}__constructEvent(t){return new CustomEvent(t,this.__constructEventData())}__constructEventData(){let t=this.config.x&&this.config.x.invert?-this._current.x:this._current.x,e=this.config.y&&this.config.y.invert?-this._current.y:this._current.y;return{detail:{x:t,y:e,x_percentage:t/this.clampX*100,y_percentage:e/this.clampY*100}}}}customElements.define($t.is,$t);const wt=document.querySelector("home-assistant").hass,jt=n(42),At=n(128),St=n(159),Et=n(63),Ot=n(166),Pt=n(62),Ct=n(25),kt=n(178),zt=new function(){this.honeycomb=null,this.position={x:0,y:0},this.handleXYPosition=function(t){this.position.x="touchstart"===t.type?t.touches[0].clientX:t.clientX,this.position.y="touchstart"===t.type?t.touches[0].clientY:t.clientY}.bind(this)};window.honeycomb_menu=t=>{var e=function t(e,n){if(!n){n=new Array(6);for(let t=0;t<6;t++)n[t]=new Array}function o(t){return t.buttons&&t.buttons.forEach((t,e)=>{t.position?n[t.position].unshift(t):n[e].unshift(t)}),{buttons:n}}e=jt({},e);const r=ft();if(!e.template||!r||!r[e.template])return Object.assign({},e,o(e));let i=t(r[e.template],n);return delete e.template,Object.assign({},i,e,o(e))}(t);e.entity_id&&!e.entity&&(e.entity=e.entity_id),function(t){zt.honeycomb&&zt.honeycomb.close();zt.honeycomb=document.createElement("honeycomb-menu"),zt.honeycomb.setConfig(t),zt.honeycomb.display(function(){let t=document.querySelector("home-assistant");return t=t&&t.shadowRoot,t=t&&t.querySelector("home-assistant-main"),t=t&&t.shadowRoot,t=t&&t.querySelector("app-drawer-layout partial-panel-resolver")||t.querySelector("ha-drawer partial-panel-resolver"),t=t&&t.shadowRoot||t,t=t&&t.querySelector("ha-panel-lovelace"),t=t&&t.shadowRoot,t=t&&t.querySelector("hui-root"),t=t&&t.shadowRoot,t=t&&t.querySelector("ha-app-layout")||t,t=t&&t.querySelector("#view"),t=t&&t.firstElementChild,t}(),zt.position.x,zt.position.y),zt.honeycomb.addEventListener("closing",t=>{zt.honeycomb=null})}(e)},document.addEventListener("touchstart",zt.handleXYPosition,!1),document.addEventListener("mousedown",zt.handleXYPosition,!1),document.body.addEventListener("ll-custom",t=>{t.detail.honeycomb_menu&&window.honeycomb_menu(t.detail.honeycomb_menu)}),wt._callService=wt.callService,wt.callService=function(t,e,n,o){if("honeycomb"!=t)return wt._callService(t,e,n,o);window.honeycomb_menu(n)};class Ut extends rt{static get is(){return"honeycomb-menu"}static get properties(){return{hass:{type:Object},config:{type:Object},sizes:{type:Object,readonly:!0},variables:{type:Object},closing:{type:Boolean,attribute:!0,reflect:!0},view:{},buttons:{type:Array},_service:{type:Object}}}constructor(){super(),this.closing=!1,this.buttons=[],this._service={x:!1,y:!1}}static get styles(){return c` + }`}render(){return H``}get joystick(){return this.shadowRoot.querySelector("#joystick")}firstUpdated(){this.config.x||(this.clampX=0),this.config.y||(this.clampY=0),this._setInitCssPositions(),this._bindListeners(),this._reset()}_setInitCssPositions(){const t=this.joystick;t.style.width=this.size+"px",t.style.height=this.size+"px",t.style.left=`calc( 50% - (${this.size}px / 2) )`,t.style.top=`calc( 50% - (${this.size}px / 2) )`}_bindListeners(){this.addEventListener("touchstart",this._handleOnDragStart,!1),this.addEventListener("touchmove",this._handleOnDrag,!1),document.addEventListener("touchend",this._handleOnDragEnd.bind(this),!1),this.addEventListener("mousedown",this._handleOnDragStart,!1),this.addEventListener("mousemove",this._handleOnDrag,!1),document.addEventListener("mouseup",this._handleOnDragEnd.bind(this),!1)}_reset(){this.active=!1,this.style.zIndex=0,this.joystick.style.transform="translate3d(0, 0, 0)",this._current={x:0,y:0},this._interval&&(clearInterval(this._interval),this._interval=null)}_handleOnDragStart(t){this.active=!0,this.style.zIndex=100,this.dispatchEvent(this.__constructEvent("drag-start")),this.config.repeat&&(this._interval=setInterval(t=>{this.dispatchEvent(this.__constructEvent("drag-interval"))},this.config.repeat))}_setPosition(t,e){t=t-this.joystick.offsetLeft-this.size/2,e=e-this.joystick.offsetTop-this.size/2,this._current.x=xt(t,-this.clampX,this.clampX),this._current.y=xt(e,-this.clampY,this.clampY),this.joystick.style.transform=`translate3d(${this._current.x}px, ${this._current.y}px, 0)`,this.dispatchEvent(this.__constructEvent("drag"))}_handleOnDrag(t){if(this.active){if(t.cancelBubble=!0,"touchmove"===t.type){var e=t.target.getBoundingClientRect();t.offsetX=t.targetTouches[0].pageX-e.left,t.offsetY=t.targetTouches[0].pageY-e.top}this._setPosition(t.offsetX,t.offsetY)}}_handleOnDragEnd(t){this.dispatchEvent(this.__constructEvent("drag-end")),this._reset()}__constructEvent(t){return new CustomEvent(t,this.__constructEventData())}__constructEventData(){let t=this.config.x&&this.config.x.invert?-this._current.x:this._current.x,e=this.config.y&&this.config.y.invert?-this._current.y:this._current.y;return{detail:{x:t,y:e,x_percentage:t/this.clampX*100,y_percentage:e/this.clampY*100}}}}customElements.define($t.is,$t);const wt=document.querySelector("home-assistant").hass,jt=n(42),At=n(128),St=n(159),Et=n(63),Ot=n(166),Pt=n(62),Ct=n(25),kt=n(178),zt=new function(){this.honeycomb=null,this.position={x:0,y:0},this.handleXYPosition=function(t){this.position.x="touchstart"===t.type?t.touches[0].clientX:t.clientX,this.position.y="touchstart"===t.type?t.touches[0].clientY:t.clientY}.bind(this)};window.honeycomb_menu=t=>{var e=function t(e,n){if(!n){n=new Array(6);for(let t=0;t<6;t++)n[t]=new Array}function o(t){return t.buttons&&t.buttons.forEach((t,e)=>{t.position?n[t.position].unshift(t):n[e].unshift(t)}),{buttons:n}}e=jt({},e);const r=ft();if(!e.template||!r||!r[e.template])return Object.assign({},e,o(e));let i=t(r[e.template],n);return delete e.template,Object.assign({},i,e,o(e))}(t);e.entity_id&&!e.entity&&(e.entity=e.entity_id),function(t){zt.honeycomb&&zt.honeycomb.close();zt.honeycomb=document.createElement("honeycomb-menu"),zt.honeycomb.setConfig(t),zt.honeycomb.display(function(){let t=document.querySelector("home-assistant");return t=t&&t.shadowRoot,t=t&&t.querySelector("home-assistant-main"),t=t&&t.shadowRoot,t=t&&t.querySelector("app-drawer-layout partial-panel-resolver")||t.querySelector("ha-drawer partial-panel-resolver"),t=t&&t.shadowRoot||t,t=t&&t.querySelector("ha-panel-lovelace"),t=t&&t.shadowRoot,t=t&&t.querySelector("hui-root"),t=t&&t.shadowRoot,t=t&&t.querySelector("ha-app-layout")||t,t=t&&t.querySelector("#view"),t=t&&t.querySelector("hui-view"),t}(),zt.position.x,zt.position.y),zt.honeycomb.addEventListener("closing",t=>{zt.honeycomb=null})}(e)},document.addEventListener("touchstart",zt.handleXYPosition,!1),document.addEventListener("mousedown",zt.handleXYPosition,!1),document.body.addEventListener("ll-custom",t=>{t.detail.honeycomb_menu&&window.honeycomb_menu(t.detail.honeycomb_menu)}),wt._callService=wt.callService,wt.callService=function(t,e,n,o){if("honeycomb"!=t)return wt._callService(t,e,n,o);window.honeycomb_menu(n)};class Ut extends rt{static get is(){return"honeycomb-menu"}static get properties(){return{hass:{type:Object},config:{type:Object},sizes:{type:Object,readonly:!0},variables:{type:Object},closing:{type:Boolean,attribute:!0,reflect:!0},view:{},buttons:{type:Array},_service:{type:Object}}}constructor(){super(),this.closing=!1,this.buttons=[],this._service={x:!1,y:!1}}static get styles(){return c` @keyframes fadeIn { from {opacity: 0; } to { opacity: 1; } } @keyframes fadeOut { from { opacity: 1; } to { opacity: 0; } } @keyframes zoomIn { diff --git a/src/helpers.js b/src/helpers.js index 0b41bf5..67efb69 100644 --- a/src/helpers.js +++ b/src/helpers.js @@ -99,7 +99,7 @@ export function lovelace_view() root = root && root.shadowRoot; root = root && root.querySelector("ha-app-layout") || root; root = root && root.querySelector("#view"); - root = root && root.firstElementChild; + root = root && root.querySelector("hui-view"); return root; } @@ -111,9 +111,9 @@ export function lovelace_config() root = root && root.shadowRoot; root = root && root.querySelector("app-drawer-layout partial-panel-resolver") || root.querySelector("ha-drawer partial-panel-resolver"); root = root && root.shadowRoot || root; - root = root && root.querySelector("ha-panel-lovelace") + root = root && root.querySelector("ha-panel-lovelace"); root = root && root.shadowRoot; - root = root && root.querySelector("hui-root") + root = root && root.querySelector("hui-root"); if (root) { return root.lovelace.config || null; }