@orchyn/mcp 1.17.6 → 1.17.8

package/dist/shared/tools.js

@@ -11,7 +11,7 @@ import { OrchynError } from "./orchyn.js";
 import { formatPaywallError, runVideoAnalysis, validatePostUrl } from "./video.js";
 import { ORCHYN_UI_TEMPLATE } from "./ui-template.js";
 /** Current MCP server version — bumped on every deploy for traceability. */
-export const MCP_SERVER_VERSION = "1.17.6";
+export const MCP_SERVER_VERSION = "1.17.7";
 /** MCP Apps extension identifier */
 const UI_EXTENSION = "io.modelcontextprotocol/ui";
 /** MIME type for MCP Apps HTML resources */

package/dist/shared/ui-template.js

@@ -49,15 +49,29 @@ body{font-family:system-ui,-apple-system,'Segoe UI',sans-serif;background:var(--
 .stagger>*:nth-child(8){animation-delay:.4s}
 
 /* ─── Cards ─── */
-.gallery{display:flex;flex-wrap:wrap;gap:10px;}
-.card{border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;width:300px;background:var(--card);display:inline-block;vertical-align:top;box-shadow:var(--shadow-sm);transition:var(--transition);cursor:default;}
+.gallery-wrap{position:relative;margin:0 -4px}
+.gallery{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;-webkit-overflow-scrolling:touch;padding:4px 4px 8px;scrollbar-width:none}
+.gallery::-webkit-scrollbar{display:none}
+.gallery-dots{display:flex;justify-content:center;gap:6px;margin-top:10px;flex-wrap:wrap}
+.gallery-dots .dot{width:8px;height:8px;border-radius:50%;background:var(--border);border:none;cursor:pointer;transition:var(--transition);padding:0}
+.gallery-dots .dot.active{background:var(--accent);transform:scale(1.3)}
+.gallery-nav{position:absolute;top:50%;transform:translateY(-50%);width:32px;height:32px;border-radius:50%;background:var(--card);border:1px solid var(--border);box-shadow:var(--shadow-md);cursor:pointer;z-index:2;display:flex;align-items:center;justify-content:center;font-size:14px;color:var(--fg);transition:var(--transition);opacity:0}
+.gallery-wrap:hover .gallery-nav{opacity:1}
+.gallery-nav:hover{background:var(--accent);color:#fff}
+.gallery-nav.prev{left:-16px}
+.gallery-nav.next{right:-16px}
+.card{border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;width:380px;min-width:380px;background:var(--card);display:block;box-shadow:var(--shadow-sm);transition:var(--transition);cursor:default;scroll-snap-align:start;flex-shrink:0}
 .card:hover{box-shadow:var(--shadow-md);transform:translateY(-2px);border-color:var(--muted);}
 .card-wide{width:100%;}
-.card img{width:100%;height:200px;object-fit:cover;display:block;transition:transform .3s ease;}
+.card img{width:100%;height:260px;object-fit:cover;display:block;transition:transform .3s ease;}
 .card:hover img{transform:scale(1.02);}
 .card-wide img{max-height:340px;}
-.card video{width:100%;display:block;background:#000;border:none;outline:none;}
-.card-wide video{max-height:500px;}
+.card video{width:100%;min-height:220px;max-height:520px;display:block;background:#000;border:none;outline:none;object-fit:contain;}
+.card-wide video{max-height:520px;}
+.video-wrap{width:100%;background:#000;position:relative;overflow:hidden;}
+.video-wrap.v{aspect-ratio:9/16;max-height:520px;}
+.video-wrap.h{aspect-ratio:16/9;max-height:360px;}
+.video-wrap.sq{aspect-ratio:1/1;max-height:440px;}
 .card-body{padding:14px 16px;}
 
 /* ─── Badges & Tags ─── */
@@ -347,13 +361,12 @@ body{font-family:system-ui,-apple-system,'Segoe UI',sans-serif;background:var(--
       else if(platform==="tiktok"||platform==="douyin")isVertical=true;
       else if(platform==="youtube"&&dur>0&&dur<=60)isVertical=true;
       else if(platform==="instagram")isVertical=true;
-      var videoAR=isVertical?"56.25%":"";
-      var videoMaxH=isVertical?(wide?"500px":"380px"):(wide?"340px":"250px");
-      mediaHtml='<div class="video-wrap" style="width:100%;aspect-ratio:16/9;background:#000;position:relative;overflow:hidden">'
+      var arCls=isVertical?"v":"h";
+      var _vc="video-wrap "+arCls;
+      mediaHtml='<div class=""+_vc+"">'
         +'<video src="'+esc(video)+'" controls preload="metadata" playsinline '
         +'poster="'+esc(thumb)+'" '
-        +'style="width:100%;height:100%;object-fit:contain;display:block;background:#000" '
-        +'onloadedmetadata="onVideoLoaded(this)"'
+        +'style="width:100%;height:100%;object-fit:contain;display:block;background:#000">'
         +'Your browser does not support video playback.</video></div>';
     }else if(images.length>1){
       // Carousel / multi-image gallery — horizontally scrollable strip.
@@ -434,7 +447,7 @@ body{font-family:system-ui,-apple-system,'Segoe UI',sans-serif;background:var(--
       var vt=a.viralTriggers.slice(0,8).map(function(t){return'<span class="tag clickable" onclick="copyText(this.dataset.v)" data-v="'+esc(t)+'">🔥 '+esc(t)+"</span>";}).join("");
       sections+=section("Viral Triggers",vt);
     }
-    if(a.suggestedHook)sections+=section("Suggested Hook",'<div class="quote-box">'+esc(a.suggestedHook)+'<button class="copy-btn" onclick="copyText(\\''+esc(a.suggestedHook).replace(/'/g,"\\\\'")+'\\')">Copy</button></div>',true);
+    if(a.suggestedHook)sections+=section("Suggested Hook",'<div class="quote-box">'+esc(a.suggestedHook)+'<button class="copy-btn" data-copy="'+esc(a.suggestedHook).replace(/"/g,'&quot;')+'">Copy</button></div>',true);
     if(a.suggestedHashtags&&a.suggestedHashtags.length){
       var sh=a.suggestedHashtags.slice(0,10).map(function(t){var clean=t.replace(/^#/,"");return'<span class="tag clickable" onclick="copyText(this.dataset.v)" data-v="#'+esc(clean)+'" style="background:#ede9fe;color:#6d28d9">#'+esc(clean)+"</span>";}).join("");
       sections+=section("Hashtags",sh);
@@ -484,6 +497,58 @@ body{font-family:system-ui,-apple-system,'Segoe UI',sans-serif;background:var(--
     return result;
   }
 
+  var galleryId=0;
+  function galleryWrap(cardsHtml,count){
+    var id="gal"+(galleryId++);
+    if(count<=1)return cardsHtml;
+    var dots="";
+    for(var i=0;i<count;i++)dots+='<button class="dot'+(i===0?" active":"")+'" data-g="'+id+'" data-i="'+i+'"></button>';
+    return '<div class="gallery-wrap fade-in">'
+      +'<button class="gallery-nav prev" data-gnav="'+id+'" data-dir="-1">\u2039</button>'
+      +'<div class="gallery" id="'+id+'">'+cardsHtml+'</div>'
+      +'<button class="gallery-nav next" data-gnav="'+id+'" data-dir="1">\u203a</button>'
+      +'<div class="gallery-dots" id="'+id+'-dots">'+dots+'</div>'
+      +'</div>';
+  }
+  function initGalleryNav(){
+    document.addEventListener('click',function(e){
+      var navBtn=e.target.closest('.gallery-nav[data-gnav]');
+      if(navBtn){
+        var g=document.getElementById(navBtn.getAttribute('data-gnav'));
+        if(!g)return;
+        var dir=Number(navBtn.getAttribute('data-dir'));
+        var cardW=g.querySelector('.card')?.offsetWidth||380;
+        g.scrollBy({left:dir*(cardW+12),behavior:'smooth'});
+        return;
+      }
+      var dotBtn=e.target.closest('.dot[data-g]');
+      if(dotBtn){
+        var gId=dotBtn.getAttribute('data-g');
+        var g=document.getElementById(gId);
+        var dots=document.getElementById(gId+'-dots');
+        if(!g||!dots)return;
+        var idx=Number(dotBtn.getAttribute('data-i'));
+        var cards=g.querySelectorAll('.card');
+        if(cards[idx])cards[idx].scrollIntoView({behavior:'smooth',block:'nearest',inline:'start'});
+        dots.querySelectorAll('.dot').forEach(function(d){d.classList.remove('active')});
+        dotBtn.classList.add('active');
+      }
+    });
+    document.addEventListener('scroll',function(e){
+      if(!e.target.classList||!e.target.classList.contains('gallery'))return;
+      var g=e.target;var gId=g.id;
+      var dots=document.getElementById(gId+'-dots');
+      if(!dots)return;
+      var cards=g.querySelectorAll('.card');
+      if(!cards.length)return;
+      var scrollLeft=g.scrollLeft;var cardW=cards[0].offsetWidth+12;
+      var active=Math.round(scrollLeft/cardW);
+      active=Math.max(0,Math.min(active,cards.length-1));
+      dots.querySelectorAll('.dot').forEach(function(d,i){d.classList.toggle('active',i===active)});
+    },true);
+  }
+  initGalleryNav();
+
   function render(result){
     var app=document.getElementById("app");if(!app)return;
     var d=extractResult(result);
@@ -496,11 +561,11 @@ body{font-family:system-ui,-apple-system,'Segoe UI',sans-serif;background:var(--
     // Posts gallery
     if(d.posts&&Array.isArray(d.posts)){
       if(!d.posts.length){app.innerHTML='<div class="empty-state fade-in"><div class="icon">🔍</div><div class="text">No posts found</div></div>';return;}
-      app.innerHTML='<div class="gallery stagger">'+d.posts.map(function(p){return postCard(p,false);}).join("")+"</div>";return;}
+      app.innerHTML=galleryWrap(d.posts.map(function(p){return postCard(p,false);}).join(""),d.posts.length);return;}
     // Creators
     if(d.creators&&Array.isArray(d.creators)){
       if(!d.creators.length){app.innerHTML='<div class="empty-state fade-in"><div class="icon">👤</div><div class="text">No creators found</div></div>';return;}
-      app.innerHTML='<div class="gallery stagger">'+d.creators.map(function(c){return creatorCard(c);}).join("")+"</div>";return;}
+      app.innerHTML=galleryWrap(d.creators.map(function(c){return creatorCard(c);}).join(""),d.creators.length);return;}
     // Comments
     if(d.comments&&Array.isArray(d.comments)){
       var ch=d.comments.slice(0,15).map(function(c){
@@ -513,7 +578,7 @@ body{font-family:system-ui,-apple-system,'Segoe UI',sans-serif;background:var(--
         +'<div style="font-size:16px;font-weight:700;margin-bottom:12px">💬 Comments ('+d.comments.length+')</div>'+ch+"</div></div>";return;}
     // Sounds
     if(d.sounds&&Array.isArray(d.sounds)){
-      app.innerHTML='<div class="gallery stagger">'+d.sounds.map(function(s){
+      app.innerHTML=galleryWrap(d.sounds.map(function(s){
         var color=pColor(s.platform||"tiktok");
         var cover=s.coverUrl?'<img class="sound-cover" src="'+esc(s.coverUrl)+'" alt="cover" loading="lazy"/>'
           :'<div class="sound-cover" style="background:'+color+'15;display:flex;align-items:center;justify-content:center;font-size:26px">🎵</div>';
@@ -524,7 +589,7 @@ body{font-family:system-ui,-apple-system,'Segoe UI',sans-serif;background:var(--
           +'<div style="font-size:14px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap">'+esc(s.title||"")+"</div>"
           +'<div style="font-size:12px;color:var(--muted)">'+esc(s.artist||s.author||"")+(s.duration?" • "+esc(s.duration):"")+"</div>"
           +playBtn+"</div></div></div>";
-      }).join("")+"</div>";return;}
+      }).join(""),d.sounds.length);return;}
     // Credits
     if(d.balance!=null||d.tier){
       var bal=Number(d.balance)||0,tier=d.tier||"",ff=d.firstFreeTools||[];
@@ -562,6 +627,10 @@ body{font-family:system-ui,-apple-system,'Segoe UI',sans-serif;background:var(--
 
   // Global helpers
   window.copyText=copyText;
+  document.addEventListener('click',function(e){
+    var btn=e.target.closest('.copy-btn[data-copy]');
+    if(btn)copyText(btn.getAttribute('data-copy'));
+  });
   window.toggleSection=function(header){
     header.classList.toggle("open");
     var content=header.nextElementSibling;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@orchyn/mcp",
-  "version": "1.17.6",
+  "version": "1.17.8",
   "description": "MCP server for orchyn - fetch, discover and understand TikTok/Instagram/YouTube/X/LinkedIn posts with AI (media metadata, niche discovery, hook & viral analysis)",
   "type": "module",
   "main": "dist/index.js",