analyzthis_design 2.5.2 → 2.6.0

package/dist/lib/mcp-server.js

@@ -208,23 +208,55 @@ var TOOLS = [
   },
   {
     name: 'analyzthis_mood_board',
-    description: 'Mood Board or UI image board. Mood: tagged URLs + team deliberation. UI: Zara scouts 3-5 real shipped screens, then Arjun/Noor/Priya/Meera jury. She re-scouts if they skip (max 3 rounds). Use for visual direction before designing.',
+    description: 'Visual mood board. Zara crops 20-24 real UI elements (cards, tables, type, colour, nav) from 6+ live sites into a sectioned collage with real colours and fonts. Arjun/Noor/Priya/Meera vote as advice. The board opens in the browser and the USER clicks keep / maybe / reject — the user\'s choice overrides every persona, and the locked direction is saved for all personas. kind=mood keeps the older link-and-tag board.',
     inputSchema: {
       type: 'object',
       properties: {
         task: { type: 'string', description: 'Visual direction brief (e.g., "B2B fintech dashboard, trustworthy, high-contrast, data-dense")' },
-        kind: { type: 'string', enum: ['mood', 'ui'], description: 'mood = tagged URLs (default). ui = Zara image-board scout.' },
-        action: { type: 'string', enum: ['create', 'frames', 'jury', 'verdict'], description: 'create (default), frames (save Zara picks), jury (critique prompt), verdict (SHIP/REVISE/BLOCK after jury)' },
-        verdict: { type: 'string', enum: ['SHIP', 'REVISE', 'BLOCK'], description: 'Jury verdict (action=verdict)' },
-        summary: { type: 'string', description: 'Jury because-lines (action=verdict). Sent back to Zara if they skip.' },
-        board: { type: 'string', description: 'Board id (frames and jury)' },
-        urls: { type: 'array', items: { type: 'string' }, description: 'Web reference URLs to include (mood boards)' },
-        url: { type: 'string', description: 'One frame URL (ui boards, action=frames)' },
-        title: { type: 'string', description: 'Frame title' },
-        steal: { type: 'string', description: 'One thing to take from this frame' },
-        refuse: { type: 'string', description: 'One thing we will not copy' },
-        peak: { type: 'string', description: 'The first-impression this frame proves' },
-        auto: { type: 'boolean', description: 'Auto-collect references (mood boards only)' },
+        kind: { type: 'string', enum: ['ui', 'mood'], description: 'ui = visual element board (default). mood = older tagged-URL board.' },
+        action: { type: 'string', enum: ['create', 'brief', 'capture_script', 'tiles', 'film', 'jury', 'votes', 'show', 'decide', 'rescout', 'lock', 'status', 'frames', 'verdict'], description: 'create (default) → brief → tiles (Zara crops) and film (records urls scrolling as motion tiles; needs playwright-core + Chrome) → jury → votes (advice) → show (user decides in browser) → rescout or lock. decide records a user choice from chat. frames/verdict are older names for tiles/votes.' },
+        board: { type: 'string', description: 'Board id' },
+        adjectives: { type: 'array', items: { type: 'string' }, description: 'Three feel words for the brief' },
+        not_this: { type: 'string', description: 'One thing this board must not look like' },
+        sections: { type: 'array', items: { type: 'string', enum: ['first_screen', 'typography', 'color', 'components', 'imagery', 'motion'] }, description: 'Sections this board needs' },
+        confirmed_by_user: { type: 'boolean', description: 'User approved the brief (action=brief)' },
+        selector: { type: 'string', description: 'CSS selector for action=capture_script' },
+        text: { type: 'string', description: 'Visible text that narrows the selector match (action=capture_script)' },
+        tiles: {
+          type: 'array',
+          description: 'Element crops (action=tiles)',
+          items: {
+            type: 'object',
+            properties: {
+              page_url: { type: 'string', description: 'Exact page the element came from (required)' },
+              image_path: { type: 'string', description: 'Local image file, or the saved Page.captureScreenshot JSON file' },
+              image_base64: { type: 'string', description: 'Inline Page.captureScreenshot data when no file was written' },
+              image_url: { type: 'string', description: 'Remote image URL if no local crop' },
+              video_path: { type: 'string', description: 'Local WebM/MP4 scroll film (motion tiles)' },
+              stills: { type: 'array', items: { type: 'string' }, description: 'Up to 4 waypoint still image paths for a film' },
+              section: { type: 'string', enum: ['first_screen', 'typography', 'color', 'components', 'imagery', 'motion'] },
+              element: { type: 'string', description: 'What the element is, e.g. "pricing card"' },
+              tokens: { type: 'object', description: 'From capture_script: colors, fonts, radius, spacing, font_size' },
+              steal: { type: 'string' }, refuse: { type: 'string' }, peak: { type: 'string' },
+              concept: { type: 'boolean', description: 'True if this is a concept shot, not shipped product' },
+            },
+          },
+        },
+        votes: {
+          type: 'array',
+          description: 'Persona advice (action=votes): [{tile, persona, vote: keep|skip, because}]',
+          items: { type: 'object' },
+        },
+        verdict: { type: 'string', enum: ['SHIP', 'REVISE', 'BLOCK'], description: 'Team advice verdict (action=votes)' },
+        summary: { type: 'string', description: 'Team because-lines (action=votes)' },
+        tile: { type: 'string', description: 'Tile number or id (action=decide)' },
+        decision: { type: 'string', enum: ['keep', 'maybe', 'reject', 'clear'], description: 'User decision (action=decide)' },
+        note: { type: 'string', description: 'User note (decide, rescout, lock)' },
+        urls: { type: 'array', items: { type: 'string' }, description: 'Reference URLs (kind=mood), or pages to film (action=film)' },
+        element: { type: 'string', description: 'Tile name (action=film), default "Scroll film — <site>"' },
+        section: { type: 'string', enum: ['first_screen', 'typography', 'color', 'components', 'imagery', 'motion'], description: 'Section for action=film (default motion)' },
+        steal: { type: 'string' }, refuse: { type: 'string' }, peak: { type: 'string' },
+        auto: { type: 'boolean', description: 'Auto-collect references (kind=mood only)' },
       },
     },
   },
