TYPE-0 PERFECT SEIHA

Server Info:

User Info:

Server Software:

LiteSpeed

Edit File: /home/typp2877/public_html/ylnime.com/dramabox/index.php

<?php
// KONFIGURASI API
$api_base = "https://dramabox.sansekai.my.id/api/dramabox";

// FUNGSI HELPER UNTUK REQUEST KE API
function fetchAPI($endpoint, $params = []) {
    global $api_base;
    $url = $api_base . $endpoint;
    if (!empty($params)) {
        $url .= "?" . http_build_query($params);
    }
    
    $ch = curl_init();
    curl_setopt($ch, CURLOPT_URL, $url);
    curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1);
    curl_setopt($ch, CURLOPT_SSL_VERIFYPEER, false); // Abaikan SSL untuk development
    curl_setopt($ch, CURLOPT_USERAGENT, 'Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/91.0.4472.124 Safari/537.36');
    $output = curl_exec($ch);
    curl_close($ch);
    return json_decode($output, true);
}

// FORMAT ANGKA (e.g. 1.2M)
function formatNumber($num) {
    if ($num > 1000000) return round($num / 1000000, 1) . 'M';
    if ($num > 1000) return round($num / 1000, 1) . 'K';
    return $num;
}

// LOGIKA HALAMAN
$page = isset($_GET['page']) ? $_GET['page'] : 'home';
$query = isset($_GET['q']) ? $_GET['q'] : '';

