tmk3ki/aibow
1
0
Fork 0
Code Issues 1 Pull requests Projects Releases Packages Wiki Activity Actions

バグ修正: AI検索結果表示時に動画が非表示になる問題を修正(誤ってPIP化していた)。検索結果・主要操作にキーボード対応(Enter/Space/Escape)を追加

Browse source
This commit is contained in:
tmk3ki 2026-07-22 10:37:23 +09:00
parent aff02e99a8
commit b28f15f75d
1 changed files with 24 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

27
web/index.html
View file

@ -81,6 +81,10 @@
.ytRow { display: flex; gap: 10px; padding: 8px; border-radius: 10px; cursor: pointer; align-items: flex-start; white-space: normal; } .ytRow { display: flex; gap: 10px; padding: 8px; border-radius: 10px; cursor: pointer; align-items: flex-start; white-space: normal; }
.ytRow:hover { background: var(--surface-3); } .ytRow:hover { background: var(--surface-3); }
.ytRow:focus-visible { outline: 2px solid var(--primary); outline-offset: 2px; background: var(--surface-3); }
.iconBtn:focus-visible, .mdSelect:focus-visible, .searchStage .searchHeader button:focus-visible {
outline: 2px solid var(--primary); outline-offset: 2px;
}
.ytRow img { width: 120px; aspect-ratio: 16/9; object-fit: cover; border-radius: 8px; background: #000; flex-shrink: 0; } .ytRow img { width: 120px; aspect-ratio: 16/9; object-fit: cover; border-radius: 8px; background: #000; flex-shrink: 0; }
.ytRow .meta { min-width: 0; } .ytRow .meta { min-width: 0; }
.ytRow .title { font-size: 13px; line-height: 1.4; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; white-space: normal; } .ytRow .title { font-size: 13px; line-height: 1.4; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; white-space: normal; }
@ -286,6 +290,12 @@ document.getElementById('playerWrap').addEventListener('click', () => {
} }
}); });
document.addEventListener('keydown', (e) => {
if (e.key === 'Escape' && document.getElementById('playerWrap').classList.contains('pip')) {
exitSearchMode();
}
});
document.getElementById('searchCancelBtn').addEventListener('click', exitSearchMode); document.getElementById('searchCancelBtn').addEventListener('click', exitSearchMode);
function loadVideo(id, opts) { function loadVideo(id, opts) {
@ -312,6 +322,9 @@ function decodeEntities(text) {
function buildYtRow(item) { function buildYtRow(item) {
const row = document.createElement('div'); const row = document.createElement('div');
row.className = 'ytRow'; row.className = 'ytRow';
row.tabIndex = 0;
row.setAttribute('role', 'button');
row.setAttribute('aria-label', decodeEntities(item.title));
const title = document.createElement('div'); const title = document.createElement('div');
title.className = 'title'; title.className = 'title';
title.textContent = decodeEntities(item.title); title.textContent = decodeEntities(item.title);
@ -328,6 +341,12 @@ function buildYtRow(item) {
row.appendChild(img); row.appendChild(img);
row.appendChild(meta); row.appendChild(meta);
row.addEventListener('click', () => loadVideo(item.videoId)); row.addEventListener('click', () => loadVideo(item.videoId));
row.addEventListener('keydown', (e) => {
if (e.key === 'Enter' || e.key === ' ') {
e.preventDefault();
loadVideo(item.videoId);
}
});
return row; return row;
} }
@ -355,6 +374,7 @@ document.getElementById('loadBtn').addEventListener('click', () => {
document.getElementById('urlInput').addEventListener('keydown', (e) => { document.getElementById('urlInput').addEventListener('keydown', (e) => {
if (e.key === 'Enter') document.getElementById('loadBtn').click(); if (e.key === 'Enter') document.getElementById('loadBtn').click();
if (e.key === 'Escape') exitSearchMode();
}); });
const modelSelect = document.getElementById('modelSelect'); const modelSelect = document.getElementById('modelSelect');
@ -369,6 +389,10 @@ modelSelect.addEventListener('change', () => {
lockIcon.classList.toggle('unlocked', modelSelect.value === 'gemini' && !!unlockCode); lockIcon.classList.toggle('unlocked', modelSelect.value === 'gemini' && !!unlockCode);
}); });
document.getElementById('unlockInput').addEventListener('keydown', (e) => {
if (e.key === 'Enter') document.getElementById('unlockBtn').click();
});
document.getElementById('unlockBtn').addEventListener('click', async () => { document.getElementById('unlockBtn').addEventListener('click', async () => {
const code = document.getElementById('unlockInput').value.trim(); const code = document.getElementById('unlockInput').value.trim();
if (!code) return; if (!code) return;
@ -475,9 +499,6 @@ async function sendChatMessage(message, opts) {
finalizeBubble(statusDiv, evt.reply, evt.videos); finalizeBubble(statusDiv, evt.reply, evt.videos);
chatHistory.push({ role: 'user', text: message }); chatHistory.push({ role: 'user', text: message });
chatHistory.push({ role: 'model', text: evt.reply }); chatHistory.push({ role: 'model', text: evt.reply });
if (evt.videos && evt.videos.length) {
setPip(true);
}
if (evt.autoPlayVideoId) { if (evt.autoPlayVideoId) {
loadVideo(evt.autoPlayVideoId, { notifyAI: false }); loadVideo(evt.autoPlayVideoId, { notifyAI: false });
} }