8 lines
5.2 KiB
JavaScript
8 lines
5.2 KiB
JavaScript
(()=>{var i=class{constructor(){this.buttons=document.querySelectorAll(".menu .item"),this.screens=document.querySelectorAll(".screen div"),this.qrCodeContainer=document.querySelector(".qrcode"),this.qrCodeContainerLoader=document.querySelector(".qrloading"),this.imgElement=this.createElement("img",{display:"none"}),this.textElement=this.createElement("span",{display:"none"}),this.videoElement=this.createElement("video",{display:"none"}),this.qrCodeContainer.append(this.imgElement,this.textElement,this.videoElement),this.qrCodeContainer.style.display="none",this.connection={watch:0,loadTime:0},this.init(),this.handleFiles=this.handleFiles.bind(this),this.deleteModel=this.deleteModel.bind(this),this.submitJsonToServer=this.submitJsonToServer.bind(this);let e=document.getElementById("drop-zone");e.addEventListener("dragover",t=>{t.preventDefault(),t.stopPropagation(),e.classList.add("hover")}),e.addEventListener("dragleave",t=>{t.preventDefault(),t.stopPropagation(),e.classList.remove("hover")}),e.addEventListener("drop",t=>{t.preventDefault(),t.stopPropagation(),e.classList.remove("hover");let n=t.dataTransfer.files;this.handleFiles(n)})}createElement(e,t={}){let n=document.createElement(e);return Object.assign(n.style,t),n}async handleFiles(e){e=Array.from(e),console.log(e);for(let t of e)if(t.type==="application/json"){let n=new FileReader;n.onload=async s=>{try{let o=JSON.parse(s.target.result),a=t.name.split(".")[0].replace(/[^a-zA-Z0-9.]/g,"").replace(/\s+/g,"_").substr(0,16);await this.submitJsonToServer(o,a+".json"),this.fetchModels()}catch(o){console.error("Invalid JSON file:",o)}},n.readAsText(t)}else alert("Please drop a JSON file.")}formatDateToDDMMYYYY(e){let t=new Date(e),n=String(t.getDate()).padStart(2,"0"),s=String(t.getMonth()+1).padStart(2,"0"),o=t.getFullYear();return`${n}-${s}-${o}`}async fetchModels(){try{let e=await fetch("/models");if(!e.ok)throw new Error("Failed to fetch models");let t=await e.json(),n=document.querySelector("#models-table tbody");n.innerHTML="",t.forEach(s=>{let o=document.createElement("tr");o.innerHTML=`
|
|
<td>${s.name}</td>
|
|
<td>${this.formatDateToDDMMYYYY(s.dateCreated)}</td>
|
|
<td>
|
|
<button class="delete-btn" data-name="${s.name}">Delete</button>
|
|
</td>
|
|
`,n.appendChild(o)}),this.addDeleteEventListeners()}catch(e){console.error("Error fetching models:",e)}}addDeleteEventListeners(){document.querySelectorAll(".delete-btn").forEach(t=>{t.addEventListener("click",()=>{let n=t.getAttribute("data-name");this.deleteModel(n)})})}async deleteModel(e){try{if(!(await fetch(`/model/${e}`,{method:"DELETE"})).ok)throw new Error("Failed to delete model");this.fetchModels()}catch(t){console.error("Error deleting model:",t),alert("Failed to delete model")}}async submitJsonToServer(e,t){try{let n=await fetch("/model",{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({data:e,name:t})});if(!n.ok)throw new Error("Network response was not ok");let s=await n.json();console.log("Server response:",s)}catch(n){console.error("Error submitting JSON to server:",n)}}init(){this.buttons.forEach(e=>{e.addEventListener("click",()=>this.activateScreen(e.id))}),this.activateScreen("connection")}async updateQrCode(){try{let e=await fetch("/qr");if(e.ok){let t=await e.blob();this.imgElement.src=URL.createObjectURL(t),this.imgElement.style.display="block"}else throw new Error("QR code image not found")}catch{this.imgElement.style.display="none"}}async watchAction(e){if(e!=="connection")return;(await fetch("ready").then(n=>n.json())).ready?this.showVideo():(this.showQrCode(),this.connection.watch>0&&(this.connection.loadTime--,setTimeout(()=>this.watchAction(e),1e3)))}async showQrCode(){this.connection.loadTime<0&&(this.qrCodeContainerLoader.style.display="none",this.qrCodeContainer.style.display="flex",this.imgElement.style.display="block",this.textElement.textContent="Scan From WhatsApp",this.textElement.style.display="block",this.videoElement.style.display="none",this.updateQrCode())}async showVideo(){this.qrCodeContainerLoader.style.display="none",this.qrCodeContainer.style.display="flex",this.textElement.style.display="none",this.imgElement.style.display="none",this.textElement.textContent="WhatsApp is Connected!",this.textElement.style.display="block",this.videoElement.src="./linked.mp4",this.videoElement.autoplay=!0,this.videoElement.muted=!0,this.videoElement.style.display="block"}async screenFunctions(e){this.videoElement.src="",this.connection.watch=0,this.textElement.style.display="none",e==="connection"?await fetch("ping").then(n=>n.json())&&(this.connection.watch=1,this.connection.loadTime=10,this.watchAction(e)):e=="models"&&this.fetchModels()}activateScreen(e){this.buttons.forEach(t=>t.classList.remove("active")),this.screens.forEach(t=>{t.dataset.screen==1&&(t.classList.remove("active"),setTimeout(()=>{if(t.dataset.id!==e)t.style.display="none";else{document.getElementById(e).classList.add("active");let s=document.querySelector(`.screen div[data-id="${e}"]`);s.style.display="flex",setTimeout(()=>s.classList.add("active"),20)}},10))}),this.screenFunctions(e)}};document.addEventListener("DOMContentLoaded",()=>{new i});})();
|