File size: 9,598 Bytes
39140e2 | 1 | <!DOCTYPE html><html lang="en" class="dark"><head><meta charSet="utf-8"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="stylesheet" href="/_next/static/css/1cf62c737a71895f.css" data-precedence="next"/><link rel="preload" as="script" fetchPriority="low" href="/_next/static/chunks/webpack-4ebfcd0abd2e4b97.js"/><script src="/_next/static/chunks/fd9d1056-b984c68a60c5470f.js" async=""></script><script src="/_next/static/chunks/23-4abb6602b7cca65b.js" async=""></script><script src="/_next/static/chunks/main-app-879d53eaff1e26da.js" async=""></script><script src="/_next/static/chunks/b2db8554-ed64f5072c2ba889.js" async=""></script><script src="/_next/static/chunks/771-6cfce061b1e036d8.js" async=""></script><script src="/_next/static/chunks/app/page-4df89cc9f8390628.js" async=""></script><link rel="preconnect" href="https://fonts.googleapis.com"/><link rel="preconnect" href="https://fonts.gstatic.com" crossorigin="anonymous"/><title>PostureGuard — Edge AI Posture Detection</title><meta name="description" content="Real-time client-side posture analysis using YOLOv8-pose and ONNX Runtime Web. No data leaves your device."/><link href="https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;700&display=swap" rel="stylesheet"/><script src="/_next/static/chunks/polyfills-78c92fac7aa8fdd8.js" noModule=""></script></head><body class="bg-[#060810] text-slate-100 antialiased"><div class="min-h-screen bg-[#060810] text-slate-100 flex flex-col"><header class="flex items-center justify-between px-6 py-3 border-b border-[#1e2337]"><div class="flex items-center gap-3"><div class="relative w-8 h-8"><div class="absolute inset-0 rounded-lg bg-[#00ffa3]/10 border border-[#00ffa3]/30"></div><svg viewBox="0 0 32 32" class="w-8 h-8 p-1.5"><circle cx="16" cy="9" r="3" stroke="#00ffa3" stroke-width="1.5" fill="none"></circle><circle cx="16" cy="18" r="2" stroke="#00ffa3" stroke-width="1.5" fill="none"></circle><circle cx="16" cy="26" r="2" stroke="#00ffa3" stroke-width="1.5" fill="none"></circle><line x1="16" y1="12" x2="16" y2="16" stroke="#00ffa3" stroke-width="1.5"></line><line x1="16" y1="20" x2="16" y2="24" stroke="#00ffa3" stroke-width="1.5" stroke-dasharray="2 1.5"></line></svg></div><div><h1 class="text-sm font-bold tracking-widest font-mono uppercase text-slate-100">PostureGuard</h1><p class="text-[10px] font-mono text-slate-600 tracking-wider -mt-0.5">Edge AI · YOLOv8-pose · ONNX</p></div></div><div class="flex items-center gap-3"><div class="inline-flex items-center gap-2 px-3 py-1.5 rounded-full border text-xs font-mono tracking-widest uppercase border-slate-700/60 bg-slate-800/20"><span class="w-1.5 h-1.5 rounded-full bg-slate-500 "></span><span class="text-slate-400">DETECTING...</span></div><button class="text-[10px] font-mono tracking-widest px-3 py-1.5 rounded-full border uppercase transition-all bg-transparent border-slate-700 text-slate-500 hover:border-slate-500 hover:text-slate-300">Analytics</button></div></header><main class="flex-1 flex gap-4 p-4 overflow-hidden"><div class="flex flex-col gap-3 flex-1 min-w-0"><div class="relative bg-[#0d1117] border border-[#1e2337] rounded-xl overflow-hidden aspect-video"><video class="hidden" playsInline="" muted=""></video><canvas class="w-full h-full object-cover" style="display:none"></canvas><div class="absolute inset-0 flex flex-col items-center justify-center gap-4"><div class="w-16 h-16 rounded-2xl bg-[#00ffa3]/5 border border-[#00ffa3]/20 flex items-center justify-center"><svg viewBox="0 0 24 24" class="w-7 h-7 text-[#00ffa3]/40" fill="none" stroke="currentColor" stroke-width="1.5"><circle cx="12" cy="8" r="3"></circle><path d="M6 20v-1a6 6 0 0 1 12 0v1"></path></svg></div><div class="text-center"><p class="text-sm font-mono text-slate-400">Camera inactive</p><p class="text-xs font-mono text-slate-600 mt-1">Enable detection to begin posture analysis</p></div></div></div><div class="flex items-center gap-3 bg-[#0d1117] border border-[#1e2337] rounded-xl px-4 py-3"><button class="flex items-center gap-2 px-4 py-2 rounded-lg text-xs font-bold font-mono tracking-wider uppercase transition-all disabled:opacity-50 bg-[#00ffa3]/15 border border-[#00ffa3]/40 text-[#00ffa3] hover:bg-[#00ffa3]/25"><span class="w-1.5 h-1.5 rounded-full bg-[#00ffa3]"></span>Start Detection</button><div class="w-px h-6 bg-[#1e2337]"></div><label class="flex items-center gap-2 cursor-pointer select-none"><div class="relative w-8 h-4 rounded-full border transition-colors bg-[#00ffa3]/20 border-[#00ffa3]/40"><span class="absolute top-0.5 left-0.5 w-3 h-3 rounded-full transition-all translate-x-4 bg-[#00ffa3]"></span></div><span class="text-[11px] font-mono text-slate-400 uppercase tracking-widest">Skeleton</span></label><div class="w-px h-6 bg-[#1e2337]"></div><div class="flex items-center gap-2 flex-1"><span class="text-[11px] font-mono text-slate-500 uppercase tracking-widest whitespace-nowrap">Sensitivity</span><input type="range" min="5" max="40" step="1" class="flex-1 h-1 accent-[#00ffa3] cursor-pointer" value="15"/><span class="text-[11px] font-mono text-[#00ffa3] w-5 tabular-nums">15</span></div><div class="w-px h-6 bg-[#1e2337]"></div><button class="text-[11px] font-mono text-slate-500 hover:text-slate-300 uppercase tracking-widest transition-colors">Reset</button></div></div></main><footer class="px-6 py-2 border-t border-[#1e2337] flex items-center justify-between"><p class="text-[10px] font-mono text-slate-700 tracking-widest">All inference runs locally · No data leaves your device</p><p class="text-[10px] font-mono text-slate-700 tracking-widest">YOLOv8n-pose · ONNX Runtime Web</p></footer></div><script src="/_next/static/chunks/webpack-4ebfcd0abd2e4b97.js" async=""></script><script>(self.__next_f=self.__next_f||[]).push([0]);self.__next_f.push([2,null])</script><script>self.__next_f.push([1,"1:HL[\"/_next/static/css/1cf62c737a71895f.css\",\"style\"]\n"])</script><script>self.__next_f.push([1,"2:I[5751,[],\"\"]\n4:I[6513,[],\"ClientPageRoot\"]\n5:I[4193,[\"15\",\"static/chunks/b2db8554-ed64f5072c2ba889.js\",\"771\",\"static/chunks/771-6cfce061b1e036d8.js\",\"931\",\"static/chunks/app/page-4df89cc9f8390628.js\"],\"default\"]\n6:I[9275,[],\"\"]\n7:I[1343,[],\"\"]\n9:I[6130,[],\"\"]\na:[]\n"])</script><script>self.__next_f.push([1,"0:[[[\"$\",\"link\",\"0\",{\"rel\":\"stylesheet\",\"href\":\"/_next/static/css/1cf62c737a71895f.css\",\"precedence\":\"next\",\"crossOrigin\":\"$undefined\"}]],[\"$\",\"$L2\",null,{\"buildId\":\"a_-nKWvFqAqr-vvjbkuwa\",\"assetPrefix\":\"\",\"initialCanonicalUrl\":\"/\",\"initialTree\":[\"\",{\"children\":[\"__PAGE__\",{}]},\"$undefined\",\"$undefined\",true],\"initialSeedData\":[\"\",{\"children\":[\"__PAGE__\",{},[[\"$L3\",[\"$\",\"$L4\",null,{\"props\":{\"params\":{},\"searchParams\":{}},\"Component\":\"$5\"}]],null],null]},[[\"$\",\"html\",null,{\"lang\":\"en\",\"className\":\"dark\",\"children\":[[\"$\",\"head\",null,{\"children\":[[\"$\",\"link\",null,{\"rel\":\"preconnect\",\"href\":\"https://fonts.googleapis.com\"}],[\"$\",\"link\",null,{\"rel\":\"preconnect\",\"href\":\"https://fonts.gstatic.com\",\"crossOrigin\":\"anonymous\"}],[\"$\",\"link\",null,{\"href\":\"https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;700\u0026display=swap\",\"rel\":\"stylesheet\"}]]}],[\"$\",\"body\",null,{\"className\":\"bg-[#060810] text-slate-100 antialiased\",\"children\":[\"$\",\"$L6\",null,{\"parallelRouterKey\":\"children\",\"segmentPath\":[\"children\"],\"error\":\"$undefined\",\"errorStyles\":\"$undefined\",\"errorScripts\":\"$undefined\",\"template\":[\"$\",\"$L7\",null,{}],\"templateStyles\":\"$undefined\",\"templateScripts\":\"$undefined\",\"notFound\":[[\"$\",\"title\",null,{\"children\":\"404: This page could not be found.\"}],[\"$\",\"div\",null,{\"style\":{\"fontFamily\":\"system-ui,\\\"Segoe UI\\\",Roboto,Helvetica,Arial,sans-serif,\\\"Apple Color Emoji\\\",\\\"Segoe UI Emoji\\\"\",\"height\":\"100vh\",\"textAlign\":\"center\",\"display\":\"flex\",\"flexDirection\":\"column\",\"alignItems\":\"center\",\"justifyContent\":\"center\"},\"children\":[\"$\",\"div\",null,{\"children\":[[\"$\",\"style\",null,{\"dangerouslySetInnerHTML\":{\"__html\":\"body{color:#000;background:#fff;margin:0}.next-error-h1{border-right:1px solid rgba(0,0,0,.3)}@media (prefers-color-scheme:dark){body{color:#fff;background:#000}.next-error-h1{border-right:1px solid rgba(255,255,255,.3)}}\"}}],[\"$\",\"h1\",null,{\"className\":\"next-error-h1\",\"style\":{\"display\":\"inline-block\",\"margin\":\"0 20px 0 0\",\"padding\":\"0 23px 0 0\",\"fontSize\":24,\"fontWeight\":500,\"verticalAlign\":\"top\",\"lineHeight\":\"49px\"},\"children\":\"404\"}],[\"$\",\"div\",null,{\"style\":{\"display\":\"inline-block\"},\"children\":[\"$\",\"h2\",null,{\"style\":{\"fontSize\":14,\"fontWeight\":400,\"lineHeight\":\"49px\",\"margin\":0},\"children\":\"This page could not be found.\"}]}]]}]}]],\"notFoundStyles\":[],\"styles\":null}]}]]}],null],null],\"couldBeIntercepted\":false,\"initialHead\":[false,\"$L8\"],\"globalErrorComponent\":\"$9\",\"missingSlots\":\"$Wa\"}]]\n"])</script><script>self.__next_f.push([1,"8:[[\"$\",\"meta\",\"0\",{\"name\":\"viewport\",\"content\":\"width=device-width, initial-scale=1\"}],[\"$\",\"meta\",\"1\",{\"charSet\":\"utf-8\"}],[\"$\",\"title\",\"2\",{\"children\":\"PostureGuard — Edge AI Posture Detection\"}],[\"$\",\"meta\",\"3\",{\"name\":\"description\",\"content\":\"Real-time client-side posture analysis using YOLOv8-pose and ONNX Runtime Web. No data leaves your device.\"}]]\n3:null\n"])</script></body></html> |