João Henrique
b541f502ba
- Adicionado estrutura completa do projeto - Configurado MCP server para Premiere Pro - Adicionado documentação e skills - Configurado Gitignore para o projeto
342 lines
16 KiB
Plaintext
Executable File
342 lines
16 KiB
Plaintext
Executable File
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<title>MCP for Adobe Premiere Pro</title>
|
|
<link rel="stylesheet" href="styles.css">
|
|
</head>
|
|
<body>
|
|
<main class="panel-shell">
|
|
<header class="panel-header">
|
|
<div class="brand-mark" aria-hidden="true"><span>M</span></div>
|
|
<div class="brand-copy">
|
|
<h1>MCP for Adobe Premiere Pro</h1>
|
|
<p>Local Premiere connection</p>
|
|
</div>
|
|
<div class="auto-start"><span></span>Auto-start</div>
|
|
</header>
|
|
|
|
<nav class="tab-bar" role="tablist" aria-label="Painel">
|
|
<button class="tab-button active" id="tabBtnBridge" role="tab" aria-selected="true" aria-controls="tabBridge" onclick="switchTab('bridge')" type="button">Bridge</button>
|
|
<button class="tab-button" id="tabBtnSilence" role="tab" aria-selected="false" aria-controls="tabSilence" onclick="switchTab('silence')" type="button">Cortar silêncio</button>
|
|
<button class="tab-button" id="tabBtnSettings" role="tab" aria-selected="false" aria-controls="tabSettings" onclick="switchTab('settings')" type="button">Configurações</button>
|
|
<button class="tab-button" id="tabBtnModels" role="tab" aria-selected="false" aria-controls="tabModels" onclick="switchTab('models')" type="button">Modelos Locais</button>
|
|
</nav>
|
|
|
|
<div class="tab-panel" id="tabBridge" role="tabpanel" aria-labelledby="tabBtnBridge">
|
|
|
|
<section class="status-panel" role="status" aria-live="polite" aria-atomic="true">
|
|
<div class="status-indicator" aria-hidden="true">
|
|
<div class="status-ring"><div class="status-dot waiting" id="statusDot"></div></div>
|
|
</div>
|
|
<div class="status-copy">
|
|
<span class="section-label">Bridge status</span>
|
|
<strong id="statusText">Starting connector…</strong>
|
|
<span id="statusDetail">Checking Premiere Pro</span>
|
|
</div>
|
|
<div class="command-stat">
|
|
<strong id="cmdCount">0</strong>
|
|
<span>commands</span>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="connection-center" aria-labelledby="connectionCenterTitle">
|
|
<div class="section-heading">
|
|
<div>
|
|
<span class="section-label">Connection Center</span>
|
|
<h2 id="connectionCenterTitle">Ready-to-edit check</h2>
|
|
</div>
|
|
<button class="save-link" type="button" onclick="refreshConnectionCenter()" aria-controls="connectionChecks">Refresh</button>
|
|
</div>
|
|
<p class="connection-intro">This panel only checks Premiere. In your AI assistant, run <strong>Verify Premiere connection</strong> for the complete safe check.</p>
|
|
<ul class="connection-checks" id="connectionChecks">
|
|
<li id="checkConnector" data-state="waiting"><span class="check-dot" aria-hidden="true"></span><span><strong>Connector</strong><small>Starting…</small></span></li>
|
|
<li id="checkProject" data-state="waiting"><span class="check-dot" aria-hidden="true"></span><span><strong>Project</strong><small>Checking…</small></span></li>
|
|
<li id="checkSequence" data-state="waiting"><span class="check-dot" aria-hidden="true"></span><span><strong>Active sequence</strong><small>Checking…</small></span></li>
|
|
</ul>
|
|
</section>
|
|
|
|
<section class="config-section">
|
|
<div class="section-heading">
|
|
<div>
|
|
<span class="section-label">Configuration</span>
|
|
<h2>Bridge directory</h2>
|
|
</div>
|
|
<button class="save-link" id="btnSave" onclick="saveTempDir()" type="button" title="Save bridge directory">
|
|
<svg viewBox="0 0 20 20" aria-hidden="true"><path d="M4 3.5h9.4L16.5 6v10.5h-13v-13Z"/><path d="M6.5 3.5v5h7v-5M6.5 16.5v-5h7v5"/></svg>
|
|
Save
|
|
</button>
|
|
</div>
|
|
<label class="sr-only" for="tempDir">Temporary bridge directory</label>
|
|
<div class="path-field">
|
|
<svg viewBox="0 0 20 20" aria-hidden="true"><path d="M2.5 5.5h5l1.5 2h8.5v8h-15v-10Z"/></svg>
|
|
<input type="text" id="tempDir" value="" spellcheck="false" autocomplete="off" aria-describedby="tempDirHelp">
|
|
</div>
|
|
<p class="field-help" id="tempDirHelp">Commands and responses are exchanged through this local folder.</p>
|
|
</section>
|
|
|
|
<div class="action-row">
|
|
<button id="btnStart" class="button button-primary" onclick="startBridge()" type="button" aria-controls="log">
|
|
<svg viewBox="0 0 20 20" aria-hidden="true"><path class="fill-icon" d="m7 5 8 5-8 5V5Z"/></svg>
|
|
Start Bridge
|
|
</button>
|
|
<button id="btnStop" class="button button-stop" onclick="stopBridge()" type="button" aria-controls="log" disabled>
|
|
<svg viewBox="0 0 20 20" aria-hidden="true"><rect class="fill-icon" x="6" y="6" width="8" height="8" rx="1"/></svg>
|
|
Stop
|
|
</button>
|
|
</div>
|
|
|
|
<section class="update-section" aria-live="polite">
|
|
<div class="update-copy">
|
|
<span class="section-label">MCP updates</span>
|
|
<strong id="updateTitle">Version 1.14.9</strong>
|
|
<span id="updateDetail">Checking the global MCP server and connector release…</span>
|
|
</div>
|
|
<button id="btnUpdate" class="button button-update" onclick="handleUpdateClick()" type="button" aria-describedby="updateDetail" disabled>
|
|
Check again
|
|
</button>
|
|
</section>
|
|
|
|
<section class="activity-section">
|
|
<div class="section-heading activity-heading">
|
|
<div>
|
|
<span class="section-label">Live monitor</span>
|
|
<h2>Activity</h2>
|
|
</div>
|
|
<span class="activity-state"><span></span>Listening</span>
|
|
</div>
|
|
<div id="log" role="log" aria-live="polite" aria-relevant="additions" tabindex="0" aria-label="Bridge activity log"></div>
|
|
</section>
|
|
|
|
</div>
|
|
|
|
<div class="tab-panel" id="tabSilence" role="tabpanel" aria-labelledby="tabBtnSilence" hidden>
|
|
|
|
<section class="config-section">
|
|
<div class="section-heading">
|
|
<div>
|
|
<span class="section-label">1. Vídeo</span>
|
|
<h2>Clipe da sequência ativa</h2>
|
|
</div>
|
|
<button class="save-link" id="btnDetectClip" onclick="silenceDetectClip()" type="button">Detectar</button>
|
|
</div>
|
|
<p class="field-help" id="silenceClipInfo">Clique em Detectar com a sequência desejada aberta no Premiere.</p>
|
|
</section>
|
|
|
|
<section class="config-section" id="silenceCachedSection" hidden>
|
|
<div class="section-heading">
|
|
<div>
|
|
<span class="section-label">Transcrições salvas</span>
|
|
<h2>Já existe transcrição deste vídeo</h2>
|
|
</div>
|
|
</div>
|
|
<label class="sr-only" for="silenceCachedSelect">Transcrição salva</label>
|
|
<select id="silenceCachedSelect" class="path-field-select"></select>
|
|
<div class="action-row">
|
|
<button id="btnUseCachedTranscript" class="button button-primary" onclick="silenceUseCachedTranscript()" type="button">Usar esta e ir para o plano de cortes</button>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="config-section">
|
|
<div class="section-heading">
|
|
<div>
|
|
<span class="section-label">2. Transcrição</span>
|
|
<h2>Whisper (faster-whisper)</h2>
|
|
</div>
|
|
</div>
|
|
<label class="sr-only" for="silenceModel">Modelo</label>
|
|
<select id="silenceModel" class="path-field-select">
|
|
<option value="small" selected>small (recomendado)</option>
|
|
<option value="base">base (mais rápido)</option>
|
|
<option value="medium">medium (mais preciso)</option>
|
|
</select>
|
|
<label class="checkbox-field">
|
|
<input type="checkbox" id="silenceDiarize">
|
|
Detectar quem fala automaticamente após transcrever
|
|
</label>
|
|
<div class="action-row">
|
|
<button id="btnTranscribe" class="button button-primary" onclick="silenceTranscribe()" type="button" disabled>Transcrever</button>
|
|
</div>
|
|
<p class="field-help" id="silenceCacheInfo"></p>
|
|
<div class="action-row">
|
|
<button id="btnDiarize" class="button" onclick="silenceDiarizeSpeakers()" type="button" disabled>Detectar quem fala nesta transcrição</button>
|
|
</div>
|
|
<p class="field-help" id="silenceDiarizeInfo"></p>
|
|
<div class="action-row">
|
|
<button id="btnVoiceFeatures" class="button" onclick="silenceComputeVoiceFeatures()" type="button" disabled>Calcular pitch/energia/velocidade/pausas</button>
|
|
</div>
|
|
<p class="field-help" id="silenceVoiceFeaturesInfo"></p>
|
|
</section>
|
|
|
|
<section class="config-section">
|
|
<div class="section-heading">
|
|
<div>
|
|
<span class="section-label">3. Plano de cortes</span>
|
|
<h2>Silêncio a remover</h2>
|
|
</div>
|
|
</div>
|
|
<div class="action-row">
|
|
<button id="btnBuildPlan" class="button button-primary" onclick="silenceBuildPlan()" type="button" disabled>Gerar plano</button>
|
|
</div>
|
|
<p class="field-help" id="silencePlanInfo"></p>
|
|
</section>
|
|
|
|
<section class="config-section">
|
|
<div class="section-heading">
|
|
<div>
|
|
<span class="section-label">4. Aplicar</span>
|
|
<h2>Cortar na timeline</h2>
|
|
</div>
|
|
</div>
|
|
<p class="field-help" id="silenceApplyInfo">Revise o plano acima antes de aplicar. Esta ação não pode ser desfeita (undo indisponível nesta versão do Premiere) — um backup da sequência é criado automaticamente.</p>
|
|
<div class="action-row">
|
|
<button id="btnApplyCuts" class="button button-stop" onclick="silenceApplyCuts()" type="button" disabled>Aplicar cortes na timeline</button>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="config-section">
|
|
<div class="section-heading">
|
|
<div>
|
|
<span class="section-label">5. Plano de edição</span>
|
|
<h2>Importar plano (cut/zoom/text/marker)</h2>
|
|
</div>
|
|
</div>
|
|
<p class="field-help">Cole aqui o caminho do arquivo JSON de ações que você recebeu (ex: gerado a partir da transcrição via Claude/skill selecao-trechos). Usa a sequência detectada na seção 1.</p>
|
|
<label class="sr-only" for="editorialPlanPath">Caminho do arquivo do plano</label>
|
|
<div class="path-field">
|
|
<input type="text" id="editorialPlanPath" spellcheck="false" autocomplete="off" placeholder="/caminho/para/actions.json">
|
|
</div>
|
|
<div class="action-row">
|
|
<button id="btnApplyEditorialActions" class="button button-stop" onclick="applyEditorialActions()" type="button">Aplicar plano de edição</button>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="activity-section">
|
|
<div class="section-heading activity-heading">
|
|
<div>
|
|
<span class="section-label">Progresso</span>
|
|
<h2>Log</h2>
|
|
</div>
|
|
</div>
|
|
<div id="silenceLog" role="log" aria-live="polite" aria-relevant="additions" tabindex="0" aria-label="Silence cut log"></div>
|
|
</section>
|
|
|
|
</div>
|
|
|
|
<div class="tab-panel" id="tabSettings" role="tabpanel" aria-labelledby="tabBtnSettings" hidden>
|
|
|
|
<section class="config-section">
|
|
<div class="section-heading">
|
|
<div>
|
|
<span class="section-label">Configuração</span>
|
|
<h2>Hugging Face token</h2>
|
|
</div>
|
|
<button class="save-link" id="btnSaveHfToken" onclick="saveHfToken()" type="button" title="Salvar token">Salvar</button>
|
|
</div>
|
|
<label class="sr-only" for="hfToken">Hugging Face access token</label>
|
|
<div class="path-field">
|
|
<input type="password" id="hfToken" placeholder="hf_..." spellcheck="false" autocomplete="off" aria-describedby="hfTokenHelp">
|
|
<button type="button" class="path-field-toggle" id="btnToggleHfToken" onclick="toggleHfTokenVisibility()" aria-label="Mostrar/ocultar token">👁</button>
|
|
</div>
|
|
<p class="field-help" id="hfTokenHelp">
|
|
Usado para autenticar downloads de modelos no Hugging Face e evitar limites de requisições anônimas.
|
|
<button type="button" class="save-link" id="btnValidateHfToken" onclick="validateHfToken()">Validar</button>
|
|
</p>
|
|
<div class="hf-token-status" id="hfTokenStatus" data-state="unset">
|
|
<span class="check-dot" aria-hidden="true"></span>
|
|
<span id="hfTokenStatusText">Não configurado</span>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="config-section">
|
|
<div class="section-heading">
|
|
<div>
|
|
<span class="section-label">Configuração do Editor</span>
|
|
<h2>Personalidades de edição</h2>
|
|
</div>
|
|
</div>
|
|
<p class="field-help">
|
|
Descreva, em texto livre, como você espera que a edição seja feita (ex: "depoimento" — zoom
|
|
suave em momentos emotivos, corta hesitação; "podcast" — ritmo ágil, corta silêncio agressivo).
|
|
A personalidade marcada como ativa vai junto no JSON gerado na transcrição.
|
|
</p>
|
|
<div class="model-list" id="editorPersonalityList"></div>
|
|
<div class="action-row">
|
|
<button id="btnNewPersonality" class="button button-primary" onclick="startNewEditorPersonality()" type="button">+ Nova personalidade</button>
|
|
</div>
|
|
|
|
<div id="editorPersonalityForm" hidden>
|
|
<label class="sr-only" for="editorPersonalityName">Nome da personalidade</label>
|
|
<div class="path-field">
|
|
<input type="text" id="editorPersonalityName" placeholder="Ex: Depoimento emocional" spellcheck="false" autocomplete="off">
|
|
</div>
|
|
<label class="sr-only" for="editorPersonalityText">Descrição do comportamento</label>
|
|
<textarea id="editorPersonalityText" rows="6" placeholder="Descreva livremente o comportamento esperado do editor para esse tipo de vídeo…"></textarea>
|
|
<div class="action-row">
|
|
<button id="btnSavePersonality" class="button button-primary" onclick="saveEditorPersonalityForm()" type="button">Salvar</button>
|
|
<button id="btnCancelPersonality" class="button" onclick="cancelEditorPersonalityForm()" type="button">Cancelar</button>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
</div>
|
|
|
|
<div class="tab-panel" id="tabModels" role="tabpanel" aria-labelledby="tabBtnModels" hidden>
|
|
|
|
<section class="config-section">
|
|
<div class="section-heading">
|
|
<div>
|
|
<span class="section-label">Configuração</span>
|
|
<h2>Pasta de modelos</h2>
|
|
</div>
|
|
<button class="save-link" id="btnSaveModelsPath" onclick="saveModelsPath()" type="button" title="Salvar pasta">Salvar</button>
|
|
</div>
|
|
<label class="sr-only" for="modelsPath">Pasta de modelos</label>
|
|
<div class="path-field">
|
|
<input type="text" id="modelsPath" spellcheck="false" autocomplete="off" aria-describedby="modelsPathHelp">
|
|
</div>
|
|
<p class="field-help" id="modelsPathHelp">Onde os modelos Whisper baixados ficam armazenados. Mudar a pasta não move modelos já baixados.</p>
|
|
</section>
|
|
|
|
<section class="config-section">
|
|
<div class="section-heading">
|
|
<div>
|
|
<span class="section-label">Configuração</span>
|
|
<h2>Idioma da transcrição</h2>
|
|
</div>
|
|
<button class="save-link" id="btnSaveLanguage" onclick="saveLanguage()" type="button" title="Salvar idioma">Salvar</button>
|
|
</div>
|
|
<label class="sr-only" for="transcribeLanguage">Idioma</label>
|
|
<select id="transcribeLanguage" class="path-field-select"></select>
|
|
</section>
|
|
|
|
<section class="config-section">
|
|
<div class="section-heading">
|
|
<div>
|
|
<span class="section-label">Modelos</span>
|
|
<h2>Modelos locais (Whisper)</h2>
|
|
</div>
|
|
</div>
|
|
<div class="model-list" id="modelList"></div>
|
|
</section>
|
|
|
|
<section class="activity-section">
|
|
<div class="section-heading activity-heading">
|
|
<div>
|
|
<span class="section-label">Progresso</span>
|
|
<h2>Log</h2>
|
|
</div>
|
|
</div>
|
|
<div id="modelsLog" role="log" aria-live="polite" aria-relevant="additions" tabindex="0" aria-label="Models download log"></div>
|
|
</section>
|
|
|
|
</div>
|
|
</main>
|
|
|
|
<script src="CSInterface.js"></script>
|
|
<script src="updater.cjs"></script>
|
|
<script src="main.js"></script>
|
|
</body>
|
|
</html>
|