initial: modular iptv-dl with runtime config from ~/.iptv-downloader/config.json
This commit is contained in:
@@ -0,0 +1,49 @@
|
||||
/* ── Downloads page ─────────────────────────────────────────── */
|
||||
function escH(s) { return String(s).replace(/&/g,'&').replace(/</g,'<').replace(/>/g,'>'); }
|
||||
function fmtSpeed(b) { return b>1048576?(b/1048576).toFixed(1)+' MB/s':b>1024?(b/1024).toFixed(0)+' KB/s':b+' B/s'; }
|
||||
function fmtEta(s) {
|
||||
if (s < 0) return '';
|
||||
if (s < 60) return s + 's';
|
||||
if (s < 3600) return Math.floor(s/60) + 'm ' + (s%60) + 's';
|
||||
return Math.floor(s/3600) + 'h ' + Math.floor((s%3600)/60) + 'm';
|
||||
}
|
||||
|
||||
function renderDownloads() {
|
||||
fetch(BASE + '/api/downloads', {cache: 'no-store'})
|
||||
.then(function(r) { return r.json(); })
|
||||
.then(function(dl) {
|
||||
var el = document.getElementById('dl-table');
|
||||
if (!dl.length) { el.innerHTML = '<p style="color:var(--dim)">No downloads yet.</p>'; return; }
|
||||
var html = '<table><tr><th></th><th>Name</th><th>Status</th><th>Progress</th><th>Speed</th><th>ETA</th><th></th></tr>';
|
||||
dl.slice().reverse().forEach(function(d) {
|
||||
var pct = d.pct || 0, mb = (d.downloaded/1048576).toFixed(1);
|
||||
var cls = d.status==='done' ? 'done' : d.status.startsWith('error') ? 'err' : d.status==='downloading' ? 'dl' : '';
|
||||
var thumb = d.cover_url
|
||||
? '<img src="' + escH(d.cover_url) + '" style="width:32px;height:48px;object-fit:cover;border-radius:3px" onerror="this.style.display=\'none\'">'
|
||||
: '<span style="color:var(--dim);font-size:18px">◻</span>';
|
||||
html += '<tr><td>' + thumb + '</td><td>' + escH(d.name) + '</td><td class=' + cls + '>' + escH(d.status) + '</td><td>';
|
||||
if (d.status === 'downloading')
|
||||
html += '<div class=pbar><div class=pfill style="width:' + pct + '%"></div></div> ' + pct + '% (' + mb + 'MB)';
|
||||
else html += pct + '%';
|
||||
html += '</td><td>' + (d.status==='downloading'&&d.speed_bps>0 ? fmtSpeed(d.speed_bps) : '—') + '</td>';
|
||||
html += '<td>' + (d.status==='downloading'&&d.eta_s>=0 ? fmtEta(d.eta_s) : '—') + '</td><td>';
|
||||
if (d.status==='downloading' || d.status==='queued')
|
||||
html += '<button class="btn btn-s" onclick="cancelDl(\'' + d.id + '\')" style="padding:2px 8px">✕</button>';
|
||||
html += '</td></tr>';
|
||||
});
|
||||
html += '</table>';
|
||||
el.innerHTML = html;
|
||||
}).catch(function() {});
|
||||
}
|
||||
|
||||
function cancelDl(id) {
|
||||
fetch(BASE + '/api/cancel', {method:'POST', headers:{'Content-Type':'application/json'}, body:JSON.stringify({id:id})})
|
||||
.then(function() { setTimeout(renderDownloads, 400); });
|
||||
}
|
||||
function clearDl() { fetch(BASE + '/api/clear', {method:'POST'}).then(function() { setTimeout(renderDownloads, 400); }); }
|
||||
function clearCancelled() { fetch(BASE + '/api/clear-cancelled', {method:'POST'}).then(function() { setTimeout(renderDownloads, 400); }); }
|
||||
function retryInterrupted() { fetch(BASE + '/api/retry-interrupted', {method:'POST'}).then(function() { setTimeout(renderDownloads, 400); }); }
|
||||
function cleanPartials() { fetch(BASE + '/api/clean-partials', {method:'POST'}).then(function() { renderDownloads(); }); }
|
||||
|
||||
renderDownloads();
|
||||
setInterval(renderDownloads, 3000);
|
||||
@@ -0,0 +1,3 @@
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,17 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width,initial-scale=1">
|
||||
<title>{{TITLE}} — IPTV</title>
|
||||
<link rel="stylesheet" href="/iptv.css">
|
||||
</head>
|
||||
<body>
|
||||
<nav class="topnav">
|
||||
<a href="/series" class="nav-item">Series</a>
|
||||
<a href="/movies" class="nav-item">Movies</a>
|
||||
<a href="/search" class="nav-item">Search</a>
|
||||
<a href="/downloads" class="nav-item">Downloads</a>
|
||||
</nav>
|
||||
<div class="container">
|
||||
<script src="/iptv.js"></script>
|
||||
@@ -0,0 +1,41 @@
|
||||
@import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@300;400;700&display=swap');
|
||||
:root{--black:#000;--offblack:#0a0a0a;--terminal:#ccc;--dim:#555;--border:#171717;--strawberry:#e8547a;--green:#4ade80}
|
||||
*{box-sizing:border-box;margin:0;padding:0}
|
||||
body{background:var(--black);color:var(--terminal);font-family:'JetBrains Mono',monospace;min-height:100vh;padding:24px 16px 48px;-webkit-font-smoothing:antialiased}
|
||||
header{border-bottom:1px solid var(--border);padding-bottom:20px;margin-bottom:24px;display:flex;align-items:baseline;gap:16px}
|
||||
header h1{font-size:22px;font-weight:700;letter-spacing:-.04em;color:#fff}
|
||||
nav{display:flex;gap:6px;flex-wrap:wrap}
|
||||
nav a{font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--dim);text-decoration:none;padding:4px 10px;border:1px solid var(--border);border-radius:6px;transition:border-color .15s,color .15s}
|
||||
nav a:hover{border-color:var(--strawberry);color:var(--strawberry)}
|
||||
.c{max-width:960px;margin:0 auto}
|
||||
.lbl{font-size:9px;letter-spacing:.1em;text-transform:uppercase;color:var(--dim);margin-bottom:12px}
|
||||
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:10px;margin-bottom:28px}
|
||||
.card{background:var(--offblack);border:1px solid var(--border);border-radius:12px;padding:14px 12px 10px;cursor:pointer;text-decoration:none;display:block;color:var(--terminal);transition:border-color .15s}
|
||||
.card:hover{border-color:#2a2a2a}
|
||||
.card:active{background:#0f0f0f}
|
||||
.card-img{width:100%;aspect-ratio:2/3;background:var(--border);border-radius:6px;overflow:hidden;margin-bottom:8px}
|
||||
.card-img img{width:100%;height:100%;object-fit:cover;display:block}
|
||||
.card-name{font-size:12px;font-weight:700;color:#fff;letter-spacing:-.01em;margin-bottom:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
|
||||
.card-sub{font-size:10px;color:var(--dim);letter-spacing:.04em}
|
||||
table{width:100%;border-collapse:collapse;font-size:12px}
|
||||
th{text-align:left;padding:8px 10px;background:var(--offblack);border-bottom:1px solid var(--border);font-size:9px;letter-spacing:.08em;text-transform:uppercase;color:var(--dim);position:sticky;top:0}
|
||||
td{padding:8px 10px;border-bottom:1px solid var(--border);vertical-align:middle}
|
||||
tr:hover td{background:var(--offblack)}
|
||||
.btn{display:inline-block;padding:4px 12px;border-radius:6px;border:1px solid var(--border);cursor:pointer;font-size:10px;font-family:inherit;letter-spacing:.06em;text-transform:uppercase;text-decoration:none;transition:border-color .15s,color .15s;background:transparent;color:var(--terminal)}
|
||||
.btn:hover{border-color:var(--strawberry);color:var(--strawberry)}
|
||||
.btn-g{border-color:var(--green);color:var(--green)}.btn-g:hover{border-color:#22d360;color:#22d360}
|
||||
.btn-s{border-color:var(--strawberry);color:var(--strawberry)}.btn-r{border-color:#ef4444;color:#ef4444}.btn-r:hover{border-color:#f87171;color:#f87171}
|
||||
input[type=checkbox]{cursor:pointer;accent-color:var(--strawberry)}
|
||||
.search{width:100%;padding:8px 12px;background:var(--offblack);border:1px solid var(--border);color:var(--terminal);border-radius:8px;font-size:12px;font-family:inherit;margin-bottom:14px;outline:none;transition:border-color .15s}
|
||||
.search:focus{border-color:#2a2a2a}
|
||||
select{background:var(--offblack);border:1px solid var(--border);color:var(--terminal);border-radius:8px;font-size:12px;font-family:inherit;padding:8px 12px;outline:none;cursor:pointer}
|
||||
.pbar{background:var(--border);border-radius:2px;height:2px;overflow:hidden;min-width:80px;display:inline-block;vertical-align:middle}
|
||||
.pfill{background:var(--green);height:100%}
|
||||
.done{color:var(--green)}.err{color:var(--strawberry)}.dl{color:#fbbf24}
|
||||
.bc{font-size:10px;color:var(--dim);letter-spacing:.04em;margin-bottom:16px}
|
||||
.bc a{color:var(--strawberry);text-decoration:none}
|
||||
.sep{border:none;border-top:1px solid var(--border);margin:20px 0}
|
||||
.sform{display:flex;gap:8px;margin-bottom:20px;flex-wrap:wrap}
|
||||
.sform input{flex:1;min-width:160px;margin-bottom:0}
|
||||
.sform select{margin-bottom:0}
|
||||
@media(min-width:480px){.grid{grid-template-columns:repeat(auto-fill,minmax(160px,1fr))}}
|
||||
@@ -0,0 +1,20 @@
|
||||
/* ── Shared IPTV downloader JS ──────────────────────────────── */
|
||||
var BASE = (function(){
|
||||
var m = window.location.pathname.match(/^(\/[^/]+)/);
|
||||
return m ? m[1] : '';
|
||||
})();
|
||||
|
||||
function filter(el) {
|
||||
document.querySelectorAll('.card').forEach(function(c) {
|
||||
c.style.display = c.textContent.toLowerCase().includes(el.value.toLowerCase()) ? '' : 'none';
|
||||
});
|
||||
}
|
||||
|
||||
function dlMov(id, title, ext, icon) {
|
||||
if (!confirm('Download: ' + title + '?')) return;
|
||||
fetch(BASE + '/api/download_movie', {
|
||||
method: 'POST',
|
||||
headers: {'Content-Type': 'application/json'},
|
||||
body: JSON.stringify({id: id, title: title, ext: ext || 'mp4', cover_url: icon || ''})
|
||||
}).then(function() { alert('Queued!'); location.href = BASE + '/downloads'; });
|
||||
}
|
||||
@@ -0,0 +1,65 @@
|
||||
/* ── Series episode selector ──────────────────────────────────── */
|
||||
/* TITLE, COVER, SEASONS injected by server as window vars before this script */
|
||||
|
||||
var tabs = document.getElementById('tabs');
|
||||
var sdiv = document.getElementById('seasons');
|
||||
|
||||
Object.keys(SEASONS).sort(function(a,b){return +a-+b;}).forEach(function(s) {
|
||||
var btn = document.createElement('button');
|
||||
btn.className = 'btn b'; btn.textContent = 'S' + s.padStart(2,'0');
|
||||
btn.style.marginRight = '6px';
|
||||
btn.onclick = function() { showSeason(s); };
|
||||
tabs.appendChild(btn);
|
||||
|
||||
var div = document.createElement('div'); div.id = 's-' + s; div.style.display = 'none';
|
||||
var html = '<div style="margin:8px 0">'
|
||||
+ '<button class="btn btn-s" onclick="selAll(\'' + s + '\',true)">All S' + s.padStart(2,'0') + '</button> '
|
||||
+ '<button class="btn g" onclick="dlSeason(\'' + s + '\')" style="margin-left:6px">⬇ Season ' + s + '</button></div>';
|
||||
html += '<table><tr><th><input type=checkbox onchange="selAll(\'' + s + '\',this.checked)"></th>'
|
||||
+ '<th>Ep</th><th>Title</th><th>Duration</th></tr>';
|
||||
SEASONS[s].forEach(function(e) {
|
||||
var epn = e.episode_num || e.episodeNum || '?';
|
||||
var dur = (e.info && e.info.duration) || '';
|
||||
var ext = e.container_extension || 'mp4';
|
||||
html += '<tr>'
|
||||
+ '<td><input type=checkbox class="ep-cb s-cb-' + s + '" data-id="' + e.id + '" data-ep="' + epn + '" data-s="' + s + '" data-ext="' + ext + '"></td>'
|
||||
+ '<td>E' + String(epn).padStart(2,'0') + '</td>'
|
||||
+ '<td>' + (e.title||'') + '</td>'
|
||||
+ '<td>' + dur + '</td></tr>';
|
||||
});
|
||||
html += '</table>';
|
||||
div.innerHTML = html;
|
||||
sdiv.appendChild(div);
|
||||
});
|
||||
|
||||
var firstS = Object.keys(SEASONS).sort(function(a,b){return +a-+b;})[0];
|
||||
if (firstS) showSeason(firstS);
|
||||
|
||||
function showSeason(s) {
|
||||
document.querySelectorAll('[id^=s-]').forEach(function(d) { d.style.display = 'none'; });
|
||||
var d = document.getElementById('s-' + s); if (d) d.style.display = '';
|
||||
}
|
||||
|
||||
function selAll(s, v) {
|
||||
var all = Array.from(document.querySelectorAll('.s-cb-' + s));
|
||||
var checked = v === undefined ? !all.every(function(x){return x.checked;}) : v;
|
||||
all.forEach(function(c) { c.checked = checked; });
|
||||
}
|
||||
|
||||
function dlSeason(s) { selAll(s, true); dlSelected(); }
|
||||
|
||||
function dlSelected() {
|
||||
var eps = Array.from(document.querySelectorAll('.ep-cb:checked')).map(function(c) {
|
||||
return {id: c.dataset.id, ep: c.dataset.ep, s: c.dataset.s, ext: c.dataset.ext};
|
||||
});
|
||||
if (!eps.length) { alert('Select episodes first'); return; }
|
||||
var bySeason = {};
|
||||
eps.forEach(function(e) { (bySeason[e.s] = bySeason[e.s]||[]).push({id:e.id, episode_num:e.ep, ext:e.ext}); });
|
||||
Promise.all(Object.keys(bySeason).map(function(s) {
|
||||
return fetch(BASE + '/api/download', {
|
||||
method: 'POST',
|
||||
headers: {'Content-Type': 'application/json'},
|
||||
body: JSON.stringify({episodes: bySeason[s], series_title: TITLE, season: s, cover_url: COVER})
|
||||
}).then(function(r) { return r.json(); });
|
||||
})).then(function() { alert('Queued!'); location.href = BASE + '/downloads'; });
|
||||
}
|
||||
Reference in New Issue
Block a user