[{"_1":2,"_3":-5,"_4":-5},"loaderData",{"_5":6,"_7":8,"_9":10},"actionData","errors","root",{"_311":312,"_313":314},"routes/_app.x.$handle.$name",{"_98":97,"_32":46,"_106":88,"_27":107,"_13":14,"_108":-5,"_11":109,"_110":111,"_112":113,"_114":115,"_116":117,"_20":-5,"_118":-5,"_119":-5,"_120":25,"_121":122,"_123":59,"_124":-5,"_125":-5,"_126":127},"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":-5,"_61":62,"_63":64,"_65":66,"_67":-5,"_68":-5,"_69":-5,"_70":-5,"_71":72,"_73":72,"_74":75,"_76":75,"_77":75,"_78":72,"_79":72,"_80":81,"_82":83,"_84":85,"_86":25},"version",22,"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","backend/services/vision.ts","latestPath","fileId","8e53aca4-1f11-11f0-8667-569c3dd06744","name","vision.ts","fileType","script","content","// Vision service for analyzing food images using Llama 4 Maverick via Groq API\n\ninterface FoodAnalysis {\n calories: number;\n description: string;\n tags: string[];\n nutritionalInfo?: {\n protein?: number;\n carbs?: number;\n fat?: number;\n fiber?: number;\n };\n}\n\n// Analyze a food image using Groq API with Llama 4 Maverick\nexport async function analyzeImage(base64Image: string): Promise {\n const apiKey = Deno.env.get(\"GROQ_API_KEY\");\n \n if (!apiKey) {\n throw new Error(\"GROQ_API_KEY environment variable is not set\");\n }\n \n try {\n const response = await fetch(\"https://api.groq.com/openai/v1/chat/completions\", {\n method: \"POST\",\n headers: {\n \"Content-Type\": \"application/json\",\n \"Authorization\": `Bearer ${apiKey}`\n },\n body: JSON.stringify({\n model: \"meta-llama/llama-4-maverick-17b-128e-instruct\",\n messages: [\n {\n role: \"user\",\n content: [\n {\n type: \"text\",\n text: \"Analyze this food image. Identify what food items are present, estimate the calories, and provide descriptive tags. Return the result as a JSON object with the following fields: calories (number), description (string), tags (array of strings), and nutritionalInfo (object with protein, carbs, fat, fiber in grams). Be as accurate as possible with the calorie estimation based on portion size.\"\n },\n {\n type: \"image_url\",\n image_url: {\n url: `data:image/jpeg;base64,${base64Image}`\n }\n }\n ]\n }\n ],\n temperature: 0.2,\n max_completion_tokens: 1024,\n response_format: { type: \"json_object\" }\n })\n });\n \n if (!response.ok) {\n const errorText = await response.text();\n throw new Error(`Groq API error: ${response.status} ${errorText}`);\n }\n \n const result = await response.json();\n const content = result.choices[0].message.content;\n \n // Parse the JSON response\n const analysis = JSON.parse(content);\n \n // Ensure we have the expected format\n return {\n calories: analysis.calories || 0,\n description: analysis.description || \"Unknown food\",\n tags: analysis.tags || [],\n nutritionalInfo: analysis.nutritionalInfo || {}\n };\n } catch (error) {\n console.error(\"Error analyzing image:\", error);\n \n // Return a fallback response\n return {\n calories: 0,\n description: \"Could not analyze the image\",\n tags: [\"error\"],\n nutritionalInfo: {}\n };\n }\n}","// Vision service for analyzing food images using Llama 4 Maverick via Groq API\n\ninterface FoodAnalysis {\n calories: number;\n description: string;\n tags: string[];\n nutritionalInfo?: {\n protein?: number;\n carbs?: number;\n fat?: number;\n fiber?: number;\n };\n}\n\n// Analyze a food image using Groq API with Llama 4 Maverick\nexport async function analyzeImage(base64Image: string): Promise {\n const apiKey = Deno.env.get(\"GROQ_API_KEY\");\n \n if (!apiKey) {\n throw new Error(\"GROQ_API_KEY environment variable is not set\");\n }\n \n try {\n // Ensure the base64 string is properly formatted for the API\n const imageUrl = base64Image.startsWith('data:') \n ? base64Image \n : `data:image/jpeg;base64,${base64Image}`;\n \n const response = await fetch(\"https://api.groq.com/openai/v1/chat/completions\", {\n method: \"POST\",\n headers: {\n \"Content-Type\": \"application/json\",\n \"Authorization\": `Bearer ${apiKey}`\n },\n body: JSON.stringify({\n model: \"meta-llama/llama-4-maverick-17b-128e-instruct\",\n messages: [\n {\n role: \"user\",\n content: [\n {\n type: \"text\",\n text: \"Analyze this food image. Identify what food items are present, estimate the calories, and provide descriptive tags. Return the result as a JSON object with the following fields: calories (number), description (string), tags (array of strings), and nutritionalInfo (object with protein, carbs, fat, fiber in grams). Be as accurate as possible with the calorie estimation based on portion size.\"\n },\n {\n type: \"image_url\",\n image_url: {\n url: imageUrl\n }\n }\n ]\n }\n ],\n temperature: 0.2,\n max_completion_tokens: 1024,\n response_format: { type: \"json_object\" }\n })\n });\n \n if (!response.ok) {\n const errorText = await response.text();\n throw new Error(`Groq API error: ${response.status} ${errorText}`);\n }\n \n const result = await response.json();\n const content = result.choices[0].message.content;\n \n // Parse the JSON response\n const analysis = JSON.parse(content);\n \n // Ensure we have the expected format\n return {\n calories: analysis.calories || 0,\n description: analysis.description || \"Unknown food\",\n tags: analysis.tags || [],\n nutritionalInfo: analysis.nutritionalInfo || {}\n };\n } catch (error) {\n console.error(\"Error analyzing image:\", error);\n \n // Return a fallback response\n return {\n calories: 0,\n description: \"Could not analyze the image\",\n tags: [\"error\"],\n nutritionalInfo: {}\n };\n }\n}","createdAt",["D",1745282617402],"branchVersion","branchId","3a029fc6-1f10-11f0-bea3-569c3dd06744","id","3a02404e-1f10-11f0-bea3-569c3dd06744","calpics",["D",1745281500162],"deletedAt","legacyEnvVars","privacy","public","httpPrivacy","description","imageUrl","a8270e74-6479-475a-8025-9b69544ee0e7","pinnedFileId","76c1547e-1f11-11f0-b2b0-569c3dd06744","pinPreview",true,"pinMigrated","screenshotVersion",24,"likeCount",0,"orgId","8319defa-6e1a-46d4-ba66-2114ffd3360b","tursoName","tursoHostname","tursoMeasuredAt","pinned","userPerm","r","valPerm","blobPerm","rw","emailPerm","sqlitePerm","projectPerm","telemetryPerm","user",{"_98":97,"_105":101},"org",{"_98":97,"_99":-5,"_100":101,"_18":55,"_102":103,"_104":25},"branch",{"_13":87,"_32":88,"_44":43,"_89":45,"_90":-5,"_91":-5,"_92":-5,"_93":-5,"_94":-5,"_95":46,"_96":97},"isOwned",25,"main","projectId","forkedBranchId","forkedBranchVersion","forkedProjectPrivacy","forkedProjectId","forkedProjectOrgId","projectName","userHandle","yawnxyz","handle","displayName","avatar","https://images.clerk.dev/oauth_github/img_2NnaHhpxNuH1xWRIRjQNoo16TVc.jpeg","tier","pro","canRestrictVals","profileImageUrl","branchName","","adoptOrgId",{"_44":45,"_32":46,"_39":307,"_48":-5,"_49":25,"_50":51,"_52":51,"_53":-5,"_54":-5,"_18":55,"_56":57,"_58":59,"_60":-5,"_61":62,"_63":64,"_65":66,"_67":-5,"_68":-5,"_69":-5,"_70":-5,"_71":72,"_73":72,"_74":75,"_76":75,"_77":75,"_78":72,"_79":72,"_80":308,"_82":309,"_84":310,"_86":25},"tree",[180,187,193,196,197],"files",[180,181,182,183,184,185,186,187,188,189,190,191,192,193,194,195,196,197],"counts",{"_170":64,"_171":147,"_172":64,"_173":174,"_175":176},"contents",[128,129,130,131,132],"upstreamProject","upstreamBranch","emptyEnvVars","flags",[],"hasHttpFiles","grants","orgs","customDomains",{},{"_44":164,"_32":165,"_30":166,"_135":-5,"_42":43,"_41":167,"_137":59,"_39":168,"_13":64,"_34":156,"_36":-5,"_24":25,"_142":-5,"_27":169},{"_44":158,"_32":159,"_30":160,"_135":-5,"_42":43,"_41":161,"_137":59,"_39":162,"_13":64,"_34":156,"_36":-5,"_24":25,"_142":-5,"_27":163},{"_44":151,"_32":152,"_30":153,"_135":-5,"_42":43,"_41":154,"_137":59,"_39":155,"_13":64,"_34":156,"_36":-5,"_24":25,"_142":-5,"_27":157},{"_44":144,"_32":145,"_30":146,"_135":-5,"_42":43,"_41":147,"_137":25,"_39":148,"_13":64,"_34":20,"_36":149,"_24":25,"_142":-5,"_27":150},{"_44":133,"_32":134,"_30":57,"_135":-5,"_42":43,"_41":136,"_137":25,"_39":138,"_13":139,"_34":140,"_36":141,"_24":25,"_142":-5,"_27":143},"bd6bca66-1f12-11f0-9aa4-569c3dd06744","index.ts","parentId",18,"latest",["D",1745282579620],3,"http","import { Hono } from \"https://esm.sh/hono@3.12.6\";\nimport { serveStatic } from \"https://esm.sh/@hono/node-server@1.4.0/serve-static\";\nimport { cors } from \"https://esm.sh/hono@3.12.6/cors\";\nimport { readFile, serveFile } from \"https://esm.town/v/std/utils@85-main/index.ts\";\nimport { analyzeImage } from \"./backend/services/vision.ts\";\nimport { \n createFoodEntry, \n getFoodEntries, \n getStats,\n setupDatabase \n} from \"./backend/database/queries.ts\";\n\n// Initialize the app\nconst app = new Hono();\n\n// Unwrap Hono errors to see original error details\napp.onError((err, c) => {\n console.error(\"Error:\", err);\n throw err;\n});\n\n// Setup CORS\napp.use(\"*\", cors());\n\n// Initialize database on startup\napp.use(\"*\", async (c, next) => {\n await setupDatabase();\n await next();\n});\n\n// Serve static files\napp.get(\"/frontend/*\", c => serveFile(c.req.path, import.meta.url));\napp.get(\"/shared/*\", c => serveFile(c.req.path, import.meta.url));\n\n// Serve favicon\napp.get(\"/favicon.ico\", c => serveFile(\"/frontend/favicon.svg\", import.meta.url));\n\n// Serve index.html for root path\napp.get(\"/\", async c => {\n let html = await readFile(\"/frontend/index.html\", import.meta.url);\n return c.html(html);\n});\n\n// API Routes\napp.post(\"/api/analyze\", async c => {\n try {\n const formData = await c.req.formData();\n const imageBase64 = formData.get(\"image\") as string;\n \n if (!imageBase64) {\n return c.json({ error: \"No image provided\" }, 400);\n }\n \n // Analyze the image\n const analysis = await analyzeImage(imageBase64);\n \n // Store the analysis in the database\n const userId = formData.get(\"userId\") || \"anonymous\";\n const entry = await createFoodEntry({\n userId: userId.toString(),\n imageData: imageBase64,\n calories: analysis.calories,\n description: analysis.description,\n tags: analysis.tags\n });\n \n return c.json({ success: true, analysis, entryId: entry.id });\n } catch (error) {\n console.error(\"Error analyzing image:\", error);\n return c.json({ error: \"Failed to analyze image\" }, 500);\n }\n});\n\napp.get(\"/api/entries\", async c => {\n const userId = c.req.query(\"userId\") || \"anonymous\";\n const limit = parseInt(c.req.query(\"limit\") || \"10\");\n const offset = parseInt(c.req.query(\"offset\") || \"0\");\n \n const entries = await getFoodEntries(userId, limit, offset);\n return c.json(entries);\n});\n\napp.get(\"/api/stats\", async c => {\n const userId = c.req.query(\"userId\") || \"anonymous\";\n const days = parseInt(c.req.query(\"days\") || \"7\");\n \n const stats = await getStats(userId, days);\n return c.json(stats);\n});\n\n// Export the app\nexport default app.fetch;","label",[134],"6e25a3ec-1f11-11f0-8cb6-569c3dd06744","README.md","6e25a4aa-1f11-11f0-8cb6-569c3dd06744",1,["D",1745282017127],"# FoodVision - AI Food Tracking App\n\nA weight loss and fitness app that uses AI vision to analyze food images, calculate calories, and track your eating habits over time.\n\n## Features\n\n- 📸 Take pictures of your food\n- 🔍 AI-powered food recognition and calorie estimation\n- 🏷️ Automatic food tagging and description\n- 📊 Track your eating habits over time\n- 📱 Mobile-friendly interface\n\n## How It Works\n\n1. Upload a photo of your food\n2. The app uses Llama 4 Maverick vision AI to analyze the image\n3. Get instant feedback on calories, ingredients, and nutritional information\n4. View your eating history and trends over time\n\n## Technical Details\n\n- Backend: TypeScript with Hono framework\n- AI Vision: Llama 4 Maverick via Groq API\n- Database: SQLite for data storage\n- Frontend: HTML, CSS (Tailwind), and JavaScript\n\n## Project Structure\n\n```\n├── backend/\n│ ├── database/\n│ │ ├── schema.ts # Database schema\n│ │ └── queries.ts # Database queries\n│ ├── services/\n│ │ └── vision.ts # Groq API integration\n│ ├── routes/\n│ │ ├── analyze.ts # Food analysis endpoint\n│ │ ├── entries.ts # Food entries endpoints\n│ │ └── stats.ts # Statistics endpoints\n│ └── index.ts # Main entry point\n├── frontend/\n│ ├── components/\n│ │ ├── camera.js # Camera capture component\n│ │ ├── history.js # Food history component\n│ │ └── stats.js # Statistics component\n│ ├── index.html # Main HTML template\n│ ├── app.js # Frontend logic\n│ └── style.css # Custom styles\n└── shared/\n └── types.ts # Shared type definitions\n```\n\n## Getting Started\n\n1. Visit the app URL\n2. Upload a food image or take a photo\n3. View the AI analysis of your food\n4. Track your progress over time",[145],"9224f306-1f11-11f0-9067-569c3dd06744","shared","512e86c1-da29-4daa-b466-7a39f6b51670",7,["D",1745282077520],"directory",[152],"ac7e7d30-1f11-11f0-88cc-569c3dd06744","frontend","7d971e14-ac37-4fc2-b210-90c6c4a277cb",8,["D",1745282121725],[159],"7c4ae3ba-1f11-11f0-97fe-569c3dd06744","backend","45625f55-51e8-467b-ac8f-01a012245487",4,["D",1745282040857],[165],"pulls","branches","forks","envVars",{"_177":64,"_179":64},"connections",{"_177":64,"_178":64},"count","unfilledCount","emptyCount",{"_44":164,"_32":165,"_30":166,"_135":-5,"_42":43,"_41":167,"_137":59,"_39":304,"_13":64,"_34":156,"_36":-5,"_24":25,"_142":-5,"_199":305,"_27":306},{"_44":300,"_32":291,"_30":286,"_135":166,"_42":43,"_41":167,"_137":59,"_39":301,"_13":64,"_34":156,"_36":-5,"_24":25,"_142":-5,"_199":302,"_27":303},{"_44":292,"_32":293,"_30":294,"_135":286,"_42":43,"_41":295,"_137":59,"_39":296,"_13":64,"_34":35,"_36":297,"_24":25,"_142":-5,"_199":298,"_27":299},{"_44":283,"_32":284,"_30":285,"_135":286,"_42":43,"_41":167,"_137":59,"_39":287,"_13":64,"_34":35,"_36":288,"_24":25,"_142":-5,"_199":289,"_27":290},{"_44":278,"_32":277,"_30":273,"_135":166,"_42":43,"_41":279,"_137":59,"_39":280,"_13":64,"_34":156,"_36":-5,"_24":25,"_142":-5,"_199":281,"_27":282},{"_44":272,"_32":33,"_30":31,"_135":273,"_42":43,"_41":14,"_137":59,"_39":274,"_13":147,"_34":35,"_36":38,"_24":25,"_142":-5,"_199":275,"_27":276},{"_44":265,"_32":145,"_30":266,"_135":166,"_42":43,"_41":267,"_137":59,"_39":268,"_13":64,"_34":20,"_36":269,"_24":25,"_142":-5,"_199":270,"_27":271},{"_44":158,"_32":159,"_30":160,"_135":-5,"_42":43,"_41":161,"_137":59,"_39":262,"_13":64,"_34":156,"_36":-5,"_24":25,"_142":-5,"_199":263,"_27":264},{"_44":255,"_32":145,"_30":256,"_135":160,"_42":43,"_41":257,"_137":59,"_39":258,"_13":64,"_34":20,"_36":259,"_24":25,"_142":-5,"_199":260,"_27":261},{"_44":247,"_32":248,"_30":249,"_135":160,"_42":43,"_41":250,"_137":25,"_39":251,"_13":139,"_34":35,"_36":252,"_24":25,"_142":-5,"_199":253,"_27":254},{"_44":239,"_32":240,"_30":241,"_135":160,"_42":43,"_41":242,"_137":59,"_39":243,"_13":64,"_34":20,"_36":244,"_24":25,"_142":-5,"_199":245,"_27":246},{"_44":230,"_32":231,"_30":232,"_135":160,"_42":43,"_41":233,"_137":59,"_39":234,"_13":235,"_34":20,"_36":236,"_24":25,"_142":-5,"_199":237,"_27":238},{"_44":222,"_32":223,"_30":224,"_135":160,"_42":43,"_41":225,"_137":59,"_39":226,"_13":64,"_34":20,"_36":227,"_24":25,"_142":-5,"_199":228,"_27":229},{"_44":151,"_32":152,"_30":153,"_135":-5,"_42":43,"_41":154,"_137":59,"_39":219,"_13":64,"_34":156,"_36":-5,"_24":25,"_142":-5,"_199":220,"_27":221},{"_44":212,"_32":145,"_30":213,"_135":153,"_42":43,"_41":214,"_137":59,"_39":215,"_13":64,"_34":20,"_36":216,"_24":25,"_142":-5,"_199":217,"_27":218},{"_44":205,"_32":206,"_30":207,"_135":153,"_42":43,"_41":154,"_137":59,"_39":208,"_13":64,"_34":35,"_36":209,"_24":25,"_142":-5,"_199":210,"_27":211},{"_44":144,"_32":145,"_30":146,"_135":-5,"_42":43,"_41":147,"_137":25,"_39":202,"_13":64,"_34":20,"_36":149,"_24":25,"_142":-5,"_199":203,"_27":204},{"_44":133,"_32":134,"_30":57,"_135":-5,"_42":43,"_41":136,"_137":25,"_39":198,"_13":139,"_34":140,"_36":141,"_24":25,"_142":-5,"_199":200,"_27":201},["D",1745282579620],"children",[],[134],["D",1745282017127],[],[145],"9224c53e-1f11-11f0-9067-569c3dd06744","types.ts","9224c610-1f11-11f0-9067-569c3dd06744",["D",1745282077520],"// Shared types for both frontend and backend\n\nexport interface FoodAnalysisResult {\n calories: number;\n description: string;\n tags: string[];\n nutritionalInfo?: {\n protein?: number;\n carbs?: number;\n fat?: number;\n fiber?: number;\n };\n}\n\nexport interface FoodEntryData {\n id: number;\n user_id: string;\n timestamp: number;\n calories: number;\n description: string;\n tags: string;\n}\n\nexport interface StatsData {\n dailyCalories: { date: string; calories: number }[];\n totalCalories: number;\n averageCalories: number;\n commonTags: { tag: string; count: number }[];\n}",[],[152,206],"cdbb9460-1f11-11f0-9067-569c3dd06744","cdbb9514-1f11-11f0-9067-569c3dd06744",13,["D",1745282177496],"# FoodVision Shared\n\nThis directory contains shared code that is used by both the frontend and backend.\n\n## Structure\n\n- `types.ts`: TypeScript interfaces and types used throughout the application\n\n## Types\n\n- `FoodAnalysisResult`: The result of analyzing a food image\n- `FoodEntryData`: Data structure for a food entry in the database\n- `StatsData`: Data structure for calorie statistics",[],[152,145],["D",1745282077520],[194,195],[152],"c227ce16-1f11-11f0-9067-569c3dd06744","style.css","c227cede-1f11-11f0-9067-569c3dd06744",10,["D",1745282158072],"/* Additional custom styles for FoodVision app */\n\n/* Pulse animation for the capture button */\n@keyframes pulse {\n 0% {\n box-shadow: 0 0 0 0 rgba(79, 70, 229, 0.7);\n }\n 70% {\n box-shadow: 0 0 0 10px rgba(79, 70, 229, 0);\n }\n 100% {\n box-shadow: 0 0 0 0 rgba(79, 70, 229, 0);\n }\n}\n\n.capture-btn {\n animation: pulse 2s infinite;\n}\n\n/* Fade in animation for analysis results */\n@keyframes fadeIn {\n from {\n opacity: 0;\n transform: translateY(10px);\n }\n to {\n opacity: 1;\n transform: translateY(0);\n }\n}\n\n#analysis-result > div {\n animation: fadeIn 0.5s ease-out;\n}\n\n/* Custom scrollbar for entries list */\n#entries-list {\n max-height: 400px;\n overflow-y: auto;\n scrollbar-width: thin;\n scrollbar-color: rgba(79, 70, 229, 0.5) rgba(243, 244, 246, 1);\n}\n\n#entries-list::-webkit-scrollbar {\n width: 6px;\n}\n\n#entries-list::-webkit-scrollbar-track {\n background: rgba(243, 244, 246, 1);\n border-radius: 10px;\n}\n\n#entries-list::-webkit-scrollbar-thumb {\n background-color: rgba(79, 70, 229, 0.5);\n border-radius: 10px;\n}\n\n/* Responsive adjustments */\n@media (max-width: 640px) {\n .camera-container {\n max-width: 100%;\n }\n \n .capture-btn {\n width: 60px;\n height: 60px;\n }\n \n .capture-btn::after {\n width: 46px;\n height: 46px;\n }\n}",[],[159,223],"c17ee034-1f12-11f0-b3e7-569c3dd06744","index.html","ac7e5184-1f11-11f0-88cc-569c3dd06744",19,["D",1745282586452],2,"\n\n\n \n \n FoodVision - AI Food Tracking\n \n \n \n \n \n \n \n \n \n \n 🍽️\"\n \n\n\n

