—

Total

—

New

—

Learning

—

Mastered

\n\n

\n \n \n

\n\n\n

\n \n

\n \n \n \n

\n\n\n

\n\n\n\n\n\n\n","label",[153,64],"extension","pulls","branches",1,"forks","envVars",{"_162":26,"_164":26},"connections",{"_162":26,"_163":26},"count","unfilledCount","emptyCount",{"_32":233,"_13":153,"_62":145,"_42":-5,"_34":35,"_146":212,"_147":139,"_36":234,"_38":26,"_65":235,"_149":-5,"_66":24,"_151":-5,"_180":236,"_17":237},{"_32":225,"_13":226,"_62":227,"_42":145,"_34":35,"_146":228,"_147":139,"_36":229,"_38":26,"_65":21,"_149":230,"_66":24,"_151":-5,"_180":231,"_17":232},{"_32":217,"_13":218,"_62":219,"_42":145,"_34":35,"_146":220,"_147":139,"_36":221,"_38":26,"_65":21,"_149":222,"_66":24,"_151":-5,"_180":223,"_17":224},{"_32":209,"_13":210,"_62":211,"_42":145,"_34":35,"_146":212,"_147":139,"_36":213,"_38":26,"_65":21,"_149":214,"_66":24,"_151":-5,"_180":215,"_17":216},{"_32":201,"_13":202,"_62":203,"_42":145,"_34":35,"_146":204,"_147":139,"_36":205,"_38":26,"_65":21,"_149":206,"_66":24,"_151":-5,"_180":207,"_17":208},{"_32":144,"_13":64,"_62":63,"_42":145,"_34":35,"_146":39,"_147":139,"_36":198,"_38":26,"_65":21,"_149":150,"_66":24,"_151":-5,"_180":199,"_17":200},{"_32":190,"_13":191,"_62":192,"_42":145,"_34":35,"_146":193,"_147":139,"_36":194,"_38":26,"_65":21,"_149":195,"_66":24,"_151":-5,"_180":196,"_17":197},{"_32":183,"_13":184,"_62":185,"_42":-5,"_34":35,"_146":108,"_147":139,"_36":186,"_38":26,"_65":21,"_149":187,"_66":24,"_151":-5,"_180":188,"_17":189},{"_32":174,"_13":175,"_62":176,"_42":-5,"_34":35,"_146":156,"_147":139,"_36":177,"_38":26,"_65":178,"_149":179,"_66":24,"_151":-5,"_180":181,"_17":182},"6efc048c-309f-11f1-9d7e-42dde27851f2","api.ts","6efc0554-309f-11f1-9d7e-42dde27851f2",["D",1775359674504],"http","// ePocket API — vocabulary capture & learning tracker\nimport { Hono } from \"npm:hono@4\";\nimport { cors } from \"npm:hono/cors\";\nimport { sqlite } from \"https://esm.town/v/std/sqlite/main.ts\";\n\nconst app = new Hono();\n\n// Allow Chrome extension to call this API\napp.use(\"*\", cors({ origin: \"*\" }));\n\n// ── DB init ────────────────────────────────────────────────────────────────\nawait sqlite.execute(`\n CREATE TABLE IF NOT EXISTS vocabulary (\n id INTEGER PRIMARY KEY AUTOINCREMENT,\n word TEXT NOT NULL,\n definition TEXT,\n context TEXT,\n source_url TEXT,\n mastery INTEGER DEFAULT 0,\n reviews INTEGER DEFAULT 0,\n created_at TEXT DEFAULT (datetime('now')),\n reviewed_at TEXT\n )\n`);\n\nawait sqlite.execute(`\n CREATE TABLE IF NOT EXISTS sessions (\n id INTEGER PRIMARY KEY AUTOINCREMENT,\n url TEXT,\n words_seen TEXT,\n created_at TEXT DEFAULT (datetime('now'))\n )\n`);\n\n// ── Routes ─────────────────────────────────────────────────────────────────\n\n// Explain a word (AI via built-in fetch to a free dictionary + context)\napp.post(\"/explain\", async (c) => {\n const { word, context } = await c.req.json();\n if (!word) return c.json({ error: \"word required\" }, 400);\n\n // Free Dictionary API\n let definition = \"\";\n let phonetic = \"\";\n let partOfSpeech = \"\";\n let example = \"\";\n\n try {\n const res = await fetch(`https://api.dictionaryapi.dev/api/v2/entries/en/${encodeURIComponent(word.trim())}`);\n if (res.ok) {\n const data = await res.json();\n const entry = data[0];\n phonetic = entry.phonetic || entry.phonetics?.[0]?.text || \"\";\n const meaning = entry.meanings?.[0];\n partOfSpeech = meaning?.partOfSpeech || \"\";\n const def = meaning?.definitions?.[0];\n definition = def?.definition || \"\";\n example = def?.example || \"\";\n }\n } catch (_) {}\n\n return c.json({ word, phonetic, partOfSpeech, definition, example, context });\n});\n\n// Save a word to pocket\napp.post(\"/words\", async (c) => {\n const { word, definition, context, source_url } = await c.req.json();\n if (!word) return c.json({ error: \"word required\" }, 400);\n\n // Check duplicate\n const existing = await sqlite.execute({\n sql: \"SELECT id FROM vocabulary WHERE lower(word) = lower(?)\",\n args: [word],\n });\n\n if (existing.rows.length > 0) {\n return c.json({ status: \"already_saved\", id: existing.rows[0].id });\n }\n\n const result = await sqlite.execute({\n sql: `INSERT INTO vocabulary (word, definition, context, source_url)\n VALUES (?, ?, ?, ?)`,\n args: [word, definition || \"\", context || \"\", source_url || \"\"],\n });\n\n return c.json({ status: \"saved\", id: result.lastInsertRowid });\n});\n\n// List all words (with optional search)\napp.get(\"/words\", async (c) => {\n const q = c.req.query(\"q\") || \"\";\n const sort = c.req.query(\"sort\") || \"newest\";\n\n const orderMap: Record = {\n newest: \"created_at DESC\",\n oldest: \"created_at ASC\",\n mastery: \"mastery ASC\",\n alpha: \"word ASC\",\n };\n const order = orderMap[sort] || \"created_at DESC\";\n\n const rows = await sqlite.execute({\n sql: `SELECT * FROM vocabulary\n WHERE lower(word) LIKE lower(?)\n ORDER BY ${order}`,\n args: [`%${q}%`],\n });\n\n return c.json({ words: rows.rows, total: rows.rows.length });\n});\n\n// Update mastery (0=new, 1=learning, 2=familiar, 3=mastered)\napp.patch(\"/words/:id/review\", async (c) => {\n const id = c.req.param(\"id\");\n const { mastery } = await c.req.json();\n\n await sqlite.execute({\n sql: `UPDATE vocabulary SET mastery = ?, reviews = reviews + 1, reviewed_at = datetime('now')\n WHERE id = ?`,\n args: [mastery, id],\n });\n\n return c.json({ ok: true });\n});\n\n// Delete a word\napp.delete(\"/words/:id\", async (c) => {\n const id = c.req.param(\"id\");\n await sqlite.execute({ sql: \"DELETE FROM vocabulary WHERE id = ?\", args: [id] });\n return c.json({ ok: true });\n});\n\n// Stats\napp.get(\"/stats\", async (c) => {\n const total = await sqlite.execute(\"SELECT COUNT(*) as n FROM vocabulary\");\n const mastered = await sqlite.execute(\"SELECT COUNT(*) as n FROM vocabulary WHERE mastery >= 3\");\n const learning = await sqlite.execute(\"SELECT COUNT(*) as n FROM vocabulary WHERE mastery BETWEEN 1 AND 2\");\n const newWords = await sqlite.execute(\"SELECT COUNT(*) as n FROM vocabulary WHERE mastery = 0\");\n const recent = await sqlite.execute(\n \"SELECT word FROM vocabulary ORDER BY created_at DESC LIMIT 5\"\n );\n\n return c.json({\n total: total.rows[0].n,\n mastered: mastered.rows[0].n,\n learning: learning.rows[0].n,\n new: newWords.rows[0].n,\n recent: recent.rows.map((r: any) => r.word),\n });\n});\n\n// Dashboard (redirect to dashboard val)\napp.get(\"/\", (c) => {\n return c.html(`\n\n\n\n\nePocket API\n\n\n\n

