script.js

const $=id=>document.getElementById(id);let backendUrl="",token="",poller=null;function normalizeUrl(url){return String(url||"").trim().replace(/\/+$/,"")}function toast(text,type="info"){const wrap=$("toastWrap"),el=document.createElement("div");el.className=`toast ${type}`;el.textContent=text;wrap.appendChild(el);setTimeout(()=>{el.classList.add("leave");setTimeout(()=>el.remove(),220)},3000)}async function api(path,opts={}){if(!backendUrl||!token)throw new Error("Backend URL/token belum diisi");const res=await fetch(`${backendUrl}${path}`,{method:opts.method||"GET",headers:{Authorization:`Bearer ${token}`,"Content-Type":"application/json"},body:opts.body?JSON.stringify(opts.body):undefined});const text=await res.text();let data;try{data=text?JSON.parse(text):{}}catch{data={raw:text}}if(!res.ok)throw new Error(data.error||data.message||`HTTP ${res.status}`);return data}function setConnected(ok,msg=""){$("connectMsg").textContent=msg;$("serverSub").textContent=ok?"Backend tersambung":"Backend belum tersambung"}async function updateStatus(){const data=await api("/api/status");setConnected(true,"Backend tersambung.");$("serverStatus").textContent=data.running?"ONLINE":"OFFLINE";$("serverStatus").style.color=data.running?"#42e79b":"#ff5f7e";$("ramText").textContent=data.ram?`${data.ram.percent}%`:"-";$("cpuText").textContent=data.cpu?`${data.cpu.load}% / ${data.cpu.cores} core`:"-";$("storageText").textContent=data.storage?`${data.storage.percent}%`:"-"}async function updateLog(){try{const data=await api("/api/log");$("terminal").textContent=data.log||"Belum ada output server."}catch(err){$("terminal").textContent=`Gagal ambil log: ${err.message}`}}async function connect(){backendUrl=normalizeUrl($("backendUrl").value);token=$("token").value.trim();localStorage.setItem("mc_backend_url",backendUrl);localStorage.setItem("mc_token",token);$("terminal").textContent="Mencoba terhubung ke backend...";try{await updateStatus();await updateLog();if(poller)clearInterval(poller);poller=setInterval(async()=>{await updateStatus().catch(()=>{});await updateLog().catch(()=>{})},2500);toast("Backend tersambung","good")}catch(err){setConnected(false,err.message);toast(`Connect gagal: ${err.message}`,"bad")}}async function action(name,confirmText=""){if(confirmText&&!confirm(confirmText))return;try{const data=await api(`/api/${name}`,{method:"POST"});toast(data.message||`${name} berhasil`,"good");setTimeout(async()=>{await updateStatus().catch(()=>{});await updateLog().catch(()=>{})},900)}catch(err){toast(`${name} gagal: ${err.message}`,"bad")}}window.addEventListener("DOMContentLoaded",()=>{$("backendUrl").value=localStorage.getItem("mc_backend_url")||"";$("token").value=localStorage.getItem("mc_token")||"";$("connectBtn").addEventListener("click",connect);$("startBtn").addEventListener("click",()=>action("start"));$("stopBtn").addEventListener("click",()=>action("stop","Yakin stop server?"));$("restartBtn").addEventListener("click",()=>action("restart","Yakin restart server?"));$("listBtn").addEventListener("click",()=>action("list"));$("copyBtn").addEventListener("click",async()=>{await navigator.clipboard.writeText($("terminal").textContent);toast("Log dicopy","info")});$("clearBtn").addEventListener("click",()=>{$("terminal").textContent=""})});