[{"_1":2,"_3":-5,"_4":-5},"loaderData",{"_5":6,"_7":8,"_9":10},"actionData","errors","root",{"_153":154,"_155":156},"routes/_app.x.$handle.$name",{"_95":94,"_32":45,"_103":85,"_27":53,"_13":14,"_104":-5,"_11":105,"_106":107,"_108":109,"_110":111,"_112":113,"_20":-5,"_114":-5,"_115":-5,"_116":25,"_117":118,"_119":120,"_121":-5,"_122":-5,"_123":124},"routes/_app.x.$handle.$name.branch.$branch.version.$version.diff",{"_11":12,"_13":14,"_15":16,"_17":-5,"_18":-5},"project",{"_43":44,"_32":45,"_38":46,"_47":-5,"_48":25,"_49":50,"_51":50,"_52":53,"_54":-5,"_18":55,"_56":-5,"_57":25,"_58":-5,"_59":-5,"_60":61,"_62":63,"_64":-5,"_65":-5,"_66":-5,"_67":-5,"_68":69,"_70":69,"_71":72,"_73":72,"_74":72,"_75":69,"_76":69,"_77":78,"_79":80,"_81":82,"_83":25},"version",7,"changes",[19],"aiChatInfo","userId",{"_20":21,"_22":23,"_24":25,"_26":25,"_27":28,"_29":28},"file",{"_30":31,"_32":28,"_33":34,"_35":37,"_38":39,"_40":14,"_41":42,"_24":25},"previous",{"_30":31,"_32":28,"_33":34,"_35":36},"deleted",false,"deletedHere","path","main.ts","latestPath","fileId","e333b962-5ecb-11f1-84c0-1607ee4eb77e","name","fileType","http","content","/**\n * Wire: A 1-to-1 P2P file and text transfer application using ppng.io\n * * Updates:\n * - Refactored to use the 3-file approach (HTML, CSS, JS separate).\n * - Implemented End-to-End Encryption (AES-GCM) using Web Crypto API.\n * - Resolved FormData issues by setting Content-Type to text/plain.\n * - Added console error logging.\n * - Improved slug base to `wire-xfr-v1`.\n */\n\nimport { serve } from \"https://esm.town/v/g/serveUtils\";\nimport { Hono } from \"npm:hono\";\n\nfunction html() {\n /*\n\n\n\n \n \n Wire\n \n \n \n\n\n

Wire

Enter a name to join or create a Wire.

\n \n

\n\n

Initializing...

PASTE OR DROP TO SEND

\n\n \n

You can also click me

\n\n \n\n

Enable notifications to not miss files!

\n \n \n

\n\n \n

\n\n

Incoming File

\n \n \n \n

\n\n\n */\n}\n\nfunction css() {\n /*\n:root {\n --bg-color: #121212;\n --text-color: #ffffff;\n --dashed-color: #555555;\n --accent: #e91e63;\n}\nbody {\n margin: 0;\n padding: 0;\n background-color: var(--bg-color);\n color: var(--text-color);\n font-family: -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif;\n height: 100vh;\n overflow: hidden;\n display: flex;\n align-items: center;\n justify-content: center;\n}\n.view {\n width: 100%;\n height: 100%;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n}\n.hidden {\n display: none !important;\n}\n\n#home-view form {\n display: flex;\n gap: 10px;\n margin-top: 20px;\n align-items: center;\n}\n#home-view input {\n padding: 12px 20px;\n border-radius: 24px;\n border: 1px solid var(--dashed-color);\n background: transparent;\n color: white;\n font-size: 16px;\n outline: none;\n}\n#home-view button {\n background: var(--text-color);\n color: var(--bg-color);\n border: none;\n border-radius: 50%;\n width: 44px;\n height: 44px;\n display: flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n transition: transform 0.2s;\n}\n#home-view button:hover {\n transform: scale(1.05);\n}\n\n#drop-zone {\n position: absolute;\n top: 20px; left: 20px; right: 20px; bottom: 20px;\n border: 2px dashed var(--dashed-color);\n border-radius: 8px;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n transition: border-color 0.2s;\n}\n#drop-zone.dragover {\n border-color: var(--text-color);\n background: rgba(255,255,255,0.02);\n}\n.title-text {\n font-size: 28px;\n letter-spacing: 1px;\n margin-bottom: 20px;\n text-align: center;\n}\n.icon-large {\n width: 64px;\n height: 64px;\n margin: 10px 0;\n cursor: pointer;\n stroke-width: 1.5;\n color: #ccc;\n transition: color 0.2s;\n}\n.icon-large:hover {\n color: white;\n}\n.subtitle {\n font-size: 14px;\n font-style: italic;\n color: #888;\n cursor: pointer;\n margin-bottom: 60px;\n}\n.subtitle:hover {\n color: #bbb;\n}\n.footer {\n position: absolute;\n bottom: 60px;\n font-size: 13px;\n color: #aaa;\n text-align: center;\n}\n.highlight {\n color: var(--accent);\n}\n\n.controls-wrapper {\n position: absolute;\n bottom: 20px;\n display: flex;\n align-items: center;\n justify-content: center;\n width: 100%;\n}\n.controls {\n display: flex;\n gap: 20px;\n position: relative;\n}\n.controls button {\n background: transparent;\n border: none;\n color: #888;\n cursor: pointer;\n transition: color 0.2s;\n display: flex;\n align-items: center;\n justify-content: center;\n padding: 5px;\n}\n.controls button:hover {\n color: white;\n}\n\n#notify-nudge {\n position: absolute;\n bottom: 40px;\n left: 50%;\n transform: translateX(-50%);\n background: #333;\n color: #fff;\n padding: 8px 12px;\n border-radius: 6px;\n font-size: 12px;\n white-space: nowrap;\n box-shadow: 0 4px 12px rgba(0,0,0,0.3);\n pointer-events: none;\n opacity: 1;\n transition: opacity 0.3s;\n}\n#notify-nudge::after {\n content: '';\n position: absolute;\n top: 100%;\n left: 50%;\n margin-left: -5px;\n border-width: 5px;\n border-style: solid;\n border-color: #333 transparent transparent transparent;\n}\n\n#status {\n position: absolute;\n top: 40px;\n font-size: 14px;\n color: #666;\n letter-spacing: 0.5px;\n}\n\n#incoming-dialog {\n position: fixed;\n bottom: 30px;\n right: 30px;\n background: #222;\n border: 1px solid #444;\n padding: 20px;\n border-radius: 12px;\n box-shadow: 0 10px 30px rgba(0,0,0,0.5);\n z-index: 100;\n display: flex;\n flex-direction: column;\n gap: 15px;\n min-width: 250px;\n transition: opacity 0.3s, transform 0.3s;\n}\n#incoming-dialog.hidden {\n opacity: 0;\n transform: translateY(20px);\n pointer-events: none;\n}\n#incoming-dialog h4 {\n margin: 0;\n font-size: 16px;\n font-weight: 500;\n word-break: break-all;\n}\n.dialog-controls {\n display: flex;\n gap: 10px;\n}\n.dialog-controls button {\n flex: 1;\n padding: 8px;\n border: none;\n border-radius: 4px;\n cursor: pointer;\n font-size: 13px;\n background: #444;\n color: white;\n}\n.dialog-controls button.primary {\n background: var(--text-color);\n color: var(--bg-color);\n}\n.dialog-controls button:hover {\n opacity: 0.9;\n}\n */\n}\n\nfunction js() {\n /*\nconst DOM = {\n homeView: document.getElementById('home-view'),\n wireView: document.getElementById('wire-view'),\n joinForm: document.getElementById('join-form'),\n wireInput: document.getElementById('wire-input'),\n dropZone: document.getElementById('drop-zone'),\n fileInput: document.getElementById('file-input'),\n fileIcon: document.getElementById('file-icon'),\n fileSubtitle: document.getElementById('file-subtitle'),\n status: document.getElementById('status'),\n notifyBtn: document.getElementById('notify-btn'),\n notifyNudge: document.getElementById('notify-nudge'),\n popupBtn: document.getElementById('popup-btn'),\n dialog: document.getElementById('incoming-dialog'),\n incTitle: document.getElementById('inc-title'),\n incDownload: document.getElementById('inc-download-btn'),\n incCopy: document.getElementById('inc-copy-btn'),\n incClose: document.getElementById('inc-close-btn')\n};\n\nlet secret = null;\nlet aesKey = null;\nlet role = null;\nlet slug = null;\nlet baseSlug = null;\nlet originalTitle = document.title;\nlet titleFlashInterval = null;\n\ndocument.addEventListener(\"DOMContentLoaded\", () => {\n if (window.lucide) lucide.createIcons();\n\n const path = window.location.pathname;\n if (path === '/' || path === '') {\n DOM.homeView.classList.remove('hidden');\n DOM.joinForm.addEventListener('submit', (e) => {\n e.preventDefault();\n const val = DOM.wireInput.value.trim();\n if(val) window.location.href = '/' + encodeURIComponent(val);\n });\n } else {\n DOM.wireView.classList.remove('hidden');\n slug = path.slice(1);\n baseSlug = `wire-xfr-v1-${slug}`;\n initWire();\n }\n});\n\nfunction setStatus(text) {\n DOM.status.textContent = text;\n}\n\nfunction checkNotifications() {\n if (\"Notification\" in window && Notification.permission === \"default\") {\n DOM.notifyNudge.classList.remove('hidden');\n }\n}\n\n// Crypto Utils\nasync function deriveKey(secretStr) {\n const enc = new TextEncoder();\n const keyMaterial = await crypto.subtle.digest('SHA-256', enc.encode(secretStr));\n return await crypto.subtle.importKey(\n \"raw\",\n keyMaterial,\n { name: \"AES-GCM\" },\n false,\n [\"encrypt\", \"decrypt\"]\n );\n}\n\nasync function encryptPayload(fileOrBlob, metadata) {\n const arrayBuffer = await fileOrBlob.arrayBuffer();\n const metaBytes = new TextEncoder().encode(JSON.stringify(metadata));\n\n // Format: [4 bytes meta length] [meta bytes] [file bytes]\n const payload = new Uint8Array(4 + metaBytes.length + arrayBuffer.byteLength);\n const view = new DataView(payload.buffer);\n view.setUint32(0, metaBytes.length, true); // Little endian\n payload.set(metaBytes, 4);\n payload.set(new Uint8Array(arrayBuffer), 4 + metaBytes.length);\n\n const iv = crypto.getRandomValues(new Uint8Array(12));\n const encrypted = await crypto.subtle.encrypt({ name: \"AES-GCM\", iv }, aesKey, payload);\n\n const finalPayload = new Uint8Array(12 + encrypted.byteLength);\n finalPayload.set(iv, 0);\n finalPayload.set(new Uint8Array(encrypted), 12);\n\n return new Blob([finalPayload], { type: 'text/plain' });\n}\n\nasync function decryptPayload(responseBlob) {\n const buffer = await responseBlob.arrayBuffer();\n const bytes = new Uint8Array(buffer);\n const iv = bytes.slice(0, 12);\n const ciphertext = bytes.slice(12);\n\n const decrypted = await crypto.subtle.decrypt({ name: \"AES-GCM\", iv }, aesKey, ciphertext);\n const decBytes = new Uint8Array(decrypted);\n\n const view = new DataView(decBytes.buffer);\n const metaLen = view.getUint32(0, true);\n const metaBytes = decBytes.slice(4, 4 + metaLen);\n const metadata = JSON.parse(new TextDecoder().decode(metaBytes));\n const fileBytes = decBytes.slice(4 + metaLen);\n\n const fileBlob = new Blob([fileBytes], { type: metadata.mime || 'application/octet-stream' });\n return { metadata, fileBlob };\n}\n\nasync function initWire() {\n checkNotifications();\n\n const myId = Math.random().toString(36).slice(2);\n secret = window.location.hash.slice(1);\n\n if (secret) {\n role = localStorage.getItem('wire-role-' + secret) || 'A';\n }\n\n const hsUrl = `https://ppng.io/${baseSlug}-handshake`;\n\n if (!secret) {\n setStatus('Handshaking...');\n let handshakeDone = false;\n\n while (!handshakeDone) {\n try {\n // Generate a strong temporary secret\n const randBytes = crypto.getRandomValues(new Uint8Array(16));\n const tempSecret = Array.from(randBytes).map(b => b.toString(16).padStart(2, '0')).join('');\n\n setStatus('Waiting for peer...');\n\n const res = await fetch(hsUrl, {\n method: 'POST',\n body: JSON.stringify({ secret: tempSecret, id: myId }),\n headers: { 'Content-Type': 'text/plain' }\n });\n\n if (res.ok) {\n secret = tempSecret;\n role = 'A';\n handshakeDone = true;\n } else if (res.status === 400) {\n setStatus('Peer found, connecting...');\n const getRes = await fetch(hsUrl);\n if (getRes.ok) {\n const data = await getRes.json();\n secret = data.secret;\n role = 'B';\n handshakeDone = true;\n } else {\n console.error(\"Handshake GET error:\", getRes.status);\n }\n }\n } catch (e) {\n console.error(\"Handshake network error:\", e);\n await new Promise(r => setTimeout(r, 1000));\n }\n }\n window.location.hash = secret;\n localStorage.setItem('wire-role-' + secret, role);\n }\n\n // Derive the AES key for encryption\n aesKey = await deriveKey(secret);\n\n setStatus('Connected! Ready to transfer (E2E Encrypted).');\n startReceiveLoop();\n setupInteractions();\n}\n\nasync function startReceiveLoop() {\n const peerRole = role === 'A' ? 'B' : 'A';\n const listenPath = `https://ppng.io/${baseSlug}-dt-${secret.slice(0, 8)}-${peerRole}`;\n\n while (true) {\n try {\n const res = await fetch(listenPath);\n if (res.ok) {\n const encryptedBlob = await res.blob();\n try {\n const { metadata, fileBlob } = await decryptPayload(encryptedBlob);\n handleIncoming(metadata, fileBlob);\n } catch (decErr) {\n console.error(\"Decryption failed. Invalid key or corrupted data.\", decErr);\n }\n } else {\n console.error(\"Receive error status:\", res.status);\n }\n } catch (e) {\n console.error(\"Receive loop error:\", e);\n await new Promise(r => setTimeout(r, 1000));\n }\n }\n}\n\nasync function sendData(fileOrBlob, metadata) {\n setStatus('Encrypting...');\n try {\n const encryptedBlob = await encryptPayload(fileOrBlob, metadata);\n\n setStatus('Sending...');\n const sendPath = `https://ppng.io/${baseSlug}-dt-${secret.slice(0, 8)}-${role}`;\n\n // Use text/plain to bypass ppng parsing limits\n const res = await fetch(sendPath, {\n method: 'POST',\n body: encryptedBlob,\n headers: { 'Content-Type': 'text/plain' }\n });\n\n if (res.ok) {\n setStatus('Sent successfully!');\n } else {\n console.error(\"Send error status:\", res.status);\n setStatus('Send failed.');\n }\n } catch (e) {\n console.error(\"Send payload error:\", e);\n setStatus('Send error.');\n }\n setTimeout(() => setStatus('Connected! Ready to transfer (E2E Encrypted).'), 2500);\n}\n\nfunction triggerNotification(title) {\n if (document.hidden) {\n if (\"Notification\" in window && Notification.permission === 'granted') {\n const n = new Notification(title, { icon: '/favicon.ico' });\n n.onclick = () => { window.focus(); n.close(); };\n } else {\n clearInterval(titleFlashInterval);\n let toggle = false;\n titleFlashInterval = setInterval(() => {\n document.title = toggle ? originalTitle : `(1) ${title}`;\n toggle = !toggle;\n }, 1000);\n }\n }\n}\n\nwindow.addEventListener('focus', () => {\n clearInterval(titleFlashInterval);\n document.title = originalTitle;\n});\n\nasync function handleIncoming(metadata, fileBlob) {\n const { type, name } = metadata;\n triggerNotification(`New item: ${name}`);\n\n const url = URL.createObjectURL(fileBlob);\n\n try {\n const a = document.createElement('a');\n a.href = url;\n a.download = name;\n a.click();\n } catch(e) {\n console.error(\"Auto-download trigger failed:\", e);\n }\n\n DOM.incTitle.textContent = name;\n\n DOM.incDownload.onclick = () => {\n const a = document.createElement('a');\n a.href = url;\n a.download = name;\n a.click();\n };\n\n if (type === 'text') {\n DOM.incCopy.style.display = 'block';\n DOM.incCopy.onclick = async () => {\n try {\n const text = await fileBlob.text();\n await navigator.clipboard.writeText(text);\n DOM.incCopy.textContent = 'Copied!';\n setTimeout(() => DOM.incCopy.textContent = 'Copy', 2000);\n } catch (err) {\n console.error(\"Clipboard text write failed:\", err);\n }\n };\n } else if (type === 'file' && metadata.mime && metadata.mime.startsWith('image/')) {\n DOM.incCopy.style.display = 'block';\n DOM.incCopy.onclick = async () => {\n try {\n await navigator.clipboard.write([new ClipboardItem({ [metadata.mime]: fileBlob })]);\n DOM.incCopy.textContent = 'Copied!';\n setTimeout(() => DOM.incCopy.textContent = 'Copy', 2000);\n } catch(e) {\n console.error(\"Clipboard image write failed:\", e);\n DOM.incCopy.textContent = 'Failed';\n }\n };\n } else {\n DOM.incCopy.style.display = 'none';\n }\n\n DOM.incClose.onclick = () => {\n DOM.dialog.classList.add('hidden');\n };\n\n DOM.dialog.classList.remove('hidden');\n}\n\nfunction setupInteractions() {\n DOM.notifyBtn.addEventListener('click', () => {\n if (\"Notification\" in window) {\n Notification.requestPermission().then(p => {\n if (p === 'granted') {\n DOM.notifyNudge.classList.add('hidden');\n triggerNotification('Notifications Enabled!');\n }\n });\n }\n });\n\n DOM.popupBtn.addEventListener('click', () => {\n const popup = window.open(window.location.href, '_blank', 'width=600,height=800');\n if (popup) {\n document.body.innerHTML = '

This page can be closed.

Wire is active in the popup.

';\n setTimeout(() => { window.close(); }, 1500);\n }\n });\n\n const triggerFileInput = () => document.getElementById('file-input').click();\n DOM.fileIcon.addEventListener('click', triggerFileInput);\n DOM.fileSubtitle.addEventListener('click', triggerFileInput);\n\n document.addEventListener('dragover', (e) => {\n e.preventDefault();\n DOM.dropZone.classList.add('dragover');\n });\n document.addEventListener('dragleave', () => {\n DOM.dropZone.classList.remove('dragover');\n });\n document.addEventListener('drop', (e) => {\n e.preventDefault();\n DOM.dropZone.classList.remove('dragover');\n if (e.dataTransfer.files.length > 0) {\n const file = e.dataTransfer.files[0];\n sendData(file, { type: 'file', name: file.name, mime: file.type });\n }\n });\n\n document.addEventListener('paste', (e) => {\n const items = e.clipboardData.items;\n for (let i = 0; i < items.length; i++) {\n if (items[i].kind === 'file') {\n const file = items[i].getAsFile();\n sendData(file, { type: 'file', name: file.name || 'clipboard-image.png', mime: file.type });\n return;\n } else if (items[i].kind === 'string' && items[i].type === 'text/plain') {\n items[i].getAsString((str) => {\n const blob = new Blob([str], { type: 'text/plain' });\n sendData(blob, { type: 'text', name: 'clipboard-text.txt', mime: 'text/plain' });\n });\n return;\n }\n }\n });\n\n DOM.fileInput.addEventListener('change', (e) => {\n if (e.target.files.length > 0) {\n const file = e.target.files[0];\n sendData(file, { type: 'file', name: file.name, mime: file.type });\n e.target.value = '';\n }\n });\n}\n */\n}\n\nconst app = new Hono();\napp.get(\"/\", serve(html, \"text/html\"));\napp.get(\"/styles.css\", serve(css, \"text/css\"));\napp.get(\"/main.js\", serve(js, \"text/javascript\"));\napp.get(\"/:slug\", serve(html, \"text/html\"));\n\nexport default app.fetch;","/**\n * Wire: A 1-to-1 P2P file and text transfer application using ppng.io\n * Added a minimal light/dark theme, intelligent background downloads vs copying, and Mac OS key detection.\n * Removed nested comments in CSS/JS to prevent parsing errors in the serveUtils 3-file approach.\n */\n\nimport { serve } from \"https://esm.town/v/g/serveUtils\";\nimport { Hono } from \"npm:hono\";\n\nfunction html() {\n /*\n\n\n\n \n \n Wire\n \n \n \n\n\n

Wire

Enter a name to join or create a Wire.

\n \n

\n\n

Initializing...

PASTE OR DROP TO SEND

\n\n \n

You can also click me

\n\n \n\n

Enable notifications to not miss files!

\n \n \n

\n\n \n

\n\n

Incoming File

\n \n \n \n

\n\n\n */\n}\n\nfunction css() {\n /*\n:root {\n --bg-color: #121212;\n --text-color: #ffffff;\n --dashed-color: #555555;\n --accent: #e91e63;\n --dialog-bg: #222222;\n --dialog-border: #444444;\n --btn-bg: #444444;\n --btn-hover: #555555;\n --sub-text: #aaaaaa;\n --nudge-bg: #333333;\n --nudge-text: #ffffff;\n --drag-bg: rgba(255,255,255,0.02);\n --icon-color: #cccccc;\n}\n\n@media (prefers-color-scheme: light) {\n :root {\n --bg-color: #f8f9fa;\n --text-color: #212529;\n --dashed-color: #adb5bd;\n --dialog-bg: #ffffff;\n --dialog-border: #dee2e6;\n --btn-bg: #e9ecef;\n --btn-hover: #ced4da;\n --sub-text: #6c757d;\n --nudge-bg: #212529;\n --nudge-text: #ffffff;\n --drag-bg: rgba(0,0,0,0.02);\n --icon-color: #6c757d;\n }\n}\n\nbody {\n margin: 0;\n padding: 0;\n background-color: var(--bg-color);\n color: var(--text-color);\n font-family: -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif;\n height: 100vh;\n overflow: hidden;\n display: flex;\n align-items: center;\n justify-content: center;\n}\n.view {\n width: 100%;\n height: 100%;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n}\n.hidden {\n display: none !important;\n}\n.sub-text {\n color: var(--sub-text);\n}\n\n#home-view form {\n display: flex;\n gap: 10px;\n margin-top: 20px;\n align-items: center;\n}\n#home-view input {\n padding: 12px 20px;\n border-radius: 24px;\n border: 1px solid var(--dashed-color);\n background: transparent;\n color: var(--text-color);\n font-size: 16px;\n outline: none;\n}\n#home-view button {\n background: var(--text-color);\n color: var(--bg-color);\n border: none;\n border-radius: 50%;\n width: 44px;\n height: 44px;\n display: flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n transition: transform 0.2s;\n}\n#home-view button:hover {\n transform: scale(1.05);\n}\n\n#drop-zone {\n position: absolute;\n top: 20px; left: 20px; right: 20px; bottom: 20px;\n border: 2px dashed var(--dashed-color);\n border-radius: 8px;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n transition: border-color 0.2s;\n}\n#drop-zone.dragover {\n border-color: var(--text-color);\n background: var(--drag-bg);\n}\n.title-text {\n font-size: 28px;\n letter-spacing: 1px;\n margin-bottom: 20px;\n text-align: center;\n}\n.icon-large {\n width: 64px;\n height: 64px;\n margin: 10px 0;\n cursor: pointer;\n stroke-width: 1.5;\n color: var(--icon-color);\n transition: color 0.2s;\n}\n.icon-large:hover {\n color: var(--text-color);\n}\n.subtitle {\n font-size: 14px;\n font-style: italic;\n color: var(--sub-text);\n cursor: pointer;\n margin-bottom: 60px;\n}\n.subtitle:hover {\n color: var(--text-color);\n}\n.footer {\n position: absolute;\n bottom: 60px;\n font-size: 13px;\n color: var(--sub-text);\n text-align: center;\n}\n.highlight {\n color: var(--accent);\n font-weight: 600;\n}\n\n.controls-wrapper {\n position: absolute;\n bottom: 20px;\n display: flex;\n align-items: center;\n justify-content: center;\n width: 100%;\n}\n.controls {\n display: flex;\n gap: 20px;\n position: relative;\n}\n.controls button {\n background: transparent;\n border: none;\n color: var(--sub-text);\n cursor: pointer;\n transition: color 0.2s;\n display: flex;\n align-items: center;\n justify-content: center;\n padding: 5px;\n}\n.controls button:hover {\n color: var(--text-color);\n}\n\n#notify-nudge {\n position: absolute;\n bottom: 40px;\n left: 50%;\n transform: translateX(-50%);\n background: var(--nudge-bg);\n color: var(--nudge-text);\n padding: 8px 12px;\n border-radius: 6px;\n font-size: 12px;\n white-space: nowrap;\n box-shadow: 0 4px 12px rgba(0,0,0,0.3);\n pointer-events: none;\n opacity: 1;\n transition: opacity 0.3s;\n}\n#notify-nudge::after {\n content: '';\n position: absolute;\n top: 100%;\n left: 50%;\n margin-left: -5px;\n border-width: 5px;\n border-style: solid;\n border-color: var(--nudge-bg) transparent transparent transparent;\n}\n\n#status {\n position: absolute;\n top: 40px;\n font-size: 14px;\n color: var(--sub-text);\n letter-spacing: 0.5px;\n}\n\n#incoming-dialog {\n position: fixed;\n bottom: 30px;\n right: 30px;\n background: var(--dialog-bg);\n border: 1px solid var(--dialog-border);\n padding: 20px;\n border-radius: 12px;\n box-shadow: 0 10px 30px rgba(0,0,0,0.5);\n z-index: 100;\n display: flex;\n flex-direction: column;\n gap: 15px;\n min-width: 250px;\n transition: opacity 0.3s, transform 0.3s;\n}\n#incoming-dialog.hidden {\n opacity: 0;\n transform: translateY(20px);\n pointer-events: none;\n}\n#incoming-dialog h4 {\n margin: 0;\n font-size: 16px;\n font-weight: 500;\n word-break: break-all;\n color: var(--text-color);\n}\n.dialog-controls {\n display: flex;\n gap: 10px;\n}\n.dialog-controls button {\n flex: 1;\n padding: 8px;\n border: none;\n border-radius: 4px;\n cursor: pointer;\n font-size: 13px;\n background: var(--btn-bg);\n color: var(--text-color);\n}\n.dialog-controls button.primary {\n background: var(--text-color);\n color: var(--bg-color);\n}\n.dialog-controls button:hover {\n background: var(--btn-hover);\n}\n */\n}\n\nfunction js() {\n /*\nconst DOM = {\n homeView: document.getElementById('home-view'),\n wireView: document.getElementById('wire-view'),\n joinForm: document.getElementById('join-form'),\n wireInput: document.getElementById('wire-input'),\n dropZone: document.getElementById('drop-zone'),\n fileInput: document.getElementById('file-input'),\n fileIcon: document.getElementById('file-icon'),\n fileSubtitle: document.getElementById('file-subtitle'),\n status: document.getElementById('status'),\n notifyBtn: document.getElementById('notify-btn'),\n notifyNudge: document.getElementById('notify-nudge'),\n popupBtn: document.getElementById('popup-btn'),\n dialog: document.getElementById('incoming-dialog'),\n incTitle: document.getElementById('inc-title'),\n incDownload: document.getElementById('inc-download-btn'),\n incCopy: document.getElementById('inc-copy-btn'),\n incClose: document.getElementById('inc-close-btn'),\n ctrlKey: document.getElementById('ctrl-key')\n};\n\nlet secret = null;\nlet aesKey = null;\nlet role = null;\nlet slug = null;\nlet baseSlug = null;\nlet originalTitle = document.title;\nlet titleFlashInterval = null;\n\ndocument.addEventListener(\"DOMContentLoaded\", () => {\n if (window.lucide) lucide.createIcons();\n\n if (navigator.userAgent.includes('Mac')) {\n DOM.ctrlKey.textContent = '⌘V';\n }\n\n const path = window.location.pathname;\n if (path === '/' || path === '') {\n DOM.homeView.classList.remove('hidden');\n DOM.joinForm.addEventListener('submit', (e) => {\n e.preventDefault();\n const val = DOM.wireInput.value.trim();\n if(val) window.location.href = '/' + encodeURIComponent(val);\n });\n } else {\n DOM.wireView.classList.remove('hidden');\n slug = path.slice(1);\n baseSlug = `wire-xfr-v1-${slug}`;\n initWire();\n }\n});\n\nfunction setStatus(text) {\n DOM.status.textContent = text;\n}\n\nfunction checkNotifications() {\n if (\"Notification\" in window && Notification.permission === \"default\") {\n DOM.notifyNudge.classList.remove('hidden');\n }\n}\n\nasync function deriveKey(secretStr) {\n const enc = new TextEncoder();\n const keyMaterial = await crypto.subtle.digest('SHA-256', enc.encode(secretStr));\n return await crypto.subtle.importKey(\n \"raw\",\n keyMaterial,\n { name: \"AES-GCM\" },\n false,\n [\"encrypt\", \"decrypt\"]\n );\n}\n\nasync function encryptPayload(fileOrBlob, metadata) {\n const arrayBuffer = await fileOrBlob.arrayBuffer();\n const metaBytes = new TextEncoder().encode(JSON.stringify(metadata));\n\n const payload = new Uint8Array(4 + metaBytes.length + arrayBuffer.byteLength);\n const view = new DataView(payload.buffer);\n view.setUint32(0, metaBytes.length, true);\n payload.set(metaBytes, 4);\n payload.set(new Uint8Array(arrayBuffer), 4 + metaBytes.length);\n\n const iv = crypto.getRandomValues(new Uint8Array(12));\n const encrypted = await crypto.subtle.encrypt({ name: \"AES-GCM\", iv }, aesKey, payload);\n\n const finalPayload = new Uint8Array(12 + encrypted.byteLength);\n finalPayload.set(iv, 0);\n finalPayload.set(new Uint8Array(encrypted), 12);\n\n return new Blob([finalPayload], { type: 'text/plain' });\n}\n\nasync function decryptPayload(responseBlob) {\n const buffer = await responseBlob.arrayBuffer();\n const bytes = new Uint8Array(buffer);\n const iv = bytes.slice(0, 12);\n const ciphertext = bytes.slice(12);\n\n const decrypted = await crypto.subtle.decrypt({ name: \"AES-GCM\", iv }, aesKey, ciphertext);\n const decBytes = new Uint8Array(decrypted);\n\n const view = new DataView(decBytes.buffer);\n const metaLen = view.getUint32(0, true);\n const metaBytes = decBytes.slice(4, 4 + metaLen);\n const metadata = JSON.parse(new TextDecoder().decode(metaBytes));\n const fileBytes = decBytes.slice(4 + metaLen);\n\n const fileBlob = new Blob([fileBytes], { type: metadata.mime || 'application/octet-stream' });\n return { metadata, fileBlob };\n}\n\nasync function initWire() {\n checkNotifications();\n\n const myId = Math.random().toString(36).slice(2);\n secret = window.location.hash.slice(1);\n\n if (secret) {\n role = localStorage.getItem('wire-role-' + secret) || 'A';\n }\n\n const hsUrl = `https://ppng.io/${baseSlug}-handshake`;\n\n if (!secret) {\n setStatus('Handshaking...');\n let handshakeDone = false;\n\n while (!handshakeDone) {\n try {\n const randBytes = crypto.getRandomValues(new Uint8Array(16));\n const tempSecret = Array.from(randBytes).map(b => b.toString(16).padStart(2, '0')).join('');\n\n setStatus('Waiting for peer...');\n\n const res = await fetch(hsUrl, {\n method: 'POST',\n body: JSON.stringify({ secret: tempSecret, id: myId }),\n headers: { 'Content-Type': 'text/plain' }\n });\n\n if (res.ok) {\n secret = tempSecret;\n role = 'A';\n handshakeDone = true;\n } else if (res.status === 400) {\n setStatus('Peer found, connecting...');\n const getRes = await fetch(hsUrl);\n if (getRes.ok) {\n const data = await getRes.json();\n secret = data.secret;\n role = 'B';\n handshakeDone = true;\n } else {\n console.error(\"Handshake GET error:\", getRes.status);\n }\n }\n } catch (e) {\n console.error(\"Handshake network error:\", e);\n await new Promise(r => setTimeout(r, 1000));\n }\n }\n window.location.hash = secret;\n localStorage.setItem('wire-role-' + secret, role);\n }\n\n aesKey = await deriveKey(secret);\n\n setStatus('Connected! Ready to transfer (E2E Encrypted).');\n startReceiveLoop();\n setupInteractions();\n}\n\nasync function startReceiveLoop() {\n const peerRole = role === 'A' ? 'B' : 'A';\n const listenPath = `https://ppng.io/${baseSlug}-dt-${secret.slice(0, 8)}-${peerRole}`;\n\n while (true) {\n try {\n const res = await fetch(listenPath);\n if (res.ok) {\n const encryptedBlob = await res.blob();\n try {\n const { metadata, fileBlob } = await decryptPayload(encryptedBlob);\n handleIncoming(metadata, fileBlob);\n } catch (decErr) {\n console.error(\"Decryption failed. Invalid key or corrupted data.\", decErr);\n }\n } else {\n console.error(\"Receive error status:\", res.status);\n }\n } catch (e) {\n console.error(\"Receive loop error:\", e);\n await new Promise(r => setTimeout(r, 1000));\n }\n }\n}\n\nasync function sendData(fileOrBlob, metadata) {\n setStatus('Encrypting...');\n try {\n const encryptedBlob = await encryptPayload(fileOrBlob, metadata);\n\n setStatus('Sending...');\n const sendPath = `https://ppng.io/${baseSlug}-dt-${secret.slice(0, 8)}-${role}`;\n\n const res = await fetch(sendPath, {\n method: 'POST',\n body: encryptedBlob,\n headers: { 'Content-Type': 'text/plain' }\n });\n\n if (res.ok) {\n setStatus('Sent successfully!');\n } else {\n console.error(\"Send error status:\", res.status);\n setStatus('Send failed.');\n }\n } catch (e) {\n console.error(\"Send payload error:\", e);\n setStatus('Send error.');\n }\n setTimeout(() => setStatus('Connected! Ready to transfer (E2E Encrypted).'), 2500);\n}\n\nfunction triggerNotification(title) {\n if (document.hidden) {\n if (\"Notification\" in window && Notification.permission === 'granted') {\n const n = new Notification(title, { icon: '/favicon.ico' });\n n.onclick = () => { window.focus(); n.close(); };\n } else {\n clearInterval(titleFlashInterval);\n let toggle = false;\n titleFlashInterval = setInterval(() => {\n document.title = toggle ? originalTitle : `(1) ${title}`;\n toggle = !toggle;\n }, 1000);\n }\n }\n}\n\nwindow.addEventListener('focus', () => {\n clearInterval(titleFlashInterval);\n document.title = originalTitle;\n});\n\nasync function handleIncoming(metadata, fileBlob) {\n const { type, name, pasted } = metadata;\n const url = URL.createObjectURL(fileBlob);\n let autoSuccess = false;\n\n if (pasted) {\n try {\n if (type === 'text') {\n const text = await fileBlob.text();\n await navigator.clipboard.writeText(text);\n autoSuccess = true;\n } else if (type === 'file' && metadata.mime && metadata.mime.startsWith('image/')) {\n await navigator.clipboard.write([new ClipboardItem({ [metadata.mime]: fileBlob })]);\n autoSuccess = true;\n }\n } catch(e) {\n console.error(\"Auto-copy failed:\", e);\n }\n } else {\n try {\n const a = document.createElement('a');\n a.href = url;\n a.download = name;\n document.body.appendChild(a);\n a.click();\n document.body.removeChild(a);\n autoSuccess = true;\n } catch(e) {\n console.error(\"Auto-download trigger failed:\", e);\n }\n }\n\n if (!autoSuccess) {\n triggerNotification(`New item: ${name}`);\n\n DOM.incTitle.textContent = name;\n\n DOM.incDownload.onclick = () => {\n const a = document.createElement('a');\n a.href = url;\n a.download = name;\n document.body.appendChild(a);\n a.click();\n document.body.removeChild(a);\n };\n\n if (type === 'text') {\n DOM.incCopy.style.display = 'block';\n DOM.incCopy.onclick = async () => {\n try {\n const text = await fileBlob.text();\n await navigator.clipboard.writeText(text);\n DOM.incCopy.textContent = 'Copied!';\n setTimeout(() => DOM.incCopy.textContent = 'Copy', 2000);\n } catch (err) {\n console.error(\"Clipboard text write failed:\", err);\n }\n };\n } else if (type === 'file' && metadata.mime && metadata.mime.startsWith('image/')) {\n DOM.incCopy.style.display = 'block';\n DOM.incCopy.onclick = async () => {\n try {\n await navigator.clipboard.write([new ClipboardItem({ [metadata.mime]: fileBlob })]);\n DOM.incCopy.textContent = 'Copied!';\n setTimeout(() => DOM.incCopy.textContent = 'Copy', 2000);\n } catch(e) {\n console.error(\"Clipboard image write failed:\", e);\n DOM.incCopy.textContent = 'Failed';\n }\n };\n } else {\n DOM.incCopy.style.display = 'none';\n }\n\n DOM.incClose.onclick = () => {\n DOM.dialog.classList.add('hidden');\n };\n\n DOM.dialog.classList.remove('hidden');\n }\n}\n\nfunction setupInteractions() {\n DOM.notifyBtn.addEventListener('click', () => {\n if (\"Notification\" in window) {\n Notification.requestPermission().then(p => {\n if (p === 'granted') {\n DOM.notifyNudge.classList.add('hidden');\n triggerNotification('Notifications Enabled!');\n }\n });\n }\n });\n\n DOM.popupBtn.addEventListener('click', () => {\n const popup = window.open(window.location.href, '_blank', 'width=600,height=800');\n if (popup) {\n document.body.innerHTML = '

This page can be closed.

Wire is active in the popup.

';\n setTimeout(() => { window.close(); }, 1500);\n }\n });\n\n const triggerFileInput = () => DOM.fileInput.click();\n DOM.fileIcon.addEventListener('click', triggerFileInput);\n DOM.fileSubtitle.addEventListener('click', triggerFileInput);\n\n document.addEventListener('dragover', (e) => {\n e.preventDefault();\n DOM.dropZone.classList.add('dragover');\n });\n document.addEventListener('dragleave', () => {\n DOM.dropZone.classList.remove('dragover');\n });\n document.addEventListener('drop', (e) => {\n e.preventDefault();\n DOM.dropZone.classList.remove('dragover');\n if (e.dataTransfer.files.length > 0) {\n const file = e.dataTransfer.files[0];\n sendData(file, { type: 'file', name: file.name, mime: file.type, pasted: false });\n }\n });\n\n document.addEventListener('paste', (e) => {\n const items = e.clipboardData.items;\n for (let i = 0; i < items.length; i++) {\n if (items[i].kind === 'file') {\n const file = items[i].getAsFile();\n sendData(file, { type: 'file', name: file.name || 'clipboard-image.png', mime: file.type, pasted: true });\n return;\n } else if (items[i].kind === 'string' && items[i].type === 'text/plain') {\n items[i].getAsString((str) => {\n const blob = new Blob([str], { type: 'text/plain' });\n sendData(blob, { type: 'text', name: 'clipboard-text.txt', mime: 'text/plain', pasted: true });\n });\n return;\n }\n }\n });\n\n DOM.fileInput.addEventListener('change', (e) => {\n if (e.target.files.length > 0) {\n const file = e.target.files[0];\n sendData(file, { type: 'file', name: file.name, mime: file.type, pasted: false });\n e.target.value = '';\n }\n });\n}\n */\n}\n\nconst app = new Hono();\napp.get(\"/\", serve(html, \"text/html\"));\napp.get(\"/styles.css\", serve(css, \"text/css\"));\napp.get(\"/main.js\", serve(js, \"text/javascript\"));\napp.get(\"/:slug\", serve(html, \"text/html\"));\n\nexport default app.fetch;","createdAt",["D",1780438132477],"branchVersion","branchId","e33112fc-5ecb-11f1-84c0-1607ee4eb77e","id","e3302284-5ecb-11f1-84c0-1607ee4eb77e","wire",["D",1780436520814],"deletedAt","legacyEnvVars","privacy","public","httpPrivacy","description","","imageUrl","8d6857d3-cf1c-4e98-a094-0e379c10badf","pinnedFileId","pinPreview","pinMigrated","screenshotVersion","likeCount",0,"orgId","4f4797d6-1767-45ca-8dc5-5113174ca1c1","tursoName","tursoHostname","tursoMeasuredAt","pinned","userPerm","r","valPerm","blobPerm","rw","emailPerm","sqlitePerm","projectPerm","telemetryPerm","user",{"_95":94,"_102":98},"org",{"_95":94,"_96":-5,"_97":98,"_18":55,"_99":100,"_101":25},"branch",{"_13":84,"_32":85,"_43":42,"_86":44,"_87":-5,"_88":-5,"_89":-5,"_90":-5,"_91":-5,"_92":45,"_93":94},"isOwned",11,"main","projectId","forkedBranchId","forkedBranchVersion","forkedProjectPrivacy","forkedProjectId","forkedProjectOrgId","projectName","userHandle","g","handle","displayName","avatar","https://img.clerk.com/eyJ0eXBlIjoicHJveHkiLCJzcmMiOiJodHRwczovL2ltYWdlcy5jbGVyay5kZXYvdXBsb2FkZWQvaW1nXzJqRlBqSjdFTUlTVmVORmpObmFqZmJLVWh5VCJ9","tier","free","canRestrictVals","profileImageUrl","branchName","adoptOrgId",{"_43":44,"_32":45,"_38":149,"_47":-5,"_48":25,"_49":50,"_51":50,"_52":53,"_54":-5,"_18":55,"_56":-5,"_57":25,"_58":-5,"_59":-5,"_60":61,"_62":63,"_64":-5,"_65":-5,"_66":-5,"_67":-5,"_68":69,"_70":69,"_71":72,"_73":72,"_74":72,"_75":69,"_76":69,"_77":150,"_79":151,"_81":152,"_83":25},"tree",[144],"files",[144],"counts",{"_133":61,"_134":135,"_136":61,"_137":138,"_139":140},"contents",[125],"upstreamProject","upstreamBranch","emptyEnvVars","flags",[],"hasHttpFiles",true,"grants","orgs","customDomains",{},{"_43":126,"_32":28,"_30":31,"_127":-5,"_41":42,"_40":14,"_128":25,"_38":129,"_13":130,"_33":34,"_35":37,"_24":25,"_131":45,"_27":132},"a3d3bdcc-5ecf-11f1-a470-1607ee4eb77e","parentId","latest",["D",1780438132477],6,"label",[28],"pulls","branches",1,"forks","envVars",{"_141":61,"_143":61},"connections",{"_141":61,"_142":61},"count","unfilledCount","emptyCount",{"_43":126,"_32":28,"_30":31,"_127":-5,"_41":42,"_40":14,"_128":25,"_38":145,"_13":130,"_33":34,"_35":37,"_24":25,"_131":45,"_146":147,"_27":148},["D",1780438132477],"children",[],[28],["D",1780436520814],{"_95":94,"_102":98},{"_95":94,"_96":-5,"_97":98,"_18":55,"_99":100,"_101":25},{"_13":84,"_32":85,"_43":42,"_86":44,"_87":-5,"_88":-5,"_89":-5,"_90":-5,"_91":-5,"_92":45,"_93":94},"ctx",{"_77":-5,"_122":186,"_187":188,"_189":190,"_191":25,"_192":25,"_193":25,"_194":120,"_195":-5,"_196":-7,"_197":-7,"_198":61,"_199":25,"_200":25,"_201":-5,"_202":25,"_203":25,"_204":25,"_205":-5},"ENV",{"_157":158,"_159":160,"_161":85,"_162":163,"_164":165,"_166":167,"_168":169,"_170":171,"_172":173,"_174":175,"_176":177,"_178":179,"_180":181,"_182":183,"_184":185},"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 · v7