⚡ ePocket API

Vocabulary capture & learning tracker backend.

\n Endpoints\n

POST /explain — define a word with context
POST /words — save word to pocket
GET /words — list saved words
PATCH /words/:id/review — update mastery
DELETE /words/:id — remove word
GET /stats — learning statistics

Install the Chrome extension to start capturing vocabulary. View source →

\n\n`);\n});\n\napp.onError((err) => Promise.reject(err));\nexport default app.fetch;\n","children",[],[175],"cd249d62-309f-11f1-af0f-42dde27851f2","README.md","cd249e16-309f-11f1-af0f-42dde27851f2",["D",1775359832477],"# ⚡ ePocket — Vocabulary Capture Chrome Extension\n\n> Your personal vocabulary pocket. Capture, define, and master new words as you browse the web.\n\n## Architecture\n\n```mermaid\ngraph TD\n A[Chrome Extension] -->|Alt+E / double-click / right-click| B[Content Script modal.css + content.js]\n B -->|message| C[Background Service Worker background.js]\n C -->|POST /explain| D[ePocket API on Val Town]\n C -->|POST /words| D\n C -->|GET /words| D\n D -->|Free Dictionary API| E[dictionaryapi.dev]\n D -->|read/write| F[(SQLite — vocabulary + sessions)]\n A2[Popup popup.html + popup.js] -->|message| C\n A2 -->|stats, review| D\n```\n\n## Features\n\n| Feature | How |\n|---|---|\n| **Instant word explain** | Select text → press `Alt+E` |\n| **Double-click explain** | Double-click any word on page |\n| **Right-click explain** | Right-click selection → \"ePocket: Explain…\" |\n| **One-click save** | Click \"Save to Pocket\" in the modal |\n| **Pocket dashboard** | Click extension icon → 📚 Pocket tab |\n| **Mastery tracking** | 4 dots: New → Learning → Familiar → Mastered |\n| **Spaced review** | 🧠 Review tab — flip cards with Again/Hard/Good/Easy |\n| **Search & sort** | Search by word, sort by newest / A–Z / to review |\n\n## Install the Chrome Extension\n\n### Step 1 — Download the extension files\n\nDownload these files from the `extension/` folder in this val:\n\n```\nextension/\n manifest.json\n background.js\n content.js\n modal.css\n popup.html\n popup.js\n```\n\nYou'll also need placeholder icon images (`icon16.png`, `icon48.png`, `icon128.png`) — any PNG files will work for development.\n\n### Step 2 — Load in Chrome\n\n1. Open Chrome → `chrome://extensions`\n2. Enable **Developer mode** (top right toggle)\n3. Click **Load unpacked**\n4. Select the `extension/` folder\n\n### Step 3 — Use it!\n\n- **Select any text** on any webpage → press **`Alt+E`**\n- Or **double-click** a word\n- Or **right-click** → \"ePocket: Explain…\"\n- The modal pops up with the definition + context\n- Click **\"＋ Save to Pocket\"** to remember it\n- Click the extension icon to browse your pocket and do flashcard reviews\n\n## API Endpoints\n\nBase URL: `https://v7er--6efc0554309f11f19d7e42dde27851f2.web.val.run`\n\n| Method | Path | Description |\n|---|---|---|\n| `POST` | `/explain` | `{ word, context }` → definition |\n| `POST` | `/words` | Save word to pocket |\n| `GET` | `/words?q=&sort=` | List saved words |\n| `PATCH` | `/words/:id/review` | `{ mastery: 0-3 }` |\n| `DELETE` | `/words/:id` | Remove word |\n| `GET` | `/stats` | Learning statistics |\n\n## Mastery Levels\n\n```\n0 = New (purple dot)\n1 = Learning (purple dot)\n2 = Familiar (purple dot)\n3 = Mastered (all dots filled — excluded from review)\n```\n",[],[184],"c25c8d5e-309f-11f1-b444-42dde27851f2","popup.js","c25c8e62-309f-11f1-b444-42dde27851f2",7,["D",1775359814388],"/* ePocket popup controller */\n\nlet currentSort = \"newest\";\nlet searchQuery = \"\";\nlet reviewQueue = [];\nlet reviewIdx = 0;\nlet reviewRevealed = false;\n\n// ── Tab switching ──────────────────────────────────────────────────────────\n\ndocument.querySelectorAll(\".tab\").forEach((tab) => {\n tab.addEventListener(\"click\", () => {\n document.querySelectorAll(\".tab\").forEach((t) => t.classList.remove(\"active\"));\n document.querySelectorAll(\".pane\").forEach((p) => p.classList.remove(\"active\"));\n tab.classList.add(\"active\");\n document.getElementById(`pane-${tab.dataset.pane}`).classList.add(\"active\");\n if (tab.dataset.pane === \"review\") loadReview();\n });\n});\n\n// ── Stats ──────────────────────────────────────────────────────────────────\n\nfunction loadStats() {\n chrome.runtime.sendMessage({ type: \"GET_STATS\" }, (resp) => {\n if (resp?.ok) {\n document.getElementById(\"s-total\").textContent = resp.data.total;\n document.getElementById(\"s-new\").textContent = resp.data.new;\n document.getElementById(\"s-learn\").textContent = resp.data.learning;\n document.getElementById(\"s-master\").textContent = resp.data.mastered;\n }\n });\n}\n\n// ── Word list ──────────────────────────────────────────────────────────────\n\nfunction loadWords() {\n const list = document.getElementById(\"word-list\");\n list.innerHTML = `

