Upload index.html

index.html

@@ -114,6 +114,9 @@
   .poster-title{font-size:12.5px; font-weight:600; margin-top:6px; line-height:1.25;
     display:-webkit-box; -webkit-line-clamp:1; -webkit-box-orient:vertical; overflow:hidden;}
   .poster-sub{font-size:11px; color:var(--muted); margin-top:2px;}
+  .rank-num{position:absolute; left:6px; bottom:0; font-size:58px; font-weight:900; line-height:1; letter-spacing:-3px; color:transparent;
+    -webkit-text-stroke:2px rgba(255,255,255,.92); text-shadow:0 4px 14px rgba(0,0,0,.65); pointer-events:none; z-index:2;}
+  .poster-art:has(.rank-num)::after{content:''; position:absolute; inset:auto 0 0 0; height:46%; background:linear-gradient(transparent,rgba(0,0,0,.7)); pointer-events:none;}
   .badge{position:absolute; top:6px; left:6px; display:flex; align-items:center; gap:3px;
     background:rgba(0,0,0,0.75); border-radius:6px; padding:2px 6px; font-size:10.5px; font-weight:700; color:#ffc53d;}
   .badge-type{position:absolute; bottom:6px; right:6px; background:rgba(0,0,0,0.75);
@@ -1481,6 +1484,12 @@ const TRANSLATED_KEY = JM_CONFIG.TRANSLATED_KEY;
 // Id zake zinaanza na 'n2-' ili zisigongane na za chanzo cha zamani.
 const TRANSLATED2_BASE = JM_CONFIG.CONTENT_URL + '/functions/v1/movie-zilizotafsriwa2';
 const TR2_PREFIX = 'n2-';
+const TR_DJ_NOISE = /\b(movies?|filamu|zote|zilizotafsiriwa|zilizotafsiri|imetafsiriwa|iliyotafsiriwa|tafsiriwa|kiswahili|swahili|kwa|mpya|kali|translated|new|all|series|full)\b/gi;
+function normDj(raw) { // jina safi la DJ (bila maneno ya ziada na bila tofauti za herufi kubwa/ndogo)
+  const s = String(raw || '').replace(/\(.*?\)|\[.*?\]/g, ' ').replace(TR_DJ_NOISE, ' ').replace(/[|_\-\u2013\u2014:,.]+/g, ' ').replace(/\s+/g, ' ').trim();
+  if (!s || /^dj$/i.test(s)) return '';
+  return s.split(' ').map(w => /^dj$/i.test(w) ? 'DJ' : w.charAt(0).toUpperCase() + w.slice(1).toLowerCase()).join(' ');
+}
 // Model iliyofunzwa (train.py -> HF Model). Ikikosekana, app inafanya kazi kama kawaida (Trending = mpya zaidi).
 const TR_MODEL_URL = 'https://huggingface.co/jaynesmaxtv/translated-recommender/resolve/main/model.json';
 let trModelP = null;
@@ -1496,25 +1505,26 @@ function logTrPlay(id) { // rekodi uchezaji bila kuzuia player; kitambulisho cha
     headers: { apikey: SUPABASE_ANON_KEY, 'Content-Type': 'application/json' },
     body: JSON.stringify({ movie_id: String(id), device_id: dev }) }).catch(() => {});
 }
