revert: app_wrapper.py back to previous (shorts routing, no comment/share changes)

app_wrapper.py

@@ -16,17 +16,6 @@ SHORTS_EXTRA_CSS = """
 .tiktok-fullscreen-container.fullheight-mode .tiktok-video{object-fit:cover!important}
 .tiktok-fullheight-btn{position:absolute;bottom:70px;right:12px;background:rgba(255,255,255,.15);color:#fff;border:none;padding:6px 12px;border-radius:16px;font-size:11px;cursor:pointer;z-index:8;backdrop-filter:blur(6px)}
 .tiktok-fullheight-btn.active{background:rgba(92,184,122,.5)}
-/* Comment button on right side */
-.tiktok-comment-btn{position:absolute;right:12px;top:50%;transform:translateY(-50%);background:rgba(255,255,255,.15);color:#fff;border:none;width:44px;height:44px;border-radius:50%;font-size:20px;cursor:pointer;z-index:8;backdrop-filter:blur(6px);display:flex;align-items:center;justify-content:center;transition:background .2s}
-.tiktok-comment-btn:hover{background:rgba(255,255,255,.3)}
-.tiktok-comment-panel{position:absolute;right:0;top:0;bottom:0;width:280px;background:rgba(17,17,17,.95);z-index:20;padding:12px;overflow-y:auto;transform:translateX(100%);transition:transform .3s;border-left:1px solid #333}
-.tiktok-comment-panel.open{transform:translateX(0)}
-.tiktok-comment-panel h4{color:#fff;font-size:14px;margin:0 0 10px}
-.tiktok-comment-panel .cmt-input{width:100%;padding:8px;background:#222;border:1px solid #444;border-radius:6px;color:#eee;font-size:12px;margin-bottom:6px;box-sizing:border-box}
-.tiktok-comment-panel .cmt-send{background:#2d8659;color:#fff;border:none;padding:6px 14px;border-radius:14px;font-size:12px;cursor:pointer}
-.tiktok-comment-panel .cmt-list{margin-top:10px}
-.tiktok-comment-panel .cmt-item{background:#1a1a1a;border-radius:6px;padding:6px 8px;margin-bottom:6px;font-size:11px;color:#ccc}
-.tiktok-comment-panel .cmt-close{position:absolute;top:8px;right:8px;background:none;border:none;color:#aaa;font-size:18px;cursor:pointer}
 """
 
 FULLWIDTH_CSS = """
@@ -59,21 +48,27 @@ if "shorts-feed-mode" not in app.CSS:
 if "FULLWIDTH: kill all Gradio padding" not in app.CSS:
     app.CSS += FULLWIDTH_CSS
 
-# ══ Override app._extract_24h_video_urls ══
+# ══ Override app._extract_24h_video_urls with fixed multi-part version ══
 def _fixed_extract_24h_video_urls(article_url):
     vid = _extract_24h_video_url(article_url)
-    if not vid: return []
+    if not vid:
+        return []
     all_parts = vid.get("all_parts", [vid["src"]])
-    return [{"src": p, "poster": vid.get("poster",""), "vtype": "hls"} for p in all_parts]
+    poster = vid.get("poster", "")
+    return [{"src": p, "poster": poster, "vtype": "hls"} for p in all_parts]
 app._extract_24h_video_urls = _fixed_extract_24h_video_urls
 
-# ══ Fix homepage slider ══
+# ══ Fix homepage slider: bdpOpenTikTok → bdpOpen with 3 params ══
 _orig_render_video_slider = getattr(app, 'render_video_slider_html', None)
 if _orig_render_video_slider:
     def _patched_render_video_slider(videos):
         html = _orig_render_video_slider(videos)
         html = html.replace("window.bdpOpenTikTok(", "window.bdpOpen(")
-        html = _re.sub(r"window\.bdpOpen\('([^']+)','([^']+)'\)", r"window.bdpOpen('\1','\2','')", html)
+        html = _re.sub(
+            r"window\.bdpOpen\('([^']+)','([^']+)'\)",
+            r"window.bdpOpen('\1','\2','')",
+            html
+        )
         return html
     app.render_video_slider_html = _patched_render_video_slider
 
@@ -85,13 +80,13 @@ def _patched_render_homepage(articles, *args, **kwargs):
         shorts = scrape_24h_news_shorts()[:15]
         shorts_html = render_shorts_carousel(shorts, app.esc, app.safe_url, app.make_id, app.slug)
         if shorts_html:
-            pt = html.find('<div class="vslide-wrap">')
-            if pt > 0:
-                html = html[:pt] + shorts_html + html[pt:]
+            insert_point = html.find('<div class="vslide-wrap">')
+            if insert_point > 0:
+                html = html[:insert_point] + shorts_html + html[insert_point:]
             else:
-                pt = html.find('<div class="bdp-wrap">') + len('<div class="bdp-wrap">')
-                if pt > len('<div class="bdp-wrap">'):
-                    html = html[:pt] + shorts_html + html[pt:]
+                insert_point = html.find('<div class="bdp-wrap">') + len('<div class="bdp-wrap">')
+                if insert_point > len('<div class="bdp-wrap">'):
+                    html = html[:insert_point] + shorts_html + html[insert_point:]
     except Exception as e:
         print(f"[shorts] Error: {e}")
     return html
@@ -106,131 +101,161 @@ def _patched_render_video_page():
     return html
 app.render_video_page_html = _patched_render_video_page
 
-# ══ Patch read_article ══
+# ══ Patch read_article: video URLs → TikTok feed ══
 _orig_read_article = app.read_article
 def _patched_read_article(url):
     if not url or url == "#" or len(url) < 10:
         return "<p>Không tìm thấy bài viết.</p>"
     if "24h.com.vn" in url:
         is_highlight = "/bong-da/video-bong-da-" in url or "video-highlight" in url
-        result = _render_highlight_tiktok_feed(url) if is_highlight else _render_shorts_tiktok_feed(url)
-        if result: return result
+        if is_highlight:
+            result = _render_highlight_tiktok_feed(url)
+        else:
+            result = _render_shorts_tiktok_feed(url)
+        if result:
+            return result
     if "bongdaplus.vn/video/" in url:
         result = _render_bdp_tiktok_feed(url)
-        if result: return result
+        if result:
+            return result
     return _orig_read_article(url)
 
 def _render_bdp_tiktok_feed(current_url):
     from concurrent.futures import ThreadPoolExecutor, as_completed
-    try: bdp_list = app.scrape_bdp_video_list()[:15]
-    except: return None
-    if not bdp_list: return None
-    def _f(art):
+    try:
+        bdp_list = app.scrape_bdp_video_list()[:15]
+    except:
+        return None
+    if not bdp_list:
+        return None
+    def _fetch_bdp(art):
         vid_id = app._extract_bdp_video_id(art["link"])
-        if not vid_id: return []
+        if not vid_id: return None
         embed = app.fetch_bdp_embed_data(vid_id)
-        if not embed or not embed.get("mp4"): return []
+        if not embed or not embed.get("mp4"): return None
         return [{"title": art["title"], "link": art["link"], "img": art.get("img",""),
                 "src": embed["mp4"], "poster": embed.get("poster",""), "vtype": "mp4"}]
     videos = []
     with ThreadPoolExecutor(max_workers=6) as ex:
-        for f in as_completed({ex.submit(_f, a): a for a in bdp_list}):
+        futures = {ex.submit(_fetch_bdp, a): a for a in bdp_list}
+        for f in as_completed(futures):
             try:
                 r = f.result()
                 if r: videos.extend(r)
             except: pass
-    return _build_tiktok_html(videos, current_url, "BDP") if videos else None
+    if not videos:
+        return None
+    return _build_tiktok_html(videos, current_url, "BDP")
 
 def _render_shorts_tiktok_feed(current_url):
+    """TikTok feed using SHORTS articles (from video-tin-tuc page)."""
     from concurrent.futures import ThreadPoolExecutor, as_completed
-    try: all_articles = scrape_24h_news_shorts()[:15]
-    except: return None
-    if not all_articles: return None
-    def _f(art):
+    try:
+        all_articles = scrape_24h_news_shorts()[:15]
+    except:
+        all_articles = []
+    if not all_articles:
+        return None
+    def _fetch_video(art):
         vid = _extract_24h_video_url(art["link"])
-        if not vid: return []
-        return [{"title": art["title"], "link": art["link"], "img": art.get("img",""),
-                "src": vid["src"], "poster": vid["poster"], "vtype": vid["vtype"]}]
+        if not vid:
+            return []
+        return [{"title": art["title"], "link": art["link"],
+                "img": art.get("img", ""), "src": vid["src"],
+                "poster": vid["poster"], "vtype": vid["vtype"]}]
     videos = []
     with ThreadPoolExecutor(max_workers=8) as ex:
-        for f in as_completed({ex.submit(_f, a): a for a in all_articles}):
+        futures = {ex.submit(_fetch_video, a): a for a in all_articles}
+        for f in as_completed(futures):
             try:
                 r = f.result()
                 if r: videos.extend(r)
             except: pass
-    return _build_tiktok_html(videos, current_url, "24h") if videos else None
+    if not videos:
+        return None
+    return _build_tiktok_html(videos, current_url, "24h")
 
 def _render_highlight_tiktok_feed(current_url):
+    """TikTok feed using HIGHLIGHT articles (video-bong-da)."""
     from concurrent.futures import ThreadPoolExecutor, as_completed
-    try: all_articles = app.scrape_24h_video_list()[:20]
-    except: return None
-    if not all_articles: return None
-    def _f(art):
+    try:
+        all_articles = app.scrape_24h_video_list()[:20]
+    except:
+        all_articles = []
+    if not all_articles:
+        return None
+    def _fetch_video(art):
         vid = _extract_24h_video_url(art["link"])
-        if not vid: return []
-        parts = vid.get("all_parts", [vid["src"]])
-        return [{"title": art["title"]+(f" (P{i+1})" if len(parts)>1 else ""), "link": art["link"],
-                "img": art.get("img",""), "src": p, "poster": vid["poster"], "vtype": vid["vtype"]}
-                for i, p in enumerate(parts)]
+        if not vid:
+            return []
+        results = []
+        all_parts = vid.get("all_parts", [vid["src"]])
+        for pi, part_url in enumerate(all_parts):
+            label = f" (Phần {pi+1})" if len(all_parts) > 1 else ""
+            results.append({
+                "title": art["title"] + label, "link": art["link"],
+                "img": art.get("img", ""), "src": part_url,
+                "poster": vid["poster"], "vtype": vid["vtype"]
+            })
+        return results
     videos = []
     with ThreadPoolExecutor(max_workers=8) as ex:
-        for f in as_completed({ex.submit(_f, a): a for a in all_articles}):
+        futures = {ex.submit(_fetch_video, a): a for a in all_articles}
+        for f in as_completed(futures):
             try:
                 r = f.result()
                 if r: videos.extend(r)
             except: pass
-    return _build_tiktok_html(videos, current_url, "24h") if videos else None
+    if not videos:
+        return None
+    return _build_tiktok_html(videos, current_url, "24h")
 
 def _build_tiktok_html(videos, current_url, source_label):
-    ca = app.make_id(current_url)
-    ordered = [v for v in videos if app.make_id(v["link"])==ca] + [v for v in videos if app.make_id(v["link"])!=ca]
-    badge = "bdp-badge-24h" if source_label=="24h" else "bdp-badge-bdp"
+    current_aid = app.make_id(current_url)
+    ordered = []
+    rest = []
+    for v in videos:
+        if app.make_id(v["link"]) == current_aid:
+            ordered.append(v)
+        else:
+            rest.append(v)
+    ordered.extend(rest)
+
+    badge_cls = "bdp-badge-24h" if source_label == "24h" else "bdp-badge-bdp"
     is_shorts = source_label == "24h"
 
     slides = []
     for vi, v in enumerate(ordered):
-        po = app.safe_url(v.get("poster",""))
-        pa = f' poster="{po}"' if po else ""
-        vs = v["src"]
+        poster = app.safe_url(v.get("poster", ""))
+        poster_attr = f' poster="{poster}"' if poster else ""
+        vsrc = v["src"]
         aid = app.make_id(v["link"])
         sl = app.slug(v["title"])
-        # Share includes image URL for og:image when platform supports it
-        img_for_share = app.safe_url(v.get("img") or v.get("poster",""))
-        sj = f"event.stopPropagation();window.bdpShareWithImage('{app.esc(v['title'])}','{sl}','{aid}','{img_for_share}')"
-        vt = f'<video class="tiktok-video" playsinline preload="metadata"{pa} data-hls-src="{vs}" muted loop></video>' if v.get("vtype")=="hls" else f'<video class="tiktok-video" playsinline preload="metadata"{pa} muted loop><source src="{app.safe_url(vs)}" type="video/mp4"></video>'
+        share_js = f"event.stopPropagation();window.bdpShareHash('{app.esc(v['title'])}','{sl}','{aid}')"
+        if v.get("vtype") == "hls":
+            vtag = f'<video class="tiktok-video" playsinline preload="metadata"{poster_attr} data-hls-src="{vsrc}" muted loop></video>'
+        else:
+            vtag = f'<video class="tiktok-video" playsinline preload="metadata"{poster_attr} muted loop><source src="{app.safe_url(vsrc)}" type="video/mp4"></video>'
 
-        fh_btn = ''
+        fullheight_btn = ''
         if not is_shorts:
-            fh_btn = '<button class="tiktok-fullheight-btn" onclick="event.stopPropagation();var c=this.closest(\'.tiktok-fullscreen-container\');c.classList.toggle(\'fullheight-mode\');var on=c.classList.contains(\'fullheight-mode\');c.querySelectorAll(\'.tiktok-fullheight-btn\').forEach(function(b){b.classList.toggle(\'active\',on);b.textContent=on?\'\\u2B07 Contain\':\'\\u2922 Fullheight\';});">\u2922 Fullheight</button>'
-
-        # Comment button + panel
-        cmt_btn = f'<button class="tiktok-comment-btn" onclick="event.stopPropagation();var p=this.nextElementSibling;p.classList.toggle(\'open\');">\U0001f4ac</button>'
-        cmt_panel = f'''<div class="tiktok-comment-panel" onclick="event.stopPropagation();">
-<button class="cmt-close" onclick="this.parentElement.classList.remove('open')">\u2715</button>
-<h4>\U0001f4ac B\u00ecnh lu\u1eadn</h4>
-<div class="cmt-list" id="tiktok-cmt-{aid}"></div>
-<input class="cmt-input" id="tiktok-cmt-name-{aid}" placeholder="T\u00ean..." maxlength="30">
-<textarea class="cmt-input" id="tiktok-cmt-text-{aid}" placeholder="Vi\u1ebft b\u00ecnh lu\u1eadn..." rows="2" maxlength="300" style="resize:none"></textarea>
-<button class="cmt-send" onclick="window.bdpAddCmt('{aid}');window.bdpRenderCmtTiktok('{aid}');">G\u1eedi</button>
-</div>'''
+            fullheight_btn = '<button class="tiktok-fullheight-btn" onclick="event.stopPropagation();var c=this.closest(\'.tiktok-fullscreen-container\');c.classList.toggle(\'fullheight-mode\');var on=c.classList.contains(\'fullheight-mode\');c.querySelectorAll(\'.tiktok-fullheight-btn\').forEach(function(b){b.classList.toggle(\'active\',on);b.textContent=on?\'\\u2B07 Contain\':\'\\u2922 Fullheight\';});">\u2922 Fullheight</button>'
 
         slides.append(f'''<div class="tiktok-slide" data-index="{vi}" data-aid="{aid}">
-{vt}
+{vtag}
 <div class="tiktok-pause-icon">\u25b6</div>
 <div class="tiktok-seek-controls">
 <button class="tiktok-seek-btn" onclick="event.stopPropagation();window.bdpSeek(this,-10)">\u23ea 10s</button>
 <button class="tiktok-seek-btn" onclick="event.stopPropagation();window.bdpSeek(this,10)">10s \u23e9</button>
 </div>
 <div class="tiktok-bottom">
-<span class="bdp-badge {badge}">{source_label}</span>
+<span class="bdp-badge {badge_cls}">{source_label}</span>
 <p class="tiktok-title">{v["title"]}</p>
 <div class="tiktok-actions">
-<button class="tiktok-action-btn" onclick="{sj}">\U0001f4e4</button>
+<button class="tiktok-action-btn" onclick="{share_js}">\U0001f4e4 Chia s\u1ebb</button>
 </div>
 </div>
-{fh_btn}
-{cmt_btn}
-{cmt_panel}
+{fullheight_btn}
 <div class="tiktok-unmute-hint" onclick="window.bdpTikTokUnmute(this)">\U0001f507 B\u1eadt ti\u1ebfng</div>
 <span class="tiktok-counter">{vi+1}/{len(ordered)}</span>
 </div>''')
@@ -243,53 +268,20 @@ def _build_tiktok_html(videos, current_url, source_label):
         click = f"window.bdpOpen('{app.esc(v['link'])}','{aid}','{sl}')"
         list_cards.append(f'''<div class="bdp-card" onclick="{click}">
 <div class="bdp-card-img"><img src="{img}" alt="" class="bdp-lazy-img"><div class="bdp-play-overlay">\u25b6</div></div>
-<div class="bdp-card-body"><span class="bdp-badge {badge}">{source_label}</span>
+<div class="bdp-card-body"><span class="bdp-badge {badge_cls}">{source_label}</span>
 <h3 class="bdp-card-title">{v["title"]}</h3></div></div>''')
 
-    grid = f'<div class="bdp-wrap"><div class="bdp-topbar"><span>\U0001f3ac Video</span><span>{len(ordered)} video</span></div><div class="bdp-grid">{"".join(list_cards)}</div></div>'
+    grid_html = f'''<div class="bdp-wrap"><div class="bdp-topbar"><span>\U0001f3ac Video</span><span>{len(ordered)} video</span></div>
+<div class="bdp-grid">{''.join(list_cards)}</div></div>'''
 
     mode_class = "shorts-feed-mode" if is_shorts else ""
     return f'''<div class="tiktok-fullscreen-container {mode_class}" id="tiktok-fullscreen-feed">
 <div class="tiktok-fullscreen-feed">{''.join(slides)}</div>
 </div>
-{grid}'''
+{grid_html}'''
 
 app.read_article = _patched_read_article
 
-# ══ Patch JS: add bdpShareWithImage and bdpRenderCmtTiktok functions ══
-# These are added via CSS (actually head meta won't work, but we can add to JS_FUNC)
-_orig_js = app.JS_FUNC
-_extra_js = """
-/* Share with image for og:image */
-window.bdpShareWithImage=async function(title,sl,aid,imgUrl){
-    var hashUrl=SPACE_BASE+'/#/'+sl+'/'+aid;
-    var sd={title:title,url:hashUrl,text:title};
-    if(navigator.share){try{await navigator.share(sd);return;}catch(e){if(e.name==='AbortError')return;}}
-    if(navigator.clipboard&&navigator.clipboard.writeText){try{await navigator.clipboard.writeText(hashUrl);window.bdpToast('\\u2705 \\u0110\\u00e3 sao ch\\u00e9p li\\u00ean k\\u1ebft!');return;}catch(e){}}
-    var ta=document.createElement('textarea');ta.value=hashUrl;ta.style.cssText='position:fixed;opacity:0';
-    document.body.appendChild(ta);ta.focus();ta.select();
-    try{document.execCommand('copy');window.bdpToast('\\u2705 \\u0110\\u00e3 sao ch\\u00e9p!');}catch(e){}
-    document.body.removeChild(ta);
-};
-/* Render comments in TikTok panel */
-window.bdpRenderCmtTiktok=function(a){
-    var l=document.getElementById('tiktok-cmt-'+a);if(!l)return;
-    try{var c=JSON.parse(localStorage.getItem('bdp_cmt_'+a))||[];}catch(e){var c=[];}
-    if(!c.length){l.innerHTML='<div style="color:#666;font-size:11px;">Ch\\u01b0a c\\u00f3 b\\u00ecnh lu\\u1eadn</div>';return;}
-    var h='';for(var i=c.length-1;i>=0;i--){var x=c[i];h+='<div class="cmt-item"><b style="color:#5cb87a">'+x.name+'</b> <span style="color:#555;font-size:10px">'+x.date+'</span><div>'+x.text.replace(/</g,'&lt;')+'</div></div>';}
-    l.innerHTML=h;
-};
-"""
-
-# Inject extra JS before the closing } of the JS_FUNC
-if "bdpShareWithImage" not in _orig_js:
-    # Insert before the last closing brace and the hash routing section
-    insert_point = _orig_js.rfind("var hh=window.location.hash")
-    if insert_point > 0:
-        app.JS_FUNC = _orig_js[:insert_point] + _extra_js + "\n" + _orig_js[insert_point:]
-    else:
-        app.JS_FUNC = _orig_js.rstrip().rstrip("}") + _extra_js + "\n}"
-
 # Patch CSS on demo
 app.demo.css = app.CSS