bluemsi/connectai
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity
Files
3c2b62c018cd1806b4253a1e362a842d41552642
connectai/media/sidebar.html
T
g1nation 3c2b62c018 chore: version up to v2.80.30 and package vsix
2026-05-11 12:44:38 +09:00

192 lines
11 KiB
HTML
Raw Blame History

<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<title>Astra</title>
<script src="https://cdn.jsdelivr.net/npm/marked/marked.min.js"></script>
<link rel="stylesheet" href="__STYLES_URI__">
</head>
<body>
<div class="header">
<div class="header-top">
<div class="brand"><div class="logo">✦</div> Astra</div>
<div class="header-actions">
<button class="icon-btn" id="newChatBtn" data-tooltip="New Chat">New</button>
<button class="icon-btn" id="saveWikiRawBtn" data-tooltip="Save Wiki Raw">Wiki</button>
<button class="icon-btn active" id="brainTraceBtn" data-tooltip="Second Brain Trace Mode">Trace</button>
<button class="icon-btn" id="brainTraceDebugBtn" data-tooltip="Second Brain Debug JSON">Dbg</button>
<button class="icon-btn" id="internetBtn" data-tooltip="Internet Access">Web</button>
<button class="icon-btn" id="historyBtn" data-tooltip="View History">Log</button>
<button class="icon-btn" id="settingsBtn" data-tooltip="Settings">Set</button>
</div>
</div>
<div class="header-controls">
<div class="select-stack">
<div class="select-line">
<div class="status-pill"><span id="statusDot" class="status-dot"></span><span id="engineStatusText">Engine</span></div>
<div class="select-wrap"><select id="modelSel" title="Select Model"></select></div>
</div>
<div class="paired-row">
<div class="control-row">
<div class="select-wrap"><select id="brainSel" title="Select Brain"></select></div>
<div class="tool-group" aria-label="Brain actions">
<button class="icon-btn" id="addBrainBtn" data-tooltip="Add Brain">Add</button>
<button class="icon-btn" id="editBrainBtn" data-tooltip="Edit Brain">Edit</button>
<button class="icon-btn" id="deleteBrainBtn" data-tooltip="Delete Brain">Del</button>
<button class="icon-btn" id="brainBtn" data-tooltip="Sync Knowledge">Sync</button>
</div>
</div>
<div class="control-row">
<div class="select-wrap"><select id="agentSel" title="Select Agentic Skill"></select></div>
<div class="tool-group" aria-label="Agent actions">
<button class="icon-btn" id="addAgentBtn" data-tooltip="Create Agent">Add</button>
<button class="icon-btn" id="editAgentBtn" data-tooltip="Edit Agent Skill">Edit</button>
<button class="icon-btn" id="deleteAgentBtn" data-tooltip="Delete Agent Skill">Del</button>
</div>
</div>
<div class="control-row">
<div class="select-wrap"><select id="knowledgeScopeSel" title="Knowledge folders mapped to this agent"></select></div>
<div class="tool-group" aria-label="Knowledge map actions">
<button class="icon-btn" id="editKnowledgeMapBtn" data-tooltip="Edit Agent ↔ Knowledge Map">Map</button>
<button class="icon-btn" id="reloadKnowledgeMapBtn" data-tooltip="Reload Knowledge Map">Rld</button>
</div>
</div>
</div>
<div class="control-row">
<div class="select-wrap"><select id="designerSel" title="Select Designer Project"></select></div>
<div class="tool-group" aria-label="Designer actions">
<button class="icon-btn" id="addDesignerBtn" data-tooltip="Create Designer Project">Add</button>
<button class="icon-btn" id="openDesignerBtn" data-tooltip="Open Record Folder">Open</button>
</div>
</div>
<div class="control-row record-row">
<div class="status-pill" id="chronicleAutoStatus" title="Project records are saved automatically after meaningful project turns.">
<span class="status-dot ready"></span><span>Auto Records</span>
</div>
<div class="select-wrap"><select id="chronicleRecordSel" title="Select Chronicle Record"></select></div>
<div class="tool-group" aria-label="Chronicle record actions">
<button class="icon-btn" id="refreshChronicleRecordsBtn" data-tooltip="Refresh Records">Ref</button>
<button class="icon-btn" id="openChronicleRecordBtn" data-tooltip="Open Selected Record">Open</button>
</div>
</div>
</div>
</div>
</div>
<div id="historyOverlay" class="history-overlay">
<div style="display:flex; justify-content:space-between; align-items:center; margin-bottom:20px;">
<h2 style="color:var(--text-bright);">Chat History</h2>
<button class="icon-btn" id="closeHistoryBtn">✕</button>
</div>
<div id="historyList" style="flex:1; overflow-y:auto;"></div>
</div>
<div id="agentMapOverlay" class="history-overlay">
<div style="display:flex; justify-content:space-between; align-items:center; margin-bottom:14px;">
<div>
<h2 style="color:var(--text-bright); margin:0;">Agent Mapping</h2>
<p style="margin:4px 0 0; font-size:11px; color:var(--text-dim);">
선택한 에이전트에 <strong>지식 폴더</strong>와 <strong>외부 스킬 폴더/파일</strong>을 연결합니다.
</p>
</div>
<button class="icon-btn" id="closeAgentMapBtn">✕</button>
</div>
<div class="map-agent-row">
<div class="field-label">Agent</div>
<div id="agentMapAgentName" class="map-agent-name">(선택된 에이전트가 없습니다)</div>
</div>
<div class="map-section">
<div class="map-section-head">
<div>
<div class="map-section-title">📚 Knowledge Folders</div>
<div class="map-section-hint">Brain 안에서 검색(RAG)에 사용할 폴더입니다. 폴더가 Brain 외부면 자동으로 제외됩니다.</div>
</div>
<button class="secondary-btn" id="addKnowledgeFolderBtn">+ 폴더 추가</button>
</div>
<ul id="knowledgeFolderList" class="map-list"></ul>
</div>
<div class="map-section">
<div class="map-section-head">
<div>
<div class="map-section-title">🛠 External Skills</div>
<div class="map-section-hint">.md 스킬 파일이 들어 있는 폴더 또는 개별 .md 파일을 연결하세요. 채팅 시 항상 함께 로드됩니다.</div>
</div>
<div class="map-btn-group">
<button class="secondary-btn" id="addSkillFolderBtn">+ 폴더 추가</button>
<button class="secondary-btn" id="addSkillFileBtn">+ 파일 추가</button>
</div>
</div>
<ul id="skillFolderList" class="map-list"></ul>
</div>
<div class="map-footer">
<button class="secondary-btn" id="editAgentMapJsonBtn" title="고급 사용자용: JSON으로 직접 편집">JSON 편집</button>
<div style="flex:1"></div>
<button class="secondary-btn" id="cancelAgentMapBtn">취소</button>
<button class="send-btn" id="saveAgentMapBtn">저장</button>
</div>
<div id="agentMapStatus" class="map-status"></div>
</div>
<div class="thinking-bar" id="thinkingBar"></div>
<div id="stepper" class="stepper-container">
<div class="steps">
<div class="step" id="step-analyze"><div class="step-dot"></div><div class="step-label">Analyze</div></div>
<div class="step" id="step-plan"><div class="step-dot"></div><div class="step-label">Plan</div></div>
<div class="step" id="step-execute"><div class="step-dot"></div><div class="step-label">Execute</div></div>
<div class="step" id="step-verify"><div class="step-dot"></div><div class="step-label">Verify</div></div>
</div>
</div>
<div class="chat" id="chat">
<div class="welcome">
<div class="welcome-logo">✦</div>
<div class="welcome-title">Welcome to Astra</div>
<p>Your premium local AI assistant.<br>Ready to analyze projects and build reports.</p>
</div>
</div>
<div class="input-wrap">
<div id="agentConfigPanel" class="panel">
<div class="field-label">Agent Persona/Instructions</div>
<textarea id="agentPrompt" rows="5" placeholder="Agent Persona & Instructions..."></textarea>
<div class="field-label">Negative Prompt (Strict Rules)</div>
<textarea id="negativePrompt" rows="2" placeholder="What NOT to do..."></textarea>
<button id="updateAgentBtn" class="secondary-btn">Update Agent Skill</button>
</div>
<div class="input-box">
<div id="attachPreview" class="attachment-preview"></div>
<textarea id="input" rows="1" placeholder="Type your request..."></textarea>
<div class="input-footer">
<div class="footer-left">
<button class="icon-btn" id="attachBtn" title="Attach Files">📎</button>
<span id="statusLabel" style="font-size:10px; color:var(--text-dim);">Ready</span>
</div>
<div class="footer-right">
<button id="cancelBtn" class="cancel-btn" title="Clear draft" style="display:none;">✕ Clear</button>
<button id="stopBtn" class="stop-btn" title="Stop generation" style="display:none;">■ Stop</button>
<button id="sendBtn" class="send-btn">Send</button>
</div>
</div>
<div id="toastNotif" class="toast-notif"></div>
</div>
<div class="input-group">
<button class="action-btn" style="flex:1" id="inputNewChatBtn">New Chat</button>
<button class="action-btn" style="flex:1" id="inputSyncBtn">Sync Knowledge</button>
</div>
</div>
<input type="file" id="fileInput" multiple hidden accept="image/*,.txt,.md,.pdf,.csv,.json,.js,.ts,.py,.java,.rs,.go">
</div>
<script src="__SCRIPT_URI__"></script>
</body>
</html>
Reference in New Issue View Git Blame Copy Permalink