fix(wall): CSS card video FPT 100% match Short AI card, remove redundant video button, player uses buildTikTokSlide

static/app_v2.js

@@ -400,10 +400,11 @@ function _fptRender(){
     return;
   }
   const vids = _fptVideos.slice(0, 30);
-  _hlLeagueData['fptplay'] = vids;   // reuse the highlight feed player
+  // Render FPT Play videos using the SAME wall card CSS as Short AI cards
+  // (via _makeYTFeedWallItem) — 100% match with card video Short AI.
   let h = '<div class="slider-wrap"><div class="slider-header"><span class="slider-label">📺 FPT Play Bóng Đá</span><span class="slider-note">' + vids.length + ' video · tự cập nhật</span></div><div class="slider-track" id="fpt-main-track">';
   vids.forEach((a,i)=>{
-    h += _hlItemHtml('fptplay', a, i);
+    h += _makeYTFeedWallItem(a, i);
   });
   h += '</div></div>';
   el.innerHTML = h;
@@ -565,23 +566,23 @@ async function _ytFetchFeed(){
 }
 function _makeYTFeedWallItem(v, i){
   // Render a YouTube feed video using the SAME CSS classes as makeWallItem
-  // so it looks like a native Tường AI post. Opens the YouTube embed in the
-  // TikTok-style viewer when clicked (same as Short HOT embeds).
+  // so it looks like a native Tường AI post (100% match with card video Short AI).
+  // Opens the YouTube embed in the same TikTok-style viewer used by Short AI.
   var img = (typeof _proxyImg === 'function') ? _proxyImg(v.img) : v.img;
   var thumbContent = img
-    ? '<img src="'+img+'" style="width:100%;height:auto;max-width:100%;object-fit:contain" loading="lazy" onerror="this.style.display=\'none\'">'
+    ? '<img src="'+img+'" loading="lazy" onerror="this.style.display=\'none\'">'
     : '<div style="width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#0d1117,#1a3a2a);color:#5cb87a;font-size:24px">▶</div>';
   var videoBadge = '<div class="wall-video-badge">🎬</div>';
   var callOpen = "openYTEmbedFeed('"+esc(v.videoId)+"','"+esc(v.title)+"')";
-  var makeBtn = '<button class="wall-btn-video" onclick="event.stopPropagation();'+callOpen+'">▶ Xem Short</button>';
-  var designBtn = '<button class="wall-btn-make" onclick="event.stopPropagation();'+callOpen+'">🎬 Xem video</button>';
-  return '<div class="wall-item" style="flex:0 0 260px">' +
-    '<div class="wall-thumb" style="aspect-ratio:auto;max-height:340px;background:#000">' +
+  return '<div class="wall-item" id="wall-item-yt-'+esc(v.videoId||i)+'" style="flex:0 0 260px">' +
+    '<div class="wall-thumb">' +
       thumbContent + videoBadge +
     '</div>' +
     '<div class="wall-title">' + esc(v.title) + '</div>' +
     '<div class="wall-text">' + esc((v.published||'').replace(/T.*/,'') ) + '</div>' +
-    '<div class="wall-actions"><button class="primary" onclick="event.stopPropagation();'+callOpen+'">▶ Xem</button>' + designBtn + '</div>' +
+    '<div class="wall-actions"><button class="primary" onclick="event.stopPropagation();'+callOpen+'">▶ Xem</button>' +
+    '<button class="wall-btn-video" onclick="event.stopPropagation();'+callOpen+'">▶ Xem Short</button>' +
+    '</div>' +
   '</div>';
 }
 
@@ -615,22 +616,32 @@ function _renderYTFeedInWall(){
 }
 
 function openYTEmbedFeed(videoId, title){
-  // Open a YouTube embed in the same TikTok-style viewer used for Short HOT
+  // Open a YouTube embed in the SAME TikTok-style viewer used by Short AI
+  // (buildTikTokSlide + initTikTokFeed) — 100% match with Short AI player.
   showView('view-tiktok');
   var el = document.getElementById('view-tiktok');
   if(!el){ return; }
   var embedUrl = 'https://www.youtube.com/embed/' + videoId + '?autoplay=1&rel=0&enablejsapi=1';
-  var thumb = 'https://i.ytimg.com/vi/' + videoId + '/hqdefault.jpg';
-  var h = '<button class="back-btn" onclick="switchCat(\'home\')">← Tường AI</button>'
-    + '<div class="tiktok-container"><div class="tiktok-feed" id="tiktok-feed">'
-    + '<div class="tiktok-slide" style="background:#000">'
-    + '<div class="yt-thumb-wrap" style="background-image:url(\'' + thumb + '\')">'
+  var vtag = '<div class="yt-thumb-wrap" style="background-image:url(\'https://i.ytimg.com/vi/' + videoId + '/hqdefault.jpg\')">'
     + '<iframe data-yt-src="' + embedUrl + '" allowfullscreen '
     + 'allow="accelerometer;autoplay;clipboard-write;encrypted-media;gyroscope;picture-in-picture" '
     + 'referrerpolicy="strict-origin-when-cross-origin"></iframe>'
-    + '</div>'
-    + '<div class="tiktok-bottom"><span class="badge badge-fpt">FPT Play</span>'
-    + '<p class="tiktok-title">' + (title||'Video') + '</p></div></div></div></div>';
+    + '</div>';
+  var h = '<button class="back-btn" onclick="switchCat(\'home\')">← Tường AI</button>'
+    + '<div class="tiktok-container"><div class="tiktok-feed" id="tiktok-feed">'
+    + buildTikTokSlide({
+        vtag: vtag,
+        title: title||'Video',
+        badge: 'Short AI',
+        badgeClass: 'badge-ai',
+        videoId: videoId,
+        idx: 0,
+        total: 1,
+        shareUrl: embedUrl,
+        postId: '',
+        extraBtn: ''
+      })
+    + '</div></div>';
   el.innerHTML = h;
   setTimeout(function(){ initTikTokFeed(); }, 200);
 }