[{"_1":2,"_3":-5,"_4":-5},"loaderData",{"_5":6,"_7":8,"_9":10},"actionData","errors","root",{"_212":213,"_214":215},"routes/_app.x.$handle.$name",{"_97":96,"_32":46,"_105":87,"_27":106,"_13":14,"_107":-5,"_11":108,"_109":110,"_111":112,"_113":114,"_115":116,"_20":-5,"_117":-5,"_118":-5,"_119":25,"_120":121,"_122":59,"_123":-5,"_124":-5,"_125":126},"routes/_app.x.$handle.$name.branch.$branch.version.$version.diff",{"_11":12,"_13":14,"_15":16,"_17":-5,"_18":-5},"project",{"_44":45,"_32":46,"_39":47,"_48":-5,"_49":25,"_50":51,"_52":51,"_53":-5,"_54":-5,"_18":55,"_56":57,"_58":59,"_60":59,"_61":-5,"_62":63,"_64":65,"_66":-5,"_67":-5,"_68":-5,"_69":-5,"_70":71,"_72":71,"_73":74,"_75":74,"_76":74,"_77":71,"_78":71,"_79":80,"_81":82,"_83":84,"_85":25},"version",12,"changes",[19],"aiChatInfo","userId",{"_20":21,"_22":23,"_24":25,"_26":25,"_27":28,"_29":28},"file",{"_30":31,"_32":33,"_34":35,"_36":38,"_39":40,"_41":14,"_42":43,"_24":25},"previous",{"_30":31,"_32":33,"_34":35,"_36":37},"deleted",false,"deletedHere","path","frontend/index.js","latestPath","fileId","6532991a-356a-11f0-9d62-9e149126039e","name","index.js","fileType","script","content","// Generate a unique ID for the current user/browser\nfunction generateUserId() {\n const storedId = localStorage.getItem('bookClubUserId');\n if (storedId) return storedId;\n \n const newId = 'user_' + Math.random().toString(36).substring(2, 15);\n localStorage.setItem('bookClubUserId', newId);\n return newId;\n}\n\nconst userId = generateUserId();\nlet books = [];\n\n// DOM elements\nconst bookForm = document.getElementById('book-form');\nconst booksContainer = document.getElementById('books-container');\nconst bookTemplate = document.getElementById('book-template');\n\n// Load books from the API\nasync function loadBooks() {\n try {\n const response = await fetch('/api/books');\n if (!response.ok) throw new Error('Failed to load books');\n \n books = await response.json();\n renderBooks();\n } catch (error) {\n console.error('Error loading books:', error);\n booksContainer.innerHTML = `\n

Failed to load books. Please try again later.

\n \n

\n `;\n document.getElementById('retry-button')?.addEventListener('click', loadBooks);\n }\n}\n\n// Render books to the DOM\nfunction renderBooks() {\n if (books.length === 0) {\n booksContainer.innerHTML = `\n

No books have been suggested yet.

Be the first to suggest a book!

Failed to load books. Please try again later.

\n \n

No books have been suggested yet.

Be the first to suggest a book!

\n `;\n return;\n }\n \n booksContainer.innerHTML = '';\n \n books.forEach(book => {\n const bookElement = bookTemplate.content.cloneNode(true);\n \n // Set book details\n bookElement.querySelector('.book-title').textContent = book.title;\n bookElement.querySelector('.book-author').textContent = `by ${book.author}`;\n \n const descriptionEl = bookElement.querySelector('.book-description');\n if (book.description) {\n descriptionEl.textContent = book.description;\n } else {\n descriptionEl.remove();\n }\n \n bookElement.querySelector('.book-suggester').textContent = book.suggested_by || 'Anonymous';\n bookElement.querySelector('.vote-count').textContent = book.votes;\n \n // Set up voting\n const voteButton = bookElement.querySelector('.vote-button');\n const bookItem = bookElement.querySelector('.book-item');\n bookItem.dataset.id = book.id;\n \n // Check if user has already voted for this book\n checkVoteStatus(book.id).then(hasVoted => {\n if (hasVoted) {\n voteButton.classList.add('voted');\n }\n });\n \n voteButton.addEventListener('click', () => handleVote(book.id, voteButton));\n \n booksContainer.appendChild(bookElement);\n });\n}\n\n// Check if the user has voted for a book\nasync function checkVoteStatus(bookId) {\n try {\n const response = await fetch(`/api/books/${bookId}/vote/${userId}`);\n \n if (!response.ok) {\n throw new Error('Failed to check vote status');\n }\n \n const result = await response.json();\n return result.hasVoted;\n } catch (error) {\n console.error('Error checking vote status:', error);\n return false;\n }\n}\n\n// Handle voting for a book\nasync function handleVote(bookId, voteButton) {\n const isVoted = voteButton.classList.contains('voted');\n const method = isVoted ? 'DELETE' : 'POST';\n \n try {\n const response = await fetch(`/api/books/${bookId}/vote`, {\n method,\n headers: { 'Content-Type': 'application/json' },\n body: JSON.stringify({ voter_id: userId })\n });\n \n if (!response.ok) {\n const error = await response.json();\n throw new Error(error.error || 'Failed to process vote');\n }\n \n // Toggle voted class\n voteButton.classList.toggle('voted');\n \n // Update vote count\n const voteCountEl = voteButton.nextElementSibling;\n const currentCount = parseInt(voteCountEl.textContent);\n voteCountEl.textContent = isVoted ? currentCount - 1 : currentCount + 1;\n \n // Refresh the book list to get updated order\n setTimeout(loadBooks, 500);\n } catch (error) {\n console.error('Error voting:', error);\n alert(`Voting error: ${error.message}`);\n }\n}\n\n// Handle book form submission\nbookForm.addEventListener('submit', async (event) => {\n event.preventDefault();\n \n // Disable the submit button to prevent double submissions\n const submitButton = bookForm.querySelector('button[type=\"submit\"]');\n const originalButtonText = submitButton.textContent;\n submitButton.disabled = true;\n submitButton.textContent = 'Adding...';\n \n const formData = new FormData(bookForm);\n const title = formData.get('title')?.trim();\n const author = formData.get('author')?.trim();\n \n // Client-side validation\n if (!title || !author) {\n alert('Title and author are required');\n submitButton.disabled = false;\n submitButton.textContent = originalButtonText;\n return;\n }\n \n const bookData = {\n title,\n author,\n description: formData.get('description')?.trim() || '',\n suggested_by: formData.get('suggested-by')?.trim() || 'Anonymous'\n };\n \n try {\n const response = await fetch('/api/books', {\n method: 'POST',\n headers: { 'Content-Type': 'application/json' },\n body: JSON.stringify(bookData)\n });\n \n if (!response.ok) {\n const error = await response.json();\n throw new Error(error.error || 'Failed to add book');\n }\n \n // Clear form\n bookForm.reset();\n \n // Reload books\n await loadBooks();\n \n // Highlight the new book\n const newBook = await response.json();\n setTimeout(() => {\n const bookElement = document.querySelector(`.book-item[data-id=\"${newBook.id}\"]`);\n if (bookElement) {\n bookElement.classList.add('new-book');\n bookElement.scrollIntoView({ behavior: 'smooth', block: 'center' });\n }\n }, 100);\n } catch (error) {\n console.error('Error adding book:', error);\n alert(`Error adding book: ${error.message}`);\n } finally {\n // Re-enable the submit button\n submitButton.disabled = false;\n submitButton.textContent = originalButtonText;\n }\n});\n\n// Initialize the app\nloadBooks();\n\n// Set up view source link\ndocument.getElementById('view-source').addEventListener('click', (e) => {\n // This will be replaced by the backend with the actual URL\n if (window.sourceUrl) {\n e.target.href = window.sourceUrl;\n }\n});","createdAt",["D",1747739388685],"branchVersion","branchId","ef68d06e-3569-11f0-91e4-9e149126039e","id","ef689d6a-3569-11f0-91e4-9e149126039e","BookClubVoter",["D",1747738955292],"deletedAt","legacyEnvVars","privacy","public","httpPrivacy","description","imageUrl","6b73b7f0-f674-4d26-89f2-9de7fe1dbce7","pinnedFileId","46964808-356a-11f0-a59f-9e149126039e","pinPreview",true,"pinMigrated","screenshotVersion","likeCount",0,"orgId","e3802a43-3237-4804-8430-c924c05965c3","tursoName","tursoHostname","tursoMeasuredAt","pinned","userPerm","r","valPerm","blobPerm","rw","emailPerm","sqlitePerm","projectPerm","telemetryPerm","user",{"_97":96,"_104":100},"org",{"_97":96,"_98":-5,"_99":100,"_18":55,"_101":102,"_103":25},"branch",{"_13":86,"_32":87,"_44":43,"_88":45,"_89":-5,"_90":-5,"_91":-5,"_92":-5,"_93":-5,"_94":46,"_95":96},"isOwned",17,"main","projectId","forkedBranchId","forkedBranchVersion","forkedProjectPrivacy","forkedProjectId","forkedProjectOrgId","projectName","userHandle","td0034","handle","displayName","avatar","https://img.clerk.com/eyJ0eXBlIjoicHJveHkiLCJzcmMiOiJodHRwczovL2ltYWdlcy5jbGVyay5kZXYvb2F1dGhfZ2l0aHViL2ltZ18ycW5QZ1JaYjdycFJaUVBDaHlyd1ZSUHhlOFYifQ","tier","free","canRestrictVals","profileImageUrl","branchName","","adoptOrgId",{"_44":45,"_32":46,"_39":208,"_48":-5,"_49":25,"_50":51,"_52":51,"_53":-5,"_54":-5,"_18":55,"_56":57,"_58":59,"_60":59,"_61":-5,"_62":63,"_64":65,"_66":-5,"_67":-5,"_68":-5,"_69":-5,"_70":71,"_72":71,"_73":74,"_75":74,"_76":74,"_77":71,"_78":71,"_79":209,"_81":210,"_83":211,"_85":25},"tree",[163,165,169],"files",[163,164,165,166,167,168,169],"counts",{"_153":63,"_154":150,"_155":63,"_156":157,"_158":159},"contents",[127,128,129],"upstreamProject","upstreamBranch","emptyEnvVars","flags",[],"hasHttpFiles","grants","orgs","customDomains",{},{"_44":147,"_32":148,"_30":149,"_133":-5,"_42":43,"_41":150,"_135":59,"_39":151,"_13":63,"_34":145,"_36":-5,"_24":25,"_138":-5,"_27":152},{"_44":140,"_32":141,"_30":142,"_133":-5,"_42":43,"_41":143,"_135":59,"_39":144,"_13":63,"_34":145,"_36":-5,"_24":25,"_138":-5,"_27":146},{"_44":130,"_32":131,"_30":132,"_133":-5,"_42":43,"_41":134,"_135":59,"_39":136,"_13":63,"_34":20,"_36":137,"_24":25,"_138":-5,"_27":139},"6a22960a-356a-11f0-9d62-9e149126039e","README.md","6a2296e6-356a-11f0-9d62-9e149126039e","parentId",5,"latest",["D",1747739161189],"# Book Club Suggestion and Voting System\n\nA simple web application for book club members to suggest books and vote on them.\n\n## Features\n\n- Suggest new books with title, author, description, and suggester name\n- View all suggested books in a list\n- Vote for books you're interested in reading\n- Books are sorted by vote count (highest first)\n- Persistent storage using SQLite\n- Anonymous voting with browser-based user identification\n\n## Technical Details\n\nThis application is built using:\n\n- Backend: Hono.js with SQLite for data storage\n- Frontend: Vanilla JavaScript with Tailwind CSS for styling\n- Data is stored in two tables:\n - `book_club_books`: Stores book suggestions\n - `book_club_votes`: Tracks votes by anonymous user IDs\n\n## How It Works\n\n1. **Suggesting Books**:\n - Fill out the form at the top of the page\n - Title and author are required\n - Description and your name are optional\n\n2. **Voting**:\n - Click the up arrow on any book to vote for it\n - Each user (browser) can only vote once per book\n - Click again to remove your vote\n - Books with the most votes appear at the top\n\n3. **User Identification**:\n - A random user ID is generated and stored in your browser's localStorage\n - This ID is used to track your votes without requiring login\n - Clearing your browser data will reset your voting history\n\n## API Endpoints\n\n- `GET /api/books` - Get all books with vote counts\n- `POST /api/books` - Add a new book\n- `POST /api/books/:id/vote` - Vote for a book\n- `DELETE /api/books/:id/vote` - Remove a vote from a book","label",[131],"521ce560-356a-11f0-a389-9e149126039e","frontend","6fc5204e-1275-44ba-b2a0-3426ab78babc",2,["D",1747739120885],"directory",[141],"46965438-356a-11f0-a59f-9e149126039e","backend","16956a96-edd8-43bd-8f80-60cd8f888ede",1,["D",1747739101546],[148],"pulls","branches","forks","envVars",{"_160":63,"_162":63},"connections",{"_160":63,"_161":63},"count","unfilledCount","emptyCount",{"_44":147,"_32":148,"_30":149,"_133":-5,"_42":43,"_41":150,"_135":59,"_39":205,"_13":63,"_34":145,"_36":-5,"_24":25,"_138":-5,"_171":206,"_27":207},{"_44":197,"_32":198,"_30":57,"_133":149,"_42":43,"_41":199,"_135":25,"_39":200,"_13":177,"_34":201,"_36":202,"_24":25,"_138":-5,"_171":203,"_27":204},{"_44":140,"_32":141,"_30":142,"_133":-5,"_42":43,"_41":143,"_135":59,"_39":194,"_13":63,"_34":145,"_36":-5,"_24":25,"_138":-5,"_171":195,"_27":196},{"_44":186,"_32":187,"_30":188,"_133":142,"_42":43,"_41":189,"_135":59,"_39":190,"_13":150,"_34":20,"_36":191,"_24":25,"_138":-5,"_171":192,"_27":193},{"_44":182,"_32":33,"_30":31,"_133":142,"_42":43,"_41":14,"_135":25,"_39":183,"_13":177,"_34":35,"_36":38,"_24":25,"_138":-5,"_171":184,"_27":185},{"_44":174,"_32":175,"_30":176,"_133":142,"_42":43,"_41":177,"_135":59,"_39":178,"_13":63,"_34":20,"_36":179,"_24":25,"_138":-5,"_171":180,"_27":181},{"_44":130,"_32":131,"_30":132,"_133":-5,"_42":43,"_41":134,"_135":59,"_39":170,"_13":63,"_34":20,"_36":137,"_24":25,"_138":-5,"_171":172,"_27":173},["D",1747739161189],"children",[],[131],"5575196c-356a-11f0-b5c8-9e149126039e","style.css","55751a48-356a-11f0-b5c8-9e149126039e",3,["D",1747739126495],"/* Additional custom styles */\n.vote-button.voted {\n background-color: #e0e7ff; /* light indigo */\n}\n\n.book-item {\n transition: transform 0.2s ease;\n}\n\n.book-item:hover {\n transform: translateY(-2px);\n}\n\n.vote-button {\n transition: all 0.2s ease;\n}\n\n.vote-button:hover {\n transform: scale(1.1);\n}\n\n/* Animation for new books */\n@keyframes fadeIn {\n from { opacity: 0; transform: translateY(10px); }\n to { opacity: 1; transform: translateY(0); }\n}\n\n.new-book {\n animation: fadeIn 0.5s ease-out;\n}",[],[141,175],"f1bbcb22-356a-11f0-82f7-9e149126039e",["D",1747739388685],[],[141,33],"edbb169a-356a-11f0-95ba-9e149126039e","index.html","521cbbee-356a-11f0-a389-9e149126039e",11,["D",1747739381966],"\n\n\n \n \n Book Club Suggestions\n \n \n \n\n\n

Book Club Suggestions

Suggest books and vote for your favorites!

\n View Source\n

\n\n

Suggest a New Book

\n \n

\n\n

Book Suggestions

Loading books...

\n\n \n \n\n \n\n",[],[141,187],["D",1747739120885],[166,167,168],[141],"e133c980-356a-11f0-a833-9e149126039e","index.ts",9,["D",1747739360949],"http","import { Hono } from \"https://esm.sh/hono@3.11.7\";\nimport { cors } from \"https://esm.sh/hono@3.11.7/middleware\";\nimport { sqlite } from \"https://esm.town/v/stevekrouse/sqlite\";\nimport { readFile } from \"https://esm.town/v/std/utils@85-main/index.ts\";\n\n// Initialize the Hono app\nconst app = new Hono();\n\n// Unwrap Hono errors to see original error details\napp.onError((err, c) => {\n throw err;\n});\n\n// Enable CORS\napp.use(\"*\", cors());\n\n// Database setup\nconst BOOKS_TABLE = \"book_club_books\";\nconst VOTES_TABLE = \"book_club_votes\";\n\nasync function setupDatabase() {\n // Create books table\n await sqlite.execute(`\n CREATE TABLE IF NOT EXISTS ${BOOKS_TABLE} (\n id INTEGER PRIMARY KEY AUTOINCREMENT,\n title TEXT NOT NULL,\n author TEXT NOT NULL,\n description TEXT,\n suggested_by TEXT,\n created_at TEXT DEFAULT CURRENT_TIMESTAMP\n )\n `);\n\n // Create votes table\n await sqlite.execute(`\n CREATE TABLE IF NOT EXISTS ${VOTES_TABLE} (\n id INTEGER PRIMARY KEY AUTOINCREMENT,\n book_id INTEGER NOT NULL,\n voter_id TEXT NOT NULL,\n created_at TEXT DEFAULT CURRENT_TIMESTAMP,\n UNIQUE(book_id, voter_id)\n )\n `);\n}\n\n// Run database setup\nsetupDatabase().catch(console.error);\n\n// API Routes\n// Get all books with vote counts\napp.get(\"/api/books\", async (c) => {\n const books = await sqlite.execute(`\n SELECT \n b.id, \n b.title, \n b.author, \n b.description, \n b.suggested_by, \n b.created_at,\n COUNT(v.id) as votes\n FROM ${BOOKS_TABLE} b\n LEFT JOIN ${VOTES_TABLE} v ON b.id = v.book_id\n GROUP BY b.id\n ORDER BY votes DESC, b.created_at DESC\n `);\n \n return c.json(books);\n});\n\n// Check if a user has voted for a book\napp.get(\"/api/books/:id/vote/:voter_id\", async (c) => {\n const bookId = c.req.param(\"id\");\n const voterId = c.req.param(\"voter_id\");\n \n const vote = await sqlite.execute(\n `SELECT id FROM ${VOTES_TABLE} WHERE book_id = ? AND voter_id = ?`,\n [bookId, voterId]\n );\n \n return c.json({ hasVoted: vote.length > 0 });\n});\n\n// Add a new book\napp.post(\"/api/books\", async (c) => {\n const { title, author, description, suggested_by } = await c.req.json();\n \n if (!title || !author) {\n return c.json({ error: \"Title and author are required\" }, 400);\n }\n \n const result = await sqlite.execute(\n `INSERT INTO ${BOOKS_TABLE} (title, author, description, suggested_by) \n VALUES (?, ?, ?, ?)\n RETURNING id, title, author, description, suggested_by, created_at`,\n [title, author, description || \"\", suggested_by || \"Anonymous\"]\n );\n \n return c.json(result[0]);\n});\n\n// Vote for a book\napp.post(\"/api/books/:id/vote\", async (c) => {\n const bookId = c.req.param(\"id\");\n const { voter_id } = await c.req.json();\n \n if (!voter_id) {\n return c.json({ error: \"Voter ID is required\" }, 400);\n }\n \n try {\n // Check if book exists\n const book = await sqlite.execute(\n `SELECT id FROM ${BOOKS_TABLE} WHERE id = ?`,\n [bookId]\n );\n \n if (book.length === 0) {\n return c.json({ error: \"Book not found\" }, 404);\n }\n \n // Try to insert vote, will fail if already voted due to UNIQUE constraint\n await sqlite.execute(\n `INSERT INTO ${VOTES_TABLE} (book_id, voter_id) VALUES (?, ?)`,\n [bookId, voter_id]\n );\n \n return c.json({ success: true });\n } catch (error) {\n if (error.message?.includes(\"UNIQUE constraint failed\")) {\n return c.json({ error: \"Already voted for this book\" }, 400);\n }\n throw error;\n }\n});\n\n// Remove a vote\napp.delete(\"/api/books/:id/vote\", async (c) => {\n const bookId = c.req.param(\"id\");\n const { voter_id } = await c.req.json();\n \n if (!voter_id) {\n return c.json({ error: \"Voter ID is required\" }, 400);\n }\n \n await sqlite.execute(\n `DELETE FROM ${VOTES_TABLE} WHERE book_id = ? AND voter_id = ?`,\n [bookId, voter_id]\n );\n \n return c.json({ success: true });\n});\n\n// Serve the frontend\napp.get(\"/\", async (c) => {\n const html = await readFile(\"/frontend/index.html\", import.meta.url);\n return c.html(html);\n});\n\napp.get(\"/frontend/*\", async (c) => {\n try {\n const path = c.req.path;\n const content = await readFile(path, import.meta.url);\n \n // Map file extensions to content types\n const contentTypeMap = {\n \".css\": \"text/css\",\n \".js\": \"text/javascript\",\n \".html\": \"text/html\",\n \".json\": \"application/json\",\n \".svg\": \"image/svg+xml\",\n \".png\": \"image/png\",\n \".jpg\": \"image/jpeg\",\n \".jpeg\": \"image/jpeg\",\n \".gif\": \"image/gif\"\n };\n \n // Get file extension\n const extension = path.substring(path.lastIndexOf(\".\")).toLowerCase();\n const contentType = contentTypeMap[extension] || \"text/plain\";\n \n return new Response(content, {\n headers: { \"Content-Type\": contentType }\n });\n } catch (error) {\n return new Response(\"File not found\", { status: 404 });\n }\n});\n\n// Export the Hono app\nexport default app.fetch;",[],[148,198],["D",1747739101546],[164],[148],["D",1747738955292],{"_97":96,"_104":100},{"_97":96,"_98":-5,"_99":100,"_18":55,"_101":102,"_103":25},{"_13":86,"_32":87,"_44":43,"_88":45,"_89":-5,"_90":-5,"_91":-5,"_92":-5,"_93":-5,"_94":46,"_95":96},"ctx",{"_79":-5,"_124":245,"_246":247,"_248":249,"_250":25,"_251":25,"_252":25,"_253":59,"_254":-5,"_255":-7,"_256":-7,"_257":63,"_258":25,"_259":25,"_260":-5,"_261":25,"_262":25,"_263":25,"_264":-5},"ENV",{"_216":217,"_218":219,"_220":87,"_221":222,"_223":224,"_225":226,"_227":228,"_229":230,"_231":232,"_233":234,"_235":236,"_237":238,"_239":240,"_241":242,"_243":244},"REACT_APP_SENTRY_DSN","https://586020d86f05489db63a554690acf1e9@o1398359.ingest.sentry.io/6724499","RENDER_GIT_COMMIT","71c1b20804b3232a7e513be260cfffc1932a9e97","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 · v12