@biunow/agent-biuart 0.0.0-stage → 0.1.0

package/studio/app.js

@@ -0,0 +1,380 @@
+(() => {
+  const $ = (id) => document.getElementById(id);
+  const state = {
+    meta: null,
+    style: null,
+    format: '16:9',
+    duration: 'auto',
+    character: 'none',
+    storyboard: true,
+    assets: [],      // { name, kind, dataBase64, role:'asset' }
+    charFrames: [],  // { name, kind, dataBase64, role:'character' }
+    jobs: [],
+    jobSignatures: new Map(),
+    previewJobId: null,
+  };
+
+  async function api(path, options = {}) {
+    const res = await fetch(path, {
+      headers: { 'content-type': 'application/json' },
+      ...options,
+    });
+    const data = await res.json().catch(() => ({}));
+    if (!res.ok) throw new Error(data.error || `请求失败（${res.status}）`);
+    return data;
+  }
+
+  function showError(message) {
+    const el = $('error');
+    el.hidden = !message;
+    el.textContent = message || '';
+  }
+
+  function readFile(file) {
+    return new Promise((resolve, reject) => {
+      const reader = new FileReader();
+      reader.onload = () => resolve(String(reader.result).split(',')[1] || '');
+      reader.onerror = reject;
+      reader.readAsDataURL(file);
+    });
+  }
+
+  /* ---------- 画风 / 解说语法：图文卡片 + 悬浮大图 ---------- */
+  function mountStyleMenu() {
+    const styleOptions = state.meta.styles.map((item) => ({
+      value: item.id,
+      label: item.cn,
+      hint: item.en,
+      group: item.group,
+      thumb: item.thumb,
+      desc: item.desc,
+    }));
+    const grammarOptions = state.meta.grammars.map((item) => ({
+      value: item.id,
+      label: item.cn,
+      hint: item.en,
+      group: '解说语法',
+      thumb: item.thumb,
+      desc: item.desc,
+    }));
+    state.style = state.meta.styles[0]?.id || grammarOptions[0]?.value || '';
+    window.SelectMenu.mount($('stylePick'), {
+      value: state.style,
+      options: [...styleOptions, ...grammarOptions],
+      size: 'md',
+      onChange: (value) => {
+        state.style = value;
+        updateStylePanel();
+      },
+    });
+    updateStylePanel();
+  }
+
+  function findStyle(id) {
+    return [...state.meta.styles, ...state.meta.grammars].find((item) => item.id === id) || null;
+  }
+
+  function updateStylePanel() {
+    const item = findStyle(state.style);
+    state.style = item?.id || state.style;
+    if (!item) return;
+    $('style-group').textContent = item.group || '—';
+    const parts = [item.summary || '', item.previewable ? '可试渲染 2 秒。' : '参数化片段，由代码按 spec 渲染。'];
+    $('style-summary').textContent = parts.filter(Boolean).join(' ');
+    const canPreview = !!item.previewable && state.meta.enginePresent;
+    $('preview').disabled = !canPreview;
+    $('preview').title = canPreview ? '渲一段示例看画风' : (item.previewable ? '引擎未安装' : '这个语法没有内置示例场景');
+    $('preview-status').textContent = item.previewable
+      ? (state.meta.enginePresent ? '示例场景可用。' : '引擎未安装。')
+      : '解说语法走 spec，不提供内置预览。';
+  }
+
+  /* ---------- 小选择器：时长 / 画幅 ---------- */
+  function mountSmallMenus() {
+    window.SelectMenu.mount($('durPick'), {
+      value: 'auto',
+      options: [
+        { value: 'auto', label: '自动' },
+        { value: '30', label: '30 秒' },
+        { value: '45', label: '45 秒' },
+        { value: '60', label: '60 秒' },
+        { value: '90', label: '90 秒' },
+        { value: '120', label: '120 秒' },
+      ],
+      onChange: (value) => { state.duration = value; },
+    });
+    window.SelectMenu.mount($('formatPick'), {
+      value: '16:9',
+      options: state.meta.formats.map((item) => ({ value: item.id, label: item.label })),
+      onChange: (value) => { state.format = value; },
+    });
+  }
+
+  /* ---------- + 菜单 ---------- */
+  let charSub = null;
+  function togglePlus(force) {
+    const menu = $('plusMenu');
+    const open = force != null ? force : menu.hidden;
+    menu.hidden = !open;
+    $('plusBtn').classList.toggle('on', open);
+    if (!open && charSub) { charSub.remove(); charSub = null; }
+  }
+
+  function charLabel(id) {
+    return state.meta.characters.find((c) => c.id === id)?.cn || '不出现人物';
+  }
+
+  function updateCharHint() {
+    const n = state.charFrames.length;
+    $('charHint').textContent = state.character === 'upload'
+      ? `${charLabel('upload')} · 已选 ${n} 张`
+      : charLabel(state.character);
+  }
+
+  function openCharSub() {
+    if (charSub) { charSub.remove(); charSub = null; return; }
+    charSub = document.createElement('div');
+    charSub.className = 'plus-menu char-sub';
+    for (const c of state.meta.characters) {
+      const row = document.createElement('button');
+      row.type = 'button';
+      row.innerHTML = `<span class="plus-ico">${state.character === c.id ? '●' : '○'}</span>
+        <span><strong>${escapeHtml(c.cn)}</strong><small>${escapeHtml(c.summary)}</small></span>`;
+      row.addEventListener('click', () => {
+        state.character = c.id;
+        updateCharHint();
+        togglePlus(false);
+        if (c.id === 'upload') $('charFiles').click();
+      });
+      charSub.appendChild(row);
+    }
+    document.body.appendChild(charSub);
+    const rect = $('plusMenu').getBoundingClientRect();
+    charSub.style.left = `${rect.right + 6}px`;
+    charSub.style.top = `${rect.top}px`;
+    charSub.hidden = false;
+  }
+
+  function updateStoryboardHint() {
+    $('sbHint').textContent = state.storyboard ? '已开启：确认后再渲整片' : '已关闭：直接渲整片';
+  }
+
+  /* ---------- 素材 chips ---------- */
+  function renderAssets() {
+    const host = $('assets');
+    const all = [
+      ...state.assets.map((f, i) => ({ f, i, role: 'asset' })),
+      ...state.charFrames.map((f, i) => ({ f, i, role: 'character' })),
+    ];
+    host.hidden = !all.length;
+    host.innerHTML = '<span class="assets-label">素材</span>';
+    for (const { f, i, role } of all) {
+      const chip = document.createElement('span');
+      chip.className = 'asset';
+      chip.title = f.name;
+      chip.innerHTML = `${escapeHtml(f.name)}${role === 'character' ? '（角色）' : ''}<button type="button" aria-label="移除">×</button>`;
+      chip.querySelector('button').addEventListener('click', () => {
+        (role === 'character' ? state.charFrames : state.assets).splice(i, 1);
+        renderAssets();
+        updateCharHint();
+      });
+      host.appendChild(chip);
+    }
+  }
+
+  async function addFiles(fileList, role) {
+    const target = role === 'character' ? state.charFrames : state.assets;
+    for (const file of fileList || []) {
+      target.push({
+        name: file.name,
+        kind: file.type || 'file',
+        dataBase64: await readFile(file),
+        role,
+      });
+    }
+    renderAssets();
+    updateCharHint();
+  }
+
+  /* ---------- 任务列表 ---------- */
+  function renderJobs(jobs) {
+    const host = $('jobs');
+    const list = (jobs || []).slice(0, 8);
+    if (!list.length) {
+      host.innerHTML = '<div class="empty">还没有任务。</div>';
+      return;
+    }
+    for (const job of list) {
+      const signature = `${job.status}|${job.progress}|${job.outputMp4 || ''}|${job.message || ''}`;
+      if (state.jobSignatures.get(job.id) === signature) continue;
+      state.jobSignatures.set(job.id, signature);
+      let el = host.querySelector(`[data-job="${job.id}"]`);
+      if (!el) {
+        el = document.createElement('div');
+        el.className = 'job';
+        el.dataset.job = job.id;
+        host.prepend(el);
+      }
+      const mp4 = job.outputMp4 && /\.mp4$/i.test(job.outputMp4);
+      el.innerHTML = `
+        <div class="job-top">
+          <div class="job-title">${escapeHtml(job.title || job.styleName || '任务')}</div>
+          <span class="job-state ${job.status}">${stateLabel(job.status)}</span>
+        </div>
+        <div class="job-msg">${escapeHtml(job.message || '')}</div>
+        <div class="job-bar"><span style="width:${Math.max(0, Math.min(100, Number(job.progress) || 0))}%"></span></div>
+        ${mp4 ? `<video class="job-video" controls playsinline preload="metadata" src="/api/file?path=${encodeURIComponent(job.outputMp4)}"></video>` : ''}
+        <div class="job-actions">
+          ${job.projectPath ? `<span class="job-msg">${escapeHtml(job.projectPath)}</span>` : ''}
+          ${job.error ? `<span class="job-msg">${escapeHtml(job.error)}</span>` : ''}
+        </div>
+      `;
+    }
+  }
+
+  function stateLabel(status) {
+    return { running: '进行中', done: '完成', failed: '失败', queued: '排队', cancelled: '取消' }[status] || status || '—';
+  }
+
+  function escapeHtml(value) {
+    return String(value || '')
+      .replace(/&/g, '&amp;')
+      .replace(/</g, '&lt;')
+      .replace(/>/g, '&gt;')
+      .replace(/"/g, '&quot;');
+  }
+
+  async function refreshJobs() {
+    try {
+      const { jobs } = await api('/api/jobs');
+      state.jobs = jobs || [];
+      renderJobs(state.jobs);
+      if (state.previewJobId) {
+        const job = state.jobs.find((item) => item.id === state.previewJobId);
+        if (job?.status === 'done' && job.outputMp4) {
+          $('preview-video').hidden = false;
+          $('preview-video').src = `/api/file?path=${encodeURIComponent(job.outputMp4)}`;
+          $('preview-status').textContent = '示例已就绪。';
+          state.previewJobId = null;
+        } else if (job?.status === 'failed') {
+          $('preview-status').textContent = `试渲染失败：${job.error || '未知错误'}`;
+          state.previewJobId = null;
+        } else if (job) {
+          $('preview-status').textContent = `试渲染 ${job.progress || 0}% · ${job.message || ''}`;
+        }
+      }
+    } catch (error) {
+      console.error(error);
+    }
+  }
+
+  /* ---------- 动作 ---------- */
+  async function createPreview() {
+    const item = findStyle(state.style);
+    if (!item?.previewable) return;
+    showError('');
+    $('preview').disabled = true;
+    try {
+      const { job } = await api('/api/preview', {
+        method: 'POST',
+        body: JSON.stringify({ style: item.id, seconds: 2, format: state.format }),
+      });
+      state.previewJobId = job.id;
+      $('preview-status').textContent = '已排队，正在启动 Chromium…';
+      await refreshJobs();
+    } catch (error) {
+      showError(error.message);
+    } finally {
+      $('preview').disabled = false;
+    }
+  }
+
+  async function submit(event) {
+    event.preventDefault();
+    showError('');
+    const prompt = $('prompt').value.trim();
+    if (!prompt) {
+      showError('请先写下这支片子要讲什么。');
+      return;
+    }
+    if (state.character === 'upload' && !state.charFrames.length) {
+      showError('选择了「我上传角色图片」，请从 + 菜单上传至少一张角色图。');
+      return;
+    }
+    $('submit').disabled = true;
+    $('submit').textContent = '正在提交…';
+    try {
+      const data = await api('/api/create', {
+        method: 'POST',
+        body: JSON.stringify({
+          title: prompt.slice(0, 40),
+          style: state.style,
+          prompt,
+          format: state.format,
+          durationSec: state.duration,
+          character: state.character,
+          storyboard: state.storyboard,
+          files: [...state.assets, ...state.charFrames],
+        }),
+      });
+      await refreshJobs();
+      if (data.kickoffOk) {
+        $('submit').textContent = '已开拍';
+      } else {
+        showError('创作简报已就绪，但自动开拍未成功：请打开任务里的工程目录，按 START_IN_DSH.md 继续。');
+        $('submit').textContent = '开始创作';
+      }
+    } catch (error) {
+      showError(error.message);
+      $('submit').textContent = '开始创作';
+    } finally {
+      $('submit').disabled = false;
+    }
+  }
+
+  /* ---------- 启动 ---------- */
+  async function boot() {
+    try {
+      state.meta = await api('/api/meta');
+      mountStyleMenu();
+      mountSmallMenus();
+      updateCharHint();
+      updateStoryboardHint();
+      const chips = [];
+      chips.push(`<span class="chip ${state.meta.enginePresent ? '' : 'bad'}">${state.meta.enginePresent ? '引擎已就绪' : '引擎未安装'}</span>`);
+      if (!state.meta.canExport) chips.push('<span class="chip warn">未激活</span>');
+      $('health-chips').innerHTML = chips.join('');
+      $('engine-line').textContent = state.meta.enginePresent
+        ? `Engine: ${state.meta.engineRoot}`
+        : 'ENGINE_ROOT 未设置：把面板 settings.engineRoots["biuart"] 指向 huashu-art-motion/scripts/engine。';
+      if (!state.meta.enginePresent) {
+        $('preview').disabled = true;
+        $('submit').disabled = true;
+      }
+      await refreshJobs();
+      setInterval(refreshJobs, 3000);
+    } catch (error) {
+      showError(error.message);
+    }
+  }
+
+  $('prompt').addEventListener('input', () => {
+    $('count').textContent = `${$('prompt').value.length}/1200`;
+  });
+  $('plusBtn').addEventListener('click', (e) => { e.stopPropagation(); togglePlus(); });
+  $('uploadAssetBtn').addEventListener('click', () => { togglePlus(false); $('assetFiles').click(); });
+  $('uploadCharBtn').addEventListener('click', (e) => { e.stopPropagation(); openCharSub(); });
+  $('storyboardBtn').addEventListener('click', () => {
+    state.storyboard = !state.storyboard;
+    updateStoryboardHint();
+  });
+  $('assetFiles').addEventListener('change', (e) => { void addFiles(e.target.files, 'asset'); e.target.value = ''; });
+  $('charFiles').addEventListener('change', (e) => { void addFiles(e.target.files, 'character'); e.target.value = ''; });
+  document.addEventListener('click', (e) => {
+    if (!e.target.closest('.plus-wrap') && !(charSub && charSub.contains(e.target))) togglePlus(false);
+  });
+  $('preview').addEventListener('click', createPreview);
+  $('refresh').addEventListener('click', refreshJobs);
+  $('submit').addEventListener('click', submit);
+  boot();
+})();

package/studio/assert-panel-permit.mjs

@@ -0,0 +1,67 @@
+#!/usr/bin/env node
+/**
+ * Assert cwd/project has a valid panel Run Permit.
+ *   node assert-panel-permit.mjs --project <dir> [--agent biuremtion]
+ * Exit 0 = ok; non-zero = refuse creation.
+ */
+import fs from 'node:fs';
+import path from 'node:path';
+import os from 'node:os';
+
+function arg(name, fallback = '') {
+  const i = process.argv.indexOf(name);
+  if (i >= 0 && process.argv[i + 1]) return process.argv[i + 1];
+  return fallback;
+}
+
+function defaultPanelHome() {
+  if (process.env.DSH_PANEL_HOME) return path.resolve(process.env.DSH_PANEL_HOME);
+  const base = process.env.LOCALAPPDATA || path.join(os.homedir(), '.local', 'share');
+  return path.join(base, 'DSH-PANEL');
+}
+
+function resolveApiBase() {
+  if (process.env.PANEL_API_BASE) return String(process.env.PANEL_API_BASE).replace(/\/$/, '');
+  const epFile = path.join(defaultPanelHome(), 'panel-endpoint.json');
+  if (!fs.existsSync(epFile)) return null;
+  try {
+    const ep = JSON.parse(fs.readFileSync(epFile, 'utf8'));
+    if (!ep.baseUrl) return null;
+    const basePath = String(ep.basePath || '/panel-api').replace(/\/$/, '') || '/panel-api';
+    return `${String(ep.baseUrl).replace(/\/$/, '')}${basePath.startsWith('/') ? basePath : `/${basePath}`}`;
+  } catch {
+    return null;
+  }
+}
+
+const projectPath = path.resolve(arg('--project', process.cwd()));
+const agentId = arg('--agent', '');
+const permitFile = path.join(projectPath, 'run-permit.json');
+
+if (!fs.existsSync(permitFile)) {
+  console.error(JSON.stringify({ ok: false, reason: 'missing-permit-file', projectPath }));
+  process.exit(2);
+}
+
+const base = resolveApiBase();
+if (!base) {
+  console.error(JSON.stringify({ ok: false, reason: 'panel-endpoint-missing' }));
+  process.exit(3);
+}
+
+const body = { projectPath };
+if (agentId) body.agentId = agentId;
+
+const res = await fetch(`${base}/agents/run-permit/verify`, {
+  method: 'POST',
+  headers: { 'content-type': 'application/json' },
+  body: JSON.stringify(body),
+});
+const data = await res.json().catch(() => ({}));
+if (!res.ok || !data.ok) {
+  if (data.message) console.error(String(data.message));
+  console.error(JSON.stringify({ ok: false, status: res.status, ...data }));
+  process.exit(4);
+}
+console.log(JSON.stringify({ ok: true, agentId: data.permit?.agentId, jobId: data.permit?.jobId }));
+process.exit(0);