-// Safu: 🔥 Trending (kwa model, au mpya zaidi kama data haitoshi) -> kila DJ (Dj Mack kwanza) -> Movie -> Series
+// Rails za mlalo: Trending Now (Top 10, kwa model au mpya zaidi) -> New Releases -> kila DJ (DJ Mack kwanza) -> Series -> More to Watch
 function buildTranslatedSections(items, model) {
-  const pop = (model && model.popularity) || {}, sections = [];
+  const pop = (model && model.popularity) || {}, sections = [], covered = new Set();
   const hot = items.filter(it => pop[it.id] > 0).sort((a, b) => pop[b.id] - pop[a.id]);
-  const trending = (hot.length >= 3 ? hot : items).slice(0, 12); // orodha tayari ni mpya -> zamani
-  if (trending.length) sections.push({ title: '🔥 Trending', items: trending });
+  // Trending halisi (Top 10) inaonekana tu pale model ina data ya kutosha; kabla ya hapo ni "New Releases" tu (si udanganyifu)
+  if (hot.length >= 5) sections.push({ title: t('tr_trending'), items: hot.slice(0, 10).map((it, i) => ({ ...it, rank: i + 1 })) });
+  if (hot.length < 5 || items.length > 6) sections.push({ title: t('tr_new'), items: items.slice(0, 20) }); // orodha tayari ni mpya -> zamani
   const byDj = {};
   items.forEach(it => {
     const dj = String(it.subtitle || '').trim();
     if (!dj || dj === 'Series' || dj === 'Movie') return;
-    const k = dj.toLowerCase();
-    (byDj[k] = byDj[k] || { name: dj, list: [] }).list.push(it);
+    (byDj[dj.toLowerCase()] = byDj[dj.toLowerCase()] || { name: dj, list: [] }).list.push(it);
   });
   Object.values(byDj).filter(g => g.list.length >= 2)
     .sort((a, b) => (/mack/i.test(b.name) - /mack/i.test(a.name)) || b.list.length - a.list.length)
-    .forEach(g => sections.push({ title: '🎙 ' + g.name, items: g.list }));
-  const series = items.filter(it => it.subtitle === 'Series'), movies = items.filter(it => it.subtitle !== 'Series');
-  if (movies.length) sections.push({ title: t('tr_movies'), items: movies });
-  if (series.length) sections.push({ title: t('tr_series'), items: series });
+    .forEach(g => { g.list.forEach(it => covered.add(it.id)); sections.push({ title: g.name, items: g.list.slice(0, 40).map(it => ({ ...it, subtitle: '' })) }); });
+  const series = items.filter(it => it.isSeries);
+  if (series.length) { series.forEach(it => covered.add(it.id)); sections.push({ title: t('tr_series'), items: series }); }
+  const more = items.filter(it => !covered.has(it.id));
+  if (more.length) sections.push({ title: t('tr_more'), items: more.slice(0, 40) });
   return sections;
 }
 async function fetchTranslatedMovie(id) { // -> { ok, error?, movie } kutoka chanzo sahihi
@@ -2865,7 +2875,12 @@ const I18N_EXTRA9 = {
   fr: { dq_pause: 'Pause', dq_continue: 'Reprendre', dq_paused: 'En pause', dq_eta_left: '~{x} restantes', dq_sec: 's', dq_min: 'min', dq_hr: 'h' }
 };
 Object.keys(I18N_EXTRA9).forEach(l => { I18N[l] = Object.assign(I18N[l] || {}, I18N_EXTRA9[l]); });
-const I18N_EXTRA10 = {"sw": {}, "en": {}, "ar": {}, "fr": {}};
+const I18N_EXTRA10 = {
+  sw: { tr_trending: 'Zinazovuma Sasa', tr_new: 'Mpya Karibuni', tr_more: 'Zaidi za Kutazama' },
+  en: { tr_trending: 'Trending Now', tr_new: 'New Releases', tr_more: 'More to Watch' },
+  ar: { tr_trending: 'الأكثر رواجاً الآن', tr_new: 'أحدث الإصدارات', tr_more: 'المزيد للمشاهدة' },
+  fr: { tr_trending: 'Tendances actuelles', tr_new: 'Nouveautés', tr_more: 'À découvrir' }
+};
 Object.keys(I18N_EXTRA10).forEach(l => { I18N[l] = Object.assign(I18N[l] || {}, I18N_EXTRA10[l]); });
 function T(k, v) { return t(k, v); }
 // Maandishi yaliyoandikwa kwenye HTML kupitia data-i18n / data-i18n-ph / data-i18n-title
@@ -3137,6 +3152,7 @@ function posterCard(item, gridMode) {
       ${(() => { const lvl = getContentRatingFor(item.id); return lvl ? `<div class="badge-age age-${lvl==='18'?'18':lvl==='13'?'13':'pg'}">${esc(RATING_LABEL[lvl])}</div>` : ''; })()}
       ${item.type && item.kind === 'movie' ? `<div class="badge-type">${esc(item.type)}</div>` : ''}
       ${item.kind === 'movie' ? `<div class="wl-btn ${inWl ? 'added' : ''}">${inWl ? '✓' : '+'}</div>` : ''}
+      ${item.rank ? `<div class="rank-num">${item.rank}</div>` : ''}
     </div>
     <div class="poster-title">${esc(item.title)}</div>
     ${item.subtitle ? `<div class="poster-sub">${esc(item.subtitle)}</div>` : ''}
@@ -3629,7 +3645,7 @@ async function fetchTranslatedList() {
   const card = (m, idPrefix) => ({
     id: idPrefix + m.id, kind: 'translated', title: m.title,
     poster: m.thumb_url || m.poster_url || null, imgFallbackOn: true,
-    subtitle: m.dj || (m.category === 'series' ? 'Series' : 'Movie'),
+    subtitle: normDj(m.dj) || (m.category === 'series' ? 'Series' : 'Movie'), isSeries: m.category === 'series',
   });
   const oldP = (async () => { // chanzo cha zamani
     const r = await fetch(TRANSLATED_BASE + '?limit=100', { headers: { apikey: TRANSLATED_KEY } });
@@ -3656,7 +3672,7 @@ async function loadTranslated() {
   renderSkeletonRails(2);
   try {
     const [items, model] = await Promise.all([fetchTranslatedList(), loadTrModel()]);
-    renderRails(buildTranslatedSections(items, model), true);
+    renderRails(buildTranslatedSections(items, model), false);
   } catch (e) {
     railsEl.innerHTML = '';
     railsEl.appendChild(stateBox(t('err_failed', { e: esc(e.message || t('err_generic')) }), true, loadTranslated));
@@ -3693,7 +3709,7 @@ async function openTranslatedDetailScreen(item) {
       selectedEpisodeUrl: isParts ? vids[partKeys[0]] : undefined,
       id: item.id, title: m.title || item.title,
       poster: m.thumb_url || m.poster_url || item.poster || null,
-      dj: m.dj || (item.subtitle && item.subtitle !== 'Series' && item.subtitle !== 'Movie' ? item.subtitle : '') || '',
+      dj: normDj(m.dj) || (item.subtitle && item.subtitle !== 'Series' && item.subtitle !== 'Movie' ? item.subtitle : '') || '',
       isSeries, vids,
       seasons: isSeries ? Object.keys(vids) : [],
       selectedSeason: isSeries ? Object.keys(vids)[0] : null,
@@ -3716,7 +3732,7 @@ function renderTranslatedDetail(d) {
   const totalEps = d.isSeries ? d.seasons.reduce((n, sn) => n + epKeys(sn).length, 0) : (d.isParts ? d.parts.length : 1);
 
   const chips = [];
-  if (d.dj) chips.push('🎙 DJ ' + d.dj);
+  if (d.dj) chips.push(/\bdj\b/i.test(d.dj) ? d.dj : 'DJ ' + d.dj);
   chips.push(d.isSeries ? 'Series' : 'Movie');
   if (d.isSeries) chips.push((multiSeason ? d.seasons.length + ' Season · ' : '') + totalEps + ' ' + t('tr_episodes'));
   else if (d.isParts) chips.push(d.parts.length + ' ' + t('tr_parts'));