import{I as d,_ as n,m as h,u as i,a as m,n as p}from"./index-009d300e.js";const f={name:"Mesh",mixins:[d],props:{socket:Object},components:{ZwaveGraph:()=>n(()=>import("./ZwaveGraph-2ffe099b.js"),["./ZwaveGraph-2ffe099b.js","./index-009d300e.js","./index-fe507b7b.css","./ZwaveGraph-fe07d4ee.css"],import.meta.url),NodePanel:()=>n(()=>import("./NodePanel-fa5172ba.js"),["./NodePanel-fa5172ba.js","./index-009d300e.js","./index-fe507b7b.css","./vuedraggable.umd-b2447fd7.js","./NodePanel-c9b9749c.css"],import.meta.url)},computed:{...h(i,["nodes"])},documentListeners:{},data(){return{selectedNode:null,showProperties:!1}},methods:{...m(i,["showSnackbar","setNeighbors"]),makeDivDraggable(){const t=document.getElementById("properties");if(!t||t.hasAttribute("data-draggable"))return;t.setAttribute("data-draggable",!0);let e=0,o=0;t.onmousedown=r;function r(s){s=s||window.event,!s.target.classList.contains("handle")&&(s.preventDefault(),!s.target.classList.contains("u-over")&&(e=s.clientX,o=s.clientY,document.onmouseup=c,document.onmousemove=a))}function a(s){s=s||window.event,s.preventDefault();const l=e-s.clientX,u=o-s.clientY;e=s.clientX,o=s.clientY,t.style.top=t.offsetTop-u+"px",t.style.left=t.offsetLeft-l+"px"}function c(){document.onmouseup=null,document.onmousemove=null}},async nodeClick(t){this.selectedNode=this.selectedNode===t?null:t,this.showProperties=!!this.selectedNode,this.$vuetify.breakpoint.mdAndUp&&this.showProperties&&(await this.$nextTick(),this.makeDivDraggable())},debounceRefresh(){this.refreshTimeout&&clearTimeout(this.refreshTimeout),this.refreshTimeout=setTimeout(this.refresh.bind(this),500)},async refresh(){const t=await this.app.apiRequest("refreshNeighbors",[],{infoSnack:!1,errorSnack:!1});t.success&&(this.showSnackbar("Nodes Neighbors updated","success"),this.setNeighbors(t.result))}},mounted(){this.debounceRefresh()},beforeDestroy(){this.refreshTimeout&&clearTimeout(this.refreshTimeout)}};var _=function(){var e=this,o=e._self._c;return o("v-container",{staticClass:"fill",attrs:{fluid:""}},[o("zwave-graph",{ref:"mesh",attrs:{id:"mesh",nodes:e.nodes},on:{"node-click":e.nodeClick}}),e.$vuetify.breakpoint.mdAndUp?o("node-panel",{staticClass:"details",attrs:{node:e.selectedNode,socket:e.socket,id:"properties",draggable:""},model:{value:e.showProperties,callback:function(r){e.showProperties=r},expression:"showProperties"}}):o("v-bottom-sheet",{attrs:{scrollable:""},model:{value:e.showProperties,callback:function(r){e.showProperties=r},expression:"showProperties"}},[o("v-card",{staticClass:"text-center",attrs:{scrollable:""}},[o("v-card-text",[o("node-panel",{attrs:{node:e.selectedNode,socket:e.socket},model:{value:e.showProperties,callback:function(r){e.showProperties=r},expression:"showProperties"}})],1)],1)],1)],1)},v=[],b=p(f,_,v,!1,null,"90afc01c",null,null);const g=b.exports;export{g as default};
