v3.2.2: 폴더블 폰 모바일 패널 토글 전면 수정 + 탐정앱 네트워크 분석 + 음성 유틸
- mobToggle 가드 640→1024: 음악·슬라이드·코드·날씨·언어·치과·ESP32·아두이노 앱 (CSS max-width:1024px인데 JS guard가 >640으로 남아 폴드 내부화면에서 토글 불가) - #mob-tabbar z-index 400/490→600, 패널 bottom 0→52px, backdrop inset 0 0 52px 0 (backdrop이 탭바를 가려 열린 상태에서 다른 탭 전환 불가 문제 해결) - 모든 innerWidth<=640 자동트리거 →<=1024 통일 (9개 앱) - 탐정앱: 네트워크 분석 패널 (IP조회/Traceroute/Nmap/DNS/WHOIS/SSL/취약점/해시/웹스캔/배너/CVE) - voice-utils.js 분리 — 서브앱 공통 음성입력+TTS 유틸 - app.js: 컨텍스트 토큰 게이지 (세션 목록에 tok/max 표시), usage 이벤트 처리 - routes-music.ts: Demucs 보컬분리 + YouTube 다운로드 잡 관리 (TTL 자동정리) - server-v2.ts: 탐정 네트워크 API (traceroute/dns/whois/ssl/nmap/vuln/hash/webscan/cve) - session.ts: resolveNumCtx export, /api/agent/session contextTokenEstimate 노출 - config.json: 카카오 채널 설정, ITS 교통 API 키 vault 참조 - styles.css: app-mic-btn / app-tts-btn 공통 스타일 Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Claude Sonnet 4.6
+13
-8
@@ -136,24 +136,24 @@ body{background:var(--bg);color:var(--text);font-family:system-ui,sans-serif;dis
|
||||
@media(max-width:1024px){
|
||||
.lw-resize{display:none;}
|
||||
.lw-sb{
|
||||
position:fixed;top:0;left:0;bottom:0;z-index:500;
|
||||
position:fixed;top:0;left:0;bottom:52px;z-index:500;
|
||||
width:80vw;max-width:300px;
|
||||
transform:translateX(-100%);transition:transform .25s ease;
|
||||
box-shadow:4px 0 24px rgba(0,0,0,.4);
|
||||
}
|
||||
.lw-sb.mob-open{transform:translateX(0);}
|
||||
.lw-chat{
|
||||
position:fixed;top:0;right:0;bottom:0;z-index:500;
|
||||
position:fixed;top:0;right:0;bottom:52px;z-index:500;
|
||||
width:92vw;max-width:380px;
|
||||
transform:translateX(100%);transition:transform .25s ease;
|
||||
box-shadow:-4px 0 24px rgba(0,0,0,.4);
|
||||
}
|
||||
.lw-chat.mob-open{transform:translateX(0);}
|
||||
#mob-backdrop{display:none;position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:499;}
|
||||
#mob-backdrop{display:none;position:fixed;inset:0 0 52px 0;background:rgba(0,0,0,.5);z-index:499;}
|
||||
#mob-backdrop.show{display:block;}
|
||||
.lw-center{width:100%;}
|
||||
.lw-center-body{padding-bottom:64px;}
|
||||
#mob-tabbar{display:flex !important;position:fixed;bottom:0;left:0;right:0;z-index:400;background:var(--panel);border-top:1px solid var(--line);height:52px;}
|
||||
#mob-tabbar{display:flex !important;position:fixed;bottom:0;left:0;right:0;z-index:600;background:var(--panel);border-top:1px solid var(--line);height:52px;}
|
||||
.lw-textarea,input,textarea{font-size:16px !important;}
|
||||
}
|
||||
@media(min-width:1025px){
|
||||
@@ -161,6 +161,7 @@ body{background:var(--bg);color:var(--text);font-family:system-ui,sans-serif;dis
|
||||
#mob-backdrop{display:none !important;}
|
||||
}
|
||||
</style>
|
||||
<script src="voice-utils.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
@@ -275,6 +276,7 @@ body{background:var(--bg);color:var(--text);font-family:system-ui,sans-serif;dis
|
||||
<div class="lw-msgs" id="chat-msgs"></div>
|
||||
<div class="lw-input-bar">
|
||||
<textarea class="lw-textarea" id="chat-input" rows="1" placeholder="법률 질문을 입력하세요..." onkeydown="handleKey(event)" oninput="autoResize(this)"></textarea>
|
||||
<button class="app-mic-btn" id="mic-btn" onclick="toggleMicRecording()" title="음성 입력">🎤</button>
|
||||
<button class="lw-send" id="send-btn" onclick="sendMessage()">전송</button>
|
||||
</div>
|
||||
</div>
|
||||
@@ -445,7 +447,7 @@ function renderResults(data,query){
|
||||
}
|
||||
|
||||
async function selectResult(idx){
|
||||
if(window.innerWidth<=640) mobCloseAll();
|
||||
if(window.innerWidth<=1024) mobCloseAll();
|
||||
document.querySelectorAll('.lw-result-item').forEach(el=>el.classList.remove('active'));
|
||||
const el=document.getElementById('ri-'+idx);
|
||||
if(el)el.classList.add('active');
|
||||
@@ -518,7 +520,9 @@ function addMsg(role,html){
|
||||
const msgs=document.getElementById('chat-msgs');
|
||||
const div=document.createElement('div');div.className='lw-msg '+role;
|
||||
const b=document.createElement('div');b.className='lw-bubble';b.innerHTML=html;
|
||||
div.appendChild(b);msgs.appendChild(div);msgs.scrollTop=msgs.scrollHeight;
|
||||
div.appendChild(b);
|
||||
if(role==='assistant'){const tb=document.createElement('button');tb.className='app-tts-btn';tb.title='음성으로 듣기';tb.textContent='🔊';tb.onclick=function(){playTTSText(tb,b.innerText);};div.appendChild(tb);}
|
||||
msgs.appendChild(div);msgs.scrollTop=msgs.scrollHeight;
|
||||
return b;
|
||||
}
|
||||
|
||||
@@ -542,13 +546,13 @@ async function sendMessage(){
|
||||
const msg=input.value.trim();
|
||||
if(!msg||document.getElementById('send-btn').disabled)return;
|
||||
input.value='';autoResize(input);
|
||||
if(window.innerWidth<=640) mobToggle('chat');
|
||||
if(window.innerWidth<=1024) mobToggle('chat');
|
||||
addMsg('user',escHtml(msg));
|
||||
await callChat(msg);
|
||||
}
|
||||
|
||||
function sendQuick(msg){
|
||||
if(window.innerWidth<=640) mobCloseAll();
|
||||
if(window.innerWidth<=1024) mobCloseAll();
|
||||
addMsg('user',escHtml(msg));callChat(msg);
|
||||
}
|
||||
|
||||
@@ -611,6 +615,7 @@ function autoResize(el){el.style.height='auto';el.style.height=Math.min(el.scrol
|
||||
await loadHistory();
|
||||
await Promise.all([loadSkill(),loadModels()]);
|
||||
addMsg('system','⚖️ 법률 어시스턴트입니다. 법령/판례 검색이나 법률 질문을 입력하세요.');
|
||||
initAppVoice(sendMessage);
|
||||
document.getElementById('chat-input').focus();
|
||||
})();
|
||||
</script>
|
||||
|
||||
Reference in New Issue
Block a user