diff --git a/assets/app.js b/assets/app.js
index bcbdacd..4c84993 100644
--- a/assets/app.js
+++ b/assets/app.js
@@ -1,4 +1,5 @@
var THEME_KEY = "vyla-theme";
+
var ICONS = {
system: '" + copy.favicon + " Using your own server? ' +
+ 'Apply
' +
+ 'Examples on this page will use your URL. It stays in this browser.
';
+ h1.parentNode.insertBefore(card, h1.nextSibling);
+ var input = card.querySelector("input");
+ input.value = cleanApiUrl(getPref("api", ""));
+ function apply() {
+ var raw = input.value.trim();
+ var clean = cleanApiUrl(raw);
+ if (raw && !clean) {
+ input.classList.add("bad");
+ return;
+ }
+ input.classList.remove("bad");
+ setPref("api", clean);
+ loadPage();
+ }
+ card.querySelector(".pc-btn").addEventListener("click", apply);
+ input.addEventListener("keydown", function (e) {
+ if (e.key === "Enter") apply();
+ });
+}
+
+function rememberPage(route) {
+ if (!route || route.is404) return;
+ try {
+ localStorage.setItem("vyla-last", JSON.stringify({ title: route.item.title, path: route.item.path }));
+ } catch (e) { }
+}
+
+function timeGreeting() {
+ var h = new Date().getHours();
+ if (h < 5) return "Up late";
+ if (h < 12) return "Good morning";
+ if (h < 18) return "Good afternoon";
+ return "Good evening";
+}
+
+function getBookmarks() {
+ try { return JSON.parse(localStorage.getItem("vyla-bookmarks")) || []; } catch (e) { return []; }
+}
+
+function isBookmarked(href) {
+ return getBookmarks().some(function (b) { return b.href === href; });
+}
+
+function buildBookmarkButton(route) {
+ var b = document.createElement("button");
+ b.type = "button";
+ b.className = "bm-btn";
+ var href = route.item.path;
+ function paint() {
+ var on = isBookmarked(href);
+ b.classList.toggle("on", on);
+ b.setAttribute("aria-pressed", on ? "true" : "false");
+ b.setAttribute("aria-label", on ? "Remove bookmark" : "Save this page");
+ b.title = on ? "Remove bookmark" : "Save this page";
+ b.innerHTML = icon("star");
+ }
+ b.addEventListener("click", function (e) {
+ e.stopPropagation();
+ var list = getBookmarks();
+ var idx = list.findIndex(function (x) { return x.href === href; });
+ if (idx !== -1) list.splice(idx, 1);
+ else list.unshift({ title: route.item.title, crumbs: [route.tab.title, route.group.title, route.item.title], href: href, type: "page" });
+ try { localStorage.setItem("vyla-bookmarks", JSON.stringify(list.slice(0, 20))); } catch (err) { }
+ paint();
+ });
+ paint();
+ return b;
+}
+
+function detectPlatform() {
+ var ua = navigator.userAgent || "";
+ if (/Android.*(TV|AFT|BRAVIA|SHIELD)|AndroidTV|GoogleTV|SmartTV/i.test(ua)) return "tv";
+ if (/Android/i.test(ua)) return "android";
+ if (/Windows/i.test(ua)) return "windows";
+ if (/Mac OS X|Macintosh/i.test(ua)) return "mac";
+ if (/Linux|X11/i.test(ua)) return "linux";
+ return "other";
+}
+
+function markRecommended(project) {
+ var platform = detectPlatform();
+ var wanted = null;
+ if (project === "home" && platform === "windows") wanted = [".exe"];
+ else if (project === "home" && platform === "mac") wanted = [".dmg"];
+ else if (project === "home" && platform === "linux") wanted = ["build from source"];
+ else if (project === "go" && platform === "android") wanted = [".apk"];
+ else if (project === "TV" && platform === "tv") wanted = [".apk"];
+ if (!wanted) return;
+ var done = false;
+ document.querySelectorAll("#main-content table a").forEach(function (a) {
+ if (done || a.getAttribute("data-rec")) return;
+ var text = a.textContent.toLowerCase();
+ var hit = wanted.some(function (w) { return text.indexOf(w) !== -1; });
+ if (!hit) return;
+ done = true;
+ a.setAttribute("data-rec", "1");
+ var badge = document.createElement("span");
+ badge.className = "rec-badge";
+ badge.textContent = "Recommended for your device";
+ a.parentNode.insertBefore(badge, a.nextSibling);
+ var row = a.closest("tr");
+ if (row) {
+ row.classList.add("rec-row");
+ var body = row.parentNode;
+ if (body && body.firstElementChild !== row) body.insertBefore(row, body.firstElementChild);
+ }
+ });
+}
+
+function renderChangelog() {
+ var box = document.getElementById("changelog");
+ if (!box) return;
+ box.innerHTML = 'Loading releases...
';
+ Promise.all(PROJECTS.map(function (p) {
+ return fetchProjectReleases(p).then(function (list) {
+ return list.map(function (r) { return { project: p, rel: r }; });
+ });
+ })).then(function (groups) {
+ var all = [].concat.apply([], groups).sort(function (a, b) {
+ return new Date(b.rel.released_at || b.rel.created_at) - new Date(a.rel.released_at || a.rel.created_at);
+ }).slice(0, 15);
+ if (!all.length) {
+ box.innerHTML = 'No releases found yet.
';
+ return;
+ }
+ box.innerHTML = all.map(function (entry) {
+ var r = entry.rel;
+ var d = new Date(r.released_at || r.created_at);
+ var date = isNaN(d) ? "" : d.toLocaleDateString(undefined, { year: "numeric", month: "short", day: "numeric" });
+ var notes = String(r.description || "").replace(/[#*`>_\[\]]/g, "").replace(/\s+/g, " ").trim().slice(0, 280);
+ var url = r._links && typeof r._links.self === "string" && /^https?:\/\//.test(r._links.self) ? r._links.self : "";
+ return '' + esc(PROJECT_LABELS[entry.project] || entry.project) + " " + esc(r.tag_name || "") + " " + esc(date) + "
" +
+ (r.name && r.name !== r.tag_name ? '' + esc(r.name) + "
" : "") +
+ (notes ? '' + esc(notes) + "
" : "") +
+ (url ? 'View on GitLab ' : "") +
+ "Loading contributors...
';
+ Promise.all(PROJECTS.map(fetchContributors)).then(function (groups) {
+ var totals = {};
+ [].concat.apply([], groups).forEach(function (c) {
+ var name = String(c.name || "").trim();
+ if (!name) return;
+ var key = name.toLowerCase();
+ if (!totals[key]) totals[key] = { name: name, commits: 0 };
+ totals[key].commits += Number(c.commits) || 0;
+ });
+ var people = Object.keys(totals).map(function (k) { return totals[k]; }).sort(function (a, b) { return b.commits - a.commits; });
+ if (!people.length) {
+ box.innerHTML = 'Contributors will show up here.
';
+ return;
+ }
+ box.innerHTML = people.map(function (p) {
+ var avatar;
+ if (p.name.toLowerCase() === "alwaysmesmerizingyou") {
+ avatar = '' + esc(p.name.charAt(0).toUpperCase()) + " ";
+ }
+ return '' + avatar + esc(p.name) + " " + p.commits + " ";
+ }).join("");
+ });
+}
+
+function burstConfetti() {
+ if (document.body.classList.contains("no-motion")) return;
+ var copy = THEME_COPY[resolveTheme(getThemeMode())] || THEME_COPY.base;
+ var canvas = document.createElement("canvas");
+ canvas.className = "confetti-canvas";
+ var dpr = window.devicePixelRatio || 1;
+ var w = window.innerWidth;
+ var h = window.innerHeight;
+ canvas.width = w * dpr;
+ canvas.height = h * dpr;
+ document.body.appendChild(canvas);
+ var ctx = canvas.getContext("2d");
+ ctx.scale(dpr, dpr);
+ var accent = getComputedStyle(document.documentElement).getPropertyValue("--text").trim() || "#ffffff";
+ var colors = [accent, "#ffffff", "#ffd24d", "#4da6ff", "#ff5c8a", "#5fd68f"];
+ var glyphs = copy.confetti;
+ var parts = [];
+ for (var i = 0; i < 140; i++) {
+ parts.push({
+ x: w / 2 + (Math.random() - 0.5) * 120,
+ y: h * 0.85,
+ vx: (Math.random() - 0.5) * 16,
+ vy: -(8 + Math.random() * 12),
+ size: 8 + Math.random() * 8,
+ rot: Math.random() * 6.28,
+ vr: (Math.random() - 0.5) * 0.4,
+ color: colors[i % colors.length],
+ glyph: glyphs && i % 3 === 0 ? glyphs[i % glyphs.length] : null
+ });
+ }
+ var start = performance.now();
+ function frame(now) {
+ var t = now - start;
+ ctx.clearRect(0, 0, w, h);
+ parts.forEach(function (p) {
+ p.vy += 0.35;
+ p.vx *= 0.99;
+ p.x += p.vx;
+ p.y += p.vy;
+ p.rot += p.vr;
+ ctx.save();
+ ctx.translate(p.x, p.y);
+ ctx.rotate(p.rot);
+ ctx.globalAlpha = Math.max(0, 1 - t / 4200);
+ if (p.glyph) {
+ ctx.font = p.size * 2 + "px serif";
+ ctx.textAlign = "center";
+ ctx.textBaseline = "middle";
+ ctx.fillText(p.glyph, 0, 0);
+ } else {
+ ctx.fillStyle = p.color;
+ ctx.fillRect(-p.size / 2, -p.size / 4, p.size, p.size / 2);
+ }
+ ctx.restore();
+ });
+ if (t < 4200) requestAnimationFrame(frame);
+ else canvas.remove();
+ }
+ requestAnimationFrame(frame);
+}
+
+function initEasterEggs() {
+ var progress = 0;
+ document.addEventListener("keydown", function (e) {
+ var t = e.target;
+ if (t && (t.tagName === "INPUT" || t.tagName === "TEXTAREA")) return;
+ var key = e.key.length === 1 ? e.key.toLowerCase() : e.key;
+ if (key === KONAMI[progress]) {
+ progress++;
+ if (progress === KONAMI.length) {
+ progress = 0;
+ burstConfetti();
+ }
+ } else {
+ progress = key === KONAMI[0] ? 1 : 0;
+ }
+ });
+ try {
+ console.log("%cVyla", "font:700 22px Inter,sans-serif;color:#ff7518", "\nYou found the console. Vyla is built by its community. Come help: https://gitlab.com/vyla-entertainment/");
+ } catch (e) { }
+}
+
+var ACCENT_PRESETS = ["#ff7518", "#f4b942", "#ff5c5c", "#f472b6", "#c084fc", "#8ad1ff", "#5fd68f", "#ffffff"];
+var TEXT_STEPS = [
+ { v: "90", l: "Small" },
+ { v: "100", l: "Default" },
+ { v: "115", l: "Large" },
+ { v: "130", l: "XL" }
+];
+
+function settingsEl(id) {
+ return document.getElementById(id);
+}
+
+function setApiHint(msg, isErr) {
+ var h = settingsEl("set-api-hint");
+ if (!h) return;
+ h.textContent = msg || "Used in code examples across the Stream API docs.";
+ h.classList.toggle("err", !!isErr);
+}
+
+function refreshPersonalPages() {
+ if (document.querySelector(".personal-card")) loadPage();
+}
+
+function themeChips(list) {
+ return list.map(function (t) {
+ return '' + icon(t.id) + "" + esc(t.label) + " ";
+ }).join("");
+}
+
+function switchRow(id, title, hint) {
+ return '' + title + ' ' + hint + ' ' + s.l + " ";
+ }).join("");
+ modal.innerHTML =
+ '
' +
+ '' +
+ '
' +
+ '
Make it yours ' +
+ '
Saved only in this browser. Nothing leaves your device.
' +
+ '
" +
+ '
Reset Save preferences
' +
+ "
' + icon("dark") + ' ' +
- '' + icon("light") + ' ' +
- '' + icon("halloween") + ' ' +
- '';
- seg.innerHTML = segHtml;
-
- seg.addEventListener("click", function (e) {
- var moreBtn = e.target.closest("#theme-seg-more");
- var segMenu = document.getElementById("theme-seg-menu");
- if (moreBtn && segMenu) {
- segMenu.classList.toggle("open");
- return;
- }
- var btn = e.target.closest("button[data-mode]");
- if (btn) {
- setTheme(btn.getAttribute("data-mode"));
- if (segMenu) segMenu.classList.remove("open");
- }
+ var gear = document.createElement("button");
+ gear.type = "button";
+ gear.className = "side-settings";
+ gear.setAttribute("aria-label", "Personalize");
+ gear.innerHTML = icon("sliders");
+ gear.addEventListener("click", function () {
+ sidebar.classList.remove("open");
+ document.body.classList.remove("nav-open");
+ openSettings();
});
- sideLinks.appendChild(seg);
+ sideLinks.appendChild(gear);
head.appendChild(b);
head.appendChild(sideLinks);
sidebar.insertBefore(head, sidebar.firstChild);
- refreshThemeUI();
}
}
@@ -864,6 +1571,28 @@ function navigateTo(path) {
loadPage();
}
+function mountGreeting(root) {
+ var content = root.querySelector(".header-content");
+ var title = root.querySelector(".header-title");
+ if (!content || !title) return;
+ var name = getPref("name", "");
+ var copy = THEME_COPY[resolveTheme(getThemeMode())] || THEME_COPY.base;
+ var pill = document.createElement("div");
+ pill.className = "hero-greeting";
+ pill.textContent = timeGreeting() + (name ? ", " + name : "") + (copy.greeting ? " Β· " + copy.greeting : "");
+ content.insertBefore(pill, title);
+ var last = null;
+ try { last = JSON.parse(localStorage.getItem("vyla-last")); } catch (e) { }
+ var actions = root.querySelector(".header-actions");
+ if (actions && last && typeof last.path === "string" && last.path.charAt(0) === "/" && last.path.indexOf("//") !== 0) {
+ var resume = document.createElement("a");
+ resume.className = "btn-secondary hero-resume";
+ resume.href = last.path;
+ resume.textContent = "Continue: " + (last.title || last.path);
+ actions.appendChild(resume);
+ }
+}
+
function loadPage() {
var path = window.location.pathname.replace(/\/+$/, "") || "/";
var isHome = path === "/";
@@ -872,8 +1601,9 @@ function loadPage() {
var contentEl = document.getElementById("main-content");
if (isHome) {
- document.title = "Vyla Entertainment β Vyla";
+ document.title = "Vyla Entertainment - Vyla";
renderNavTabs(SITE_TREE[0]);
+ renderSidebar(SITE_TREE[0], { title: "Home", path: "/" });
if (contentEl) {
contentEl.classList.remove("content-animate", "caught-up");
@@ -884,6 +1614,7 @@ function loadPage() {
})
.then(function (html) {
contentEl.innerHTML = html;
+ mountGreeting(contentEl);
applyTheme();
window.scrollTo(0, 0);
})
@@ -912,7 +1643,7 @@ function loadPage() {
renderNavTabs(route.tab);
renderSidebar(route.tab, route.item);
- document.title = route.item.title + " β Vyla";
+ document.title = route.item.title + " - Vyla";
var contentEl = document.getElementById("main-content");
@@ -922,13 +1653,13 @@ function loadPage() {
renderNavTabs(route.tab);
renderSidebar(route.tab, route.item);
- document.title = route.item.title + " β Vyla";
+ document.title = route.item.title + " - Vyla";
var contentEl = document.getElementById("main-content");
if (route.is404) {
document.body.classList.add("is-404");
- document.title = "404 - Page Not Found β Vyla";
+ document.title = "404 - Page Not Found - Vyla";
if (contentEl) {
contentEl.classList.remove("content-animate");
@@ -936,7 +1667,7 @@ function loadPage() {
'' +
'
404
' +
'
PAGE NOT FOUND
' +
- '
But if you don\'t change your direction, and if you keep looking, you may end up where you are heading.
' +
+ '
' + esc(notFoundCopy()) + '
' +
'
Take me home ' +
'
' + (tokens.length ? "No results found" : "No recent searches") + "
";
+ box.innerHTML = '' + (tokens.length ? "No results found" : "Nothing saved or recent yet") + "
";
return;
}
- box.innerHTML = (tokens.length ? "" : 'Recent searches
') + searchResults.map(function (it, i) {
+ box.innerHTML = searchResults.map(function (it, i) {
+ var label = "";
+ if (!tokens.length && i === 0 && savedCount) label = 'Saved
';
+ if (!tokens.length && i === savedCount) label = 'Recent searches
';
var crumbs = it.crumbs.join('βΊ ');
- return '' +
- icon("doc") +
+ return label + ' ' +
+ icon(i < savedCount && !tokens.length ? "star" : "doc") +
'' + esc(it.title) + "
" +
'
' + crumbs + "
";
}).join("");
@@ -1183,6 +2039,230 @@ function buildSearch() {
document.addEventListener("keydown", onSearchKey);
}
+var lightboxScale = 1;
+var activeOriginImg = null;
+
+function initLightbox() {
+ if (document.getElementById("image-lightbox")) return;
+ var lb = document.createElement("div");
+ lb.id = "image-lightbox";
+ lb.className = "image-lightbox";
+ lb.innerHTML =
+ '' +
+ '
' +
+ ' ' +
+ '
' +
+ ' ' +
+ '
' +
+ ' ' +
+ '
' +
+ '' +
+ '
' +
+ '
Help Add & Fix SDK Sources ' +
+ '
Streaming endpoints and scrapers constantly break as CDNs evolve. We are actively looking for contributors to help repair broken providers, add new video sources, and implement direct download scrapers.
' +
+ '
' +
+ '
&=1
+http://YOUR_API_URL/api?url=&=1
```
When your player fetches this path from your self-hosted instance, the server:
@@ -83,5 +83,5 @@ When your player fetches this path from your self-hosted instance, the server:
Before a URL is emitted as a `source` event, it passes two verification steps:
-1. **`verifyStream`** β a HEAD request to the raw upstream URL. Must return HTTP `< 400`.
-2. **`verifyPlayable`** β fetches the proxied URL, validates `#EXTM3U`, checks for `#EXTINF` or `#EXT-X-STREAM-INF`, then fetches the first segment.
\ No newline at end of file
+1. **`verifyStream`** - a HEAD request to the raw upstream URL. Must return HTTP `< 400`.
+2. **`verifyPlayable`** - fetches the proxied URL, validates `#EXTM3U`, checks for `#EXTINF` or `#EXT-X-STREAM-INF`, then fetches the first segment.
\ No newline at end of file
diff --git a/home.txt b/home.txt
index c09aef2..2e89680 100644
--- a/home.txt
+++ b/home.txt
@@ -93,19 +93,14 @@
gap: 6px;
padding: 10px 22px;
border-radius: 100px;
- background: #000000;
- color: #ffffff !important;
+ background: var(--btn-primary-bg);
+ color: var(--btn-primary-text) !important;
font-size: 13.5px;
font-weight: 600;
text-decoration: none !important;
transition: transform 0.15s ease;
}
- html.dark .btn-primary {
- background: #FFFFFF;
- color: #000000 !important;
- }
-
.btn-secondary {
display: inline-flex;
align-items: center;
@@ -156,6 +151,11 @@
z-index: 1;
}
+ .header-desc {
+ font-size: 14.5px;
+ margin-top: 0 !important;
+ }
+
.section-head {
margin-bottom: 22px;
text-align: left;
@@ -166,13 +166,13 @@
font-size: 22px !important;
font-weight: 700 !important;
margin: 0 0 6px !important;
- color: #ffffff !important;
+ color: var(--text) !important;
}
.section-head p {
font-size: 14.5px;
margin: 0;
- color: #a1a1aa;
+ color: var(--muted);
}
.vyla-grid {
@@ -247,11 +247,71 @@
opacity: 0.75;
}
+ .hero-greeting {
+ margin: 0 0 14px;
+ padding: 6px 16px;
+ border-radius: 100px;
+ background: var(--hover-bg);
+ backdrop-filter: blur(16px);
+ -webkit-backdrop-filter: blur(16px);
+ color: var(--text);
+ font-size: 13px;
+ font-weight: 600;
+ letter-spacing: 0.01em;
+}
+
+.hero-resume {
+ max-width: min(90vw, 360px);
+ overflow: hidden;
+ white-space: nowrap;
+ text-overflow: ellipsis;
+ color: var(--text);
+}
+
@media (max-width: 900px) {
#header-container {
border-radius: 100px;
}
}
+
+ @media (orientation: landscape) and (max-height: 550px) {
+ .home-header {
+ height: auto;
+ min-height: 280px;
+ padding-top: calc(var(--header-height) + 24px);
+ padding-bottom: 28px;
+ }
+
+ .header-logo-badge {
+ width: 44px;
+ height: 44px;
+ margin-bottom: 8px;
+ }
+
+ .header-title {
+ font-size: 26px;
+ margin-bottom: 6px;
+ }
+
+ .header-desc {
+ font-size: 13.5px;
+ margin-bottom: 14px;
+ max-width: 540px;
+ }
+
+ .content-section {
+ margin-top: 32px;
+ }
+
+ .vyla-grid {
+ grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
+ gap: 12px;
+ }
+
+ .feature-box {
+ padding: 18px;
+ }
+ }
diff --git a/index.html b/index.html
index 9809c39..c26a865 100644
--- a/index.html
+++ b/index.html
@@ -3,8 +3,11 @@
-
-
Vyla Entertainment β Vyla
+
+
+
+
+
Vyla Entertainment - Vyla
-
+
@@ -26,7 +29,7 @@
-
+
@@ -77,6 +80,9 @@
+
+
+
@@ -87,7 +93,12 @@
src="https://cdnjs.cloudflare.com/ajax/libs/prism/1.29.0/plugins/autoloader/prism-autoloader.min.js">
@@ -106,10 +117,13 @@
+
+
- Rights holders can request source removal β DMCA policy .
+ Rights holders can request source removal - DMCA policy .
β
@@ -120,6 +134,8 @@
height="28" decoding="async" />
+
@@ -139,6 +155,7 @@
';
+ } else if (p.name.toLowerCase() === "zstrike") {
+ avatar = '
';
+ } else {
+ avatar = '