' +\n '

' +\n '' +\n '\\u2715' +\n '

' +\n '

';\n document.body.appendChild(overlay);\n return true;\n }\n\n function setup() {\n injectStyles();\n if (!injectMarkup()) return;\n\n var gifOverlay = document.getElementById(\"gifOverlay\");\n var gifSearchInput = document.getElementById(\"gifSearchInput\");\n var gifGrid = document.getElementById(\"gifGrid\");\n var gifCloseBtn = document.getElementById(\"gifCloseBtn\");\n var gifLabel = document.getElementById(\"gifLabel\");\n var searchTimer = null;\n\n function openPanel() {\n gifOverlay.classList.add(\"show\");\n gifSearchInput.value = \"\";\n gifSearchInput.focus();\n search(\"\");\n }\n function closePanel() {\n gifOverlay.classList.remove(\"show\");\n gifGrid.innerHTML = \"\";\n }\n function search(query) {\n gifGrid.innerHTML = '

\\u8AAD\\u307F\\u8FBC\\u307F\\u4E2D...

';\n var endpoint = query.trim()\n ? \"https://api.giphy.com/v1/gifs/search?api_key=\" + GIPHY_API_KEY + \"&q=\" + encodeURIComponent(query) + \"&limit=24&rating=pg-13&lang=ja\"\n : \"https://api.giphy.com/v1/gifs/trending?api_key=\" + GIPHY_API_KEY + \"&limit=24&rating=pg-13\";\n fetch(endpoint).then(function(res) { return res.json(); }).then(function(data) {\n var items = data.data || [];\n if (items.length === 0) {\n gifGrid.innerHTML = '

\\u898B\\u3064\\u304B\\u308A\\u307E\\u305B\\u3093\\u3067\\u3057\\u305F

';\n return;\n }\n gifGrid.innerHTML = \"\";\n items.forEach(function(g) {\n var preview = (g.images && (g.images.fixed_width_small || g.images.fixed_width) || {}).url || \"\";\n var full = (g.images && (g.images.original || g.images.fixed_width) || {}).url || \"\";\n if (!preview || !full) return;\n var img = document.createElement(\"img\");\n img.src = preview;\n img.alt = g.title || \"gif\";\n img.addEventListener(\"click\", function() {\n closePanel();\n sendGif(full);\n });\n gifGrid.appendChild(img);\n });\n }).catch(function(err) {\n console.error(err);\n gifGrid.innerHTML = '

\\u8AAD\\u307F\\u8FBC\\u307F\\u306B\\u5931\\u6557\\u3057\\u307E\\u3057\\u305F