`;\n\n chrome.runtime.sendMessage(\n { type: \"GET_WORDS\", params: { q: searchQuery, sort: currentSort } },\n (resp) => {\n if (!resp?.ok || !resp.data.words.length) {\n list.innerHTML = `\n

🪴

${searchQuery ? \"No matches found.\" : \"Your pocket is empty.
Select a word and press Alt+E!\"}

`;\n return;\n }\n list.innerHTML = \"\";\n resp.data.words.forEach((w) => {\n const item = document.createElement(\"div\");\n item.className = \"word-item\";\n item.innerHTML = `\n

${escHtml(w.word)}

\n ${w.definition ? `

${escHtml(w.definition)}

` : \"\"}\n

\n ${[0,1,2,3].map(i => ``).join(\"\")}\n

\n \n `;\n // Mastery dots\n item.querySelectorAll(\".dot\").forEach((dot) => {\n dot.addEventListener(\"click\", () => {\n const newMastery = parseInt(dot.dataset.level);\n chrome.runtime.sendMessage(\n { type: \"REVIEW_WORD\", id: dot.dataset.id, mastery: newMastery },\n () => { loadWords(); loadStats(); }\n );\n });\n });\n // Delete\n item.querySelector(\".del-btn\").addEventListener(\"click\", () => {\n if (confirm(`Remove \"${w.word}\" from your pocket?`)) {\n chrome.runtime.sendMessage({ type: \"DELETE_WORD\", id: w.id }, () => {\n loadWords(); loadStats();\n });\n }\n });\n list.appendChild(item);\n });\n }\n );\n}\n\n// Search\ndocument.getElementById(\"search-input\").addEventListener(\"input\", (e) => {\n searchQuery = e.target.value;\n loadWords();\n});\n\n// Sort buttons\ndocument.querySelectorAll(\".sort-btn\").forEach((btn) => {\n btn.addEventListener(\"click\", () => {\n document.querySelectorAll(\".sort-btn\").forEach((b) => b.classList.remove(\"active\"));\n btn.classList.add(\"active\");\n currentSort = btn.dataset.sort;\n loadWords();\n });\n});\n\n// ── Review (spaced repetition style) ──────────────────────────────────────\n\nfunction loadReview() {\n const area = document.getElementById(\"review-area\");\n area.innerHTML = `

`;\n\n chrome.runtime.sendMessage(\n { type: \"GET_WORDS\", params: { q: \"\", sort: \"mastery\" } },\n (resp) => {\n if (!resp?.ok) return;\n // Only review new/learning words\n reviewQueue = resp.data.words.filter((w) => w.mastery < 3).slice(0, 20);\n reviewIdx = 0;\n reviewRevealed = false;\n renderReviewCard();\n }\n );\n}\n\nfunction renderReviewCard() {\n const area = document.getElementById(\"review-area\");\n if (reviewQueue.length === 0 || reviewIdx >= reviewQueue.length) {\n area.innerHTML = `\n

🎉

All caught up! Come back after learning new words.

`;\n return;\n }\n\n const w = reviewQueue[reviewIdx];\n area.innerHTML = `\n

${reviewIdx+1}/${reviewQueue.length}

${escHtml(w.word)}

\n ${reviewRevealed\n ? `

${escHtml(w.definition || \"No definition saved.\")}

`\n : ``}\n

\n ${reviewRevealed ? `\n

\n \n \n \n \n

` : \"\"}\n `;\n\n if (!reviewRevealed) {\n document.getElementById(\"reveal-btn\").addEventListener(\"click\", () => {\n reviewRevealed = true;\n renderReviewCard();\n });\n } else {\n area.querySelectorAll(\".ra-btn\").forEach((btn) => {\n btn.addEventListener(\"click\", () => {\n const mastery = parseInt(btn.dataset.m);\n chrome.runtime.sendMessage(\n { type: \"REVIEW_WORD\", id: w.id, mastery },\n () => {\n reviewIdx++;\n reviewRevealed = false;\n renderReviewCard();\n loadStats();\n }\n );\n });\n });\n }\n}\n\n// ── Utils ──────────────────────────────────────────────────────────────────\n\nfunction escHtml(str) {\n return String(str || \"\")\n .replace(/&/g, \"&\")\n .replace(//g, \">\")\n .replace(/\"/g, \""\");\n}\n\n// ── Init ───────────────────────────────────────────────────────────────────\nloadStats();\nloadWords();\n",[],[153,191],["D",1775359788086],[],[153,64],"87eebc6e-309f-11f1-93b6-42dde27851f2","modal.css","87eebd18-309f-11f1-93b6-42dde27851f2",4,["D",1775359716359],"/* ePocket modal styles — injected into every page */\n\n#epocket-root {\n all: initial;\n font-family: -apple-system, BlinkMacSystemFont, \"Segoe UI\", system-ui, sans-serif;\n}\n\n#epocket-root * {\n box-sizing: border-box;\n margin: 0;\n padding: 0;\n}\n\n/* Backdrop */\n.ep-backdrop {\n position: fixed;\n inset: 0;\n background: rgba(0, 0, 0, 0.45);\n backdrop-filter: blur(3px);\n z-index: 2147483646;\n opacity: 0;\n transition: opacity 180ms ease;\n}\n.ep-backdrop.ep-visible { opacity: 1; }\n\n/* Modal card */\n.ep-modal {\n position: fixed;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -56%) scale(0.94);\n z-index: 2147483647;\n width: min(460px, calc(100vw - 32px));\n background: #13131a;\n border: 1px solid #2d2d3d;\n border-radius: 18px;\n box-shadow: 0 32px 80px rgba(0, 0, 0, 0.7), 0 0 0 1px rgba(99,102,241,.15);\n color: #e2e8f0;\n opacity: 0;\n transition: opacity 200ms ease, transform 220ms cubic-bezier(.34,1.56,.64,1);\n overflow: hidden;\n}\n.ep-modal.ep-visible {\n opacity: 1;\n transform: translate(-50%, -50%) scale(1);\n}\n\n/* Header */\n.ep-header {\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 16px 20px 12px;\n border-bottom: 1px solid #1e1e2e;\n}\n.ep-logo {\n font-size: 13px;\n font-weight: 700;\n letter-spacing: .04em;\n color: #6366f1;\n display: flex;\n align-items: center;\n gap: 6px;\n}\n.ep-logo-dot {\n width: 8px; height: 8px;\n background: linear-gradient(135deg, #6366f1, #8b5cf6);\n border-radius: 50%;\n box-shadow: 0 0 8px #6366f180;\n}\n.ep-close {\n all: unset;\n cursor: pointer;\n width: 28px; height: 28px;\n display: flex; align-items: center; justify-content: center;\n border-radius: 8px;\n color: #64748b;\n transition: background 120ms, color 120ms;\n}\n.ep-close:hover { background: #1e1e2e; color: #e2e8f0; }\n\n/* Body */\n.ep-body { padding: 20px; }\n\n/* Loading */\n.ep-loading {\n display: flex;\n align-items: center;\n gap: 10px;\n color: #64748b;\n font-size: 14px;\n}\n.ep-spinner {\n width: 18px; height: 18px;\n border: 2px solid #1e1e2e;\n border-top-color: #6366f1;\n border-radius: 50%;\n animation: ep-spin 0.6s linear infinite;\n}\n@keyframes ep-spin { to { transform: rotate(360deg); } }\n\n/* Word display */\n.ep-word-row {\n display: flex;\n align-items: baseline;\n gap: 10px;\n margin-bottom: 6px;\n flex-wrap: wrap;\n}\n.ep-word {\n font-size: 26px;\n font-weight: 800;\n color: #f1f5f9;\n line-height: 1;\n}\n.ep-phonetic {\n font-size: 14px;\n color: #6366f1;\n font-style: italic;\n}\n.ep-pos {\n font-size: 11px;\n background: #1e1e2e;\n color: #8b5cf6;\n border-radius: 6px;\n padding: 2px 8px;\n font-weight: 600;\n text-transform: uppercase;\n letter-spacing: .06em;\n}\n\n.ep-definition {\n font-size: 15px;\n line-height: 1.6;\n color: #cbd5e1;\n margin: 12px 0 0;\n}\n\n.ep-example {\n margin-top: 12px;\n padding: 10px 14px;\n background: #0f0f18;\n border-left: 3px solid #6366f1;\n border-radius: 0 8px 8px 0;\n font-size: 13px;\n color: #64748b;\n font-style: italic;\n line-height: 1.5;\n}\n\n.ep-context {\n margin-top: 12px;\n font-size: 12px;\n color: #475569;\n padding: 8px 12px;\n background: #0f0f18;\n border-radius: 8px;\n line-height: 1.5;\n}\n.ep-context strong { color: #64748b; }\n\n/* Not found */\n.ep-not-found {\n font-size: 14px;\n color: #64748b;\n line-height: 1.6;\n}\n\n/* Footer actions */\n.ep-actions {\n display: flex;\n gap: 8px;\n padding: 14px 20px;\n border-top: 1px solid #1e1e2e;\n background: #0f0f13;\n}\n.ep-btn {\n all: unset;\n cursor: pointer;\n padding: 8px 16px;\n border-radius: 10px;\n font-size: 13px;\n font-weight: 600;\n transition: all 140ms ease;\n display: flex;\n align-items: center;\n gap: 6px;\n}\n.ep-btn-primary {\n background: linear-gradient(135deg, #6366f1, #8b5cf6);\n color: #fff;\n box-shadow: 0 2px 12px rgba(99,102,241,.35);\n}\n.ep-btn-primary:hover {\n transform: translateY(-1px);\n box-shadow: 0 4px 18px rgba(99,102,241,.5);\n}\n.ep-btn-primary:active { transform: translateY(0); }\n.ep-btn-ghost {\n color: #64748b;\n}\n.ep-btn-ghost:hover { color: #e2e8f0; background: #1e1e2e; }\n\n/* Saved state */\n.ep-saved-badge {\n display: flex;\n align-items: center;\n gap: 6px;\n font-size: 13px;\n font-weight: 600;\n color: #4ade80;\n padding: 8px 0;\n}\n\n/* Toast */\n.ep-toast {\n position: fixed;\n bottom: 28px;\n left: 50%;\n transform: translateX(-50%) translateY(12px);\n background: #1e1e2e;\n border: 1px solid #2d2d3d;\n color: #e2e8f0;\n font-size: 13px;\n font-weight: 500;\n padding: 10px 18px;\n border-radius: 12px;\n box-shadow: 0 8px 32px rgba(0,0,0,.5);\n z-index: 2147483647;\n opacity: 0;\n transition: opacity 180ms, transform 200ms;\n pointer-events: none;\n}\n.ep-toast.ep-visible {\n opacity: 1;\n transform: translateX(-50%) translateY(0);\n}\n\n/* Highlight pulse on selected text */\n.ep-highlight {\n background: rgba(99, 102, 241, 0.25) !important;\n border-radius: 3px;\n transition: background 300ms;\n}\n",[],[153,202],"725a25be-309f-11f1-b3e6-42dde27851f2","manifest.json","725a2690-309f-11f1-b3e6-42dde27851f2",2,["D",1775359680108],"{\n \"manifest_version\": 3,\n \"name\": \"ePocket — Vocabulary Capture\",\n \"version\": \"1.0.0\",\n \"description\": \"Capture new words while browsing. Press Alt+E to explain any selected text.\",\n \"permissions\": [\n \"activeTab\",\n \"storage\",\n \"contextMenus\"\n ],\n \"host_permissions\": [\n \"https://v7er--6efc0554309f11f19d7e42dde27851f2.web.val.run/*\"\n ],\n \"background\": {\n \"service_worker\": \"background.js\"\n },\n \"content_scripts\": [\n {\n \"matches\": [\"\"],\n \"js\": [\"content.js\"],\n \"css\": [\"modal.css\"]\n }\n ],\n \"action\": {\n \"default_popup\": \"popup.html\",\n \"default_title\": \"ePocket\"\n },\n \"commands\": {\n \"explain-selection\": {\n \"suggested_key\": {\n \"default\": \"Alt+E\",\n \"mac\": \"Alt+E\"\n },\n \"description\": \"Explain selected word / phrase\"\n }\n },\n \"icons\": {\n \"16\": \"icon16.png\",\n \"48\": \"icon48.png\",\n \"128\": \"icon128.png\"\n }\n}\n",[],[153,210],"99f6a5e8-309f-11f1-b444-42dde27851f2","content.js","99f6a6a6-309f-11f1-b444-42dde27851f2",5,["D",1775359746609],"/* ePocket content script — modal + hotkey injection */\n\nlet modalRoot = null;\nlet backdrop = null;\nlet modal = null;\nlet currentWord = \"\";\nlet currentDef = null;\nlet toastTimer = null;\n\n// ── Build DOM ──────────────────────────────────────────────────────────────\n\nfunction buildUI() {\n if (modalRoot) return;\n\n // Isolated root\n modalRoot = document.createElement(\"div\");\n modalRoot.id = \"epocket-root\";\n document.body.appendChild(modalRoot);\n\n // Backdrop\n backdrop = document.createElement(\"div\");\n backdrop.className = \"ep-backdrop\";\n backdrop.addEventListener(\"click\", closeModal);\n modalRoot.appendChild(backdrop);\n\n // Modal\n modal = document.createElement(\"div\");\n modal.className = \"ep-modal\";\n modal.setAttribute(\"role\", \"dialog\");\n modal.setAttribute(\"aria-modal\", \"true\");\n modal.innerHTML = `\n

\n \n \n ePocket\n \n \n

\n `;\n modalRoot.appendChild(modal);\n\n modal.querySelector(\".ep-close\").addEventListener(\"click\", closeModal);\n}\n\n// ── Open / Close ───────────────────────────────────────────────────────────\n\nfunction openModal() {\n buildUI();\n requestAnimationFrame(() => {\n backdrop.classList.add(\"ep-visible\");\n modal.classList.add(\"ep-visible\");\n });\n}\n\nfunction closeModal() {\n if (!modal) return;\n backdrop.classList.remove(\"ep-visible\");\n modal.classList.remove(\"ep-visible\");\n currentDef = null;\n}\n\ndocument.addEventListener(\"keydown\", (e) => {\n if (e.key === \"Escape\") closeModal();\n});\n\n// ── Render states ──────────────────────────────────────────────────────────\n\nfunction renderLoading(word) {\n const body = modal.querySelector(\"#ep-body-content\");\n const actions = modal.querySelector(\"#ep-actions\");\n body.innerHTML = `\n

\n Looking up ${escHtml(word)}…\n

\n `;\n actions.innerHTML = \"\";\n}\n\nfunction renderResult(data, alreadySaved) {\n currentDef = data;\n const body = modal.querySelector(\"#ep-body-content\");\n const actions = modal.querySelector(\"#ep-actions\");\n\n const noDefinition = !data.definition;\n\n body.innerHTML = `\n

\n ${escHtml(data.word)}\n ${data.phonetic ? `${escHtml(data.phonetic)}` : \"\"}\n ${data.partOfSpeech ? `${escHtml(data.partOfSpeech)}` : \"\"}\n

\n ${noDefinition\n ? `

No dictionary entry found for \"${escHtml(data.word)}\". You can still save it to your pocket.

`\n : `

${escHtml(data.definition)}

`}\n ${data.example ? `

\"${escHtml(data.example)}\"

` : \"\"}\n ${data.context && data.context !== data.word\n ? `

Context: …${escHtml(data.context.trim())}…

`\n : \"\"}\n `;\n\n if (alreadySaved) {\n actions.innerHTML = `\n ✓ Already in your pocket\n \n `;\n actions.querySelector(\"#ep-dismiss\").addEventListener(\"click\", closeModal);\n } else {\n actions.innerHTML = `\n \n \n `;\n actions.querySelector(\"#ep-save\").addEventListener(\"click\", saveWord);\n actions.querySelector(\"#ep-dismiss\").addEventListener(\"click\", closeModal);\n }\n}\n\nfunction renderSaved() {\n const actions = modal.querySelector(\"#ep-actions\");\n actions.innerHTML = `\n ✓ Saved to your pocket!\n \n `;\n actions.querySelector(\"#ep-dismiss\").addEventListener(\"click\", closeModal);\n showToast(\"⚡ Word saved to ePocket!\");\n}\n\n// ── Core explain ───────────────────────────────────────────────────────────\n\nfunction explainWord(word, context) {\n if (!word || word.trim().length === 0) return;\n word = word.trim().slice(0, 80);\n currentWord = word;\n\n openModal();\n renderLoading(word);\n\n chrome.runtime.sendMessage(\n { type: \"FETCH_EXPLAIN\", word, context: context || \"\" },\n (resp) => {\n if (!resp || !resp.ok) {\n renderResult({ word, definition: \"\", context }, false);\n return;\n }\n const data = resp.data;\n // Check if already saved\n chrome.runtime.sendMessage(\n { type: \"GET_WORDS\", params: { q: word } },\n (wordsResp) => {\n const alreadySaved =\n wordsResp?.ok &&\n wordsResp.data.words.some(\n (w) => w.word.toLowerCase() === word.toLowerCase()\n );\n renderResult(data, alreadySaved);\n }\n );\n }\n );\n}\n\n// ── Save ───────────────────────────────────────────────────────────────────\n\nfunction saveWord() {\n if (!currentDef) return;\n chrome.runtime.sendMessage(\n {\n type: \"SAVE_WORD\",\n payload: {\n word: currentDef.word,\n definition: currentDef.definition,\n context: currentDef.context,\n source_url: window.location.href,\n },\n },\n () => renderSaved()\n );\n}\n\n// ── Toast ──────────────────────────────────────────────────────────────────\n\nfunction showToast(msg) {\n let toast = modalRoot.querySelector(\".ep-toast\");\n if (!toast) {\n toast = document.createElement(\"div\");\n toast.className = \"ep-toast\";\n modalRoot.appendChild(toast);\n }\n toast.textContent = msg;\n toast.classList.add(\"ep-visible\");\n clearTimeout(toastTimer);\n toastTimer = setTimeout(() => toast.classList.remove(\"ep-visible\"), 2500);\n}\n\n// ── Message listener ───────────────────────────────────────────────────────\n\nchrome.runtime.onMessage.addListener((msg) => {\n if (msg.type === \"EXPLAIN\") {\n explainWord(msg.word, getSurroundingContext(msg.word));\n }\n if (msg.type === \"EXPLAIN_SELECTION\") {\n const sel = window.getSelection();\n if (sel && sel.toString().trim()) {\n const word = sel.toString().trim();\n const context = getSelectionContext(sel);\n explainWord(word, context);\n } else {\n showToastNoRoot(\"Select a word first, then press Alt+E\");\n }\n }\n});\n\n// ── Double-click to quick-explain ─────────────────────────────────────────\n\nlet dblClickTimer = null;\ndocument.addEventListener(\"dblclick\", (e) => {\n const sel = window.getSelection();\n if (!sel || !sel.toString().trim()) return;\n const word = sel.toString().trim();\n if (word.split(/\\s+/).length > 4) return; // only short phrases\n clearTimeout(dblClickTimer);\n dblClickTimer = setTimeout(() => {\n const context = getSelectionContext(sel);\n explainWord(word, context);\n }, 200);\n});\n\n// ── Context helpers ────────────────────────────────────────────────────────\n\nfunction getSelectionContext(sel) {\n try {\n const range = sel.getRangeAt(0);\n const node = range.commonAncestorContainer;\n const text = (node.textContent || \"\").trim();\n const start = Math.max(0, range.startOffset - 60);\n const end = Math.min(text.length, range.endOffset + 60);\n return text.slice(start, end);\n } catch (_) {\n return \"\";\n }\n}\n\nfunction getSurroundingContext(word) {\n const walker = document.createTreeWalker(document.body, NodeFilter.SHOW_TEXT);\n while (walker.nextNode()) {\n const txt = walker.currentNode.textContent;\n const idx = txt.indexOf(word);\n if (idx !== -1) {\n return txt.slice(Math.max(0, idx - 60), idx + word.length + 60);\n }\n }\n return \"\";\n}\n\nfunction showToastNoRoot(msg) {\n buildUI();\n showToast(msg);\n}\n\nfunction escHtml(str) {\n return String(str)\n .replace(/&/g, \"&\")\n .replace(//g, \">\")\n .replace(/\"/g, \""\");\n}\n",[],[153,218],"794407be-309f-11f1-9d7e-42dde27851f2","background.js","7944087c-309f-11f1-9d7e-42dde27851f2",3,["D",1775359691754],"const API = \"https://v7er--6efc0554309f11f19d7e42dde27851f2.web.val.run\";\n\n// Context menu\nchrome.runtime.onInstalled.addListener(() => {\n chrome.contextMenus.create({\n id: \"epocket-explain\",\n title: \"ePocket: Explain \\\"%s\\\"\",\n contexts: [\"selection\"],\n });\n});\n\nchrome.contextMenus.onClicked.addListener((info, tab) => {\n if (info.menuItemId === \"epocket-explain\" && info.selectionText) {\n chrome.tabs.sendMessage(tab.id, {\n type: \"EXPLAIN\",\n word: info.selectionText.trim(),\n });\n }\n});\n\n// Keyboard shortcut\nchrome.commands.onCommand.addListener((command, tab) => {\n if (command === \"explain-selection\") {\n chrome.tabs.sendMessage(tab.id, { type: \"EXPLAIN_SELECTION\" });\n }\n});\n\n// Message bus\nchrome.runtime.onMessage.addListener((msg, _sender, reply) => {\n if (msg.type === \"FETCH_EXPLAIN\") {\n fetch(`${API}/explain`, {\n method: \"POST\",\n headers: { \"Content-Type\": \"application/json\" },\n body: JSON.stringify({ word: msg.word, context: msg.context }),\n })\n .then((r) => r.json())\n .then((data) => reply({ ok: true, data }))\n .catch((e) => reply({ ok: false, error: e.message }));\n return true; // async\n }\n\n if (msg.type === \"SAVE_WORD\") {\n fetch(`${API}/words`, {\n method: \"POST\",\n headers: { \"Content-Type\": \"application/json\" },\n body: JSON.stringify(msg.payload),\n })\n .then((r) => r.json())\n .then((data) => reply({ ok: true, data }))\n .catch((e) => reply({ ok: false, error: e.message }));\n return true;\n }\n\n if (msg.type === \"GET_STATS\") {\n fetch(`${API}/stats`)\n .then((r) => r.json())\n .then((data) => reply({ ok: true, data }))\n .catch((e) => reply({ ok: false, error: e.message }));\n return true;\n }\n\n if (msg.type === \"GET_WORDS\") {\n const params = new URLSearchParams(msg.params || {});\n fetch(`${API}/words?${params}`)\n .then((r) => r.json())\n .then((data) => reply({ ok: true, data }))\n .catch((e) => reply({ ok: false, error: e.message }));\n return true;\n }\n\n if (msg.type === \"REVIEW_WORD\") {\n fetch(`${API}/words/${msg.id}/review`, {\n method: \"PATCH\",\n headers: { \"Content-Type\": \"application/json\" },\n body: JSON.stringify({ mastery: msg.mastery }),\n })\n .then((r) => r.json())\n .then((data) => reply({ ok: true, data }))\n .catch((e) => reply({ ok: false, error: e.message }));\n return true;\n }\n\n if (msg.type === \"DELETE_WORD\") {\n fetch(`${API}/words/${msg.id}`, { method: \"DELETE\" })\n .then((r) => r.json())\n .then((data) => reply({ ok: true, data }))\n .catch((e) => reply({ ok: false, error: e.message }));\n return true;\n }\n});\n",[],[153,226],"725a3482-309f-11f1-b3e6-42dde27851f2",["D",1775359680108],"directory",[166,167,168,169,170,171],[153],["D",1775359645050],["D",1789551045218],{"_11":12,"_121":69},{"_11":12,"_117":-5,"_68":69,"_30":67,"_118":119,"_120":24},{"_38":108,"_13":16,"_32":35,"_109":71,"_110":-5,"_111":-5,"_112":-5,"_113":-5,"_114":-5,"_115":14,"_116":12},"ctx",{"_52":-5,"_141":276,"_277":278,"_279":280,"_281":24,"_282":24,"_283":24,"_284":139,"_285":-5,"_286":-7,"_287":-7,"_288":26,"_289":24,"_290":24,"_291":-5,"_292":24,"_293":24,"_294":24,"_295":-5},"ENV",{"_247":248,"_249":250,"_251":16,"_252":253,"_254":255,"_256":257,"_258":259,"_260":261,"_262":263,"_264":265,"_266":267,"_268":269,"_270":271,"_272":273,"_274":275},"REACT_APP_SENTRY_DSN","https://586020d86f05489db63a554690acf1e9@o1398359.ingest.sentry.io/6724499","RENDER_GIT_COMMIT","fdb67791413f4386b4dbf18f354029a617f6160f","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"]

History · popup.html