gn-math

[{"_1":2,"_3":-5,"_4":-5},"loaderData",{"_5":6,"_7":8,"_9":10},"actionData","errors","root",{"_196":197,"_198":199},"routes/_app.x.$handle.$name",{"_11":12,"_13":14,"_15":16,"_17":18,"_38":-7,"_121":-5,"_19":122,"_123":124,"_125":126,"_127":128,"_129":130,"_21":131,"_132":-5,"_133":-5,"_134":24,"_135":136,"_137":83,"_138":-5,"_139":-5,"_140":141},"routes/_app.x.$handle.$name.branch.$branch.history_.$",{"_11":12,"_13":14,"_15":16,"_17":18,"_19":20,"_21":22,"_23":24,"_25":26,"_27":28,"_29":24,"_30":-5},"handle","lolration","name","gn-math-site","branchName","main","path","index.html","project",{"_32":70,"_13":14,"_36":71,"_72":-5,"_73":24,"_74":75,"_76":75,"_77":78,"_79":-5,"_30":66,"_80":81,"_82":83,"_84":-5,"_85":-5,"_86":26,"_40":41,"_87":-5,"_88":-5,"_89":-5,"_90":-5,"_91":92,"_93":92,"_94":95,"_96":95,"_97":95,"_98":92,"_99":92,"_52":100,"_101":102,"_103":104,"_105":24},"file",{"_62":63,"_13":18,"_64":21,"_65":24,"_69":-5},"isDirectory",false,"page",0,"history",[31],"hasNext","userId",{"_32":33,"_34":35,"_36":37,"_38":39,"_40":41,"_42":43,"_44":-5,"_45":46,"_47":-5,"_48":-5,"_49":-5,"_50":-5,"_51":-5,"_52":53,"_21":54,"_55":-5,"_56":-5,"_57":-5,"_58":-5,"_59":60},"id","fd0e0268-5799-11f1-b0e3-ee650bb23af1","branchId","e8578dee-5799-11f1-a084-ee650bb23af1","createdAt",["D",1779645431202],"version",2,"orgId","019e5b1c-ef16-7469-80da-c1ed230ea738","parentId","efe22b50-5799-11f1-a084-ee650bb23af1","incomingCommitId","aiChatMessageId","b074fbce-e0af-4404-86c1-dcba2a805ff2","aiChatThreadId","aiChatThreadUserId","aiChatThreadTitle","source","clientLabel","user",{"_32":66,"_40":41,"_11":12,"_67":68},{"_62":63,"_13":18,"_64":21,"_65":24},"pull","merge","revert","multiple","commits",[61],{"_32":33,"_34":35,"_36":37,"_38":39,"_40":41,"_42":43,"_44":-5,"_45":46,"_47":-5,"_48":-5,"_49":-5,"_50":-5,"_51":-5,"_52":53,"_21":54,"_55":-5,"_56":-5,"_57":-5},"fileId","fd0af8e8-5799-11f1-b0e3-ee650bb23af1","fileType","deleted","babaa1df-e660-40a3-81ac-03270510600a","avatar","","deletedAtVersion","e856bde2-5799-11f1-a084-ee650bb23af1",["D",1779645396480],"deletedAt","legacyEnvVars","privacy","public","httpPrivacy","description","Game portal site with dark theme, search, and grid","imageUrl","pinnedFileId","efdf4cfa-5799-11f1-a084-ee650bb23af1","pinPreview",true,"pinMigrated","screenshotVersion","likeCount","tursoName","tursoHostname","tursoMeasuredAt","pinned","userPerm","r","valPerm","blobPerm","rw","emailPerm","sqlitePerm","projectPerm","telemetryPerm",{"_11":12,"_120":68},"org",{"_11":12,"_115":116,"_67":68,"_30":66,"_117":118,"_119":24},"branch",{"_38":106,"_13":16,"_32":35,"_107":70,"_108":-5,"_109":-5,"_110":-5,"_111":-5,"_112":-5,"_113":14,"_114":12},"isOwned",4,"projectId","forkedBranchId","forkedBranchVersion","forkedProjectPrivacy","forkedProjectId","forkedProjectOrgId","projectName","userHandle","displayName","Luca","tier","free","canRestrictVals","profileImageUrl","adoptOrgId",{"_32":70,"_13":14,"_36":192,"_72":-5,"_73":24,"_74":75,"_76":75,"_77":78,"_79":-5,"_30":66,"_80":81,"_82":83,"_84":-5,"_85":-5,"_86":26,"_40":41,"_87":-5,"_88":-5,"_89":-5,"_90":-5,"_91":92,"_93":92,"_94":95,"_96":95,"_97":95,"_98":92,"_99":92,"_52":193,"_101":194,"_103":195,"_105":24},"tree",[161,162,163,164],"files",[161,162,163,164],"counts",{"_150":26,"_151":152,"_153":26,"_154":155,"_156":157},"contents",[],{"_32":142,"_13":18,"_62":63,"_42":-5,"_34":35,"_143":39,"_144":83,"_36":145,"_38":26,"_64":21,"_146":147,"_65":24,"_148":-5,"_17":149},"upstreamProject","upstreamBranch","emptyEnvVars","flags",[],"hasHttpFiles","grants","orgs","customDomains",{},"fd0af7f8-5799-11f1-b0e3-ee650bb23af1","branchVersion","latest",["D",1779645431202],"content","\n\n\n \n \n gn-math\n \n \n \n\n\n\n

gn-math

\n \n \n \n

\n \n

\n\n

\n
\n

Featured Zones

All Zones

\n\n

zone

\n \n by Author\n

\n \n \n

\n \n

\n\n

\n \n

\n\n\n\n\n\n\n","label",[18],"pulls","branches",1,"forks","envVars",{"_158":26,"_160":26},"connections",{"_158":26,"_159":26},"count","unfilledCount","emptyCount",{"_32":184,"_13":185,"_62":186,"_42":-5,"_34":35,"_143":106,"_144":83,"_36":187,"_38":26,"_64":188,"_146":189,"_65":24,"_148":-5,"_171":190,"_17":191},{"_32":142,"_13":18,"_62":63,"_42":-5,"_34":35,"_143":39,"_144":83,"_36":181,"_38":26,"_64":21,"_146":147,"_65":24,"_148":-5,"_171":182,"_17":183},{"_32":174,"_13":175,"_62":81,"_42":-5,"_34":35,"_143":152,"_144":83,"_36":176,"_38":26,"_64":177,"_146":178,"_65":24,"_148":-5,"_171":179,"_17":180},{"_32":165,"_13":166,"_62":167,"_42":-5,"_34":35,"_143":168,"_144":83,"_36":169,"_38":26,"_64":21,"_146":170,"_65":24,"_148":-5,"_171":172,"_17":173},"2257e160-579a-11f1-ac80-ee650bb23af1","styles.css","2257e232-579a-11f1-ac80-ee650bb23af1",3,["D",1779645493685],":root {\n --primary: #fc2651;\n --primary-hover: #e91e47;\n --primary-light: rgba(252, 38, 81, 0.1);\n --primary-lighter: rgba(252, 38, 81, 0.05);\n --accent: #8b5cf6;\n --accent-light: rgba(139, 92, 246, 0.1);\n --success: #10b981;\n --warning: #f59e0b;\n --text: #1a1a1a;\n --text-muted: #6b7280;\n --text-light: #9ca3af;\n --bg: #ffffff;\n --bg-secondary: #f8fafc;\n --surface: #ffffff;\n --surface-hover: #f1f5f9;\n --border: #e2e8f0;\n --border-light: #f1f5f9;\n --glass: rgba(255, 255, 255, 0.8);\n --shadow-xs: 0 1px 2px 0 rgb(0 0 0 / 0.05);\n --shadow-sm: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);\n --shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);\n --shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);\n --shadow-xl: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);\n --shadow-glow: 0 0 20px rgba(252, 38, 81, 0.3);\n --radius: 12px;\n --radius-sm: 8px;\n --radius-lg: 16px;\n --radius-xl: 20px;\n --gradient-primary: linear-gradient(135deg, #fc2651 0%, #e91e47 100%);\n --gradient-accent: linear-gradient(135deg, #8b5cf6 0%, #7c3aed 100%);\n --gradient-surface: linear-gradient(135deg, #ffffff 0%, #f8fafc 100%);\n}\n\n.dark-mode {\n --primary: #fc2651;\n --primary-hover: #ff4d75;\n --primary-light: rgba(252, 38, 81, 0.15);\n --primary-lighter: rgba(252, 38, 81, 0.08);\n --accent: #a855f7;\n --accent-light: rgba(168, 85, 247, 0.15);\n --success: #34d399;\n --warning: #fbbf24;\n --text: #f1f5f9;\n --text-muted: #94a3b8;\n --text-light: #64748b;\n --bg: #0f172a;\n --bg-secondary: #1e293b;\n --surface: #1e293b;\n --surface-hover: #334155;\n --border: #334155;\n --border-light: #475569;\n --glass: rgba(30, 41, 59, 0.8);\n --shadow-xs: 0 1px 2px 0 rgb(0 0 0 / 0.4);\n --shadow-sm: 0 1px 3px 0 rgb(0 0 0 / 0.5), 0 1px 2px -1px rgb(0 0 0 / 0.5);\n --shadow: 0 4px 6px -1px rgb(0 0 0 / 0.5), 0 2px 4px -2px rgb(0 0 0 / 0.5);\n --shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.6), 0 4px 6px -4px rgb(0 0 0 / 0.6);\n --shadow-xl: 0 20px 25px -5px rgb(0 0 0 / 0.7), 0 8px 10px -6px rgb(0 0 0 / 0.7);\n --shadow-glow: 0 0 20px rgba(252, 38, 81, 0.4);\n --gradient-primary: linear-gradient(135deg, #fc2651 0%, #ff4d75 100%);\n --gradient-accent: linear-gradient(135deg, #a855f7 0%, #9333ea 100%);\n --gradient-surface: linear-gradient(135deg, #1e293b 0%, #334155 100%);\n}\n\n.theme-blue { --primary: #3b82f6; --primary-hover: #2563eb; --primary-light: rgba(59,130,246,0.15); --shadow-glow: 0 0 20px rgba(59,130,246,0.3); --gradient-primary: linear-gradient(135deg, #3b82f6, #2563eb); }\n.theme-green { --primary: #22c55e; --primary-hover: #16a34a; --primary-light: rgba(34,197,94,0.15); --shadow-glow: 0 0 20px rgba(34,197,94,0.3); --gradient-primary: linear-gradient(135deg, #22c55e, #16a34a); }\n.theme-purple { --primary: #a855f7; --primary-hover: #9333ea; --primary-light: rgba(168,85,247,0.15); --shadow-glow: 0 0 20px rgba(168,85,247,0.3); --gradient-primary: linear-gradient(135deg, #a855f7, #9333ea); }\n.theme-orange { --primary: #f97316; --primary-hover: #ea580c; --primary-light: rgba(249,115,22,0.15); --shadow-glow: 0 0 20px rgba(249,115,22,0.3); --gradient-primary: linear-gradient(135deg, #f97316, #ea580c); }\n.theme-pink { --primary: #ec4899; --primary-hover: #db2777; --primary-light: rgba(236,72,153,0.15); --shadow-glow: 0 0 20px rgba(236,72,153,0.3); --gradient-primary: linear-gradient(135deg, #ec4899, #db2777); }\n.theme-cyan { --primary: #06b6d4; --primary-hover: #0891b2; --primary-light: rgba(6,182,212,0.15); --shadow-glow: 0 0 20px rgba(6,182,212,0.3); --gradient-primary: linear-gradient(135deg, #06b6d4, #0891b2); }\n\n* { box-sizing: border-box; }\n\nbody {\n font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Segoe UI', system-ui, sans-serif;\n line-height: 1.6;\n margin: 0;\n padding: 0;\n background: var(--bg);\n color: var(--text);\n transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n -webkit-font-smoothing: antialiased;\n}\n\nheader {\n background: var(--gradient-primary);\n color: white;\n position: sticky;\n top: 0;\n z-index: 100;\n box-shadow: var(--shadow-lg);\n}\n\n.header-content {\n max-width: 1200px;\n margin: 0 auto;\n padding: 1.25rem 1rem;\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: 1.5rem;\n}\n\n.logo {\n font-size: 1.75rem;\n font-weight: 800;\n letter-spacing: -0.02em;\n background: linear-gradient(135deg, #ffffff 0%, rgba(255,255,255,0.8) 100%);\n -webkit-background-clip: text;\n -webkit-text-fill-color: transparent;\n background-clip: text;\n}\n\n.search-container {\n display: flex;\n flex: 1;\n max-width: 500px;\n gap: 0.75rem;\n}\n\n#searchBar {\n flex: 1;\n padding: 0.875rem 1rem;\n border: 0;\n border-radius: var(--radius);\n background: var(--glass);\n backdrop-filter: blur(20px);\n color: var(--text);\n font-size: 15px;\n outline: none;\n transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n box-shadow: var(--shadow-sm);\n}\n\n#searchBar:focus {\n box-shadow: 0 0 0 3px rgba(252, 38, 81, 0.25), var(--shadow);\n transform: translateY(-1px);\n}\n\n#searchBar::placeholder { color: var(--text-muted); }\n\n#sortOptions, #filterOptions {\n padding: 0.875rem 1rem;\n border: 0;\n border-radius: var(--radius);\n background: var(--glass);\n backdrop-filter: blur(20px);\n color: var(--text-muted);\n font-size: 15px;\n cursor: pointer;\n outline: none;\n transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n min-width: 130px;\n box-shadow: var(--shadow-sm);\n}\n\n#sortOptions:hover, #filterOptions:hover {\n transform: translateY(-1px);\n box-shadow: var(--shadow);\n}\n\n.control-buttons { display: flex; gap: 0.5rem; }\n\n.control-buttons button {\n background: rgba(255,255,255,0.1);\n border: 0;\n color: white;\n cursor: pointer;\n padding: 0;\n width: 44px;\n height: 44px;\n border-radius: var(--radius);\n display: flex;\n align-items: center;\n justify-content: center;\n backdrop-filter: blur(20px);\n transition: all 0.3s ease;\n}\n\n.control-buttons button:hover { background: rgba(255,255,255,0.2); }\n\n.control-icon {\n width: 24px;\n height: 24px;\n transition: transform 0.4s ease;\n}\n\n.control-button:hover .control-icon { transform: rotate(40deg); }\n\nmain {\n margin: 0 auto;\n padding: 2rem 1rem;\n padding-bottom: 6rem;\n}\n\n#container, #featuredZones {\n display: grid;\n grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));\n gap: 1.5rem;\n}\n\n.zone-item {\n background: var(--gradient-surface);\n border: 1px solid var(--border);\n border-radius: var(--radius-lg);\n overflow: hidden;\n cursor: pointer;\n transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);\n display: flex;\n flex-direction: column;\n position: relative;\n box-shadow: var(--shadow-sm);\n}\n\n.zone-item:hover {\n transform: translateY(-8px) scale(1.02);\n box-shadow: var(--shadow-xl);\n border-color: var(--primary);\n}\n\n.zone-item::before {\n content: '';\n position: absolute;\n inset: 0;\n background: var(--primary-light);\n opacity: 0;\n transition: opacity 0.4s ease;\n pointer-events: none;\n z-index: 1;\n}\n\n.zone-item:hover::before { opacity: 1; }\n\n.zone-item img {\n width: 100%;\n aspect-ratio: 1;\n object-fit: cover;\n display: block;\n background: var(--border-light);\n transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);\n}\n\n.zone-item:hover img { transform: scale(1.05); }\n\n.zone-item button {\n background: transparent;\n color: var(--text);\n border: 0;\n padding: 1.25rem 1rem;\n cursor: pointer;\n font-weight: 600;\n font-size: 14px;\n line-height: 1.4;\n text-align: center;\n transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n min-height: 70px;\n display: flex;\n align-items: center;\n justify-content: center;\n position: relative;\n z-index: 2;\n}\n\n.zone-item:hover button {\n color: var(--primary);\n background: rgba(252, 38, 81, 0.05);\n}\n\n#zoneViewer {\n position: fixed;\n inset: 0;\n background: var(--bg);\n z-index: 1000;\n display: none;\n flex-direction: column;\n animation: slideInUp 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n}\n\n@keyframes slideInUp {\n from { transform: translateY(100%); }\n to { transform: translateY(0); }\n}\n\n.zone-header {\n background: var(--gradient-primary);\n color: white;\n padding: 0.4rem 1.5rem;\n display: flex;\n align-items: center;\n justify-content: space-between;\n box-shadow: var(--shadow-lg);\n}\n\n.zone-title { flex: 1; min-width: 0; }\n\n#zoneName {\n font-size: 1.25rem;\n font-weight: 700;\n margin: 0 0 0.25rem;\n line-height: 1.3;\n}\n\n#zoneAuthor {\n font-size: 14px;\n color: rgba(255,255,255,0.8);\n text-decoration: none;\n font-weight: 500;\n}\n\n#zoneAuthor:hover { color: white; text-decoration: underline; }\n\n.zone-controls { display: flex; gap: 0.75rem; }\n\n.zone-controls button {\n background: rgba(255,255,255,0.1);\n border: 1px solid rgba(255,255,255,0.3);\n color: white;\n padding: 0.625rem 1rem;\n border-radius: var(--radius);\n cursor: pointer;\n font-size: 14px;\n font-weight: 600;\n transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n backdrop-filter: blur(20px);\n}\n\n.zone-controls button:hover {\n background: rgba(255,255,255,0.2);\n border-color: rgba(255,255,255,0.5);\n transform: translateY(-1px);\n}\n\n#zoneFrame {\n flex-grow: 1;\n border: none;\n width: 100%;\n height: 100%;\n}\n\n#popupOverlay {\n position: fixed;\n inset: 0;\n background: rgba(0,0,0,0.6);\n backdrop-filter: blur(8px);\n display: none;\n align-items: center;\n justify-content: center;\n z-index: 2000;\n padding: 1rem;\n animation: fadeIn 0.3s ease;\n}\n\n@keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }\n\n.popup {\n background: var(--surface);\n border-radius: var(--radius-lg);\n box-shadow: var(--shadow-xl);\n width: 100%;\n max-width: 520px;\n max-height: 80vh;\n overflow: hidden;\n display: flex;\n flex-direction: column;\n border: 1px solid var(--border);\n animation: slideInScale 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n}\n\n@keyframes slideInScale {\n from { transform: scale(0.9) translateY(20px); opacity: 0; }\n to { transform: scale(1) translateY(0); opacity: 1; }\n}\n\n.popup-header {\n background: var(--gradient-primary);\n color: white;\n padding: 1.25rem 1.5rem;\n display: flex;\n justify-content: space-between;\n align-items: center;\n}\n\n#popupTitle {\n margin: 0;\n font-size: 1.25rem;\n font-weight: 700;\n}\n\n#popupClose {\n background: rgba(255,255,255,0.1);\n border: 0;\n color: white;\n font-size: 1.25rem;\n cursor: pointer;\n padding: 0.5rem;\n border-radius: var(--radius);\n transition: all 0.3s;\n line-height: 1;\n width: 36px;\n height: 36px;\n display: flex;\n align-items: center;\n justify-content: center;\n}\n\n#popupClose:hover { background: rgba(255,255,255,0.2); transform: scale(1.1); }\n\n#popupBody {\n padding: 1.5rem;\n overflow-y: auto;\n color: var(--text);\n}\n\nfooter {\n background: var(--bg-secondary);\n border-top: 1px solid var(--border);\n padding: 1rem;\n text-align: center;\n position: fixed;\n bottom: 0;\n left: 0;\n width: 100%;\n z-index: 100;\n}\n\n.footer-links {\n display: flex;\n justify-content: center;\n gap: 2rem;\n flex-wrap: wrap;\n}\n\n.footer-links a {\n color: var(--primary);\n text-decoration: none;\n font-weight: 600;\n font-size: 15px;\n transition: all 0.3s;\n padding: 0.5rem 1rem;\n border-radius: var(--radius);\n}\n\n.footer-links a:hover {\n color: var(--primary-hover);\n background: var(--primary-light);\n transform: translateY(-1px);\n}\n\n.settings-button {\n background: var(--gradient-primary);\n color: white;\n border: 0;\n padding: 0.875rem 1.5rem;\n font-size: 15px;\n font-weight: 600;\n border-radius: var(--radius);\n cursor: pointer;\n transition: all 0.3s;\n box-shadow: var(--shadow-sm);\n min-width: 200px;\n width: 100%;\n text-align: center;\n}\n\n.settings-button:hover { transform: translateY(-2px); box-shadow: var(--shadow-lg); }\n\n.settings-section {\n border: 1px solid var(--border);\n border-radius: var(--radius);\n padding: 0.875rem;\n margin-bottom: 0.75rem;\n background: var(--surface);\n}\n\n.settings-section h4 { margin: 0 0 0.5rem; }\n\n.theme-options {\n display: grid;\n grid-template-columns: repeat(2, minmax(120px, 1fr));\n gap: 0.75rem;\n}\n\n.theme-button {\n border: 2px solid var(--border);\n border-radius: var(--radius-sm);\n background: var(--surface);\n color: var(--text);\n padding: 0.75rem;\n cursor: pointer;\n font-size: 14px;\n font-weight: 600;\n transition: all 0.2s ease;\n}\n\n.theme-button:hover { border-color: var(--primary); transform: translateY(-1px); }\n.theme-button.active { border-color: var(--primary); background: var(--primary-light); box-shadow: var(--shadow-glow); }\n\nhr { border: none; border-top: 1px solid var(--border); }\n\ndetails summary { color: var(--text); }\n\n@media (max-width: 768px) {\n .header-content { flex-direction: column; gap: 1rem; padding: 1rem; }\n .search-container { width: 100%; max-width: none; }\n main { padding: 1.5rem 1rem; }\n #container, #featuredZones { grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 1.25rem; }\n .zone-item button { padding: 1rem 0.75rem; min-height: 65px; font-size: 13px; }\n}\n\n@media (max-width: 480px) {\n #container, #featuredZones { grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 1rem; }\n .zone-item:hover { transform: translateY(-10px) scale(1.01); }\n}\n","children",[],[166],"efdf4c46-5799-11f1-a084-ee650bb23af1","main.ts",["D",1779645409105],"http","import { readFile } from \"https://esm.town/v/std/utils/index.ts\";\n\nexport default async function(req: Request): Promise {\n const url = new URL(req.url);\n \n if (url.pathname === \"/styles.css\") {\n const css = await readFile(\"/styles.css\", import.meta.url);\n return new Response(css, { headers: { \"Content-Type\": \"text/css\" } });\n }\n \n if (url.pathname === \"/app.js\") {\n const js = await readFile(\"/app.js\", import.meta.url);\n return new Response(js, { headers: { \"Content-Type\": \"application/javascript\" } });\n }\n\n const html = await readFile(\"/index.html\", import.meta.url);\n return new Response(html, { headers: { \"Content-Type\": \"text/html\" } });\n}\n",[],[175],["D",1779645431202],[],[18],"4793c624-579a-11f1-90b9-ee650bb23af1","app.js","4793c6c4-579a-11f1-90b9-ee650bb23af1",["D",1779645556251],"script","// ── Config ────────────────────────────────────────────────────────────────────\nconst container = document.getElementById('container');\nconst zoneViewer = document.getElementById('zoneViewer');\nlet zoneFrame = document.getElementById('zoneFrame');\nconst searchBar = document.getElementById('searchBar');\nconst sortOptions = document.getElementById('sortOptions');\nconst filterOptions = document.getElementById('filterOptions');\nconst featuredContainer = document.getElementById('featuredZones');\n\nconst zonesurls = [\n \"https://cdn.jsdelivr.net/gh/freebuisness/assets@main/zones.json\",\n \"https://cdn.jsdelivr.net/gh/freebuisness/assets@latest/zones.json\",\n \"https://cdn.jsdelivr.net/gh/freebuisness/assets@master/zones.json\",\n \"https://cdn.jsdelivr.net/gh/freebuisness/assets/zones.json\"\n];\nlet zonesURL = zonesurls[Math.floor(Math.random() * zonesurls.length)];\nconst coverURL = \"https://cdn.jsdelivr.net/gh/freebuisness/covers@main\";\nconst htmlURL = \"https://cdn.jsdelivr.net/gh/freebuisness/html@main\";\nconst htmlURLFallbacks = [\n \"https://cdn.jsdelivr.net/gh/freebuisness/html@latest\",\n \"https://cdn.jsdelivr.net/gh/freebuisness/html\",\n \"https://raw.githubusercontent.com/freebuisness/html/main\"\n];\n\nlet zones = [];\nlet popularityData = {};\n\nconst AVAILABLE_THEMES = [\"red\", \"orange\", \"blue\", \"green\", \"purple\", \"pink\", \"cyan\"];\n\n// ── Helpers ──────────────────────────────────────────────────────────────────\n\nfunction toTitleCase(str) {\n return str.replace(/\\w\\S*/g, t => t.charAt(0).toUpperCase() + t.substring(1).toLowerCase());\n}\n\nfunction getDisabledZoneIds() {\n try {\n const stored = localStorage.getItem(\"gnmath-owner-disabled-zones\");\n return new Set(stored ? JSON.parse(stored) : []);\n } catch { return new Set(); }\n}\n\nfunction isZoneDisabled(zoneId) {\n return getDisabledZoneIds().has(String(zoneId));\n}\n\n// ── Fetch zones ──────────────────────────────────────────────────────────────\n\nasync function listZones() {\n try {\n // Try to get latest commit SHA for cache busting\n try {\n const shaRes = await fetch(\"https://api.github.com/repos/freebuisness/assets/commits?t=\" + Date.now());\n if (shaRes.ok) {\n const shaJson = await shaRes.json();\n const sha = shaJson[0]?.sha;\n if (sha) zonesURL = `https://cdn.jsdelivr.net/gh/freebuisness/assets@${sha}/zones.json`;\n }\n } catch {}\n\n const response = await fetch(zonesURL + \"?t=\" + Date.now());\n const json = await response.json();\n zones = json;\n if (zones.length > 0) zones[0].featured = true;\n\n await Promise.all([\n fetchPopularity(\"year\"),\n fetchPopularity(\"month\"),\n fetchPopularity(\"week\"),\n fetchPopularity(\"day\")\n ]);\n\n sortZones();\n\n // Handle ?id= param\n try {\n const id = new URLSearchParams(window.location.search).get('id');\n if (id) {\n const zone = zones.find(z => z.id + '' === id + '');\n if (zone) openZone(zone);\n }\n } catch {}\n\n // Build filter tags\n let alltags = [];\n for (const obj of json) {\n if (Array.isArray(obj.special)) alltags.push(...obj.special);\n }\n alltags = [...new Set(alltags)];\n while (filterOptions.children.length > 1) filterOptions.removeChild(filterOptions.lastElementChild);\n for (const tag of alltags) {\n const opt = document.createElement(\"option\");\n opt.value = tag;\n opt.textContent = toTitleCase(tag);\n filterOptions.appendChild(opt);\n }\n } catch (error) {\n console.error(error);\n container.innerHTML = `Error loading zones: ${error}`;\n }\n}\n\nasync function fetchPopularity(duration) {\n try {\n if (!popularityData[duration]) popularityData[duration] = {};\n const response = await fetch(\n \"https://data.jsdelivr.com/v1/stats/packages/gh/freebuisness/html@main/files?period=\" + duration\n );\n const data = await response.json();\n data.forEach(file => {\n const idMatch = file.name.match(/\\/(\\d+)\\.html$/);\n if (idMatch) {\n popularityData[duration][parseInt(idMatch[1])] = file.hits?.total ?? 0;\n }\n });\n } catch {\n if (!popularityData[duration]) popularityData[duration] = {};\n }\n}\n\n// ── Sort & Display ───────────────────────────────────────────────────────────\n\nfunction sortZones() {\n const sortBy = sortOptions.value;\n if (sortBy === 'name') zones.sort((a, b) => a.name.localeCompare(b.name));\n else if (sortBy === 'id') zones.sort((a, b) => a.id - b.id);\n else if (sortBy === 'popular') zones.sort((a, b) => ((popularityData['year']?.[b.id]) ?? 0) - ((popularityData['year']?.[a.id]) ?? 0));\n\n zones.sort((a, b) => (a.id === -1 ? -1 : b.id === -1 ? 1 : 0));\n\n if (featuredContainer.innerHTML === \"\") {\n displayFeaturedZones(zones.filter(z => z.featured));\n }\n displayZones(zones);\n}\n\nfunction createZoneCard(file) {\n const zoneItem = document.createElement(\"div\");\n zoneItem.className = \"zone-item\";\n zoneItem.onclick = () => openZone(file);\n\n const img = document.createElement(\"img\");\n img.dataset.src = file.cover.replace(\"{COVER_URL}\", coverURL).replace(\"{HTML_URL}\", htmlURL);\n img.alt = file.name;\n img.loading = \"lazy\";\n img.className = \"lazy-zone-img\";\n zoneItem.appendChild(img);\n\n const button = document.createElement(\"button\");\n button.textContent = file.name;\n button.onclick = (e) => { e.stopPropagation(); openZone(file); };\n zoneItem.appendChild(button);\n\n // Play count badge\n const plays = (popularityData['year']?.[file.id]) ?? 0;\n if (plays > 0) {\n const badge = document.createElement(\"div\");\n badge.style.cssText = \"font-size:11px;color:var(--text-muted);text-align:center;padding:0 0.75rem 0.4rem;\";\n badge.textContent = \"▶ \" + plays.toLocaleString() + \" plays\";\n zoneItem.appendChild(badge);\n }\n\n return zoneItem;\n}\n\nfunction observeLazyImages(selector) {\n const observer = new IntersectionObserver((entries, obs) => {\n entries.forEach(entry => {\n if (entry.isIntersecting) {\n const img = entry.target;\n img.src = img.dataset.src;\n img.classList.remove(\"lazy-zone-img\");\n obs.unobserve(img);\n }\n });\n }, { rootMargin: \"100px\", threshold: 0.1 });\n document.querySelectorAll(selector).forEach(img => observer.observe(img));\n}\n\nfunction displayFeaturedZones(featured) {\n featuredContainer.innerHTML = \"\";\n const visible = featured.filter(f => !isZoneDisabled(f.id));\n visible.forEach(f => featuredContainer.appendChild(createZoneCard(f)));\n if (!visible.length) featuredContainer.innerHTML = \"No featured zones found.\";\n else document.getElementById(\"allZonesSummary\").textContent = `Featured Zones (${visible.length})`;\n observeLazyImages('#featuredZones img.lazy-zone-img');\n}\n\nfunction displayZones(list) {\n container.innerHTML = \"\";\n const visible = list.filter(f => !isZoneDisabled(f.id));\n visible.forEach(f => container.appendChild(createZoneCard(f)));\n if (!visible.length) container.innerHTML = \"No zones found.\";\n else document.getElementById(\"allSummary\").textContent = `All Zones (${visible.length})`;\n observeLazyImages('img.lazy-zone-img');\n}\n\n// ── Filtering ────────────────────────────────────────────────────────────────\n\nfunction filterZones() {\n const query = searchBar.value.toLowerCase();\n const filtered = zones.filter(z => z.name.toLowerCase().includes(query));\n if (query.length) document.getElementById(\"featuredZonesWrapper\").removeAttribute(\"open\");\n displayZones(filtered);\n}\n\nfunction filterZones2() {\n const query = filterOptions.value;\n if (query === \"none\") { displayZones(zones); return; }\n const filtered = zones.filter(z => z.special?.includes(query));\n if (query.length) document.getElementById(\"featuredZonesWrapper\").removeAttribute(\"open\");\n displayZones(filtered);\n}\n\n// ── Zone Viewer ──────────────────────────────────────────────────────────────\n\nasync function fetchWithFallback(rawUrl) {\n const suffix = rawUrl.replace(\"{HTML_URL}\", \"\").replace(\"{COVER_URL}\", \"\");\n const isHtml = rawUrl.includes(\"{HTML_URL}\");\n const candidates = isHtml\n ? [htmlURL, ...htmlURLFallbacks].map(base => base + suffix)\n : [rawUrl.replace(\"{COVER_URL}\", coverURL).replace(\"{HTML_URL}\", htmlURL)];\n\n let lastError;\n for (const url of candidates) {\n try {\n const res = await fetch(url);\n if (!res.ok) throw new Error(`HTTP ${res.status}`);\n return await res.text();\n } catch (err) { lastError = err; }\n }\n throw lastError;\n}\n\nfunction openZone(file) {\n if (isZoneDisabled(file.id)) { alert(\"This game is disabled.\"); return; }\n\n if (file.url.startsWith(\"http\")) {\n window.open(file.url, \"_blank\");\n return;\n }\n\n document.getElementById('zoneName').textContent = file.name;\n document.getElementById('zoneId').textContent = file.id;\n document.getElementById('zoneAuthor').textContent = \"by \" + file.author;\n if (file.authorLink) document.getElementById('zoneAuthor').href = file.authorLink;\n else document.getElementById('zoneAuthor').removeAttribute('href');\n\n zoneViewer.style.display = \"flex\";\n zoneViewer.hidden = false;\n\n if (zoneFrame.contentDocument) {\n zoneFrame.contentDocument.open();\n zoneFrame.contentDocument.write('Loading...');\n zoneFrame.contentDocument.close();\n }\n\n try {\n const locUrl = new URL(window.location);\n locUrl.searchParams.set('id', file.id);\n history.pushState(null, '', locUrl.toString());\n } catch {}\n\n fetchWithFallback(file.url).then(html => {\n if (!zoneFrame.contentDocument) {\n zoneFrame = document.createElement(\"iframe\");\n zoneFrame.id = \"zoneFrame\";\n zoneViewer.appendChild(zoneFrame);\n }\n zoneFrame.contentDocument.open();\n zoneFrame.contentDocument.write(html);\n zoneFrame.contentDocument.close();\n }).catch(err => { closeZone(); alert(\"Failed to load zone: \" + err); });\n}\n\nfunction closeZone() {\n zoneViewer.style.display = \"none\";\n if (zoneFrame.parentNode === zoneViewer) zoneViewer.removeChild(zoneFrame);\n zoneFrame = document.createElement(\"iframe\");\n zoneFrame.id = \"zoneFrame\";\n zoneViewer.appendChild(zoneFrame);\n try {\n const url = new URL(window.location);\n url.searchParams.delete('id');\n history.pushState(null, '', url.toString());\n } catch {}\n}\n\nfunction fullscreenZone() {\n if (zoneFrame.requestFullscreen) zoneFrame.requestFullscreen();\n else if (zoneFrame.webkitRequestFullscreen) zoneFrame.webkitRequestFullscreen();\n}\n\n// ── Popup ────────────────────────────────────────────────────────────────────\n\nfunction closePopup() {\n document.getElementById('popupOverlay').style.display = \"none\";\n}\n\nfunction showContact() {\n document.getElementById('popupTitle').textContent = \"Contact\";\n document.getElementById('popupBody').innerHTML = `

For any inquiries, reach out via the project's GitHub or community channels.

`;\n document.getElementById('popupOverlay').style.display = \"flex\";\n}\n\nfunction showPrivacy() {\n document.getElementById('popupTitle').textContent = \"Privacy Policy\";\n document.getElementById('popupBody').innerHTML = `

This site does not collect personal data. Game usage statistics are gathered anonymously via CDN analytics. Local preferences are stored in your browser's localStorage.

`;\n document.getElementById('popupOverlay').style.display = \"flex\";\n}\n\n// ── Settings ─────────────────────────────────────────────────────────────────\n\nfunction openSettings() {\n document.getElementById('popupTitle').textContent = \"Settings\";\n const isDark = document.body.classList.contains(\"dark-mode\");\n const currentTheme = localStorage.getItem(\"gnmath-theme\") || \"red\";\n\n document.getElementById('popupBody').innerHTML = `\n

🌓 Appearance

\n \n

🎨 Theme Color

\n ${AVAILABLE_THEMES.map(t => `\n \n `).join('')}\n

🔄 Reset

\n \n

\n `;\n document.getElementById('popupOverlay').style.display = \"flex\";\n}\n\nfunction darkMode() {\n document.body.classList.toggle(\"dark-mode\");\n localStorage.setItem(\"gnmath-mode\", document.body.classList.contains(\"dark-mode\") ? \"dark\" : \"light\");\n openSettings(); // refresh the settings popup\n}\n\nfunction setTheme(themeName) {\n const safe = AVAILABLE_THEMES.includes(themeName) ? themeName : \"red\";\n document.body.classList.remove(...AVAILABLE_THEMES.map(t => `theme-${t}`));\n document.body.classList.add(`theme-${safe}`);\n localStorage.setItem(\"gnmath-theme\", safe);\n}\n\nfunction resetSettings() {\n localStorage.removeItem(\"gnmath-mode\");\n localStorage.removeItem(\"gnmath-theme\");\n location.reload();\n}\n\n// ── Init ─────────────────────────────────────────────────────────────────────\n\nfunction applySavedSettings() {\n const savedMode = localStorage.getItem(\"gnmath-mode\");\n if (savedMode === \"light\") document.body.classList.remove(\"dark-mode\");\n else document.body.classList.add(\"dark-mode\");\n\n const savedTheme = localStorage.getItem(\"gnmath-theme\") || \"red\";\n setTheme(savedTheme);\n}\n\napplySavedSettings();\nlistZones();\n",[],[185],["D",1779645396480],{"_11":12,"_120":68},{"_11":12,"_115":116,"_67":68,"_30":66,"_117":118,"_119":24},{"_38":106,"_13":16,"_32":35,"_107":70,"_108":-5,"_109":-5,"_110":-5,"_111":-5,"_112":-5,"_113":14,"_114":12},"ctx",{"_52":-5,"_139":229,"_230":231,"_232":233,"_234":24,"_235":24,"_236":24,"_237":83,"_238":-5,"_239":-7,"_240":-7,"_241":26,"_242":24,"_243":24,"_244":-5,"_245":24,"_246":24,"_247":24,"_248":-5},"ENV",{"_200":201,"_202":203,"_204":16,"_205":206,"_207":208,"_209":210,"_211":212,"_213":214,"_215":216,"_217":218,"_219":220,"_221":222,"_223":224,"_225":226,"_227":228},"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"]

History · index.html