';\n });\n }\n function getCurrentRoom() {\n var r = location.hash.replace(/^#/, \"\");\n return r || \"lobby\";\n }\n function getCurrentUserId() {\n return localStorage.getItem(\"chatUserId\") || \"unknown\";\n }\n function getCurrentName() {\n return localStorage.getItem(\"chatName\") || \"\\u540D\\u7121\\u3057\";\n }\n function getCurrentAvatar() {\n return localStorage.getItem(\"chatAvatar\") || \"\";\n }\n\n function sendGif(fullUrl) {\n try {\n fetch(\"/api/send\", {\n method: \"POST\",\n headers: { \"Content-Type\": \"application/json\" },\n body: JSON.stringify({\n room: getCurrentRoom(),\n user_id: getCurrentUserId(),\n name: getCurrentName(),\n body: \"\",\n image_url: fullUrl,\n avatar_url: getCurrentAvatar(),\n }),\n }).then(function() {\n if (typeof window.poll === \"function\") window.poll();\n }).catch(function(err) { console.error(err); });\n } catch (err) {\n console.error(err);\n }\n }\n\n gifLabel.addEventListener(\"click\", openPanel);\n gifCloseBtn.addEventListener(\"click\", closePanel);\n gifOverlay.addEventListener(\"click\", function(e) { if (e.target === gifOverlay) closePanel(); });\n gifSearchInput.addEventListener(\"input\", function() {\n clearTimeout(searchTimer);\n var q = gifSearchInput.value;\n searchTimer = setTimeout(function() { search(q); }, 350);\n });\n }\n\n if (document.readyState === \"loading\") {\n document.addEventListener(\"DOMContentLoaded\", setup);\n } else {\n setup();\n }\n})();\n`;\n\nexport default async function (req: Request): Promise {\n return new Response(gifClientJs, {\n headers: {\n \"Content-Type\": \"application/javascript; charset=utf-8\",\n \"Cache-Control\": \"no-cache\",\n },\n });\n}",[147],"c1fc9d43-e402-49b6-80f7-9133b970bd65","client.ts","9f6caee6-a7f0-11f1-b997-1607ee4eb77e",10,["D",1788478805460],"export const jsContent = `\n// ★完全独立型Push: プロフィール前でも動くようにグローバル化\nlet __pushRegistration = null;\nasync function getPushRegistration() {\n if (__pushRegistration) return __pushRegistration;\n __pushRegistration = await navigator.serviceWorker.register('/sw.js');\n return __pushRegistration;\n}\nfunction urlBase64ToUint8Array(base64String) {\n const padding = '='.repeat((4 - base64String.length % 4) % 4);\n const base64 = (base64String + padding).replace(/\\\\-/g, '+').replace(/_/g, '/');\n const rawData = window.atob(base64);\n const outputArray = new Uint8Array(rawData.length);\n for (let i = 0; i < rawData.length; ++i) outputArray[i] = rawData.charCodeAt(i);\n return outputArray;\n}\nfunction updateNotifUI() {\n const bar = document.getElementById('notifBar');\n const status = document.getElementById('notifStatus');\n if (!bar) return;\n if (!('Notification' in window)) { bar.innerHTML = '⚠️ このブラウザは通知非対応です'; bar.classList.add('show'); return; }\n if (Notification.permission === 'granted') { bar.classList.remove('show'); if (status) status.textContent = '🔔 通知オン'; }\n else if (Notification.permission === 'denied') { bar.innerHTML = '🔕 ブロック中。ブラウザ設定から通知を許可してください'; bar.classList.add('show'); }\n else { bar.classList.add('show'); if (status) status.textContent = ''; }\n}\nwindow.enablePush = async function() {\n const btn = document.getElementById('enableNotifBtn');\n if (btn) { btn.disabled = true; btn.textContent = '処理中...'; }\n try {\n if (!('serviceWorker' in navigator) || !('PushManager' in window)) throw new Error('このブラウザはPush非対応');\n if (Notification.permission === 'default') {\n const perm = await Notification.requestPermission();\n if (perm !== 'granted') throw new Error('通知が許可されませんでした: ' + perm);\n }\n if (Notification.permission !== 'granted') throw new Error('通知が許可されていません');\n const reg = await getPushRegistration();\n const res = await fetch('/api/vapid-public-key');\n const data = await res.json();\n if (!data.publicKey) throw new Error('VAPIDキー取得失敗');\n const key = urlBase64ToUint8Array(data.publicKey);\n let sub = await reg.pushManager.getSubscription();\n if (!sub) sub = await reg.pushManager.subscribe({ userVisibleOnly: true, applicationServerKey: key });\n const tmpUserId = localStorage.getItem('chatUserId') || 'tmp-' + Math.random().toString(36).slice(2,8);\n const tmpRoom = (location.hash.replace(/^#/, '') || 'lobby');\n const save = await fetch('/api/subscribe', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ user_id: tmpUserId, room: tmpRoom, subscription: sub }) });\n if (!save.ok) throw new Error('購読保存失敗');\n updateNotifUI();\n alert('通知が有効になりました。');\n } catch(e) {\n console.error(e);\n alert('❌ 失敗: ' + e.message);\n if (btn) { btn.disabled = false; btn.textContent = '有効'; }\n updateNotifUI();\n }\n};\n\nasync function setupPushNotifications() {\n try {\n if (!('serviceWorker' in navigator)) return;\n if (Notification.permission === 'granted') {\n try {\n const reg = await getPushRegistration();\n const sub = await reg.pushManager.getSubscription();\n if (sub) {\n const uid = localStorage.getItem('chatUserId') || myUserId || 'unknown';\n const rm = (typeof room !== 'undefined' && room) ? room : (location.hash.replace(/^#/, '') || 'lobby');\n await fetch('/api/subscribe', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ user_id: uid, room: rm, subscription: sub }) });\n }\n } catch {}\n }\n updateNotifUI();\n } catch(e) { console.error(e); }\n}\ndocument.getElementById('enableNotifBtn')?.addEventListener('click', window.enablePush);\n\nfunction setAppHeightVar() {\n const h = (window.visualViewport && window.visualViewport.height) ? window.visualViewport.height : window.innerHeight;\n document.documentElement.style.setProperty(\"--app-height\", h + \"px\");\n}\nsetAppHeightVar();\nwindow.addEventListener(\"resize\", setAppHeightVar);\nwindow.addEventListener(\"orientationchange\", () => setTimeout(setAppHeightVar, 50));\nif (window.visualViewport) {\n window.visualViewport.addEventListener(\"resize\", setAppHeightVar);\n window.visualViewport.addEventListener(\"scroll\", setAppHeightVar);\n}\n\nfunction getRoomFromHash() { return location.hash.replace(/^#/, \"\"); }\nfunction getUserId() {\n let id = localStorage.getItem(\"chatUserId\");\n if (!id) { id = Math.random().toString(36).slice(2, 12) + Date.now().toString(36); localStorage.setItem(\"chatUserId\", id); }\n return id;\n}\nfunction randomRoomId() { return Math.random().toString(36).slice(2, 8); }\n\nlet room = getRoomFromHash();\nconst myUserId = getUserId();\n\nconst messagesEl = document.getElementById(\"messages\"); const composer = document.getElementById(\"composer\");\nconst bodyInput = document.getElementById(\"body\");\nconst roomLabel = document.getElementById(\"roomLabel\");\nconst fileInput = document.getElementById(\"imageFile\"); const fileLabel = document.getElementById(\"fileLabel\");\nconst mentionList = document.getElementById(\"mentionList\");\nconst replyPreviewBar = document.getElementById(\"replyPreviewBar\");\nconst rpText = document.getElementById(\"rpText\");\nconst rpCancel = document.getElementById(\"rpCancel\");\nconst imagePreviewBar = document.getElementById(\"imagePreviewBar\");\nconst imagePreviewThumb = document.getElementById(\"imagePreviewThumb\");\nconst ipCancel = document.getElementById(\"ipCancel\");\nconst scrollBottomBtn = document.getElementById(\"scrollBottomBtn\");\nconst lightbox = document.getElementById(\"lightbox\");\nconst lightboxImg = document.getElementById(\"lightboxImg\");\nconst inviteBtn = document.getElementById(\"inviteBtn\");\nconst backBtn = document.getElementById(\"backBtn\");\nconst newChatBtn = document.getElementById(\"newChatBtn\");\nconst talklistItems = document.getElementById(\"talklistItems\");\nconst talkSearchInput = document.getElementById(\"talkSearchInput\");\nconst profileTabIcon = document.getElementById(\"profileTabIcon\");\n\nconst entryOverlay = document.getElementById(\"entryOverlay\");\nconst entryTitle = document.getElementById(\"entryTitle\");\nconst entrySub = document.getElementById(\"entrySub\");\nconst entryAvatarPreview = document.getElementById(\"entryAvatarPreview\");\nconst entryAvatarFile = document.getElementById(\"entryAvatarFile\");\nconst entryNameInput = document.getElementById(\"entryNameInput\");\nconst entryCancelBtn = document.getElementById(\"entryCancelBtn\");\nconst entrySubmitBtn = document.getElementById(\"entrySubmitBtn\");\n\nlet lastId = 0; let lastUpdateSeen = 0; let firstLoad = true;\nlet lastRenderedDateStr = \"\";\nlet replyingTo = null;\nlet onlineUsers = [];\nconst knownNames = new Set();\nconst msgIndex = new Map();\nconst messageData = new Map();\nlet chatPollTimer = null;\nlet currentScreen = \"talklist\";\nlet allRooms = [];\nlet pendingFirstEntry = false;\n\nconst AVATAR_COLORS = [\"#2f7cf6\", \"#5856d6\", \"#34c759\", \"#ff9500\", \"#ff2d55\", \"#00b8d9\", \"#af52de\", \"#06c755\"];\nfunction colorForKey(key) {\n let hash = 0;\n const s = String(key || \"?\");\n for (let i = 0; i < s.length; i++) { hash = (hash * 31 + s.charCodeAt(i)) >>> 0; }\n return AVATAR_COLORS[hash % AVATAR_COLORS.length];\n}\nfunction buildAvatarHtml(name, avatarUrl, colorKey) {\n if (avatarUrl) return ' $\"avatar\"$ ';\n const trimmed = (name || \"\").trim();\n const letter = escapeHtml(trimmed ? trimmed.charAt(0).toUpperCase() : \"?\");\n const color = colorForKey(colorKey || name || \"?\");\n return '