FoodVision

AI-powered food tracking for your health journey

\n\n

Capture Food

\n \n

\n $\"Food$ \n \n

\n \n \n \n

\n \n

Calorie Trends

\n \n \n \n \n \n \n \n \n \n\n",[],[159,231],"b00ce698-1f12-11f0-a5c7-569c3dd06744","favicon.svg","b00ce756-1f12-11f0-a5c7-569c3dd06744",15,["D",1745282557191],"",[],[159,240],"cb62e230-1f12-11f0-849c-569c3dd06744","app.js","bc9bd456-1f11-11f0-8377-569c3dd06744",21,["D",1745282603052],"// FoodVision App Frontend Logic\n\ndocument.addEventListener('DOMContentLoaded', () => {\n // DOM Elements\n const startCameraBtn = document.getElementById('start-camera');\n const uploadImageBtn = document.getElementById('upload-image');\n const fileInput = document.getElementById('file-input');\n const cameraView = document.getElementById('camera-view');\n const cameraCanvas = document.getElementById('camera-canvas');\n const captureBtn = document.getElementById('capture-btn');\n const cameraOverlay = document.querySelector('.camera-overlay');\n const previewImage = document.getElementById('preview-image');\n const analysisForm = document.getElementById('analysis-form');\n const imageData = document.getElementById('image-data');\n \n // Camera stream reference\n let stream = null;\n \n // Start camera\n startCameraBtn.addEventListener('click', async () => {\n try {\n stream = await navigator.mediaDevices.getUserMedia({ \n video: { facingMode: 'environment' },\n audio: false \n });\n \n cameraView.srcObject = stream;\n cameraView.classList.remove('hidden');\n cameraOverlay.classList.remove('hidden');\n previewImage.classList.add('hidden');\n analysisForm.classList.add('hidden');\n \n // Show capture button\n captureBtn.parentElement.classList.remove('hidden');\n } catch (error) {\n console.error('Error accessing camera:', error);\n alert('Could not access camera. Please check permissions or try uploading an image instead.');\n }\n });\n \n // Capture photo\n captureBtn.addEventListener('click', () => {\n // Set canvas dimensions to match video\n cameraCanvas.width = cameraView.videoWidth;\n cameraCanvas.height = cameraView.videoHeight;\n \n // Draw video frame to canvas\n const context = cameraCanvas.getContext('2d');\n context.drawImage(cameraView, 0, 0, cameraCanvas.width, cameraCanvas.height);\n \n // Convert to data URL\n const dataUrl = cameraCanvas.toDataURL('image/jpeg');\n \n // Stop camera stream\n if (stream) {\n stream.getTracks().forEach(track => track.stop());\n stream = null;\n }\n \n // Hide camera view and show preview\n cameraView.classList.add('hidden');\n cameraOverlay.classList.add('hidden');\n previewImage.src = dataUrl;\n previewImage.classList.remove('hidden');\n \n // Prepare form data - extract base64 data without the prefix\n const base64Data = dataUrl.split(',')[1];\n prepareImageForUpload(base64Data);\n });\n \n // Handle image upload\n uploadImageBtn.addEventListener('click', () => {\n fileInput.click();\n });\n \n fileInput.addEventListener('change', (e) => {\n if (e.target.files && e.target.files[0]) {\n const file = e.target.files[0];\n const reader = new FileReader();\n \n reader.onload = (event) => {\n const dataUrl = event.target.result;\n previewImage.src = dataUrl;\n previewImage.classList.remove('hidden');\n cameraView.classList.add('hidden');\n cameraOverlay.classList.add('hidden');\n \n // Extract base64 data without the prefix\n const base64Data = dataUrl.toString().split(',')[1];\n prepareImageForUpload(base64Data);\n };\n \n reader.readAsDataURL(file);\n }\n });\n \n // Prepare image for upload\n function prepareImageForUpload(base64Data) {\n // Show the analysis form\n analysisForm.classList.remove('hidden');\n \n // Set the base64 data as a value in a hidden input\n // This is a workaround since we can't directly set files programmatically\n const dataInput = document.getElementById('image-data');\n dataInput.value = base64Data;\n }\n \n // Handle form submission response\n document.body.addEventListener('htmx:afterSwap', (event) => {\n if (event.detail.target.id === 'analysis-result') {\n const response = JSON.parse(event.detail.xhr.response);\n \n if (response.success) {\n // Render the analysis using the template\n const template = document.getElementById('analysis-template').innerHTML;\n const rendered = Mustache.render(template, response);\n event.detail.target.innerHTML = rendered;\n \n // Refresh entries list\n document.getElementById('entries-list').setAttribute('hx-trigger', 'load');\n htmx.process(document.getElementById('entries-list'));\n \n // Refresh stats\n document.getElementById('stats-container').setAttribute('hx-trigger', 'load');\n htmx.process(document.getElementById('stats-container'));\n } else {\n event.detail.target.innerHTML = `\n

