mcserverweb/index.html at main · takashivin/mcserverweb · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
<!doctype html>
<html lang="id">
<head>
  <meta charset="utf-8" />
  <meta name="viewport" content="width=device-width,initial-scale=1" />
  <title>Bedrock Server Control</title>
  <link rel="stylesheet" href="./style.css" />
</head>
<body>
  <div class="bg bg-a"></div>
  <div class="bg bg-b"></div>
  <main class="app">
    <section class="hero">
      <div>
        <p class="badge">Minecraft Bedrock Web Control</p>
        <h1>Kontrol Server</h1>
        <p class="muted">Panel GitHub Pages + backend Python di Ubuntu. Tanpa Cloudflare, tanpa Node.js, tanpa WebSocket.</p>
      </div>
      <div class="server-address">
        <span>Public Minecraft Address</span>
        <strong>relations-webmaster.gl.at.ply.gg</strong>
        <small>Port 51633</small>
      </div>
    </section>
    <section class="card">
      <h2>Koneksi Backend</h2>
      <p class="muted">Masukkan URL backend HTTPS dari Tailscale Funnel / domain kamu.</p>
      <label>Backend URL</label>
      <input id="backendUrl" autocomplete="off" placeholder="https://ubuntu.tail0f169a.ts.net" />
      <label>Token Rahasia</label>
      <input id="token" type="password" autocomplete="off" placeholder="token backend" />
      <button id="connectBtn" class="btn primary">Connect</button>
      <p id="connectMsg" class="message"></p>
    </section>
    <section class="stats">
      <div class="stat"><span>Status</span><strong id="serverStatus">-</strong><small id="serverSub">Belum connect</small></div>
      <div class="stat"><span>RAM</span><strong id="ramText">-</strong><small>Penggunaan memori</small></div>
      <div class="stat"><span>CPU</span><strong id="cpuText">-</strong><small>Load & core</small></div>
      <div class="stat"><span>Storage</span><strong id="storageText">-</strong><small>Penyimpanan utama</small></div>
    </section>
    <section class="card">
      <h2>Control</h2>
      <div class="controls">
        <button id="startBtn" class="btn start">▶ Start Server</button>
        <button id="stopBtn" class="btn stop">⏻ Stop Server</button>
        <button id="restartBtn" class="btn restart">⟳ Restart</button>
        <button id="listBtn" class="btn list">☷ List Player</button>
      </div>
    </section>
    <section class="card terminal-card">
      <div class="terminal-head">
        <div><h2>Live Terminal</h2><p class="muted">Cuma output server Minecraft. Bukan fastfetch, bukan prompt shell.</p></div>
        <div class="terminal-actions"><button id="copyBtn" class="small">Copy</button><button id="clearBtn" class="small">Clear View</button></div>
      </div>
      <pre id="terminal">Belum connect ke backend...</pre>
    </section>
  </main>
  <div id="toastWrap" class="toast-wrap"></div>
  <script src="./script.js"></script>
</body>
</html>