@@ -475,114 +507,147 @@ function handleCombinationPass(skillId, args) {
   return { prompt: prompt, skill: skillId, task: task, persona: skillId, verdicts: 1 };
 }
 
+// One live board server per board id, kept for the life of the MCP process.
+var moodBoardServers = {};
+
+function tileCountLine(board) {
+  var sites = {};
+  board.tiles.forEach(function(t) { if (t.site) sites[t.site] = true; });
+  return board.tiles.length + ' tile(s) from ' + Object.keys(sites).length + ' site(s)';
+}
+
 function handleMoodBoard(args) {
-  var skill = readSkill('mood-board');
   var task = args.task || '';
-  var kind = args.kind === 'ui' ? 'ui' : 'mood';
+  var kind = args.kind === 'mood' ? 'mood' : 'ui';
   var action = args.action || 'create';
   var mb = require('./moodboard');
+  var view = require('./moodboard-view');
+  var ref = { boardId: args.board };
+  var zaraNext = function(board) {
+    return 'You are Zara on a Scout Pass. Open real pages in the browser. Do not invent URLs.\n\n' + board.scout.brief +
+      '\n\nBoard id: ' + board.board_id +
+      '\nToken script for Runtime.evaluate: call analyzthis_mood_board action=capture_script selector=<css>.' +
+      '\nSave tiles with action=tiles, board=' + board.board_id + ', tiles=[{page_url,image_path,section,element,tokens,steal,refuse,peak}].' +
+      '\nThen action=jury for advice, then action=show and open the URL so the user decides.';
+  };
 
-  if (action === 'frames') {
-    try {
-      var added = mb.addFrames({
-        boardId: args.board,
-        frames: args.frames || [{
-          url: args.url,
-          title: args.title,
-          steal: args.steal,
-          refuse: args.refuse,
-          peak: args.peak,
-        }],
+  try {
+    if (action === 'capture_script') {
+      return { result: mb.captureScript(args.selector || 'body', args.text || '') };
+    }
+
+    if (action === 'brief') {
+      var briefed = mb.setBrief({
+        boardId: args.board, adjectives: args.adjectives, not_this: args.not_this,
+        sections: args.sections, confirmed_by_user: args.confirmed_by_user,
       });
+      return { result: 'Brief saved.', board_id: briefed.board.board_id, brief: briefed.board.brief };
+    }
+
+    if (action === 'tiles' || action === 'frames') {
+      var tiles = args.tiles || args.frames || [{
+        page_url: args.page_url || args.url, element: args.element || args.title, section: args.section,
+        image_path: args.image_path, image_url: args.image_url, tokens: args.tokens,
+        video_path: args.video_path, stills: args.stills, steal: args.steal, refuse: args.refuse, peak: args.peak,
+      }];
+      var added = mb.addTiles({ boardId: args.board, tiles: tiles });
       return {
-        result: 'Saved. ' + added.board.frames.length + ' frame(s). Next: action=jury on board ' + added.board.board_id,
+        result: 'Saved ' + added.added.length + ' tile(s). Board now has ' + tileCountLine(added.board) +
+          '. Target ' + mb.TILE_TARGET.min + '-' + mb.TILE_TARGET.max + ' from ' + mb.TILE_TARGET.sites + '+ sites.' +
+          (added.skipped.length ? ' Skipped: ' + JSON.stringify(added.skipped) : ''),
         board_id: added.board.board_id,
-        scout: added.board.scout,
+        skipped: added.skipped,
       };
-    } catch (e) {
-      return { error: e.message };
     }
-  }
 
-  if (action === 'jury') {
-    try {
-      var juryBoard = mb.getBoard({ boardId: args.board });
-      if (!juryBoard.frames || !juryBoard.frames.length) {
-        return {
-          error: 'NEED_SCOUT',
-          board_id: juryBoard.board_id,
-          scout: juryBoard.scout,
-          prompt: 'Zara has not scouted yet.\n\n' + ((juryBoard.scout && juryBoard.scout.brief) || ''),
-        };
-      }
-      var frameLines = juryBoard.frames.map(function(f, idx) {
-        return (idx + 1) + '. ' + (f.title || 'Frame') + ' — ' + (f.url || '') +
-          '\n   Steal: ' + (f.steal || '') +
-          '\n   Refuse: ' + (f.refuse || '') +
-          '\n   Peak: ' + (f.peak || '');
-      }).join('\n');
-      var juryPrompt = 'You are the UI image-board jury: Arjun, Noor, Priya, Meera. Zara does not vote.\n\n' +
-        'Job: ' + (juryBoard.task || '') + '\n\n' +
-        'Frames:\n' + frameLines + '\n\n' +
-        'KEEP or SKIP each frame with one because-sentence. Rank the best 2-3. Verdict SHIP only if the set fits the job. REVISE or BLOCK sends Zara to scout again.\n' +
-        'Do not reward cinematic marketing motion on a daily working surface.\n\n' +
-        'Then call analyzthis_mood_board with action=verdict, board=' + juryBoard.board_id +
-        ', verdict=SHIP|REVISE|BLOCK, and summary=the because-lines.';
-      return { prompt: juryPrompt, board_id: juryBoard.board_id, scout: juryBoard.scout, frames: juryBoard.frames };
-    } catch (e) {
-      return { error: e.message };
+    if (action === 'jury') {
+      var juryBoard = mb.loadUiBoard(ref);
+      if (!juryBoard.tiles.length) return { error: 'NEED_SCOUT: Zara has not added tiles yet.' };
+      return { prompt: mb.juryPrompt(juryBoard, ''), board_id: juryBoard.board_id };
     }
-  }
 
-  if (action === 'verdict') {
-    try {
-      var judged = mb.recordJuryVerdict({
-        boardId: args.board,
-        verdict: args.verdict,
-        summary: args.summary,
+    if (action === 'votes' || action === 'verdict') {
+      var voted = mb.recordPersonaVotes({
+        boardId: args.board, votes: args.votes || [], verdict: args.verdict, summary: args.summary,
       });
-      var scout = judged.board.scout || {};
-      if (scout.status === 'awaiting_scout') {
+      return {
+        result: 'Team advice saved' + (voted.ignored.length ? ' (ignored: ' + JSON.stringify(voted.ignored) + ')' : '') +
+          '. The user decides next: call action=show and open the URL in the browser.',
+        board_id: voted.board.board_id,
+        scout: voted.board.scout,
+      };
+    }
+
+    if (action === 'film') {
+      return require('./moodboard-film').filmTiles({
+        boardId: args.board, urls: args.urls || (args.page_url ? [args.page_url] : []),
+        section: args.section, element: args.element, steal: args.steal, refuse: args.refuse, peak: args.peak,
+      }).then(function(out) {
+        var added = out.saved ? out.saved.added : [];
         return {
-          result: 'Jury skipped. Zara scouts again (round ' + scout.round + ').',
-          board_id: judged.board.board_id,
-          scout: scout,
-          prompt: 'You are Zara on a Scout Pass. Search and open real pages. Do not invent URLs.\n\n' + scout.brief +
-            '\n\nBoard id: ' + judged.board.board_id + '\nAfter 3-5 new frames, call action=frames, then action=jury.',
+          result: 'Filmed ' + added.length + ' site(s) as motion tiles' + (out.saved ? '. Board now has ' + tileCountLine(out.saved.board) : '') + '.' +
+            (out.failed.length ? ' Failed: ' + JSON.stringify(out.failed) : '') +
+            (out.saved && out.saved.skipped.length ? ' Skipped: ' + JSON.stringify(out.saved.skipped) : ''),
+          board_id: args.board,
         };
-      }
-      if (scout.status === 'raj') {
+      }).catch(function(e) { return { error: e.message }; });
+    }
+
+    if (action === 'show') {
+      var existing = moodBoardServers[args.board];
+      if (existing) return { result: 'Board is live at ' + existing.url + ' — open it with browser_navigate.', url: existing.url };
+      return view.serveBoard({ boardId: args.board }).then(function(live) {
+        moodBoardServers[args.board] = live;
         return {
-          result: 'Max scout rounds reached. Raj or the designer picks from the frames on this board.',
-          board_id: judged.board.board_id,
-          scout: scout,
+          result: 'Board is live at ' + live.url + ' — open it with browser_navigate. The user clicks keep / maybe / reject; their choice overrides every persona.',
+          url: live.url,
         };
-      }
-      return {
-        result: 'Jury SHIP. Board is done. User still /accept on the notes.',
-        board_id: judged.board.board_id,
-        scout: scout,
-      };
-    } catch (e) {
-      return { error: e.message };
+      }).catch(function(e) { return { error: e.message }; });
+    }
+
+    if (action === 'decide') {
+      var decided = mb.recordUserDecision({ boardId: args.board, tile: args.tile, decision: args.decision, note: args.note });
+      return { result: 'User decision saved on tile ' + args.tile + '. It outranks every persona vote.', board_id: decided.board.board_id };
+    }
+
+    if (action === 'rescout') {
+      var again = mb.requestRescout({ boardId: args.board, note: args.note });
+      return { prompt: zaraNext(again.board), board_id: again.board.board_id, scout: again.board.scout };
+    }
+
+    if (action === 'lock') {
+      var locked = mb.lockDirection({ boardId: args.board, note: args.note });
+      return { result: 'Direction locked by the user and saved to the session as design_direction. Every persona must follow it.', direction: locked.board.direction };
+    }
+
+    if (action === 'status') {
+      var b = mb.loadUiBoard(ref);
+      return { result: JSON.stringify({ board_id: b.board_id, scout: b.scout, brief: b.brief, tiles: tileCountLine(b), direction: mb.computeDirection(b) }, null, 2) };
     }
+  } catch (e) {
+    return { error: e.message };
   }
 
   if (kind === 'ui') {
-    if (!task) return { error: 'task is required to open a UI image board' };
-    try {
-      var created = mb.buildMoodBoard({ task: task, kind: 'ui', discover: false });
-      var prompt = 'You are Zara on a Scout Pass. Search and open real pages. Do not invent URLs.\n\n' +
-        created.board.scout.brief + '\n\n' +
-        'Board id: ' + created.board.board_id + '\n' +
-        'After 3-5 frames, call analyzthis_mood_board again with action=frames, board=' + created.board.board_id +
-        ', and url/title/steal/refuse/peak. Then action=jury.\n';
-      return { prompt: prompt, board_id: created.board.board_id, scout: created.board.scout, task: task };
-    } catch (e) {
-      return { error: e.message };
-    }
+    if (!task) return { error: 'task is required to open a mood board' };
+    return mb.buildMoodBoard({
+      task: task, kind: 'ui', discover: false,
+      brief: { adjectives: args.adjectives, not_this: args.not_this, sections: args.sections },
+    }).then(function(created) {
+      return {
+        prompt: 'First show the user this brief (job, 3 adjectives, one "not this", sections) and let them correct it with action=brief confirmed_by_user=true.\n\n' + zaraNext(created.board),
+        board_id: created.board.board_id,
+        brief: created.board.brief,
+      };
+    }).catch(function(e) { return { error: e.message }; });
   }
 
+  return handleLinkMoodBoard(args);
+}
+
+function handleLinkMoodBoard(args) {
+  var skill = readSkill('mood-board');
+  var task = args.task || '';
   var urls = (args.urls || []).join('\n');
   var prompt = 'Build a mood board.\n\n' +
     (skill ? skill.slice(0, 3000) : '') + '\n\n' +
@@ -971,8 +1036,8 @@ function startStdioServer(catalog) {
     if (method === 'tools/call') {
       var toolName = params.name;
       var toolArgs = params.arguments || {};
-      var result = handleToolCall(toolName, toolArgs);
-
+      // Some tools (mood board create / show) are async.
+      Promise.resolve().then(function() { return handleToolCall(toolName, toolArgs); }).then(function(result) {
       if (result.error) {
         send({
           jsonrpc: '2.0',
@@ -995,6 +1060,9 @@ function startStdioServer(catalog) {
           },
         });
       }
+      }).catch(function(e) {
+        send({ jsonrpc: '2.0', id: id, error: { code: -32603, message: e.message } });
+      });
       return;
     }
 

package/dist/lib/moodboard-film.js

@@ -0,0 +1,119 @@
+'use strict';
+
+/**
+ * Mood board scroll films.
+ *
+ * filmSite  — opens a real page in headless Chrome, records it scrolling
+ *   through four depths with its animations running, and saves a still at
+ *   each depth. Wheel events drive the scroll so sites with their own scroll
+ *   engine (Lenis, Locomotive, WebGL) move too.
+ * filmTiles — films each URL and puts the result on a UI board as a
+ *   motion tile (film + poster + waypoint stills), then cleans up.
+ *
+ * Needs `playwright-core` (optional dependency) and Google Chrome installed.
+ */
+
+var fs = require('fs');
+var os = require('os');
+var path = require('path');
+
+var DEFAULTS = { width: 1280, height: 860, stops: 4, settleMs: 3000, holdMs: 1200 };
+
+function loadPlaywright() {
+  var tries = [function() { return require('playwright-core'); },
+    function() { return require(require.resolve('playwright-core', { paths: [process.cwd()] })); }];
+  for (var i = 0; i < tries.length; i++) {
+    try { return tries[i](); } catch (e) { /* try next location */ }
+  }
+  throw new Error('Scroll films need playwright-core. Run: npm install playwright-core (Google Chrome must be installed).');
+}
+
+function launchChrome(chromium) {
+  return chromium.launch({ channel: 'chrome', headless: true }).catch(function() {
+    return chromium.launch({ headless: true });
+  }).catch(function() {
+    throw new Error('Could not start Chrome. Install Google Chrome, or run: npx playwright-core install chromium');
+  });
+}
+
+function wait(ms) { return new Promise(function(r) { setTimeout(r, ms); }); }
+
+// Wheel-scrolls `distance` px in small steps so the film shows real motion.
+function wheelBy(page, distance) {
+  var steps = Math.max(1, Math.round(distance / 60));
+  var chain = Promise.resolve();
+  for (var i = 0; i < steps; i++) {
+    chain = chain.then(function() { return page.mouse.wheel(0, 60); }).then(function() { return wait(40); });
+  }
+  return chain;
+}
+
+async function filmSite(opts) {
+  var given = opts || {};
+  opts = Object.assign({}, DEFAULTS);
+  Object.keys(given).forEach(function(k) { if (given[k] != null) opts[k] = given[k]; });
+  if (!/^https?:\/\//i.test(String(opts.url || ''))) throw new Error('Film needs an http(s) url');
+  var outDir = opts.outDir || fs.mkdtempSync(path.join(os.tmpdir(), 'analyzthis-film-'));
+  var size = { width: opts.width, height: opts.height };
+  var browser = await launchChrome(loadPlaywright().chromium);
+  var context;
+  try {
+    context = await browser.newContext({ viewport: size, recordVideo: { dir: outDir, size: size } });
+    var page = await context.newPage();
+    await page.goto(opts.url, { waitUntil: 'domcontentloaded', timeout: 30000 });
+    await wait(opts.settleMs);
+    await page.mouse.move(size.width / 2, size.height / 2);
+    var docH = await page.evaluate(function() { return document.documentElement.scrollHeight; });
+    // Virtual-scroll sites report no page height; still travel three screens.
+    var travel = Math.max(docH - size.height, size.height * 3);
+    var stills = [];
+    for (var i = 0; i < opts.stops; i++) {
+      if (i > 0) await wheelBy(page, Math.round(travel / opts.stops));
+      await wait(opts.holdMs);
+      var still = path.join(outDir, 'still-' + (i + 1) + '.png');
+      await page.screenshot({ path: still });
+      stills.push(still);
+    }
+    var video = page.video();
+    await context.close();
+    context = null;
+    return { url: opts.url, video: await video.path(), stills: stills, dir: outDir };
+  } finally {
+    if (context) await context.close().catch(function() {});
+    await browser.close().catch(function() {});
+  }
+}
+
+async function filmTiles(opts) {
+  opts = opts || {};
+  var urls = (opts.urls || []).filter(Boolean);
+  if (!opts.boardId || !urls.length) throw new Error('--board and at least one --url are required');
+  var mb = require('./moodboard');
+  var films = [];
+  var failed = [];
+  for (var i = 0; i < urls.length; i++) {
+    try { films.push(await filmSite({ url: urls[i], stops: opts.stops })); }
+    catch (e) { failed.push({ url: urls[i], reason: e.message }); }
+  }
+  var saved = null;
+  try {
+    if (films.length) {
+      saved = mb.addTiles({
+        project: opts.project, boardId: opts.boardId, workspaceDir: opts.workspaceDir,
+        tiles: films.map(function(f) {
+          return {
+            page_url: f.url, section: opts.section || 'motion',
+            element: opts.element || 'Scroll film — ' + mb.siteOf(f.url),
+            video_path: f.video, stills: f.stills,
+            steal: opts.steal, refuse: opts.refuse, peak: opts.peak,
+          };
+        }),
+      });
+    }
+  } finally {
+    films.forEach(function(f) { fs.rmSync(f.dir, { recursive: true, force: true }); });
+  }
+  return { saved: saved, failed: failed };
+}
+
+module.exports = { filmSite: filmSite, filmTiles: filmTiles, loadPlaywright: loadPlaywright };