' + letter + \"

\";\n}\n\nfunction loadProfile() {\n const name = localStorage.getItem(\"chatName\");\n if (!name) return null;\n const avatar = localStorage.getItem(\"chatAvatar\") || \"\";\n return { name, avatar };\n}\nfunction saveProfileToStorage(name, avatar) {\n localStorage.setItem(\"chatName\", name);\n if (avatar) { localStorage.setItem(\"chatAvatar\", avatar); } else { localStorage.removeItem(\"chatAvatar\"); }\n}\nlet currentProfile = loadProfile();\nfunction getDisplayName() { return (currentProfile && currentProfile.name) || \"名無し\"; }\nfunction getAvatarUrl() { return (currentProfile && currentProfile.avatar) || \"\"; }\nfunction updateProfileTabIcon() {\n if (profileTabIcon) profileTabIcon.innerHTML = buildAvatarHtml(getDisplayName(), getAvatarUrl(), myUserId);\n}\n\nlet entryDraftAvatar = \"\";\n\nfunction updateEntryAvatarPreview() {\n if (entryDraftAvatar) {\n entryAvatarPreview.innerHTML = ' $\"avatar$ ';\n return;\n }\n const v = (entryNameInput.value || \"\").trim();\n entryAvatarPreview.innerHTML = v ? escapeHtml(v.charAt(0).toUpperCase()) : \"＋\";\n}\n\nfunction openEntryOverlay(editMode) {\n pendingFirstEntry = !editMode;\n entryDraftAvatar = editMode ? getAvatarUrl() : \"\";\n entryNameInput.value = editMode ? getDisplayName() : \"\";\n entryAvatarFile.value = \"\";\n updateEntryAvatarPreview();\n entryTitle.textContent = editMode ? \"プロフィール設定\" : \"ようこそ\";\n entrySub.textContent = editMode ? \"名前とアイコンを変更できます\" : \"名前とアイコンを設定して始めましょう\";\n entrySubmitBtn.textContent = editMode ? \"保存\" : \"はじめる\";\n entryCancelBtn.style.display = editMode ? \"inline-block\" : \"none\";\n entryOverlay.classList.add(\"show\");\n entryNameInput.focus();\n}\nfunction closeEntryOverlay() { entryOverlay.classList.remove(\"show\"); }\n\nentryNameInput.addEventListener(\"input\", updateEntryAvatarPreview);\nentryAvatarFile.addEventListener(\"change\", () => {\n const file = entryAvatarFile.files[0];\n if (!file) return;\n const reader = new FileReader();\n reader.onload = () => { entryDraftAvatar = reader.result; updateEntryAvatarPreview(); };\n reader.readAsDataURL(file);\n});\nentryCancelBtn.addEventListener(\"click\", () => { closeEntryOverlay(); });\nentrySubmitBtn.addEventListener(\"click\", () => {\n const name = entryNameInput.value.trim();\n if (!name) { alert(\"名前を入力してください\"); entryNameInput.focus(); return; }\n saveProfileToStorage(name, entryDraftAvatar);\n currentProfile = { name, avatar: entryDraftAvatar };\n updateProfileTabIcon();\n closeEntryOverlay();\n if (pendingFirstEntry) { boot(); }\n});\n\n// ---------- 画面遷移 (トーク一覧 / VOOM / チャット) ----------\nfunction showScreen(name) {\n document.getElementById(\"screenTalklist\").classList.toggle(\"active\", name === \"talklist\");\n document.getElementById(\"screenTimeline\").classList.toggle(\"active\", name === \"timeline\");\n document.getElementById(\"screenChatroom\").classList.toggle(\"active\", name === \"chatroom\");\n document.getElementById(\"tabbar\").style.display = name === \"chatroom\" ? \"none\" : \"flex\";\n document.querySelectorAll(\".tab-item\").forEach((el) => el.classList.toggle(\"active\", el.dataset.tab === name));\n currentScreen = name;\n}\n\nfunction navigateTo(name) {\n if (currentScreen === \"chatroom\" && name !== \"chatroom\") {\n stopChatPolling();\n room = \"\";\n history.replaceState(null, \"\", location.pathname + location.search);\n }\n showScreen(name);\n if (name === \"talklist\") loadTalklist();\n}\n\ndocument.querySelectorAll(\".tab-item\").forEach((btn) => {\n btn.addEventListener(\"click\", () => {\n const tab = btn.dataset.tab;\n if (tab === \"profile\") { openEntryOverlay(true); return; }\n navigateTo(tab);\n });\n});\nbackBtn.addEventListener(\"click\", () => navigateTo(\"talklist\"));\n\nnewChatBtn.addEventListener(\"click\", () => { openChatroom(randomRoomId()); });\n\ninviteBtn.addEventListener(\"click\", async () => {\n try {\n await navigator.clipboard.writeText(location.href);\n const original = inviteBtn.innerHTML;\n inviteBtn.textContent = \"✓\";\n setTimeout(() => { inviteBtn.innerHTML = original; }, 1500);\n } catch (err) { console.error(err); }\n});\n\n// ---------- トーク一覧 ----------\nfunction fmtRoomListTime(ts) {\n const d = new Date(ts);\n const now = new Date();\n const sameDay = d.getFullYear() === now.getFullYear() && d.getMonth() === now.getMonth() && d.getDate() === now.getDate();\n return sameDay ? fmtTime(ts) : fmtDate(ts);\n}\nfunction buildRoomPreview(r) {\n if (r.last_deleted) return \"（メッセージは削除されました）\";\n if (r.last_is_poll) return \"📊 \" + (r.last_body || \"投票\");\n if (r.last_has_image && !r.last_body) return \"📷 画像\";\n return r.last_body || \"\";\n}\nasync function loadTalklist() {\n talklistItems.innerHTML = '

