@@ -428,6 +445,7 @@ textarea.cprompt{width:100%;background:var(--surf);border:1px solid var(--border
✓ 저장됨 (CPU·타임아웃: worker 재시작 후 반영)
@@ -643,6 +702,7 @@ textarea.cprompt{width:100%;background:var(--surf);border:1px solid var(--border
// ══ STATE ══
let token=null,currentUser=null,ollamaModels=[],appSettings={};
let sttFile=null,sttOutputFile=null,sttEngine='whisper';
+let orModels=[],orVisionModels=[],orTextModels=[];
let ocrFile=null,ocrOutputTxt=null,ocrOutputXlsx=null,ocrEngine='paddle',ocrMode='text';
let editTarget=null,sysTimer=null;
let histPage=1,histType='',histTotal=0;
@@ -721,6 +781,8 @@ function populateModelSelects(){
fill(document.getElementById('ocr-ollama-model'),appSettings.ocr_ollama_model,'설정 기본 모델 사용');
fill(document.getElementById('setting-stt-model'),appSettings.stt_ollama_model,'(없음)');
fill(document.getElementById('setting-ocr-model'),appSettings.ocr_ollama_model,'(없음)');
+ // OpenRouter 드롭다운
+ populateOrSelects();
}
// ══ 설정 ══
@@ -729,7 +791,11 @@ async function loadSettings(){
const th=appSettings.cpu_threads||0;cpuSlider.value=th;cpuDisplay.textContent=th===0?'0 (자동)':th+' 스레드';
document.getElementById('stt-timeout').value=appSettings.stt_timeout||0;
document.getElementById('ollama-timeout').value=appSettings.ollama_timeout||600;
- populateModelSelects()}catch{}
+ if(appSettings.openrouter_url)document.getElementById('or-url').value=appSettings.openrouter_url;
+ if(appSettings.openrouter_api_key_masked)document.getElementById('or-api-key').placeholder='저장된 키: '+appSettings.openrouter_api_key_masked;
+ populateModelSelects();
+ // 기존 OR 모델 로드
+ if(appSettings.openrouter_api_key_masked)loadOrModels();}catch{}
}
document.getElementById('btn-save-settings').addEventListener('click',async()=>{
const fd=new FormData();
@@ -738,6 +804,10 @@ document.getElementById('btn-save-settings').addEventListener('click',async()=>{
fd.append('cpu_threads',cpuSlider.value);
fd.append('stt_timeout',document.getElementById('stt-timeout').value||'0');
fd.append('ollama_timeout',document.getElementById('ollama-timeout').value||'600');
+ fd.append('openrouter_url',document.getElementById('or-url').value||'https://openrouter.ai/api/v1');
+ const orKey=document.getElementById('or-api-key').value.trim();if(orKey)fd.append('openrouter_api_key',orKey);
+ fd.append('openrouter_stt_model',document.getElementById('setting-or-stt-model').value);
+ fd.append('openrouter_ocr_model',document.getElementById('setting-or-ocr-model').value);
try{const r=await api('POST','/api/settings',fd);if(r.ok){appSettings=(await r.json()).settings;const msg=document.getElementById('settings-msg');msg.style.display='block';setTimeout(()=>msg.style.display='none',3500)}}catch{}
});
document.getElementById('btn-refresh-models').addEventListener('click',loadOllamaModels);
@@ -762,10 +832,11 @@ sttDrop.addEventListener('dragover',e=>{e.preventDefault();sttDrop.classList.add
sttDrop.addEventListener('dragleave',()=>sttDrop.classList.remove('dragover'));
sttDrop.addEventListener('drop',e=>{e.preventDefault();sttDrop.classList.remove('dragover');setSttFile(e.dataTransfer.files[0])});
function setSttFile(f){if(!f)return;sttFile=f;showFileInfo('stt',f);document.getElementById('stt-btn').disabled=false;document.getElementById('stt-err').style.display='none'}
-document.querySelectorAll('#page-stt .engine-btn').forEach(btn=>{btn.addEventListener('click',()=>{document.querySelectorAll('#page-stt .engine-btn').forEach(b=>b.classList.remove('active'));btn.classList.add('active');sttEngine=btn.dataset.engine;document.getElementById('stt-ollama-opts').classList.toggle('visible',sttEngine==='whisper+ollama');document.getElementById('stt-btn').className='btn-start '+(sttEngine==='whisper+ollama'?'purple':'green')})});
+document.querySelectorAll('#page-stt .engine-btn').forEach(btn=>{btn.addEventListener('click',()=>{document.querySelectorAll('#page-stt .engine-btn').forEach(b=>b.classList.remove('active'));btn.classList.add('active');sttEngine=btn.dataset.engine;document.getElementById('stt-ollama-opts').classList.toggle('visible',sttEngine==='whisper+ollama');document.getElementById('stt-or-opts').classList.toggle('visible',sttEngine==='whisper+openrouter');const isOr=sttEngine==='whisper+openrouter',isOllama=sttEngine==='whisper+ollama';document.getElementById('stt-btn').className='btn-start '+(isOr||isOllama?'purple':'green')})});
document.getElementById('stt-btn').addEventListener('click',async()=>{
if(!sttFile)return;document.getElementById('stt-err').style.display='none';setSttLoading(true);
const fd=new FormData();fd.append('file',sttFile);fd.append('use_ollama',sttEngine==='whisper+ollama'?'true':'false');fd.append('ollama_model',document.getElementById('stt-ollama-model').value||'');
+ fd.append('use_openrouter',sttEngine==='whisper+openrouter'?'true':'false');fd.append('openrouter_model',document.getElementById('stt-or-model').value||'');
try{const r=await api('POST','/api/transcribe',fd);const d=await r.json();if(!r.ok)throw new Error(d.detail||'업로드 실패');pollTask(d.task_id,dt=>setProg('stt',dt.progress||0,dt.message||'처리 중...'),showSttResult,e=>{showErr('stt-err',e);setSttLoading(false)})}
catch(e){showErr('stt-err',e.message);setSttLoading(false)}
});
@@ -793,12 +864,13 @@ ocrDrop.addEventListener('dragover',e=>{e.preventDefault();ocrDrop.classList.add
ocrDrop.addEventListener('dragleave',()=>ocrDrop.classList.remove('dragover'));
ocrDrop.addEventListener('drop',e=>{e.preventDefault();ocrDrop.classList.remove('dragover');setOcrFile(e.dataTransfer.files[0])});
function setOcrFile(f){if(!f)return;ocrFile=f;showFileInfo('ocr',f);document.getElementById('ocr-btn').disabled=false;document.getElementById('ocr-err').style.display='none';const p=document.getElementById('ocr-preview'),w=document.getElementById('ocr-preview-wrap');p.src=URL.createObjectURL(f);w.style.display='block'}
-document.querySelectorAll('#page-ocr .engine-btn').forEach(btn=>{btn.addEventListener('click',()=>{document.querySelectorAll('#page-ocr .engine-btn').forEach(b=>b.classList.remove('active'));btn.classList.add('active');ocrEngine=btn.dataset.engine;document.getElementById('ocr-ollama-opts').classList.toggle('visible',ocrEngine==='ollama');document.getElementById('ocr-btn').className='btn-start '+(ocrEngine==='ollama'?'purple':'green')})});
+document.querySelectorAll('#page-ocr .engine-btn').forEach(btn=>{btn.addEventListener('click',()=>{document.querySelectorAll('#page-ocr .engine-btn').forEach(b=>b.classList.remove('active'));btn.classList.add('active');ocrEngine=btn.dataset.engine;document.getElementById('ocr-ollama-opts').classList.toggle('visible',ocrEngine==='ollama');document.getElementById('ocr-or-opts').classList.toggle('visible',ocrEngine==='openrouter');const isOr=ocrEngine==='openrouter',isOllama=ocrEngine==='ollama';document.getElementById('ocr-btn').className='btn-start '+(isOr||isOllama?'purple':'green')})});
document.getElementById('cprompt-toggle').addEventListener('click',()=>{const ta=document.getElementById('custom-prompt');const open=ta.style.display!=='block';ta.style.display=open?'block':'none';document.getElementById('cprompt-toggle').textContent=(open?'▼':'▶')+' 커스텀 프롬프트'});
+document.getElementById('cprompt-toggle-or').addEventListener('click',()=>{const ta=document.getElementById('custom-prompt-or');const open=ta.style.display!=='block';ta.style.display=open?'block':'none';document.getElementById('cprompt-toggle-or').textContent=(open?'▼':'▶')+' 커스텀 프롬프트'});
document.querySelectorAll('.mode-btn').forEach(btn=>{btn.addEventListener('click',()=>{document.querySelectorAll('.mode-btn').forEach(b=>b.classList.remove('active'));btn.classList.add('active');ocrMode=btn.dataset.mode;document.getElementById('mode-desc').textContent=ocrMode==='structure'?'표 구조를 감지하고 Excel로 저장합니다':'일반 텍스트와 글자를 인식합니다'})});
document.getElementById('ocr-btn').addEventListener('click',async()=>{
if(!ocrFile)return;document.getElementById('ocr-err').style.display='none';setOcrLoading(true);
- const fd=new FormData();fd.append('file',ocrFile);fd.append('mode',ocrMode);fd.append('backend',ocrEngine);fd.append('ollama_model',document.getElementById('ocr-ollama-model').value||'');fd.append('custom_prompt',document.getElementById('custom-prompt').value||'');
+ const fd=new FormData();fd.append('file',ocrFile);fd.append('mode',ocrMode);fd.append('ollama_model',document.getElementById('ocr-ollama-model').value||'');fd.append('custom_prompt',document.getElementById('custom-prompt').value||'');
try{const r=await api('POST','/api/ocr',fd);const d=await r.json();if(!r.ok)throw new Error(d.detail||'업로드 실패');pollTask(d.task_id,dt=>setProg('ocr',dt.progress||0,dt.message||'처리 중...'),showOcrResult,e=>{showErr('ocr-err',e);setOcrLoading(false)})}
catch(e){showErr('ocr-err',e.message);setOcrLoading(false)}
});
@@ -1067,6 +1139,72 @@ function fmtTime(s){const m=Math.floor(s/60),ss=Math.floor(s%60);return String(m
function esc(s){return String(s||'').replace(/&/g,'&').replace(//g,'>')}
async function copyText(text,btn){try{await navigator.clipboard.writeText(text);const o=btn.textContent;btn.textContent='복사됨 ✓';setTimeout(()=>btn.textContent=o,1500)}catch{}}
+// ══ OPENROUTER ══
+async function loadOrModels(){
+ try{
+ const r=await api('GET','/api/openrouter/models');const d=await r.json();
+ const wrap=document.getElementById('or-models-wrap');
+ if(d.connected){
+ orModels=d.models||[];orVisionModels=d.vision_models||[];orTextModels=d.text_models||[];
+ wrap.style.display='block';
+ document.getElementById('or-connected-badge').textContent=`✓ 연결됨 — Vision ${orVisionModels.length}개 / 전체 ${orModels.length}개`;
+ populateOrSelects('vision');
+ } else {
+ wrap.style.display='none';
+ }
+ }catch{}
+}
+
+let orFilter='vision';
+document.querySelectorAll('.or-model-tab').forEach(btn=>{
+ btn.addEventListener('click',()=>{
+ document.querySelectorAll('.or-model-tab').forEach(b=>b.classList.remove('active'));
+ btn.classList.add('active');orFilter=btn.dataset.filter;populateOrSelects(orFilter);
+ });
+});
+
+function populateOrSelects(filter){
+ filter=filter||orFilter;
+ const list = filter==='vision'?orVisionModels:filter==='text'?orTextModels:orModels;
+ const fillOr=(sel,def)=>{
+ const cur=sel.value||def||'';
+ sel.innerHTML='
';
+ list.forEach(m=>{const o=document.createElement('option');o.value=m;o.textContent=m;if(m===cur)o.selected=true;sel.appendChild(o)});
+ };
+ const sttSel=document.getElementById('setting-or-stt-model');
+ const ocrSel=document.getElementById('setting-or-ocr-model');
+ const sttPage=document.getElementById('stt-or-model');
+ const ocrPage=document.getElementById('ocr-or-model');
+ if(sttSel)fillOr(sttSel,appSettings.openrouter_stt_model);
+ if(ocrSel){
+ // OCR은 Vision만
+ const vlist=filter==='text'?[]:orVisionModels;
+ const cur=ocrSel.value||appSettings.openrouter_ocr_model||'';
+ ocrSel.innerHTML='
';
+ vlist.forEach(m=>{const o=document.createElement('option');o.value=m;o.textContent=m;if(m===cur)o.selected=true;ocrSel.appendChild(o)});
+ }
+ if(sttPage)fillOr(sttPage,appSettings.openrouter_stt_model);
+ if(ocrPage){
+ const cur=ocrPage.value||appSettings.openrouter_ocr_model||'';
+ ocrPage.innerHTML='
';
+ orVisionModels.forEach(m=>{const o=document.createElement('option');o.value=m;o.textContent=m;if(m===cur)o.selected=true;ocrPage.appendChild(o)});
+ }
+}
+
+document.getElementById('btn-or-test').addEventListener('click',async()=>{
+ const key=document.getElementById('or-api-key').value.trim();
+ const url=document.getElementById('or-url').value.trim()||'https://openrouter.ai/api/v1';
+ const result=document.getElementById('or-test-result');
+ if(!key){result.style.display='block';result.style.color='var(--warn)';result.textContent='API 키를 입력하세요';return}
+ result.style.display='block';result.style.color='var(--muted)';result.textContent='연결 중...';
+ try{
+ const fd=new FormData();fd.append('api_key',key);fd.append('base_url',url);
+ const r=await api('POST','/api/openrouter/test',fd);const d=await r.json();
+ result.style.color=d.ok?'var(--accent)':'var(--warn)';result.textContent=d.message;
+ if(d.ok)loadOrModels();
+ }catch{result.style.color='var(--warn)';result.textContent='요청 실패'}
+});
+
checkAuth();