?>
<!DOCTYPE html>
<html lang="id">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>DramaStream - Pink & Black</title>
    <link href="https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;600;700&display=swap" rel="stylesheet">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
    <style>
        :root {
            --bg-dark: #0a0a0a;
            --bg-card: #161616;
            --primary: #ff007f; /* Hot Pink */
            --primary-hover: #d6006b;
            --text-main: #ffffff;
            --text-muted: #a0a0a0;
            --gradient: linear-gradient(45deg, #ff007f, #7928ca);
        }

* { margin: 0; padding: 0; box-sizing: border-box; }
        body {
            background-color: var(--bg-dark);
            color: var(--text-main);
            font-family: 'Outfit', sans-serif;
            overflow-x: hidden;
        }

/* SCROLLBAR */
        ::-webkit-scrollbar { width: 8px; }
        ::-webkit-scrollbar-track { background: var(--bg-dark); }
        ::-webkit-scrollbar-thumb { background: #333; border-radius: 4px; }
        ::-webkit-scrollbar-thumb:hover { background: var(--primary); }

/* NAVBAR */
        .navbar {
            display: flex; justify-content: space-between; align-items: center;
            padding: 20px 5%; background: rgba(10,10,10,0.95);
            position: sticky; top: 0; z-index: 1000;
            border-bottom: 1px solid #222;
            backdrop-filter: blur(10px);
        }
        .logo { font-size: 24px; font-weight: 700; color: var(--primary); text-decoration: none; letter-spacing: 1px; }
        .logo span { color: #fff; }
        
        .search-box {
            background: #222; border-radius: 50px; padding: 8px 20px;
            display: flex; align-items: center; border: 1px solid transparent;
            transition: 0.3s;
        }
        .search-box:focus-within { border-color: var(--primary); box-shadow: 0 0 10px rgba(255,0,127,0.3); }
        .search-box input {
            background: transparent; border: none; color: #fff; outline: none;
            margin-left: 10px; width: 200px;
        }

/* HERO SECTION */
        .hero {
            height: 60vh; position: relative; display: flex; align-items: center;
            background-size: cover; background-position: center;
            mask-image: linear-gradient(to bottom, black 50%, transparent 100%);
            -webkit-mask-image: linear-gradient(to bottom, black 50%, transparent 100%);
        }
        .hero::before {
            content: ''; position: absolute; inset: 0;
            background: linear-gradient(90deg, #0a0a0a 0%, rgba(10,10,10,0.4) 100%);
        }
        .hero-content {
            position: relative; z-index: 2; padding-left: 5%; width: 50%;
        }
        .hero-title { font-size: 3rem; font-weight: 800; line-height: 1.1; margin-bottom: 15px; }
        .hero-desc { color: var(--text-muted); margin-bottom: 25px; line-height: 1.6; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
        
        .btn {
            padding: 12px 30px; border-radius: 50px; font-weight: 600; text-decoration: none;
            display: inline-flex; align-items: center; gap: 10px; transition: 0.3s; cursor: pointer; border: none; font-family: inherit;
        }
        .btn-primary { background: var(--primary); color: white; box-shadow: 0 5px 20px rgba(255,0,127,0.4); }
        .btn-primary:hover { background: var(--primary-hover); transform: translateY(-2px); }
        
        /* GRID SYSTEM */
        .container { padding: 40px 5%; }
        .section-title { font-size: 1.5rem; margin-bottom: 20px; border-left: 4px solid var(--primary); padding-left: 15px; }
        
        .grid {
            display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
            gap: 20px;
        }
        .card {
            background: var(--bg-card); border-radius: 12px; overflow: hidden;
            transition: 0.3s; position: relative; cursor: pointer;
            text-decoration: none; color: white; display: block;
        }
        .card:hover { transform: translateY(-5px); box-shadow: 0 10px 20px rgba(0,0,0,0.5); }
        .card img { width: 100%; aspect-ratio: 2/3; object-fit: cover; }
        .card-info { padding: 15px; }
        .card-title { font-size: 1rem; font-weight: 600; margin-bottom: 5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
        .card-meta { font-size: 0.8rem; color: var(--text-muted); display: flex; justify-content: space-between; }
        .badge {
            position: absolute; top: 10px; left: 10px; background: var(--primary);
            color: white; font-size: 0.7rem; padding: 4px 8px; border-radius: 4px;
            font-weight: 700;
        }

/* DETAIL PAGE */
        .detail-container { display: flex; flex-wrap: wrap; gap: 40px; margin-top: 20px; }
        .video-player-wrapper { flex: 2; min-width: 300px; }
        .playlist-wrapper { flex: 1; min-width: 300px; height: 500px; overflow-y: auto; background: var(--bg-card); border-radius: 12px; padding: 20px; }
        
        video { width: 100%; border-radius: 12px; box-shadow: 0 0 30px rgba(255,0,127,0.2); background: #000; }
        
        .episode-item {
            display: flex; align-items: center; padding: 12px; border-bottom: 1px solid #333;
            cursor: pointer; transition: 0.2s; text-decoration: none; color: #fff;
        }
        .episode-item:hover, .episode-item.active { background: rgba(255,0,127,0.1); border-left: 3px solid var(--primary); }
        .episode-item i { margin-right: 10px; color: var(--primary); }

.tags span {
            background: rgba(255,255,255,0.1); padding: 5px 12px; border-radius: 20px;
            font-size: 0.8rem; margin-right: 5px; display: inline-block; margin-bottom: 5px;
        }

/* RESPONSIVE */
        @media (max-width: 768px) {
            .hero { height: 50vh; }
            .hero-title { font-size: 2rem; }
            .hero-content { width: 100%; background: linear-gradient(0deg, #0a0a0a 0%, transparent 100%); padding: 20px; position: absolute; bottom: 0; }
            .detail-container { flex-direction: column; }
            .playlist-wrapper { height: auto; max-height: 400px; }
        }
    </style>
</head>
<body>

<nav class="navbar">
        <a href="index.php" class="logo">Drama<span>Box</span></a>
        <form action="index.php" method="GET" class="search-box">
            <input type="hidden" name="page" value="search">
            <i class="fas fa-search" style="color: #aaa;"></i>
            <input type="text" name="q" placeholder="Cari judul film..." value="<?= htmlspecialchars($query) ?>">
        </form>
    </nav>

<?php if ($page == 'home'): ?>
        <?php 
            // Fetch Data for Home
            $vipData = fetchAPI('/vip');
            $newestData = fetchAPI('/dubindo', ['classify' => 'terbaru']);
            $popularData = fetchAPI('/dubindo', ['classify' => 'terpopuler']);
            
            // Setup Hero Banner (Take first item from 'Pilihan Mingguan' or random)
            $heroItem = null;
            if (isset($vipData['columnVoList'][0]['bookList'][0])) {
                $heroItem = $vipData['columnVoList'][0]['bookList'][0];
            }
        ?>

<?php if ($heroItem): ?>
        <header class="hero" style="background-image: url('<?= $heroItem['coverWap'] ?>');">
            <div class="hero-content">
                <div class="tags" style="margin-bottom: 15px;">
                    <?php 
                        $tags = isset($heroItem['tags']) ? $heroItem['tags'] : [];
                        foreach(array_slice($tags, 0, 3) as $tag) { echo "<span>$tag</span>"; }
                    ?>
                </div>
                <h1 class="hero-title"><?= $heroItem['bookName'] ?></h1>
                <p class="hero-desc"><?= $heroItem['introduction'] ?></p>
                <a href="index.php?page=detail&bookId=<?= $heroItem['bookId'] ?>" class="btn btn-primary">
                    <i class="fas fa-play"></i> Tonton Sekarang
                </a>
            </div>
        </header>
        <?php endif; ?>

<div class="container">
            <h2 class="section-title">Pilihan Editor</h2>
            <div class="grid">
                <?php 
                if(isset($vipData['columnVoList'][0]['bookList'])) {
                    foreach($vipData['columnVoList'][0]['bookList'] as $item) {
                        include 'card_template.php'; 
                    }
                }
                ?>
            </div>
        </div>

<div class="container">
            <h2 class="section-title">Rilis Terbaru (Dub Indo)</h2>
            <div class="grid">
                <?php 
                if(is_array($newestData)) {
                    foreach($newestData as $item) {
                        include 'card_template.php';
                    }
                }
                ?>
            </div>
        </div>

<div class="container">
            <h2 class="section-title">Sedang Trending</h2>
            <div class="grid">
                <?php 
                if(is_array($popularData)) {
                    foreach($popularData as $item) {
                        include 'card_template.php';
                    }
                }
                ?>
            </div>
        </div>

<?php elseif ($page == 'search'): ?>
        <?php 
            $searchResults = fetchAPI('/search', ['query' => $query]);
        ?>
        <div class="container" style="min-height: 80vh;">
            <h2 class="section-title">Hasil Pencarian: "<?= htmlspecialchars($query) ?>"</h2>
            <div class="grid">
                <?php 
                if(is_array($searchResults) && !empty($searchResults)) {
                    foreach($searchResults as $item) {
                        include 'card_template.php';
                    }
                } else {
                    echo "<p style='color:#777;'>Tidak ada hasil ditemukan.</p>";
                }
                ?>
            </div>
        </div>

<?php elseif ($page == 'detail'): ?>
        <?php 
            $bookId = $_GET['bookId'];
            $detail = fetchAPI('/detail', ['bookId' => $bookId]);
            $episodes = fetchAPI('/allepisode', ['bookId' => $bookId]);
            $book = $detail['data']['book'] ?? null;
            
            // Get selected episode or default to first
            $currentEpIndex = isset($_GET['ep']) ? intval($_GET['ep']) : 0;
            $videoUrl = "";
            
            // Logic to extract video URL safely
            if (isset($episodes[$currentEpIndex]['cdnList'][0]['videoPathList'])) {
                // Try to get 720p or default
                foreach($episodes[$currentEpIndex]['cdnList'][0]['videoPathList'] as $vSrc) {
                     if($vSrc['isDefault'] == 1 || $vSrc['quality'] == 720) {
                         $videoUrl = $vSrc['videoPath'];
                         break;
                     }
                }
                if(empty($videoUrl)) $videoUrl = $episodes[$currentEpIndex]['cdnList'][0]['videoPathList'][0]['videoPath'];
            }
        ?>

<?php if($book): ?>
        <div class="container">
            <div class="detail-container">
                <div class="video-player-wrapper">
                    <?php if($videoUrl): ?>
                    <video controls autoplay poster="<?= $book['cover'] ?>">
                        <source src="<?= $videoUrl ?>" type="video/mp4">
                        Browser Anda tidak mendukung tag video.
                    </video>
                    <?php else: ?>
                    <div style="background:#222; height:400px; display:flex; align-items:center; justify-content:center; border-radius:12px;">
                        <p>Video tidak tersedia atau dikunci (VIP).</p>
                    </div>
                    <?php endif; ?>
                    
                    <h1 style="margin-top:20px; font-size:1.8rem;"><?= $book['bookName'] ?></h1>
                    <div style="margin: 10px 0; color:var(--text-muted);">
                        <i class="fas fa-eye"></i> <?= formatNumber($book['viewCount']) ?> Views &nbsp;|&nbsp; 
                        <i class="fas fa-heart"></i> <?= formatNumber($book['followCount']) ?> Followers
                    </div>
                    <div class="tags">
                        <?php foreach($book['tags'] as $tag) echo "<span>$tag</span>"; ?>
                    </div>
                    <p style="margin-top:15px; line-height:1.6; color:#ccc;">
                        <?= $book['introduction'] ?>
                    </p>
                </div>

<div class="playlist-wrapper">
                    <h3 style="margin-bottom:15px; color:var(--primary);">Daftar Episode</h3>
                    <?php 
                    if(is_array($episodes)) {
                        foreach($episodes as $idx => $ep) {
                            $activeClass = ($idx == $currentEpIndex) ? 'active' : '';
                            $isLocked = ($ep['isCharge'] == 1) ? '<i class="fas fa-lock" style="font-size:12px; margin-left:auto; color:#555;"></i>' : '';
                            
                            echo "<a href='index.php?page=detail&bookId=$bookId&ep=$idx' class='episode-item $activeClass'>";
                            echo "<i class='fas fa-play-circle'></i>";
                            echo "<div>Episode ". ($idx + 1) ."</div>";
                            echo $isLocked;
                            echo "</a>";
                        }
                    }
                    ?>
                </div>
            </div>
        </div>
        <?php else: ?>
            <div class="container"><p>Data film tidak ditemukan.</p></div>
        <?php endif; ?>

<?php endif; ?>

<footer style="text-align:center; padding: 40px; color:#555; margin-top:50px; border-top:1px solid #222;">
        <p>&copy; <?= date('Y') ?> DramaBox Clone - Elegant Pink & Black Theme</p>
    </footer>

</body>
</html>

<?php
// TEMPLATE KECIL UNTUK KARTU (Disimpan dalam file sama untuk kemudahan copy-paste, 
// teknik output buffering atau eval string bisa dipakai, tapi ini cara simpel inline)
// Note: Logic di bawah ini hanya berjalan jika di-include di dalam loop di atas.
// Agar satu file index.php jalan tanpa file eksternal 'card_template.php', 
// kita buat file dummy jika belum ada, atau tulis ulang loop-nya. 
// Untuk kemudahanmu, saya tulis ulang logic loop-nya di dalam kode utama, 
// tetapi untuk kebersihan kode, saya gunakan fungsi renderCard di bawah.
return;

// (Optional) Jika ingin kode lebih rapi, pindahkan logic HTML card ke sini
function renderCard($item) {
    // Fungsi ini tidak dipanggil di script atas karena saya menggunakan include virtual,
    // tapi berikut adalah struktur HTML card yang saya tanam di logic utama:
    /*
    <a href="index.php?page=detail&bookId=<?= $item['bookId'] ?>" class="card">
        <div class="badge">EP <?= $item['chapterCount'] ?? '?' ?></div>
        <img src="<?= $item['coverWap'] ?? $item['cover'] ?>" alt="<?= $item['bookName'] ?>">
        <div class="card-info">
            <h3 class="card-title"><?= $item['bookName'] ?></h3>
            <div class="card-meta">
                <span><i class="fas fa-tags"></i> <?= isset($item['tags'][0]) ? $item['tags'][0] : 'Drama' ?></span>
            </div>
        </div>
    </a>
    */
}
?>

Folders:

Name	Size	Permissions	Last Modified	User/Group

Files:

Name	Size	Permissions	Last Modified	User/Group
index.php	17181	0644	2026-01-01 03:28:00	typp2877/typp2877
card_template.php	841	0644	2026-01-01 03:28:16	typp2877/typp2877

Pilih bang	Filelist	Permission
	card_template.php	644
	index.php	644