読み込み中...

';\n try {\n const res = await fetch(\"/api/rooms?user_id=\" + encodeURIComponent(myUserId));\n const data = await res.json();\n allRooms = data.rooms || [];\n renderTalklistItems(allRooms);\n } catch (err) {\n console.error(err);\n talklistItems.innerHTML = '

読み込みに失敗しました

';\n }\n}\nfunction renderTalklistItems(rooms) {\n if (rooms.length === 0) {\n talklistItems.innerHTML = '

まだトークがありません
右上の＋から新しいトークを始めましょう

';\n return;\n }\n talklistItems.innerHTML = \"\";\n rooms.forEach((r) => {\n const item = document.createElement(\"div\");\n item.className = \"talk-item\";\n const color = colorForKey(r.room);\n const letter = escapeHtml((r.room || \"?\").charAt(0).toUpperCase());\n item.innerHTML =\n '

' + letter + \"

\" +\n '

' +\n '

#' + escapeHtml(r.room) + \"

\" +\n '

' + escapeHtml(buildRoomPreview(r)) + \"

\" +\n \"

\" +\n '

' + fmtRoomListTime(r.last_created_at) + \"

\";\n item.addEventListener(\"click\", () => openChatroom(r.room));\n talklistItems.appendChild(item);\n });\n}\ntalkSearchInput.addEventListener(\"input\", () => {\n const q = talkSearchInput.value.trim().toLowerCase();\n if (!q) { renderTalklistItems(allRooms); return; }\n renderTalklistItems(allRooms.filter((r) => r.room.toLowerCase().includes(q)));\n});\n\n// ---------- チャット画面の入退室 ----------\nfunction resetChatState() {\n lastId = 0; lastUpdateSeen = 0; firstLoad = true; lastRenderedDateStr = \"\";\n msgIndex.clear(); messageData.clear();\n messagesEl.innerHTML = '

まだメッセージはありません

