[{"_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",{"_102":101,"_38":51,"_109":92,"_33":42,"_13":14,"_110":-5,"_11":111,"_112":113,"_114":115,"_116":117,"_118":119,"_26":-5,"_120":-5,"_121":-5,"_122":31,"_123":124,"_125":31,"_126":-5,"_127":-5,"_128":129},"routes/_app.x.$handle.$name.branch.$branch.version.$version.diff",{"_11":12,"_13":14,"_15":16,"_17":18,"_19":-5},"project",{"_49":50,"_38":51,"_44":52,"_53":-5,"_54":31,"_55":56,"_57":56,"_58":59,"_60":-5,"_19":61,"_62":37,"_63":64,"_65":-5,"_66":-5,"_67":68,"_69":70,"_71":-5,"_72":-5,"_73":-5,"_74":-5,"_75":76,"_77":76,"_78":79,"_80":79,"_81":79,"_82":76,"_83":76,"_84":85,"_86":87,"_88":89,"_90":31},"version",7,"changes",[25],"aiChatInfo",{"_20":21,"_22":-5,"_23":-5,"_24":-5},"userId","aiChatMessageId","716d9165-9e41-4dc2-b2fe-5f7c7008bceb","aiChatThreadId","aiChatThreadUserId","aiChatThreadTitle",{"_26":27,"_28":29,"_30":31,"_32":31,"_33":34,"_35":34},"file",{"_36":37,"_38":34,"_39":40,"_41":43,"_44":45,"_46":14,"_47":48,"_30":31},"previous",{"_36":37,"_38":34,"_39":40,"_41":42},"deleted",false,"deletedHere","path","main.ts","latestPath","fileId","07e99a5e-3903-11f1-a227-42b51c65c3df","name","fileType","script","content","","import { Hono } from \"npm:hono@4\";\nimport { serveFile } from \"https://esm.town/v/std/utils/index.ts\";\nimport { parseVal } from \"https://esm.town/v/std/utils/index.ts\";\n\nconst app = new Hono();\n\napp.onError((err) => Promise.reject(err));\n\n// Serve the main HTML page\napp.get(\"/\", (c) => serveFile(\"frontend/index.html\", import.meta.url));\n\n// Serve frontend files (tsx gets transpiled automatically)\napp.get(\"/frontend/*\", (c) => serveFile(c.req.path, import.meta.url));\n\n// Serve shared files\napp.get(\"/shared/*\", (c) => serveFile(c.req.path, import.meta.url));\n\n// View source link\napp.get(\"/source\", (c) => c.redirect(parseVal(import.meta.url).links.self.val));\n\nexport default app.fetch;\n","createdAt",["D",1776282173609],"branchVersion","branchId","07e72bac-3903-11f1-a227-42b51c65c3df","id","07e65f06-3903-11f1-a227-42b51c65c3df","hayvan-yiyecek-eslestirme",["D",1776282060541],"deletedAt","legacyEnvVars","privacy","public","httpPrivacy","description","Okul öncesi çocuklar için hayvan-yiyecek eşleştirme oyunu 🐾🍌","imageUrl","1ae3e1cd-e72b-45d5-8da3-d191bce305cb","pinnedFileId","pinPreview",true,"pinMigrated","screenshotVersion","likeCount",0,"orgId","019d92a8-8d31-7628-a08a-6d591a17f5b0","tursoName","tursoHostname","tursoMeasuredAt","pinned","userPerm","r","valPerm","blobPerm","rw","emailPerm","sqlitePerm","projectPerm","telemetryPerm","user",{"_102":101,"_108":42},"org",{"_102":101,"_103":-5,"_104":42,"_19":61,"_105":106,"_107":31},"branch",{"_13":91,"_38":92,"_49":48,"_93":50,"_94":-5,"_95":-5,"_96":-5,"_97":-5,"_98":-5,"_99":51,"_100":101},"isOwned",13,"main","projectId","forkedBranchId","forkedBranchVersion","forkedProjectPrivacy","forkedProjectId","forkedProjectOrgId","projectName","userHandle","kayaaleyna","handle","displayName","avatar","tier","free","canRestrictVals","profileImageUrl","branchName","adoptOrgId",{"_49":50,"_38":51,"_44":211,"_53":-5,"_54":31,"_55":56,"_57":56,"_58":59,"_60":-5,"_19":61,"_62":37,"_63":64,"_65":-5,"_66":-5,"_67":68,"_69":70,"_71":-5,"_72":-5,"_73":-5,"_74":-5,"_75":76,"_77":76,"_78":79,"_80":79,"_81":79,"_82":76,"_83":76,"_84":212,"_86":213,"_88":214,"_90":31},"tree",[163,167,169],"files",[163,164,165,166,167,168,169],"counts",{"_153":68,"_154":137,"_155":68,"_156":157,"_158":159},"contents",[130,131,132],"upstreamProject","upstreamBranch","emptyEnvVars","flags",[],"hasHttpFiles","grants","orgs","customDomains",{},{"_49":147,"_38":148,"_36":149,"_134":-5,"_47":48,"_46":150,"_135":64,"_44":151,"_13":68,"_39":145,"_41":-5,"_30":31,"_138":-5,"_33":152},{"_49":140,"_38":141,"_36":142,"_134":-5,"_47":48,"_46":143,"_135":64,"_44":144,"_13":68,"_39":145,"_41":-5,"_30":31,"_138":-5,"_33":146},{"_49":133,"_38":34,"_36":37,"_134":-5,"_47":48,"_46":14,"_135":31,"_44":136,"_13":137,"_39":40,"_41":43,"_30":31,"_138":-5,"_33":139},"4b4d33fa-3903-11f1-9a35-42b51c65c3df","parentId","latest",["D",1776282173609],1,"label",[34],"260ac76a-3903-11f1-b178-42b51c65c3df","shared","a429fe0c-6655-4db7-a313-b38d677ef70e",3,["D",1776282111098],"directory",[141],"1ef021dc-3903-11f1-b873-42b51c65c3df","frontend","1ef022b8-3903-11f1-b873-42b51c65c3df",2,["D",1776282099171],[148],"pulls","branches","forks","envVars",{"_160":68,"_162":68},"connections",{"_160":68,"_161":68},"count","unfilledCount","emptyCount",{"_49":147,"_38":148,"_36":149,"_134":-5,"_47":48,"_46":150,"_135":64,"_44":208,"_13":68,"_39":145,"_41":-5,"_30":31,"_138":-5,"_171":209,"_33":210},{"_49":200,"_38":201,"_36":202,"_134":149,"_47":48,"_46":203,"_135":31,"_44":204,"_13":68,"_39":40,"_41":205,"_30":31,"_138":-5,"_171":206,"_33":207},{"_49":192,"_38":193,"_36":194,"_134":149,"_47":48,"_46":195,"_135":31,"_44":196,"_13":68,"_39":26,"_41":197,"_30":31,"_138":-5,"_171":198,"_33":199},{"_49":184,"_38":185,"_36":186,"_134":149,"_47":48,"_46":187,"_135":64,"_44":188,"_13":68,"_39":40,"_41":189,"_30":31,"_138":-5,"_171":190,"_33":191},{"_49":140,"_38":141,"_36":142,"_134":-5,"_47":48,"_46":143,"_135":64,"_44":181,"_13":68,"_39":145,"_41":-5,"_30":31,"_138":-5,"_171":182,"_33":183},{"_49":174,"_38":175,"_36":176,"_134":142,"_47":48,"_46":143,"_135":31,"_44":177,"_13":68,"_39":40,"_41":178,"_30":31,"_138":-5,"_171":179,"_33":180},{"_49":133,"_38":34,"_36":37,"_134":-5,"_47":48,"_46":14,"_135":31,"_44":170,"_13":137,"_39":40,"_41":43,"_30":31,"_138":-5,"_171":172,"_33":173},["D",1776282173609],"children",[],[34],"260a9880-3903-11f1-b178-42b51c65c3df","cards.ts","260a9a10-3903-11f1-b178-42b51c65c3df",["D",1776282111098],"export interface CardPair {\n id: number;\n month: string;\n icon: string; // emoji/symbol\n iconLabel: string; // Turkish name\n color: string; // theme color\n}\n\nexport const CARD_PAIRS: CardPair[] = [\n { id: 1, month: \"Ocak\", icon: \"⛄\", iconLabel: \"Kardan Adam\", color: \"#5BC0EB\" },\n { id: 2, month: \"Şubat\", icon: \"❤️\", iconLabel: \"Kalp\", color: \"#E84855\" },\n { id: 3, month: \"Mart\", icon: \"🌧️\", iconLabel: \"Yağmur Bulutu\", color: \"#7B8CDE\" },\n { id: 4, month: \"Nisan\", icon: \"🌸\", iconLabel: \"Çiçekler\", color: \"#FF6F91\" },\n { id: 5, month: \"Mayıs\", icon: \"🐞\", iconLabel: \"Uğur Böceği\", color: \"#F25C54\" },\n { id: 6, month: \"Haziran\", icon: \"🎓\", iconLabel: \"Mezuniyet Kepi\", color: \"#2D3047\" },\n { id: 7, month: \"Temmuz\", icon: \"🏖️\", iconLabel: \"Deniz / Güneş\", color: \"#FFC43D\" },\n { id: 8, month: \"Ağustos\", icon: \"🍉\", iconLabel: \"Karpuz Dilimi\", color: \"#4CAF50\" },\n { id: 9, month: \"Eylül\", icon: \"🎒\", iconLabel: \"Okul Çantası\", color: \"#FF8C42\" },\n { id: 10, month: \"Ekim\", icon: \"🍂\", iconLabel: \"Kurumuş Yapraklar\", color: \"#C45B28\" },\n { id: 11, month: \"Kasım\", icon: \"☂️\", iconLabel: \"Şemsiye\", color: \"#6A4C93\" },\n { id: 12, month: \"Aralık\", icon: \"🎄\", iconLabel: \"Yılbaşı Ağacı\", color: \"#1B998B\" },\n];\n",[],[141,175],["D",1776282111098],[168],[141],"2ba6151c-3903-11f1-a9f0-42b51c65c3df","index.tsx","2ba615e4-3903-11f1-a9f0-42b51c65c3df",5,["D",1776282120485],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React from \"https://esm.sh/react@18.2.0\";\nimport { createRoot } from \"https://esm.sh/react-dom@18.2.0/client\";\nimport { App } from \"./App.tsx\";\n\nconst root = createRoot(document.getElementById(\"root\")!);\nroot.render();\n",[],[148,185],"280f1994-3903-11f1-bbae-42b51c65c3df","index.html","280f1a48-3903-11f1-bbae-42b51c65c3df",4,["D",1776282114488],"\n\n\n \n \n Aylar Eşleştirme Oyunu 🎴\n \n \n \n \n \n\n\n

\n \n\n\n",[],[148,193],"46c4733e-3903-11f1-9a35-42b51c65c3df","App.tsx","46c47410-3903-11f1-9a35-42b51c65c3df",6,["D",1776282166004],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React, { useState, useCallback, useEffect, useRef } from \"https://esm.sh/react@18.2.0\";\nimport { CARD_PAIRS } from \"../shared/cards.ts\";\nimport type { CardPair } from \"../shared/cards.ts\";\n\n// Card types: \"month\" shows month name, \"icon\" shows emoji\ninterface GameCard {\n uid: string;\n pairId: number;\n type: \"month\" | \"icon\";\n pair: CardPair;\n}\n\nfunction shuffle(arr: T[]): T[] {\n const a = [...arr];\n for (let i = a.length - 1; i > 0; i--) {\n const j = Math.floor(Math.random() * (i + 1));\n [a[i], a[j]] = [a[j], a[i]];\n }\n return a;\n}\n\nfunction buildDeck(): { leftCards: GameCard[]; rightCards: GameCard[] } {\n const monthCards: GameCard[] = CARD_PAIRS.map((p) => ({\n uid: `month-${p.id}`,\n pairId: p.id,\n type: \"month\" as const,\n pair: p,\n }));\n const iconCards: GameCard[] = CARD_PAIRS.map((p) => ({\n uid: `icon-${p.id}`,\n pairId: p.id,\n type: \"icon\" as const,\n pair: p,\n }));\n return { leftCards: shuffle(monthCards), rightCards: shuffle(iconCards) };\n}\n\n// Puzzle tab SVG shape for connecting cards\nfunction PuzzleCard({\n card,\n side,\n isSelected,\n isMatched,\n isWrong,\n onClick,\n}: {\n card: GameCard;\n side: \"left\" | \"right\";\n isSelected: boolean;\n isMatched: boolean;\n isWrong: boolean;\n onClick: () => void;\n}) {\n const color = card.pair.color;\n\n let borderColor = \"#d1d5db\";\n let bg = \"white\";\n let shadow = \"0 2px 8px rgba(0,0,0,0.08)\";\n\n if (isMatched) {\n borderColor = color;\n bg = `${color}18`;\n shadow = `0 0 16px ${color}44`;\n } else if (isWrong) {\n borderColor = \"#ef4444\";\n bg = \"#fef2f2\";\n shadow = \"0 0 12px #ef444444\";\n } else if (isSelected) {\n borderColor = color;\n bg = `${color}10`;\n shadow = `0 0 12px ${color}33`;\n }\n\n const puzzleNotch = side === \"left\"\n ? (\n \n )\n : (\n \n );\n\n return (\n \n {puzzleNotch}\n {card.type === \"month\"\n ? (\n \n {card.pair.month}\n \n )\n : (\n

\n {card.pair.icon}\n \n {card.pair.iconLabel}\n \n

\n )}\n {isMatched && (\n

✓

\n )}\n \n );\n}\n\nfunction Confetti() {\n const colors = [\"#FFC43D\", \"#E84855\", \"#5BC0EB\", \"#4CAF50\", \"#FF6F91\", \"#6A4C93\", \"#1B998B\", \"#FF8C42\"];\n const pieces = Array.from({ length: 60 }, (_, i) => ({\n id: i,\n left: Math.random() * 100,\n delay: Math.random() * 2,\n color: colors[i % colors.length],\n size: 6 + Math.random() * 8,\n duration: 2 + Math.random() * 2,\n }));\n\n return (\n

\n {pieces.map((p) => (\n 0.5 ? \"50%\" : \"2px\",\n background: p.color,\n animation: `confettiFall ${p.duration}s ease-in ${p.delay}s forwards`,\n }}\n />\n ))}\n \n

\n );\n}\n\nexport function App() {\n const [deck, setDeck] = useState(buildDeck);\n const [selectedLeft, setSelectedLeft] = useState(null);\n const [selectedRight, setSelectedRight] = useState(null);\n const [matched, setMatched] = useState>(new Set());\n const [wrongPair, setWrongPair] = useState<[string, string] | null>(null);\n const [score, setScore] = useState(0);\n const [attempts, setAttempts] = useState(0);\n const [showConfetti, setShowConfetti] = useState(false);\n const timerRef = useRef(null);\n\n const isComplete = matched.size === CARD_PAIRS.length;\n\n // Check match when both sides selected\n useEffect(() => {\n if (!selectedLeft || !selectedRight) return;\n\n const leftCard = [...deck.leftCards].find((c) => c.uid === selectedLeft);\n const rightCard = [...deck.rightCards].find((c) => c.uid === selectedRight);\n if (!leftCard || !rightCard) return;\n\n setAttempts((a) => a + 1);\n\n if (leftCard.pairId === rightCard.pairId) {\n // Match!\n setMatched((prev) => new Set([...prev, leftCard.pairId]));\n setScore((s) => s + 10);\n // Play a little \"ding\" via audio context\n try {\n const ctx = new AudioContext();\n const osc = ctx.createOscillator();\n const gain = ctx.createGain();\n osc.connect(gain);\n gain.connect(ctx.destination);\n osc.frequency.value = 523;\n gain.gain.value = 0.15;\n osc.start();\n osc.stop(ctx.currentTime + 0.15);\n } catch {}\n\n timerRef.current = window.setTimeout(() => {\n setSelectedLeft(null);\n setSelectedRight(null);\n }, 600);\n } else {\n // Wrong\n setWrongPair([selectedLeft, selectedRight]);\n try {\n const ctx = new AudioContext();\n const osc = ctx.createOscillator();\n const gain = ctx.createGain();\n osc.connect(gain);\n gain.connect(ctx.destination);\n osc.frequency.value = 200;\n osc.type = \"square\";\n gain.gain.value = 0.08;\n osc.start();\n osc.stop(ctx.currentTime + 0.2);\n } catch {}\n\n timerRef.current = window.setTimeout(() => {\n setSelectedLeft(null);\n setSelectedRight(null);\n setWrongPair(null);\n }, 900);\n }\n }, [selectedLeft, selectedRight]);\n\n // Show confetti on complete\n useEffect(() => {\n if (isComplete) {\n setShowConfetti(true);\n const t = setTimeout(() => setShowConfetti(false), 5000);\n return () => clearTimeout(t);\n }\n }, [isComplete]);\n\n const handleLeftClick = useCallback(\n (uid: string) => {\n if (wrongPair) return;\n if (selectedLeft && selectedRight) return;\n setSelectedLeft((prev) => (prev === uid ? null : uid));\n },\n [wrongPair, selectedLeft, selectedRight],\n );\n\n const handleRightClick = useCallback(\n (uid: string) => {\n if (wrongPair) return;\n if (selectedLeft && selectedRight) return;\n setSelectedRight((prev) => (prev === uid ? null : uid));\n },\n [wrongPair, selectedLeft, selectedRight],\n );\n\n const resetGame = () => {\n if (timerRef.current) clearTimeout(timerRef.current);\n setDeck(buildDeck());\n setSelectedLeft(null);\n setSelectedRight(null);\n setMatched(new Set());\n setWrongPair(null);\n setScore(0);\n setAttempts(0);\n setShowConfetti(false);\n };\n\n return (\n

\n {showConfetti && }\n\n {/* Header */}\n

\n 🗓️ Aylar Eşleştirme Oyunu\n

\n Her ayı doğru sembolüyle eşleştir!\n

\n\n {/* Score */}\n

\n ⭐ Puan: {score}\n

\n 🎯 Deneme: {attempts}\n

\n ✅ {matched.size} / {CARD_PAIRS.length}\n

\n\n {/* Game Board */}\n

\n {/* Left column: months */}\n

📅 AYLAR

\n {deck.leftCards.map((card) => (\n handleLeftClick(card.uid)}\n />\n ))}\n

\n\n {/* Right column: icons */}\n

🎨 SEMBOLLER

\n {deck.rightCards.map((card) => (\n handleRightClick(card.uid)}\n />\n ))}\n

\n\n {/* Win message */}\n {isComplete && (\n

🎉🏆🎉

Tebrikler!

\n Tüm ayları doğru eşleştirdin!\n

\n {attempts} denemede {score} puan kazandın!\n

\n )}\n\n {/* Reset button */}\n \n 🔄 Yeniden Oyna\n \n\n {/* Footer */}\n

\n kaynak kodu\n {\" \"}•{\" \"}Okul öncesi eğitim için hazırlanmıştır 🧸\n

\n );\n}\n",[],[148,201],["D",1776282099171],[164,165,166],[148],["D",1776282060541],{"_102":101,"_108":42},{"_102":101,"_103":-5,"_104":42,"_19":61,"_105":106,"_107":31},{"_13":91,"_38":92,"_49":48,"_93":50,"_94":-5,"_95":-5,"_96":-5,"_97":-5,"_98":-5,"_99":51,"_100":101},"ctx",{"_84":-5,"_127":248,"_249":250,"_251":252,"_253":31,"_254":31,"_255":31,"_256":64,"_257":-5,"_258":-7,"_259":-7,"_260":68,"_261":31,"_262":31,"_263":-5,"_264":31,"_265":31,"_266":31,"_267":-5},"ENV",{"_219":220,"_221":222,"_223":92,"_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","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"]

Diff · v7