From d302287dd7bef40fcb2856587b27916b5f596fb2 Mon Sep 17 00:00:00 2001 From: tmk3ki Date: Wed, 22 Jul 2026 12:12:19 +0900 Subject: [PATCH] =?UTF-8?q?=E5=AE=9F=E6=B3=81=E3=83=A2=E3=83=BC=E3=83=89?= =?UTF-8?q?=E3=81=AE=E5=A4=B1=E6=95=97=E3=82=92=E5=8F=AF=E8=A6=96=E5=8C=96?= =?UTF-8?q?(=E3=82=A8=E3=83=A9=E3=83=BC=E3=83=AC=E3=82=B9=E3=83=9D?= =?UTF-8?q?=E3=83=B3=E3=82=B9=E3=82=92console.error=E3=81=AB=E5=87=BA?= =?UTF-8?q?=E5=8A=9B=E3=80=81=E8=A7=A3=E5=83=8F=E5=BA=A6/=E3=83=95?= =?UTF-8?q?=E3=83=AC=E3=83=BC=E3=83=A0=E3=83=AC=E3=83=BC=E3=83=88=E5=88=B6?= =?UTF-8?q?=E7=B4=84=E3=81=A7=E5=AE=89=E5=AE=9A=E5=8C=96)=E3=80=82?= =?UTF-8?q?=E3=83=81=E3=83=A3=E3=83=83=E3=83=88=E3=83=91=E3=83=8D=E3=83=AB?= =?UTF-8?q?=E3=81=AEmin-height:0=E4=B8=8D=E8=B6=B3=E3=81=AB=E3=82=88?= =?UTF-8?q?=E3=82=8B=E3=83=AC=E3=82=A4=E3=82=A2=E3=82=A6=E3=83=88=E5=9C=A7?= =?UTF-8?q?=E8=BF=AB=E3=83=90=E3=82=B0=E3=82=92=E4=BF=AE=E6=AD=A3=E3=80=81?= =?UTF-8?q?100vh=E2=86=92100svh=E3=81=AB=E5=A4=89=E6=9B=B4?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- web/index.html | 19 ++++++++++++++----- 1 file changed, 14 insertions(+), 5 deletions(-) diff --git a/web/index.html b/web/index.html index bb704b9..4f1bfd3 100644 --- a/web/index.html +++ b/web/index.html @@ -41,8 +41,8 @@ font-size: 20px; line-height: 1; vertical-align: middle; user-select: none; display: inline-block; white-space: nowrap; word-wrap: normal; direction: ltr; } - .app { display: grid; grid-template-columns: 1fr 380px; height: 100vh; } - .videoPane { display: flex; flex-direction: column; min-width: 0; padding: 12px; gap: 10px; position: relative; } + .app { display: grid; grid-template-columns: 1fr 380px; height: 100vh; height: 100svh; } + .videoPane { display: flex; flex-direction: column; min-width: 0; min-height: 0; padding: 12px; gap: 10px; position: relative; } .topBar { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; } .brand { font-weight: 700; font-size: 16px; display: flex; align-items: center; gap: 6px; margin-right: auto; } @@ -126,7 +126,8 @@ .searchStage .searchList { flex: 1; overflow-y: auto; padding: 8px; } .chatPane { - display: flex; flex-direction: column; min-width: 0; + display: flex; flex-direction: column; min-width: 0; min-height: 0; + max-height: 100vh; max-height: 100svh; background: var(--surface); border-left: 1px solid var(--outline); } .chatHeader { padding: 14px 16px; border-bottom: 1px solid var(--outline); display: flex; flex-direction: column; gap: 8px; } @@ -609,7 +610,11 @@ async function sendWatchClip(blob) { form.append('history', JSON.stringify(chatHistory.slice(-6))); try { const res = await fetch('/api/watch', { method: 'POST', body: form }); - if (!res.ok) return; + if (!res.ok) { + const bodyText = await res.text().catch(() => ''); + console.error('watch clip request failed', res.status, bodyText, 'clip size(bytes):', blob.size); + return; + } const data = await res.json(); const reaction = (data.reaction || '').trim(); const now = Date.now(); @@ -629,11 +634,15 @@ async function startWatchMode() { return; } try { - watchStream = await navigator.mediaDevices.getDisplayMedia({ video: true, audio: true }); + watchStream = await navigator.mediaDevices.getDisplayMedia({ + video: { width: { ideal: 960 }, height: { ideal: 540 }, frameRate: { ideal: 5, max: 10 } }, + audio: true, + }); } catch (e) { console.error('getDisplayMedia failed', e); return; } + console.log('watch stream tracks:', watchStream.getVideoTracks().map(t => t.getSettings()), watchStream.getAudioTracks().map(t => t.getSettings())); if (watchStream.getAudioTracks().length === 0) { alert('音声トラックが取得できませんでした。共有元は「Chromeタブ」を選び、「タブの音声を共有」にチェックを入れ直してください(画面全体/ウィンドウ共有だとmacOSでは音声が乗りません)。'); watchStream.getTracks().forEach((t) => t.stop());