';\n replyingTo = null; showReplyPreview();\n clearImagePreview();\n bodyInput.value = \"\";\n autoGrowBody();\n restoreDraft();\n}\nfunction openChatroom(r) {\n room = r;\n history.replaceState(null, \"\", location.pathname + location.search + \"#\" + r);\n roomLabel.textContent = \"#\" + r;\n resetChatState();\n showScreen(\"chatroom\");\n startChatPolling();\n}\nfunction startChatPolling() {\n if (chatPollTimer) return;\n setupPushNotifications();\n poll();\n chatPollTimer = setInterval(poll, 1500);\n}\nfunction stopChatPolling() {\n if (chatPollTimer) { clearInterval(chatPollTimer); chatPollTimer = null; }\n}\n\nfunction clearImagePreview() {\n fileInput.value = \"\";\n fileLabel.classList.remove(\"has-file\");\n imagePreviewBar.classList.remove(\"show\");\n imagePreviewThumb.src = \"\";\n}\nfileInput.addEventListener(\"change\", () => {\n const file = fileInput.files[0];\n if (!file) { clearImagePreview(); return; }\n fileLabel.classList.add(\"has-file\");\n const reader = new FileReader();\n reader.onload = () => { imagePreviewThumb.src = reader.result; imagePreviewBar.classList.add(\"show\"); };\n reader.readAsDataURL(file);\n});\nipCancel.addEventListener(\"click\", () => { clearImagePreview(); });\n\nfunction fmtTime(ts) { const d = new Date(ts); return d.getHours().toString().padStart(2, \"0\") + \":\" + d.getMinutes().toString().padStart(2, \"0\"); }\nfunction fmtDate(ts) {\n const d = new Date(ts);\n const days = [\"日\", \"月\", \"火\", \"水\", \"木\", \"金\", \"土\"];\n return (d.getMonth() + 1) + \"月\" + d.getDate() + \"日(\" + days[d.getDay()] + \")\";\n}\nfunction escapeHtml(s) { if (!s) return \"\"; return s.replace(/[&<>\"']/g, (c) => ({ \"&\": \"&\", \"<\": \"<\", \">\": \">\", '\"': \""\", \"'\": \"'\" }[c])); }\nfunction truncateText(s, n) { if (!s) return \"\"; return s.length > n ? s.slice(0, n) + \"…\" : s; }\nfunction linkifyMentions(escapedBody) {\n return escapedBody.replace(/(^|[\\\\s\\\\u3000])@([^\\\\s\\\\u3000@]+)/g, (match, prefix, name) => prefix + '@' + name + \"\");\n}\nfunction fileToBase64(file) { return new Promise((resolve, reject) => { const reader = new FileReader(); reader.readAsDataURL(file); reader.onload = () => resolve(reader.result); reader.onerror = (error) => reject(error); }); }\n\nfunction signatureOf(m) {\n return JSON.stringify({ body: m.body, deleted: m.deleted, edited_at: m.edited_at, poll: m.poll, avatar_url: m.avatar_url });\n}\nfunction buildTimeLabel(m) {\n const editedLabel = m.edited_at && !m.deleted ? '編集済み' : \"\";\n return fmtTime(m.created_at) + editedLabel;\n}\nfunction buildActionsRow(m, mine) {\n if (m.deleted) return \"\";\n let actions = '返信';\n if (mine) {\n actions += '編集';\n actions += '削除';\n }\n return actions;\n}\nfunction buildPollHtml(m) {\n const poll = m.poll; const total = poll.total || 0;\n const optsHtml = poll.options.map((opt, idx) => {\n const pct = total > 0 ? Math.round((opt.count / total) * 100) : 0;\n const mine = poll.myVote === idx;\n return '';\n }).join(\"\");\n return '

投票 ' + escapeHtml(poll.question) + '

' +\n '

' + optsHtml + '

' +\n '

計 ' + total + '票

';\n}\nfunction extractColorCode(body) {\n const match = body.match(/^#([0-9a-fA-F]{3}|[0-9a-fA-F]{6})[ \\\\u3000]+([\\\\s\\\\S]+)$/);\n if (!match) return null;\n return { color: \"#\" + match[1], text: match[2] };\n}\nfunction buildBubbleInner(m) {\n if (m.deleted) return '

このメッセージは削除されました

';\n let replyHtml = \"\";\n if (m.reply_to_id) {\n replyHtml = '

' + escapeHtml(m.reply_to_name || \"\") + \"「\" +\n escapeHtml(truncateText(m.reply_to_body || \"\", 60)) + \"」

\";\n }\n let imgHtml = \"\";\n if (m.image_url) imgHtml = ' $\"uploaded$ ';\n\n let bodyHtml;\n if (m.poll) {\n bodyHtml = buildPollHtml(m);\n } else {\n const colorInfo = extractColorCode(m.body);\n if (colorInfo) {\n bodyHtml = '' + linkifyMentions(escapeHtml(colorInfo.text)) + '';\n } else {\n bodyHtml = linkifyMentions(escapeHtml(m.body));\n }\n }\n return '

' + replyHtml + bodyHtml + imgHtml + '

';\n}\n\nfunction createMessageElement(m) {\n const mine = m.user_id === myUserId;\n const wrap = document.createElement(\"div\");\n wrap.className = \"msg \" + (mine ? \"me\" : \"them\");\n wrap.dataset.id = m.id;\n\n const nameLabel = document.createElement(\"div\"); nameLabel.className = \"msg-name\";\n const row = document.createElement(\"div\"); row.className = \"msg-row\";\n const avatarSlot = document.createElement(\"div\"); avatarSlot.className = \"msg-avatar-slot\";\n const bubbleContainer = document.createElement(\"div\"); bubbleContainer.className = \"bubble-container\";\n const timeLabel = document.createElement(\"div\"); timeLabel.className = \"msg-time\";\n const actionsRow = document.createElement(\"div\"); actionsRow.className = \"msg-actions\";\n row.appendChild(avatarSlot);\n row.appendChild(bubbleContainer);\n row.appendChild(timeLabel);\n wrap.appendChild(nameLabel);\n wrap.appendChild(row);\n wrap.appendChild(actionsRow);\n\n updateMessageElement(wrap, m);\n return wrap;\n}\nfunction updateMessageElement(wrap, m) {\n const mine = m.user_id === myUserId;\n wrap.querySelector(\".msg-name\").innerHTML = mine ? \"\" : escapeHtml(m.name);\n const avatarSlot = wrap.querySelector(\".msg-avatar-slot\");\n if (avatarSlot) avatarSlot.innerHTML = mine ? \"\" : buildAvatarHtml(m.name, m.avatar_url, m.user_id);\n wrap.querySelector(\".bubble-container\").innerHTML = buildBubbleInner(m);\n wrap.querySelector(\".msg-time\").innerHTML = buildTimeLabel(m);\n wrap.querySelector(\".msg-actions\").innerHTML = buildActionsRow(m, mine);\n}\n\nfunction renderSystemMessage(text) {\n const div = document.createElement(\"div\");\n div.className = \"date-divider system-msg\";\n div.textContent = text;\n messagesEl.appendChild(div);\n messagesEl.scrollTop = messagesEl.scrollHeight;\n}\nfunction isNearBottom() {\n return messagesEl.scrollHeight - messagesEl.scrollTop - messagesEl.clientHeight < 80;\n}\n\nfunction render(messages) {\n const wasNearBottom = firstLoad ? true : isNearBottom();\n if (firstLoad) { messagesEl.innerHTML = \"\"; firstLoad = false; }\n\n if (pendingOptimistic) {\n const match = messages.find((m) =>\n m.user_id === myUserId &&\n m.body === pendingOptimistic.body &&\n (m.image_url || \"\") === (pendingOptimistic.image_url || \"\") &&\n !msgIndex.has(m.id)\n );\n if (match) {\n if (pendingOptimistic.tempId != null) {\n const entry = msgIndex.get(pendingOptimistic.tempId);\n if (entry && entry.el) { entry.el.remove(); }\n msgIndex.delete(pendingOptimistic.tempId);\n messageData.delete(pendingOptimistic.tempId);\n }\n pendingOptimistic = null;\n }\n }\n\n for (const m of messages) {\n lastId = Math.max(lastId, m.id);\n if (m.updated_at) lastUpdateSeen = Math.max(lastUpdateSeen, m.updated_at);\n\n knownNames.add(m.name);\n messageData.set(m.id, m);\n\n const sig = signatureOf(m);\n const existing = msgIndex.get(m.id);\n\n if (existing) {\n if (existing.sig !== sig && existing.el) {\n updateMessageElement(existing.el, m);\n existing.sig = sig;\n }\n continue;\n }\n\n const dateStr = fmtDate(m.created_at);\n if (dateStr !== lastRenderedDateStr) {\n const divider = document.createElement(\"div\");\n divider.className = \"date-divider\";\n divider.textContent = dateStr;\n messagesEl.appendChild(divider);\n lastRenderedDateStr = dateStr;\n }\n\n const el = createMessageElement(m);\n messagesEl.appendChild(el);\n msgIndex.set(m.id, { el, sig });\n }\n\n if (wasNearBottom) {\n messagesEl.scrollTop = messagesEl.scrollHeight;\n scrollBottomBtn.classList.remove(\"show\");\n } else {\n scrollBottomBtn.classList.add(\"show\");\n }\n}\n\nmessagesEl.addEventListener(\"scroll\", () => {\n if (isNearBottom()) { scrollBottomBtn.classList.remove(\"show\"); }\n});\nscrollBottomBtn.addEventListener(\"click\", () => {\n messagesEl.scrollTop = messagesEl.scrollHeight;\n scrollBottomBtn.classList.remove(\"show\");\n});\nmessagesEl.addEventListener(\"click\", (e) => {\n const replyBtn = e.target.closest(\".reply-btn\");\n if (replyBtn) { replyingTo = { id: replyBtn.dataset.id, name: replyBtn.dataset.name, body: replyBtn.dataset.body }; showReplyPreview(); return; }\n const editBtn = e.target.closest(\".edit-btn\");\n if (editBtn) { startEdit(editBtn.dataset.id); return; }\n const deleteBtn = e.target.closest(\".delete-btn\");\n if (deleteBtn) { handleDelete(deleteBtn.dataset.id); return; }\n const pollOption = e.target.closest(\".poll-option\");\n if (pollOption) { handleVote(pollOption.dataset.pollId, pollOption.dataset.messageId, pollOption.dataset.option); return; }\n const img = e.target.closest(\".msg-img\");\n if (img) { openLightbox(img.dataset.full); return; }\n});\n\nfunction openLightbox(src) { lightboxImg.src = src; lightbox.classList.add(\"show\"); }\nfunction closeLightbox() { lightbox.classList.remove(\"show\"); lightboxImg.src = \"\"; }\nlightbox.addEventListener(\"click\", closeLightbox);\n\nfunction showReplyPreview() {\n if (!replyingTo) { replyPreviewBar.style.display = \"none\"; return; }\n rpText.textContent = replyingTo.name + \": \" + replyingTo.body;\n replyPreviewBar.style.display = \"flex\";\n bodyInput.focus();\n}\nrpCancel.addEventListener(\"click\", () => { replyingTo = null; showReplyPreview(); });\n\nfunction startEdit(idStr) {\n const id = Number(idStr);\n const m = messageData.get(id);\n if (!m || m.deleted) return;\n const entry = msgIndex.get(id);\n if (!entry) return;\n\n const bubbleContainer = entry.el.querySelector(\".bubble-container\");\n const original = m.body;\n\n bubbleContainer.innerHTML =\n '

' +\n '

保存キャンセル

';\n\n const input = bubbleContainer.querySelector(\".edit-input\");\n input.focus();\n input.setSelectionRange(input.value.length, input.value.length);\n\n bubbleContainer.querySelector(\".edit-cancel\").addEventListener(\"click\", () => { bubbleContainer.innerHTML = buildBubbleInner(m); });\n bubbleContainer.querySelector(\".edit-save\").addEventListener(\"click\", () => submitEdit(id, input.value));\n input.addEventListener(\"keydown\", (e) => {\n if (e.key === \"Enter\") { e.preventDefault(); submitEdit(id, input.value); }\n if (e.key === \"Escape\") { bubbleContainer.innerHTML = buildBubbleInner(m); }\n });\n}\nasync function submitEdit(id, newBody) {\n const trimmed = newBody.trim();\n if (!trimmed) return;\n try {\n const res = await fetch(\"/api/edit\", {\n method: \"POST\", headers: { \"Content-Type\": \"application/json\" },\n body: JSON.stringify({ id, user_id: myUserId, body: trimmed }),\n });\n const data = await res.json();\n if (!data.success) { alert(\"編集に失敗しました: \" + (data.error || \"unknown\")); return; }\n await poll();\n } catch (err) { console.error(err); }\n}\nasync function handleDelete(idStr) {\n const id = Number(idStr);\n if (!confirm(\"このメッセージを削除しますか？\")) return;\n try {\n const res = await fetch(\"/api/delete\", {\n method: \"POST\", headers: { \"Content-Type\": \"application/json\" },\n body: JSON.stringify({ id, user_id: myUserId }),\n });\n const data = await res.json();\n if (!data.success) { alert(\"削除に失敗しました: \" + (data.error || \"unknown\")); return; }\n await poll();\n } catch (err) { console.error(err); }\n}\nasync function handleVote(pollIdStr, messageIdStr, optionStr) {\n try {\n await fetch(\"/api/poll/vote\", {\n method: \"POST\", headers: { \"Content-Type\": \"application/json\" },\n body: JSON.stringify({\n poll_id: Number(pollIdStr), message_id: Number(messageIdStr),\n user_id: myUserId, option_index: Number(optionStr),\n }),\n });\n await poll();\n } catch (err) { console.error(err); }\n}\n\nbodyInput.addEventListener(\"input\", () => {\n const val = bodyInput.value;\n const caret = bodyInput.selectionStart;\n const uptoCaret = val.slice(0, caret);\n const match = uptoCaret.match(/(^|[\\\\s\\\\u3000])@([^\\\\s\\\\u3000@]*)$/);\n if (match) {\n const query = match[2].toLowerCase();\n const myName = getDisplayName();\n const candidates = Array.from(knownNames).filter((n) => n !== myName && n.toLowerCase().includes(query));\n if (candidates.length > 0) { showMentionList(candidates); return; }\n }\n hideMentionList();\n});\nbodyInput.addEventListener(\"blur\", () => { setTimeout(hideMentionList, 150); });\n\nfunction autoGrowBody() {\n bodyInput.style.height = \"auto\";\n bodyInput.style.height = Math.min(bodyInput.scrollHeight, 120) + \"px\";\n}\nbodyInput.addEventListener(\"input\", autoGrowBody);\n\nfunction getDraftKey() { return \"chatDraft:\" + room; }\nfunction saveDraft() {\n if (!room) return;\n try { localStorage.setItem(getDraftKey(), bodyInput.value); } catch (e) {}\n}\nfunction restoreDraft() {\n if (!room) return;\n try {\n const saved = localStorage.getItem(getDraftKey());\n if (saved) { bodyInput.value = saved; autoGrowBody(); }\n } catch (e) {}\n}\nfunction clearDraft() {\n if (!room) return;\n try { localStorage.removeItem(getDraftKey()); } catch (e) {}\n}\nbodyInput.addEventListener(\"input\", saveDraft);\nwindow.addEventListener(\"pagehide\", saveDraft);\ndocument.addEventListener(\"visibilitychange\", () => {\n if (document.visibilityState === \"hidden\") { saveDraft(); }\n else if (currentScreen === \"chatroom\") { restoreDraft(); }\n});\nwindow.addEventListener(\"pageshow\", () => { if (currentScreen === \"chatroom\") restoreDraft(); });\nsetInterval(saveDraft, 3000);\n\nbodyInput.addEventListener(\"keydown\", (e) => {\n if (e.key === \"Enter\" && !e.shiftKey && !e.isComposing) {\n e.preventDefault();\n composer.requestSubmit ? composer.requestSubmit() : composer.dispatchEvent(new Event(\"submit\", { cancelable: true }));\n }\n});\nbodyInput.addEventListener(\"focus\", () => {\n setAppHeightVar();\n setTimeout(() => { bodyInput.scrollIntoView({ block: \"end\", behavior: \"smooth\" }); }, 300);\n});\n\nfunction showMentionList(candidates) {\n mentionList.innerHTML = \"\";\n candidates.slice(0, 6).forEach((n) => {\n const item = document.createElement(\"div\");\n item.className = \"mention-item\"; item.textContent = n;\n item.addEventListener(\"mousedown\", (e) => { e.preventDefault(); insertMention(n); });\n mentionList.appendChild(item);\n });\n mentionList.style.display = \"block\";\n}\nfunction hideMentionList() { mentionList.style.display = \"none\"; mentionList.innerHTML = \"\"; }\nfunction insertMention(name) {\n const val = bodyInput.value; const caret = bodyInput.selectionStart;\n const uptoCaret = val.slice(0, caret);\n const replaced = uptoCaret.replace(/@([^\\\\s\\\\u3000@]*)$/, \"@\" + name + \" \");\n bodyInput.value = replaced + val.slice(caret);\n hideMentionList(); bodyInput.focus();\n}\n\nfunction detectSlashCommand(trimmed) {\n if (trimmed === \"/roll\" || trimmed.indexOf(\"/roll \") === 0) {\n const arg = trimmed === \"/roll\" ? \"\" : trimmed.slice(6).trim();\n let max = 6;\n if (arg !== \"\") { const n = parseInt(arg, 10); if (!Number.isNaN(n) && n > 0) max = n; }\n return { type: \"roll\", max };\n }\n if (trimmed.indexOf(\"/poll \") === 0) return { type: \"poll\", raw: trimmed.slice(6) };\n if (trimmed === \"/who\") return { type: \"who\" };\n if (trimmed.toLowerCase() === \"/profile\") return { type: \"profile\" };\n return null;\n}\n\nasync function sendRollCommand(max) {\n const safeMax = max > 0 ? max : 6;\n const result = Math.floor(Math.random() * safeMax) + 1;\n const text = \"🎲 \" + getDisplayName() + \" のダイス: \" + result + \" (1〜\" + safeMax + \")\";\n clearImagePreview();\n await sendNormalMessage(text, null);\n}\nasync function sendPollCommand(raw) {\n const parts = raw.split(\"|\").map((s) => s.trim()).filter((s) => s.length > 0);\n if (parts.length < 3) {\n alert(\"使い方: /poll 質問|選択肢1|選択肢2|選択肢3\\\\n(「|」で区切ってください。選択肢は2つ以上)\");\n return;\n }\n const question = parts[0]; const options = parts.slice(1);\n sending = true; bodyInput.disabled = true;\n try {\n await fetch(\"/api/poll/create\", {\n method: \"POST\", headers: { \"Content-Type\": \"application/json\" },\n body: JSON.stringify({ room, user_id: myUserId, name: getDisplayName(), avatar_url: getAvatarUrl(), question, options }),\n });\n bodyInput.value = \"\"; autoGrowBody(); clearImagePreview(); clearDraft();\n await poll();\n } catch (err) { console.error(err); } finally { bodyInput.disabled = false; bodyInput.focus(); sending = false; }\n}\nasync function sendWhoCommand() {\n bodyInput.value = \"\"; autoGrowBody(); clearDraft();\n sending = true; bodyInput.disabled = true;\n try {\n await poll();\n const names = onlineUsers.length ? onlineUsers.map((u) => u.name).join(\"、\") : \"(自分以外は今いません)\";\n renderSystemMessage(\"オンライン (\" + onlineUsers.length + \"人): \" + names);\n } catch (err) { console.error(err); } finally { bodyInput.disabled = false; bodyInput.focus(); sending = false; }\n}\n\nlet sending = false;\nlet tempIdCounter = 0;\nlet pendingOptimistic = null;\n\nfunction appendMessageElementToDOM(m) {\n if (firstLoad) { messagesEl.innerHTML = \"\"; firstLoad = false; }\n const dateStr = fmtDate(m.created_at);\n if (dateStr !== lastRenderedDateStr) {\n const divider = document.createElement(\"div\");\n divider.className = \"date-divider\";\n divider.textContent = dateStr;\n messagesEl.appendChild(divider);\n lastRenderedDateStr = dateStr;\n }\n const el = createMessageElement(m);\n messagesEl.appendChild(el);\n msgIndex.set(m.id, { el, sig: signatureOf(m) });\n messageData.set(m.id, m);\n return el;\n}\n\nasync function sendNormalMessage(body, file) {\n sending = true; bodyInput.disabled = true;\n const currentReply = replyingTo;\n try {\n let imageUrl = \"\"; if (file) imageUrl = await fileToBase64(file);\n\n const tempId = --tempIdCounter;\n const nowTs = Date.now();\n const optimisticMsg = {\n id: tempId, user_id: myUserId, name: getDisplayName(), body, image_url: imageUrl,\n reply_to_id: currentReply ? currentReply.id : null, reply_to_name: currentReply ? currentReply.name : null,\n reply_to_body: currentReply ? currentReply.body : null, edited_at: null, deleted: false,\n updated_at: nowTs, poll_id: null, poll: null, created_at: nowTs, avatar_url: getAvatarUrl(),\n };\n knownNames.add(optimisticMsg.name);\n appendMessageElementToDOM(optimisticMsg);\n messagesEl.scrollTop = messagesEl.scrollHeight;\n scrollBottomBtn.classList.remove(\"show\");\n pendingOptimistic = { tempId, body, image_url: imageUrl };\n\n bodyInput.value = \"\"; autoGrowBody(); clearImagePreview(); clearDraft();\n replyingTo = null; showReplyPreview();\n\n await fetch(\"/api/send\", {\n method: \"POST\", headers: { \"Content-Type\": \"application/json\" },\n body: JSON.stringify({\n room, user_id: myUserId, name: getDisplayName(), body, image_url: imageUrl,\n avatar_url: getAvatarUrl(),\n reply_to_id: currentReply ? currentReply.id : null,\n reply_to_name: currentReply ? currentReply.name : null,\n reply_to_body: currentReply ? currentReply.body : null,\n }),\n });\n await poll();\n } catch (err) {\n console.error(err);\n if (pendingOptimistic) {\n if (pendingOptimistic.tempId != null) {\n const entry = msgIndex.get(pendingOptimistic.tempId);\n if (entry && entry.el) { entry.el.remove(); }\n msgIndex.delete(pendingOptimistic.tempId);\n messageData.delete(pendingOptimistic.tempId);\n }\n bodyInput.value = body; autoGrowBody();\n pendingOptimistic = null;\n }\n } finally { bodyInput.disabled = false; bodyInput.focus(); sending = false; }\n}\n\nasync function poll() {\n if (!room || currentScreen !== \"chatroom\") return;\n try {\n const res = await fetch(\n \"/api/messages?room=\" + encodeURIComponent(room) +\n \"&since=\" + lastId + \"&sinceUpdate=\" + lastUpdateSeen +\n \"&viewer=\" + encodeURIComponent(myUserId) +\n \"&name=\" + encodeURIComponent(getDisplayName()),\n );\n const data = await res.json();\n if (data.online) { onlineUsers = data.online; }\n if (data.messages && data.messages.length) { render(data.messages); }\n } catch (err) { console.error(err); }\n}\nwindow.poll = poll;\n\ncomposer.addEventListener(\"submit\", async (e) => {\n e.preventDefault(); if (sending) return;\n const trimmed = bodyInput.value.trim(); const file = fileInput.files[0];\n if (!trimmed && !file) return;\n\n const cmd = detectSlashCommand(trimmed);\n if (cmd && cmd.type === \"roll\") { await sendRollCommand(cmd.max); return; }\n if (cmd && cmd.type === \"poll\") { await sendPollCommand(cmd.raw); return; }\n if (cmd && cmd.type === \"who\") { await sendWhoCommand(); return; }\n if (cmd && cmd.type === \"profile\") { bodyInput.value = \"\"; autoGrowBody(); openEntryOverlay(true); return; }\n\n await sendNormalMessage(trimmed, file);\n});\n\n// --- 起動処理 ---\nfunction boot() {\n updateProfileTabIcon();\n const initialRoom = getRoomFromHash();\n if (initialRoom) {\n room = initialRoom;\n roomLabel.textContent = \"#\" + room;\n resetChatState();\n showScreen(\"chatroom\");\n startChatPolling();\n } else {\n showScreen(\"talklist\");\n loadTalklist();\n }\n}\n\nupdateNotifUI();\nif (currentProfile) {\n boot();\n} else {\n openEntryOverlay(false);\n}\n`;",[156],"pulls","branches",1,"forks","envVars",{"_170":164,"_172":61},"connections",{"_170":61,"_171":61},"count","unfilledCount","emptyCount",{"_42":155,"_32":156,"_30":157,"_134":-5,"_40":41,"_39":158,"_136":25,"_37":187,"_13":151,"_34":152,"_35":160,"_24":25,"_141":-5,"_178":188,"_27":189},{"_42":146,"_32":147,"_30":148,"_134":-5,"_40":41,"_39":149,"_136":25,"_37":184,"_13":151,"_34":152,"_35":153,"_24":25,"_141":-5,"_178":185,"_27":186},{"_42":143,"_32":28,"_30":31,"_134":-5,"_40":41,"_39":14,"_136":25,"_37":181,"_13":138,"_34":20,"_35":36,"_24":25,"_141":-5,"_178":182,"_27":183},{"_42":132,"_32":133,"_30":55,"_134":-5,"_40":41,"_39":135,"_136":25,"_37":177,"_13":138,"_34":139,"_35":140,"_24":25,"_141":97,"_178":179,"_27":180},["D",1788479462703],"children",[],[133],["D",1788479521584],[],[28],["D",1788478847024],[],[147],["D",1788478805460],[],[156],["D",1788478632137],["D",1789448471428],{"_98":97,"_106":102},{"_98":97,"_99":100,"_101":102,"_18":53,"_103":104,"_105":25},{"_13":87,"_32":88,"_42":41,"_89":43,"_90":-5,"_91":-5,"_92":-5,"_93":-5,"_94":-5,"_95":44,"_96":97},"ctx",{"_80":-5,"_125":228,"_229":230,"_231":232,"_233":25,"_234":25,"_235":25,"_236":57,"_237":-5,"_238":-7,"_239":-7,"_240":61,"_241":25,"_242":25,"_243":-5,"_244":25,"_245":25,"_246":25,"_247":-5},"ENV",{"_199":200,"_201":202,"_203":88,"_204":205,"_206":207,"_208":209,"_210":211,"_212":213,"_214":215,"_216":217,"_218":219,"_220":221,"_222":223,"_224":225,"_226":227},"REACT_APP_SENTRY_DSN","https://586020d86f05489db63a554690acf1e9@o1398359.ingest.sentry.io/6724499","RENDER_GIT_COMMIT","e87eb04e707cf64e7e532c8e8ec395f209e17f15","RENDER_GIT_BRANCH","POSTHOG_API_TOKEN","phc_nmoyuAkStEZuUp69rYlg1DZgrIt19Gx0Y4Hwf8tGgJP","POSTHOG_API_HOST","https://wart.val.town","WEB_API_TEMPLATE","https://{val}.web.val.run","APP_URL","https://www.val.town","MODULE_URL","https://esm.town","VANITY_WEB_API_TEMPLATE","https://{label}.val.run/","DENOLS_URL","https://lsp.val.town","NODE_ENV","production","CLOUDFLARE_TURNSTILE_SITE_KEY","0x4AAAAAACtaIZJH7s9rBMZ6","GOOGLE_CLIENT_ID","875989696899-jtsqkhlbdv5jrlsk8631p7ipjg3c6o62.apps.googleusercontent.com","STRIPE_PUBLISHABLE_KEY","pk_live_51N2zvWEpZTTLipIkVEwXrUG9AT0yeOOEYxszarZT1jpsZV58Ly6wlg3SltZpHN26CUalOBmUSY7adQRQiSkCZz2500qSXNkf8Y","API_URL","https://api.val.town",[],"preferencesKeybindings","default","preferencesTheme","light","preferencesFixers","preferencesCopilot","preferencesSelectionAi","preferencesCloseBrackets","preferencesChatPanelState","preferencesDprint","preferencesDenofmt","notificationCount","flagDenols","isBusinessOrgMember","businessOrgHandle","isBusinessOrgAdmin","isHigherTownieTier","navCollapsed","currentOrgId"]

Diff · v14