| module.exports = { |
| |
| layout: (content, query = '', page = 1, totalPages = 1) => ` |
| <html><head> |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> |
| <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css"> |
| <style> |
| @import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;600;800&display=swap'); |
| :root { --primary: #3b82f6; --bg: #030303; --card: #0d0d0d; --text: #f1f5f9; } |
| body { background: var(--bg); color: var(--text); font-family: 'Plus Jakarta Sans', sans-serif; margin: 0; padding-bottom: 80px; } |
| header { background: rgba(3,3,3,0.8); backdrop-filter: blur(20px); padding: 18px 25px; border-bottom: 1px solid #1a1a1a; display: flex; justify-content: space-between; align-items: center; position: sticky; top: 0; z-index: 1000; } |
| .logo { font-weight: 800; font-size: 20px; color: #fff; text-decoration: none; } |
| .logo span { color: var(--primary); } |
| .main { padding: 20px; max-width: 1200px; margin: 0 auto; } |
| .grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 15px; } |
| @media (min-width: 768px) { .grid { grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 25px; } } |
| .card { background: var(--card); border-radius: 18px; overflow: hidden; border: 1px solid #1a1a1a; cursor: pointer; transition: 0.4s; position: relative; } |
| .card:hover { transform: translateY(-10px); border-color: var(--primary); } |
| .card img { width: 100%; height: 280px; object-fit: cover; } |
| .card-title { padding: 12px; font-size: 11px; font-weight: 700; text-align: center; } |
| |
| /* Pagination Elit */ |
| .pagination { display: flex; justify-content: center; gap: 8px; margin: 40px 0; } |
| .p-btn { background: #111; border: 1px solid #222; color: #555; padding: 10px 18px; border-radius: 12px; text-decoration: none; font-size: 12px; font-weight: 800; } |
| .p-btn.active { background: var(--primary); color: #fff; border-color: var(--primary); } |
| |
| .bottom-nav { position: fixed; bottom: 0; left: 0; width: 100%; background: #080808; border-top: 1px solid #1a1a1a; display: flex; justify-content: space-around; padding: 15px 0; z-index: 9999; } |
| .nav-item { color: #475569; text-decoration: none; display: flex; flex-direction: column; align-items: center; gap: 5px; font-size: 10px; font-weight: 800; } |
| .nav-item.active { color: var(--primary); } |
| </style> |
| </head><body> |
| <header> |
| <a href="/" class="logo">AQSO <span>OMEGA</span></a> |
| <form action="/" style="margin:0;"><input type="text" name="q" value="${query}" placeholder="Cari donghua..." style="background:#111; border:1px solid #222; color:#fff; padding:8px 15px; border-radius:20px; font-size:11px; outline:none;"></form> |
| </header> |
| <div class="main">${content}</div> |
| <div class="bottom-nav"> |
| <a href="/" class="nav-item active"><i class="fas fa-play-circle"></i>STREAM</a> |
| <a href="/?page=1" class="nav-item"><i class="fas fa-th-large"></i>INDEX</a> |
| </div> |
| </body></html>`, |
|
|
| |
| adminLayout: (stats, logs) => ` |
| <html><head> |
| <style> |
| body { background: #000; color: #fff; font-family: monospace; padding: 25px; } |
| .card { background: #0a0a0a; border: 1px solid #111; padding: 25px; border-radius: 15px; margin-bottom: 25px; } |
| input { width: 100%; padding: 15px; background: #000; border: 1px solid #222; color: #10b981; border-radius: 10px; margin-bottom: 15px; } |
| button { background: #3b82f6; color: #fff; border: none; padding: 15px; border-radius: 10px; cursor: pointer; width: 100%; font-weight: 800; } |
| .log-box { background: #050505; border: 1px solid #111; padding: 15px; border-radius: 10px; font-family: monospace; font-size: 11px; height: 350px; overflow-y: auto; color: #10b981; } |
| </style> |
| <script> |
| function startSync() { |
| const url = document.getElementById('url').value; |
| fetch('/api/scrape?url=' + encodeURIComponent(url)); |
| alert('DEEP SCRAPE MULAI! Pantau terminal.'); |
| setInterval(async () => { |
| const r = await fetch('/api/live-status'); |
| const d = await r.json(); |
| const l = document.createElement('div'); |
| l.innerHTML = '<b>[' + new Date().toLocaleTimeString() + ']</b> ' + d.lastAction; |
| document.getElementById('live').appendChild(l); |
| document.getElementById('live').scrollTop = document.getElementById('live').scrollHeight; |
| }, 3000); |
| } |
| </script> |
| </head><body> |
| <h2>COMMAND CENTER v55.0 [RAHASIA]</h2> |
| <div class="card"> |
| <p>DATABASE: ${stats.total} TITLES</p> |
| <input type="text" id="url" value="https://anichin.cafe" placeholder="Link Anichin"> |
| <button onclick="startSync()">EXECUTE ATOMIC SYNC</button> |
| </div> |
| <div class="log-box" id="live">> STANDBY...</div> |
| </body></html>` |
| }; |
|
|