Error: ${response.error}

\n `;\n }\n }\n \n // Handle entries list\n if (event.detail.target.id === 'entries-list') {\n const entries = JSON.parse(event.detail.xhr.response);\n \n // Process entries data\n const processedEntries = entries.map(entry => {\n const date = new Date(entry.timestamp * 1000);\n return {\n ...entry,\n formattedDate: date.toLocaleDateString(),\n tagsList: entry.tags.split(',')\n };\n });\n \n // Render the entries template\n const template = document.getElementById('entries-template').innerHTML;\n const rendered = Mustache.render(template, processedEntries);\n event.detail.target.innerHTML = rendered;\n }\n \n // Handle stats\n if (event.detail.target.id === 'stats-container') {\n const stats = JSON.parse(event.detail.xhr.response);\n \n // Render the stats template\n const template = document.getElementById('stats-template').innerHTML;\n const rendered = Mustache.render(template, stats);\n event.detail.target.innerHTML = rendered;\n \n // Create chart if we have data\n if (stats.dailyCalories && stats.dailyCalories.length > 0) {\n const ctx = document.getElementById('calories-chart').getContext('2d');\n \n new Chart(ctx, {\n type: 'bar',\n data: {\n labels: stats.dailyCalories.map(d => d.date),\n datasets: [{\n label: 'Calories',\n data: stats.dailyCalories.map(d => d.calories),\n backgroundColor: 'rgba(79, 70, 229, 0.6)',\n borderColor: 'rgba(79, 70, 229, 1)',\n borderWidth: 1\n }]\n },\n options: {\n responsive: true,\n scales: {\n y: {\n beginAtZero: true,\n title: {\n display: true,\n text: 'Calories'\n }\n },\n x: {\n title: {\n display: true,\n text: 'Date'\n }\n }\n }\n }\n });\n }\n }\n });\n});",[],[159,248],"cade5494-1f11-11f0-8377-569c3dd06744","cade555c-1f11-11f0-8377-569c3dd06744",12,["D",1745282172689],"# FoodVision Frontend\n\nThis directory contains the frontend code for the FoodVision app.\n\n## Structure\n\n- `index.html`: Main HTML template\n- `app.js`: Frontend JavaScript logic\n- `style.css`: Additional custom styles\n\n## Features\n\n- Camera integration for taking food photos\n- File upload for existing food images\n- Real-time food analysis with AI\n- Food entry history display\n- Calorie tracking and statistics\n\n## Technologies Used\n\n- HTMX for AJAX requests and DOM updates\n- Mustache for client-side templating\n- Chart.js for data visualization\n- Tailwind CSS for styling\n\n## How It Works\n\n1. The user can either take a photo using their device camera or upload an existing image\n2. The image is sent to the backend for analysis\n3. The AI analyzes the image and returns information about the food\n4. The results are displayed to the user\n5. The entry is saved to the database for future reference\n6. Statistics and history are updated automatically",[],[159,145],["D",1745282121725],[188,189,190,191,192],[159],"c712e578-1f11-11f0-a3db-569c3dd06744","c712e622-1f11-11f0-a3db-569c3dd06744",11,["D",1745282166323],"# FoodVision Backend\n\nThis directory contains the backend code for the FoodVision app.\n\n## Structure\n\n- `database/`: Database schema and queries\n - `schema.ts`: Defines the database tables and types\n - `queries.ts`: Contains functions for interacting with the database\n- `services/`: External service integrations\n - `vision.ts`: Integration with Groq API for Llama 4 Maverick vision\n- `index.ts`: Main entry point for the HTTP API\n\n## API Endpoints\n\n- `POST /api/analyze`: Analyze a food image\n - Accepts: `multipart/form-data` with `image` file and optional `userId`\n - Returns: Analysis results including calories, description, and tags\n\n- `GET /api/entries`: Get food entry history\n - Query params: `userId` (optional), `limit` (optional), `offset` (optional)\n - Returns: List of food entries\n\n- `GET /api/stats`: Get calorie statistics\n - Query params: `userId` (optional), `days` (optional)\n - Returns: Daily calories, total calories, average calories, and common tags\n\n## Environment Variables\n\n- `GROQ_API_KEY`: API key for Groq (required for vision analysis)",[],[165,145],"d3f0c71e-1f12-11f0-becc-569c3dd06744","1034177d-c3fe-449d-955b-1df766ac5aad",["D",1745282617402],[],[165,277,33],"services","8e53d22e-1f11-11f0-8667-569c3dd06744",6,["D",1745282071114],[185],[165,277],"7c4adb7c-1f11-11f0-97fe-569c3dd06744","schema.ts","7c4adc30-1f11-11f0-97fe-569c3dd06744","4f837b2e-fadb-4cae-b81c-6302fbd877bf",["D",1745282040857],"// Database schema for the food tracking app\n\n// Table names - use versioning to handle schema changes\nexport const TABLES = {\n FOOD_ENTRIES: \"food_entries_v1\",\n USERS: \"users_v1\"\n};\n\n// SQL statements to create tables\nexport const CREATE_USERS_TABLE = `\nCREATE TABLE IF NOT EXISTS ${TABLES.USERS} (\n id TEXT PRIMARY KEY,\n name TEXT,\n email TEXT,\n created_at INTEGER DEFAULT (unixepoch())\n)\n`;\n\nexport const CREATE_FOOD_ENTRIES_TABLE = `\nCREATE TABLE IF NOT EXISTS ${TABLES.FOOD_ENTRIES} (\n id INTEGER PRIMARY KEY AUTOINCREMENT,\n user_id TEXT NOT NULL,\n timestamp INTEGER DEFAULT (unixepoch()),\n image_data TEXT NOT NULL,\n calories INTEGER,\n description TEXT,\n tags TEXT,\n FOREIGN KEY (user_id) REFERENCES ${TABLES.USERS} (id)\n)\n`;\n\n// Types for database entities\nexport interface User {\n id: string;\n name?: string;\n email?: string;\n created_at: number;\n}\n\nexport interface FoodEntry {\n id: number;\n user_id: string;\n timestamp: number;\n image_data: string;\n calories: number;\n description: string;\n tags: string;\n}\n\nexport interface FoodEntryInput {\n userId: string;\n imageData: string;\n calories: number;\n description: string;\n tags: string[];\n}\n\nexport interface FoodStats {\n dailyCalories: { date: string; calories: number }[];\n totalCalories: number;\n averageCalories: number;\n commonTags: { tag: string; count: number }[];\n}",[],[165,291,284],"database","86990d88-1f11-11f0-aa48-569c3dd06744","queries.ts","86990e1e-1f11-11f0-aa48-569c3dd06744",5,["D",1745282058151],"import { sqlite } from \"https://esm.town/v/stevekrouse/sqlite\";\nimport { \n TABLES, \n CREATE_USERS_TABLE, \n CREATE_FOOD_ENTRIES_TABLE,\n FoodEntry,\n FoodEntryInput,\n FoodStats\n} from \"./schema.ts\";\n\n// Initialize the database\nexport async function setupDatabase() {\n // Create tables if they don't exist\n await sqlite.execute(CREATE_USERS_TABLE);\n await sqlite.execute(CREATE_FOOD_ENTRIES_TABLE);\n \n // Create anonymous user if it doesn't exist\n await sqlite.execute(\n `INSERT OR IGNORE INTO ${TABLES.USERS} (id, name) VALUES (?, ?)`,\n [\"anonymous\", \"Anonymous User\"]\n );\n}\n\n// Create a new food entry\nexport async function createFoodEntry(input: FoodEntryInput): Promise<{ id: number }> {\n // Ensure user exists\n await sqlite.execute(\n `INSERT OR IGNORE INTO ${TABLES.USERS} (id, name) VALUES (?, ?)`,\n [input.userId, `User ${input.userId}`]\n );\n \n // Insert the food entry\n const result = await sqlite.execute(\n `INSERT INTO ${TABLES.FOOD_ENTRIES} \n (user_id, image_data, calories, description, tags) \n VALUES (?, ?, ?, ?, ?)`,\n [\n input.userId,\n input.imageData,\n input.calories,\n input.description,\n input.tags.join(\",\")\n ]\n );\n \n return { id: result.lastInsertId };\n}\n\n// Get food entries for a user\nexport async function getFoodEntries(\n userId: string,\n limit: number = 10,\n offset: number = 0\n): Promise[]> {\n const entries = await sqlite.execute(\n `SELECT id, user_id, timestamp, calories, description, tags\n FROM ${TABLES.FOOD_ENTRIES}\n WHERE user_id = ?\n ORDER BY timestamp DESC\n LIMIT ? OFFSET ?`,\n [userId, limit, offset]\n );\n \n return entries.rows.map(row => ({\n id: row.id,\n user_id: row.user_id,\n timestamp: row.timestamp,\n calories: row.calories,\n description: row.description,\n tags: row.tags\n }));\n}\n\n// Get a single food entry by ID\nexport async function getFoodEntry(id: number): Promise {\n const result = await sqlite.execute(\n `SELECT * FROM ${TABLES.FOOD_ENTRIES} WHERE id = ?`,\n [id]\n );\n \n if (result.rows.length === 0) {\n return null;\n }\n \n return result.rows[0] as FoodEntry;\n}\n\n// Get statistics for a user\nexport async function getStats(userId: string, days: number = 7): Promise {\n // Calculate the timestamp for 'days' ago\n const daysAgoTimestamp = Math.floor(Date.now() / 1000) - (days * 24 * 60 * 60);\n \n // Get daily calories\n const dailyCaloriesResult = await sqlite.execute(\n `SELECT \n date(timestamp, 'unixepoch') as date,\n SUM(calories) as calories\n FROM ${TABLES.FOOD_ENTRIES}\n WHERE user_id = ? AND timestamp >= ?\n GROUP BY date(timestamp, 'unixepoch')\n ORDER BY date`,\n [userId, daysAgoTimestamp]\n );\n \n const dailyCalories = dailyCaloriesResult.rows.map(row => ({\n date: row.date,\n calories: row.calories\n }));\n \n // Get total and average calories\n const caloriesStatsResult = await sqlite.execute(\n `SELECT \n SUM(calories) as total,\n AVG(calories) as average\n FROM ${TABLES.FOOD_ENTRIES}\n WHERE user_id = ? AND timestamp >= ?`,\n [userId, daysAgoTimestamp]\n );\n \n const totalCalories = caloriesStatsResult.rows[0]?.total || 0;\n const averageCalories = Math.round(caloriesStatsResult.rows[0]?.average || 0);\n \n // Get common tags\n const tagsResult = await sqlite.execute(\n `SELECT \n value as tag,\n COUNT(*) as count\n FROM ${TABLES.FOOD_ENTRIES},\n json_each('[\"' || replace(tags, ',', '\",\"') || '\"]')\n WHERE user_id = ? AND timestamp >= ?\n GROUP BY value\n ORDER BY count DESC\n LIMIT 5`,\n [userId, daysAgoTimestamp]\n );\n \n const commonTags = tagsResult.rows.map(row => ({\n tag: row.tag,\n count: row.count\n }));\n \n return {\n dailyCalories,\n totalCalories,\n averageCalories,\n commonTags\n };\n}",[],[165,291,293],"7c4ae57c-1f11-11f0-97fe-569c3dd06744",["D",1745282040857],[182,183],[165,291],["D",1745282040857],[181,184,186],[165],["D",1745281500162],{"_98":97,"_105":101},{"_98":97,"_99":-5,"_100":101,"_18":55,"_102":103,"_104":25},{"_13":87,"_32":88,"_44":43,"_89":45,"_90":-5,"_91":-5,"_92":-5,"_93":-5,"_94":-5,"_95":46,"_96":97},"ctx",{"_80":-5,"_125":344,"_345":346,"_347":348,"_349":25,"_350":25,"_351":25,"_352":59,"_353":-5,"_354":-7,"_355":-7,"_356":64,"_357":25,"_358":25,"_359":-5,"_360":25,"_361":25,"_362":25,"_363":-5},"ENV",{"_315":316,"_317":318,"_319":88,"_320":321,"_322":323,"_324":325,"_326":327,"_328":329,"_330":331,"_332":333,"_334":335,"_336":337,"_338":339,"_340":341,"_342":343},"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"]

FoodVision

Capture Food

Recent Entries

Calorie Trends

{{analysis.description}}

Tags:

{{description}}

Common Foods:

Diff · v22