za / views.js
Aqso's picture
Update views.js
53ed886 verified
module.exports = {
// 1. TAMPILAN PUBLIK (TANPA AKSES PANEL)
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>`,
// 2. PANEL ADMIN (AKSES TERPISAH/RAHASIA)
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>`
};