Probability Display

[{"_1":2,"_3":-5,"_4":-5},"loaderData",{"_5":6,"_7":8,"_9":10},"actionData","errors","root",{"_215":216,"_217":218},"routes/_app.x.$handle.$name",{"_11":12,"_13":14,"_15":-7,"_18":19,"_17":-7,"_162":-5,"_20":163,"_22":164,"_165":166,"_167":168,"_26":169,"_24":170,"_171":-5,"_172":-5,"_173":55,"_174":175,"_176":46,"_177":-5,"_178":-5,"_179":180},"routes/_app.x.$handle.$name.code.$",{"_11":12,"_13":14,"_15":16,"_17":-7,"_18":19,"_20":21,"_22":23,"_24":25,"_26":27,"_28":-5,"_29":-5,"_30":-5,"_31":-5,"_32":-5},"handle","sultanoloyede","name","stock_forecast","branchName","main","version","path","backend","project",{"_34":109,"_13":14,"_47":110,"_111":-5,"_112":55,"_113":114,"_115":114,"_116":-5,"_117":-5,"_118":119,"_120":38,"_121":46,"_122":46,"_123":-5,"_124":61,"_125":126,"_127":-5,"_128":-5,"_129":-5,"_130":-5,"_131":132,"_133":132,"_134":135,"_136":135,"_137":135,"_138":132,"_139":132,"_140":141,"_142":143,"_144":145,"_146":55},"tree",[64,65,66,67],"file",{"_34":58,"_13":19,"_37":40,"_39":-5,"_41":42,"_43":59,"_45":46,"_47":60,"_17":61,"_50":62,"_52":-5,"_54":55,"_56":-5,"_18":63},"contents",[33],"upstream","pull","ahead","behind","envVars",{"_34":35,"_13":36,"_37":38,"_39":40,"_41":42,"_43":44,"_45":46,"_47":48,"_17":49,"_50":51,"_52":53,"_54":55,"_56":-5,"_18":57},"id","c6288fce-50f2-11f0-a338-f69ea79377d9","index.ts","fileId","6c601c2a-39bc-11f0-9efc-9e149126039e","parentId","cd3e9980-e45d-415e-9199-0bfed67562a6","branchId","0cfcda9e-39bb-11f0-9998-9e149126039e","branchVersion",20,"latest",true,"createdAt",["D",1750766408503],8,"fileType","http","content","import { Hono } from \"https://esm.sh/hono@3.11.7\";\nimport { readFile, serveFile } from \"https://esm.town/v/std/utils@85-main/index.ts\";\n\nconst app = new Hono();\n\n// Unwrap Hono errors to see original error details\napp.onError((err, c) => {\n throw err;\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// API endpoint to fetch probability data\napp.get(\"/api/probability\", async (c) => {\n try {\n const response = await fetch(\"https://37ce-137-122-64-213.ngrok-free.app/predict\", {\n headers: {\n \"ngrok-skip-browser-warning\": \"true\",\n },\n });\n\n if (!response.ok) {\n throw new Error(`HTTP error! status: ${response.status}`);\n }\n\n const data = await response.json();\n console.log(\"Received data:\", data); // Debug log\n\n // Try to find probability value in different possible field names\n let probability = null;\n const possibleFields = [\"probability\", \"prob\", \"p\", \"score\", \"value\", \"result\"];\n\n for (const field of possibleFields) {\n if (typeof data[field] === \"number\") {\n probability = data[field];\n break;\n }\n }\n\n // If no direct field found, check if data itself is a number\n if (probability === null && typeof data === \"number\") {\n probability = data;\n }\n\n if (probability === null) {\n throw new Error(`Probability value not found. Available fields: ${Object.keys(data).join(\", \")}`);\n }\n\n const percentage = probability * 100;\n\n return c.json({\n probability: percentage,\n originalData: data,\n foundField: typeof data === \"number\" ? \"root\" : possibleFields.find(f => typeof data[f] === \"number\"),\n });\n } catch (error) {\n console.error(\"Error fetching probability:\", error);\n return c.json({\n error: \"Failed to fetch probability data\",\n message: error.message,\n }, 500);\n }\n});\n\n// Serve the main page\napp.get(\"/\", async (c) => {\n const html = await readFile(\"/frontend/index.html\", import.meta.url);\n return c.html(html);\n});\n\nexport default app.fetch;","deleted",false,"label",[19,36],"6c603e58-39bc-11f0-9efc-9e149126039e",2,["D",1748214188328],0,"directory",[19],{"_34":58,"_13":19,"_37":40,"_39":-5,"_41":42,"_43":59,"_45":46,"_47":102,"_17":61,"_50":62,"_52":-5,"_54":55,"_56":-5,"_75":103,"_18":104},{"_34":85,"_13":86,"_37":87,"_39":-5,"_41":42,"_43":88,"_45":46,"_47":89,"_17":61,"_50":62,"_52":-5,"_54":55,"_56":-5,"_75":90,"_18":91},{"_34":78,"_13":79,"_37":80,"_39":-5,"_41":42,"_43":49,"_45":46,"_47":81,"_17":71,"_50":24,"_52":82,"_54":55,"_56":-5,"_75":83,"_18":84},{"_34":68,"_13":69,"_37":70,"_39":-5,"_41":42,"_43":71,"_45":46,"_47":72,"_17":61,"_50":73,"_52":74,"_54":55,"_56":-5,"_75":76,"_18":77},"0cfe09e6-39bb-11f0-9998-9e149126039e","main.tsx","0cfe0a72-39bb-11f0-9998-9e149126039e",1,["D",1748213598809],"script","","children",[],[69],"b2b52670-39bc-11f0-b70a-9e149126039e","README.md","82027154-39bc-11f0-9550-9e149126039e",["D",1748214306325],"# Probability Display Website\n\nA beautiful, responsive website that fetches probability data from an external API and displays it in an aesthetic manner.\n\n## Features\n\n- 🎯 Fetches data from `https://2275-65-95-228-32.ngrok-free.app/predict`\n- 📊 Extracts probability value and converts to percentage (multiplies by 100)\n- 🎨 Beautiful gradient design with animated elements\n- 📱 Fully responsive for mobile and desktop\n- 🔄 Auto-refresh every 30 seconds\n- ⚡ Real-time loading and error states\n- 🎭 Smooth animations and transitions\n\n## Project Structure\n\n```\n├── backend/\n│ └── index.ts # Hono API server with probability endpoint\n├── frontend/\n│ └── index.html # Main website with aesthetic display\n└── README.md\n```\n\n## API Endpoints\n\n- `GET /` - Main website\n- `GET /api/probability` - Fetches and processes probability data\n\n## Design Features\n\n- **Animated Circle**: Pulsing gradient circle displaying the percentage\n- **Loading States**: Elegant spinner while fetching data\n- **Error Handling**: User-friendly error messages with retry functionality\n- **Auto-refresh**: Updates data every 30 seconds automatically\n- **Responsive**: Works perfectly on all device sizes\n\n## Technical Stack\n\n- **Backend**: Hono framework for API handling\n- **Frontend**: Vanilla HTML/CSS/JS with TailwindCSS\n- **Styling**: Custom CSS animations + Tailwind utilities\n- **Fonts**: Google Fonts (Inter)",[],[79],"79fb3482-39bc-11f0-bcdf-9e149126039e","frontend","92e2aadf-c50a-44ee-a196-52490067584e",3,["D",1748214211157],[92],[86],{"_34":93,"_13":94,"_37":95,"_39":87,"_41":42,"_43":96,"_45":46,"_47":97,"_17":98,"_50":24,"_52":99,"_54":55,"_56":-5,"_75":100,"_18":101},"d235df14-3a2d-11f0-aacd-9e149126039e","index.html","79fb0c00-39bc-11f0-bcdf-9e149126039e",16,["D",1748262892311],7,"\n\n\n \n \n Probability Display\n \n\n\n

\n\n \n\n",[],[86,94],["D",1748214188328],[105],[19],{"_34":35,"_13":36,"_37":38,"_39":40,"_41":42,"_43":44,"_45":46,"_47":106,"_17":49,"_50":51,"_52":53,"_54":55,"_56":-5,"_75":107,"_18":108},["D",1750766408503],[],[19,36],"0cfc9048-39bb-11f0-9998-9e149126039e",["D",1748213598801],"deletedAt","legacyEnvVars","privacy","public","httpPrivacy","description","imageUrl","userId","124f16b2-c4a6-4573-a1c0-78c6b64da210","pinnedFileId","pinPreview","pinMigrated","screenshotVersion","likeCount","orgId","80c9371d-28b2-439f-8746-b6469ec683df","tursoName","tursoHostname","tursoMeasuredAt","pinned","userPerm","r","valPerm","blobPerm","rw","emailPerm","sqlitePerm","projectPerm","telemetryPerm","user",{"_11":12,"_161":157},"org",{"_11":12,"_155":-5,"_156":157,"_118":119,"_158":159,"_160":55},"branch",{"_17":44,"_13":16,"_34":42,"_147":109,"_148":-5,"_149":-5,"_150":-5,"_151":-5,"_152":-5,"_153":14,"_154":12},"isOwned","projectId","forkedBranchId","forkedBranchVersion","forkedProjectPrivacy","forkedProjectId","forkedProjectOrgId","projectName","userHandle","displayName","avatar","https://img.clerk.com/eyJ0eXBlIjoicHJveHkiLCJzcmMiOiJodHRwczovL2ltYWdlcy5jbGVyay5kZXYvb2F1dGhfZ2l0aHViL2ltZ18ybkFzQVlQcXp2Rjc4d2F2Q3EwUEhERjhnUk4ifQ","tier","free","canRestrictVals","profileImageUrl","adoptOrgId",{"_34":109,"_13":14,"_47":211,"_111":-5,"_112":55,"_113":114,"_115":114,"_116":-5,"_117":-5,"_118":119,"_120":38,"_121":46,"_122":46,"_123":-5,"_124":61,"_125":126,"_127":-5,"_128":-5,"_129":-5,"_130":-5,"_131":132,"_133":132,"_134":135,"_136":135,"_137":135,"_138":132,"_139":132,"_140":212,"_142":213,"_144":214,"_146":55},[193,195,197,198],"files",[193,194,195,196,197,198],"counts",{"_184":61,"_185":71,"_186":61,"_32":187,"_188":189},[182],{"_34":58,"_13":19,"_37":40,"_39":-5,"_41":42,"_43":59,"_45":46,"_47":60,"_17":61,"_50":62,"_52":-5,"_54":55,"_56":-5,"_18":181},"upstreamProject","upstreamBranch","emptyEnvVars","flags",[],"hasHttpFiles","grants","orgs","customDomains",{},[19],{"_34":35,"_13":36,"_37":38,"_39":40,"_41":42,"_43":44,"_45":46,"_47":48,"_17":49,"_50":51,"_52":53,"_54":55,"_56":-5,"_18":183},[19,36],"pulls","branches","forks",{"_190":61,"_192":61},"connections",{"_190":61,"_191":61},"count","unfilledCount","emptyCount",{"_34":58,"_13":19,"_37":40,"_39":-5,"_41":42,"_43":59,"_45":46,"_47":102,"_17":61,"_50":62,"_52":-5,"_54":55,"_56":-5,"_75":209,"_18":210},{"_34":35,"_13":36,"_37":38,"_39":40,"_41":42,"_43":44,"_45":46,"_47":106,"_17":49,"_50":51,"_52":53,"_54":55,"_56":-5,"_75":207,"_18":208},{"_34":85,"_13":86,"_37":87,"_39":-5,"_41":42,"_43":88,"_45":46,"_47":89,"_17":61,"_50":62,"_52":-5,"_54":55,"_56":-5,"_75":205,"_18":206},{"_34":93,"_13":94,"_37":95,"_39":87,"_41":42,"_43":96,"_45":46,"_47":97,"_17":98,"_50":24,"_52":99,"_54":55,"_56":-5,"_75":203,"_18":204},{"_34":78,"_13":79,"_37":80,"_39":-5,"_41":42,"_43":49,"_45":46,"_47":81,"_17":71,"_50":24,"_52":82,"_54":55,"_56":-5,"_75":201,"_18":202},{"_34":68,"_13":69,"_37":70,"_39":-5,"_41":42,"_43":71,"_45":46,"_47":72,"_17":61,"_50":73,"_52":74,"_54":55,"_56":-5,"_75":199,"_18":200},[],[69],[],[79],[],[86,94],[196],[86],[],[19,36],[194],[19],["D",1748213598801],{"_11":12,"_161":157},{"_11":12,"_155":-5,"_156":157,"_118":119,"_158":159,"_160":55},{"_17":44,"_13":16,"_34":42,"_147":109,"_148":-5,"_149":-5,"_150":-5,"_151":-5,"_152":-5,"_153":14,"_154":12},"ctx",{"_140":-5,"_178":248,"_249":250,"_251":252,"_253":55,"_254":55,"_255":55,"_256":46,"_257":-5,"_258":-7,"_259":-7,"_260":61,"_261":55,"_262":55,"_263":-5,"_264":55,"_265":55,"_266":55,"_267":-5},"ENV",{"_219":220,"_221":222,"_223":16,"_224":225,"_226":227,"_228":229,"_230":231,"_232":233,"_234":235,"_236":237,"_238":239,"_240":241,"_242":243,"_244":245,"_246":247},"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"]