</head> <body> <div id="game-container"> <!-- Settings Gear --> <div id="settings-trigger" class="interactive"> <svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M12.22 2h-.44a2 2 0 0 0-2 2v.18a2 2 0 0 1-1 1.73l-.43.58a2 2 0 0 1-2 0l-.15-.08a2 2 0 0 0-2.73.73l-.22.38a2 2 0 0 0 .73 2.73l.15.1a2 2 0 0 1 1 1.72v.51a2 2 0 0 1-1 1.74l-.15.09a2 2 0 0 0-.73 2.73l.22.38a2 2 0 0 0 2.73.73l.15-.08a2 2 0 0 1 2 0l.43.58a2 2 0 0 1 1 1.72V20a2 2 0 0 0 2 2h.44a2 2 0 0 0 2-2v-.18a2 2 0 0 1 1-1.73l.43-.58a2 2 0 0 1 2 0l.15.08a2 2 0 0 0 2.73-.73l.22-.39a2 2 0 0 0-.73-2.73l-.15-.08a2 2 0 0 1-1-1.74v-.5a2 2 0 0 1 1-1.74l.15-.1a2 2 0 0 0 .73-2.73l-.22-.38a2 2 0 0 0-2.73-.73l-.15.08a2 2 0 0 1-2 0l-.43-.58a2 2 0 0 1-1-1.73V4a2 2 0 0 0-2-2z"/><circle cx="12" cy="12" r="3"/></svg> </div> <div id="settings-overlay" class="interactive"> <div class="menu-card"> <h2 class="text-xl font-black mb-6 text-slate-800">Settings</h2> <div class="volume-container"> <label class="volume-label">Voice Volume</label> <input type="range" id="tts-volume" min="0" max="1" step="0.01" value="1.0"> </div> <div class="volume-container"> <label class="volume-label">Sound Effects</label> <input type="range" id="sfx-volume" min="0" max="1" step="0.01" value="0.4"> </div> <div class="volume-container"> <label class="volume-label">Music Volume</label> <input type="range" id="music-volume" min="0" max="1" step="0.01" value="0.3"> </div> <hr class="my-4"> <button id="debug-toggle" class="menu-btn btn-debug">Debug Mode: OFF</button> <button id="resume-button" class="menu-btn btn-resume">Resume Game</button> </div> </div> <div id="title-screen"> <div id="language-controls" class="interactive"> <select id="lang-select" class="custom-select"> <option value="en">English</option> <option value="fr">French</option> <option value="de">German</option> <option value="ja">Japanese</option> <option value="zh-hans">Mandarin (Hanzi)</option> <option value="zh-pinyin">Mandarin (Pinyin)</option> <option value="it">Italian</option> <option value="es">Spanish</option> <option value="ar">Standard Arabic</option> <option value="aii">Assyrian</option> <option value="mk">Macedonian</option> <option value="hr">Croatian</option> <option value="pt">Portuguese</option> <option value="vi">Vietnamese</option> <option value="hi">Hindi</option> <option value="he">Hebrew</option> <option value="tr">Turkish</option> <option value="sa">Sanskrit</option> </select> <button id="start-button" class="start-btn">Start</button> </div> </div> <canvas id="gameCanvas"></canvas> <div class="ui-overlay flex flex-col justify-between"> <div class="flex justify-between items-start"> <div id="score-card" class="interactive"> <div id="score-label" class="text-[10px] uppercase tracking-[0.2em] text-slate-500 font-black opacity-80 mb-1">Points</div> <div id="score" class="text-3xl font-black text-slate-800 leading-none">00</div> </div> <div id="quest-box" class="bg-white/95 p-6 rounded-3xl shadow-2xl max-w-xl w-full interactive border-b-8 border-yellow-500 flex flex-col items-center gap-1 transition-all"> <h3 id="quest-header" class="text-slate-500 text-xs font-black uppercase tracking-[0.2em] opacity-80">Where is my potato?</h3> <div class="flex items-center gap-4"> <div id="instruction-text" class="text-3xl md:text-4xl font-black text-slate-800 leading-tight">...</div> <button id="tts-button" class="tts-button interactive" title="Listen"> <svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><path d="M11 5L6 9H2v6h4l5 4V5z"></path><path d="M15.54 8.46a5 5 0 0 1 0 7.07"></path><path d="M19.07 4.93a10 10 0 0 1 0 14.14"></path></svg> </button> </div> </div> <div class="flex flex-col gap-2 items-end"> <div id="coord-display" class="bg-black/80 text-white px-4 py-2 rounded-xl border border-yellow-500/50 font-mono text-sm shadow-lg whitespace-nowrap"> World X: 0, World Y: 0 </div> </div> </div> <div class="controls"> <div class="flex gap-4"> <div class="btn-circle" id="btn-left">←</div> <div class="btn-circle" id="btn-right">→</div> </div> <div class="flex flex-col gap-2"> <div class="btn-circle" id="btn-jump">UP</div> <div class="btn-circle" id="btn-down">DOWN</div> </div> </div> </div> <div id="feedback-overlay" class="fixed inset-0 bg-slate-900/90 hidden items-center justify-center p-6 z-50 interactive backdrop-blur-md"> <div class="bg-white p-8 rounded-[2.5rem] max-w-sm w-full text-center shadow-2xl border-t-8 border-red-500"> <div class="text-6xl mb-4">🥔💨</div> <h2 id="feedback-header" class="text-2xl font-black text-slate-800 mb-2">That's not my potato!</h2> <p id="feedback-text" class="text-slate-600 mb-6 text-xl font-bold leading-relaxed"></p> <button id="close-feedback-btn" class="w-full bg-slate-800 text-white font-black py-4 rounded-2xl hover:bg-black transition-all shadow-xl">Keep Searching</button> </div> </div> </div> <script> const apiKey = ""; const canvas = document.getElementById('gameCanvas'); const ctx = canvas.getContext('2d'); const SPRITE_URLS = { idle1: 'https://raw.githubusercontent.com/monsieurparkes/parkour-game/3b9ce46b21964d9b6d3196dc96f4ca33ad63c9aa/PARKOURIDLE1.png', idle2: 'https://raw.githubusercontent.com/monsieurparkes/parkour-game/3b9ce46b21964d9b6d3196dc96f4ca33ad63c9aa/PARKOURIDLE2.png', walk1: 'https://raw.githubusercontent.com/monsieurparkes/parkour-game/3b9ce46b21964d9b6d3196dc96f4ca33ad63c9aa/PARKOURWALK1.png', walk2: 'https://raw.githubusercontent.com/monsieurparkes/parkour-game/3b9ce46b21964d9b6d3196dc96f4ca33ad63c9aa/PARKOURWALK2.png', jump: 'https://raw.githubusercontent.com/monsieurparkes/parkour-game/3b9ce46b21964d9b6d3196dc96f4ca33ad63c9aa/PARKOURJUMP.png', cherback: 'https://raw.githubusercontent.com/monsieurparkes/parkour-game/3138d2a4b35eb2a6aba1eac3bac1befe869410d2/cherback.png', cherfront: 'https://raw.githubusercontent.com/monsieurparkes/parkour-game/3138d2a4b35eb2a6aba1eac3bac1befe869410d2/cherfront.png', grass: 'https://raw.githubusercontent.com/monsieurparkes/parkour-game/5b41eedddcee96026248de437d92c7b45f4f2177/REPEATABLE_GRASS1.png', house1: 'https://raw.githubusercontent.com/monsieurparkes/parkour-game/b2af3b7ccf136cc476fb84820ecfb57695f6374a/HOUSE1.png', house2: 'https://raw.githubusercontent.com/monsieurparkes/parkour-game/61b4f99f4daf0c5030ceaf8b30c0beb754e81813/HOUSE2.png', house3: 'https://raw.githubusercontent.com/monsieurparkes/parkour-game/21ba091a3b3840b508821a49fbe082a6c42a7646/HOUSE3.png', forest1: 'https://raw.githubusercontent.com/monsieurparkes/parkour-game/21ba091a3b3840b508821a49fbe082a6c42a7646/FOREST1.png', crawl1: 'https://raw.githubusercontent.com/monsieurparkes/parkour-game/169487128c03e2ca8502fa7b923f8206353daae5/PARKOURCRAWL1.png', crawl2: 'https://raw.githubusercontent.com/monsieurparkes/parkour-game/169487128c03e2ca8502fa7b923f8206353daae5/PARKOURCRAWL2.png', background: 'https://raw.githubusercontent.com/monsieurparkes/parkour-game/9ac0af46133b9302702816b569465e2295e2af23/BACKGROUNDAUS3.png' }; const AUDIO_URLS = { reward: 'https://raw.githubusercontent.com/monsieurparkes/parkour-game/4cfe1f7b46e0dc3991ff4e89561bfb1a9454ffbd/audio_ouiouiohyeah.wav', music: 'https://raw.githubusercontent.com/monsieurparkes/parkour-game/fc319dff2fc92e7abbda0afe006d1273211fdbfa/AUDIOBACKINGMAIN.mp3' }; const TRANSLATIONS = { en: { header: "Where is my potato?", score: "Points", mistake: "That's not my potato!", correct_msg: "That's the potato ", world_x: "World X", world_y: "World Y", keep_searching: "Keep Searching", locs: { shower: "in the shower", toilet: "on the toilet", bed: "on the bed", wardrobe: "on the wardrobe", lamp: "on the lamp", toybox: "on the toybox", "red-roof": "on the red roof", "black-roof": "on the black roof", television: "on the television", lounge: "on the lounge", fridge: "on the fridge", bin: "above the bin", "coffee-table": "above the coffee table", sink: "above the kitchen sink", computer: "on the computer", bookcase: "on the bookcase", "washing-machine": "on the washing machine", "washing-basket": "above the washing basket", "ironing-board": "on the ironing board", "blue-roof": "on the blue roof" }, voice: "Kore" }, fr: { header: "Où est ma pomme de terre ?", score: "Points", mistake: "Ce n'est pas ma pomme de terre !", correct_msg: "C'est la pomme de terre ", world_x: "Monde X", world_y: "Monde Y", keep_searching: "Continue à chercher", locs: { shower: "dans la douche", toilet: "sur la toilette", bed: "sur le lit", wardrobe: "sur l'armoire", lamp: "sur la lampe", toybox: "sur le coffre à jouets", "red-roof": "sur le toit rouge", "black-roof": "sur le toit noir", television: "sur la télévision", lounge: "sur le canapé", fridge: "sur le frigo", bin: "au-dessus de la poubelle", "coffee-table": "au-dessus de la table basse", sink: "au-dessus de l'évier", computer: "sur l'ordinateur", bookcase: "sur la bibliothèque", "washing-machine": "sur la machine à laver", "washing-basket": "au-dessus du panier à linge", "ironing-board": "sur la planche à repasser", "blue-roof": "sur le toit bleu" }, voice: "Leda" }, tr: { header: "Patatesim nerede?", score: "Puan", mistake: "Bu benim patatesim değil!", correct_msg: "Bu patates ", world_x: "X", world_y: "Y", keep_searching: "Aramaya devam et", locs: { shower: "duşun içinde", toilet: "tuvaletin üzerinde", bed: "yatağın üzerinde", wardrobe: "gardırobun üzerinde", lamp: "lambanın üzerinde", toybox: "oyuncak kutusunun içinde", "red-roof": "kırmızı çatının üzerinde", "black-roof": "siyah çatının üzerinde", television: "televizyonun üzerinde", lounge: "koltuğun üzerinde", fridge: "buzdolabının üzerinde", bin: "çöp kutusunun yukarısında", "coffee-table": "sehpanın yukarısında", sink: "lavabonun yukarısında", computer: "bilgisayarın üzerinde", bookcase: "kitaplığın üzerinde", "washing-machine": "çamaşır makinesinin üzerinde", "washing-basket": "çamaşır sepetinin yukarısında", "ironing-board": "ütü masasının üzerinde", "blue-roof": "mavi çatının üzerinde" }, voice: "Leda" }, sa: { header: "मम आलुकं कुत्र अस्ति?", score: "अङ्काः", mistake: "एतत् मम आलुकं नास्ति!", correct_msg: "अहम् आलुकम् ", world_x: "X", world_y: "Y", keep_searching: "अन्वेषणं कुरु", locs: { shower: "स्नानगृहे", toilet: "शौचालयपीठोपरि", bed: "शय्यायाम्", wardrobe: "कपाटोपरि", lamp: "दीपोपरि", toybox: "क्रीडनकपेटीमध्ये", "red-roof": "रक्तच्छदोपरि", "black-roof": "कृष्णच्छदोपरि", television: "दूरदर्शनयन्त्रोपरि", lounge: "पर्यङ्कोपरि", fridge: "प्रशीतकयन्त्रोपरि", bin: "अवकरिकायाः उपरि", computer: "सङ्गणके", bookcase: "पुस्तकाधानोपरि", "washing-machine": "क्षालनयन्त्रोपरि", "washing-basket": "वस्त्रकण्डोले", "ironing-board": "इस्त्री-पीठोपरि", "blue-roof": "नीलच्छदोपरि" }, voice: "Algieba" }, de: { header: "Wo ist meine Kartoffel?", score: "Punkte", mistake: "Das ist nicht meine Kartoffel!", correct_msg: "Das ist die Kartoffel ", world_x: "Welt X", world_y: "Welt Y", keep_searching: "Weiter suchen", locs: { shower: "in der Dusche", toilet: "auf der Toilette", bed: "auf dem Bett", wardrobe: "auf dem Kleiderschrank", lamp: "auf der Lampe", toybox: "in der Spielzeugkiste", "red-roof": "auf dem roten Dach", "black-roof": "auf dem schwarzen Dach", television: "auf dem Fernseher", lounge: "auf dem Sofa", fridge: "auf dem Kühlschrank", bin: "über dem Mülleimer", "coffee-table": "über dem Couchtisch", sink: "über dem Spülbecken", computer: "auf dem Computer", bookcase: "auf dem Bücherregal", "washing-machine": "auf der Waschmaschine", "washing-basket": "über dem Wäschekorb", "ironing-board": "auf dem Bügelbrett", "blue-roof": "auf dem blauen Dach" }, voice: "Fenrir" }, ja: { header: "じゃがいमोはどこ？", score: "ポイント", mistake: "それは私のじゃがいもじゃないよ！", correct_msg: "それはじゃがいもだよ ", world_x: "世界 X", world_y: "世界 Y", keep_searching: "探し続ける", locs: { shower: "シャワーの中", toilet: "トイレの上", bed: "ベッドの上", wardrobe: "たんすの上", lamp: "ランプの上", toybox: "おもちゃ箱の中", "red-roof": "赤い屋根の上", "black-roof": "黒い屋根の上", television: "テレビの上", lounge: "ソファーの上", fridge: "冷蔵庫の上", bin: "ゴミ箱の上", "coffee-table": "コーヒーテーブルの上", sink: "流し台の上", computer: "コンピュータの上", bookcase: "本棚の上", "washing-machine": "洗濯機の上", "washing-basket": "洗濯かごの上", "ironing-board": "アイロン台の上", "blue-roof": "青い屋根の上" }, voice: "Aoede" }, "zh-hans": { header: "我的土豆在哪里？", score: "分数", mistake: "那不是我的土豆！", correct_msg: "那是土豆 ", world_x: "世界 X", world_y: "世界 Y", keep_searching: "继续寻找", locs: { shower: "在淋浴间里", toilet: "在马桶上", bed: "在床上", wardrobe: "在衣柜上", lamp: "在灯上", toybox: "在玩具箱里", "red-roof": "在红屋顶上", "black-roof": "在黑屋顶上", television: "在电视上", lounge: "在沙发上", fridge: "在冰箱上", bin: "在垃圾桶上方", "coffee-table": "在咖啡桌上方", sink: "在厨房水槽上方", computer: "在电脑上", bookcase: "在书架上", "washing-machine": "在洗衣机上", "washing-basket": "在洗衣篮上方", "ironing-board": "在熨衣板上", "blue-roof": "在蓝屋顶上" }, voice: "Callirrhoe" }, "zh-pinyin": { header: "Wǒ de tǔdòu zài nǎlǐ?", score: "Fēnshù", mistake: "Nà bùshì wǒ de tǔdòu!", correct_msg: "Nà shì tǔdòu ", world_x: "X", world_y: "Y", keep_searching: "Jìxù xúnzhǎo", locs: { shower: "zài línyùjiān lǐ", toilet: "zài mǎtǒng shàng", bed: "zài chuáng shàng", wardrobe: "zài yīguì shàng", lamp: "zài dēng shàng", toybox: "zài wánjùxiāng lǐ", "red-roof": "zài hóng wūdǐng shàng", "black-roof": "zài hóng wūdǐng shàng", television: "zài diànshì shàng", lounge: "zài shāfā shàng", fridge: "zài bīngxiāng shàng", bin: "zài lājītǒng shàngfāng", "coffee-table": "zài kāfēizhuō shàngfāng", sink: "zài chúfáng shuǐcáo shàngfāng", computer: "zài diànnǎo shàng", bookcase: "zài shūjià shàng", "washing-machine": "zài xǐyījī shàng", "washing-basket": "zài xǐyīlán shàngfāng", "ironing-board": "zài yùnyībǎn shàng", "blue-roof": "zài lán wūdǐng shàng" }, ttsLocs: { shower: "在淋浴间里", toilet: "在马桶上", bed: "在床上", wardrobe: "在衣柜上", lamp: "在灯上", toybox: "在玩具箱里", "red-roof": "在红屋顶上", "black-roof": "在黑屋顶上", television: "在电视上", lounge: "在沙发上", fridge: "在冰箱上", bin: "在垃圾桶上方", "coffee-table": "在咖啡桌上方", sink: "在厨房水槽上方", computer: "在电脑上", bookcase: "在书架上", "washing-machine": "在洗衣机上", "washing-basket": "在洗衣篮上方", "ironing-board": "在熨衣板上", "blue-roof": "在蓝屋顶上" }, voice: "Callirrhoe" }, it: { header: "Dov'è la mia patata?", score: "Punti", mistake: "Questa non è la mia patata!", correct_msg: "È la patata ", world_x: "Mondo X", world_y: "Mondo Y", keep_searching: "Continua a cercare", locs: { shower: "nella doccia", toilet: "sulla toilette", bed: "sul letto", wardrobe: "sull'armadio", lamp: "sulla lampada", toybox: "nella scatola dei giocattoli", "red-roof": "sul tetto rosso", "black-roof": "sul tetto nero", television: "sulla televisione", lounge: "sul divano", fridge: "sul frigorifero", bin: "sopra il cestino", "coffee-table": "sopra il tavolino", sink: "sopra il lavandino", computer: "sul computer", bookcase: "sulla libreria", "washing-machine": "sulla lavatrice", "washing-basket": "sopra il cesto della biancheria", "ironing-board": "sull'asse da stiro", "blue-roof": "sul tetto blu" }, voice: "Autonoe" }, es: { header: "¿Dónde está mi patata?", score: "Puntos", mistake: "¡Esa no es mi patata!", correct_msg: "Es la patata ", world_x: "Mundo X", world_y: "Mundo Y", keep_searching: "Sigue buscando", locs: { shower: "en la ducha", toilet: "en el inodoro", bed: "en la cama", wardrobe: "en el armario", lamp: "en la lámpara", toybox: "en el baúl de juguetes", "red-roof": "en el tejado rojo", "black-roof": "en el tejado negro", television: "en la televisión", lounge: "en el sofá", fridge: "en la nevera", bin: "sobre el cubo de basura", "coffee-table": "sobre la mesa de centro", sink: "sobre el fregadero", computer: "en el ordenador", bookcase: "en la estantería", "washing-machine": "en la lavadora", "washing-basket": "sobre el cesto de la ropa", "ironing-board": "en la tabla de planchar", "blue-roof": "en el tejado azul" }, voice: "Enceladus" }, ar: { header: "أين بطاطسي؟", score: "نقاط", mistake: "ليست هذه بطاطسي!", correct_msg: "هذه هي البطاطس ", world_x: "X العالم", world_y: "Y العالم", keep_searching: "استمر في البحث", locs: { shower: "في الدش", toilet: "على المرحاض", bed: "على السرير", wardrobe: "على خزانة الملابس", lamp: "على المصباح", toybox: "في صندوق الألعاب", "red-roof": "على السطح الأحمر", "black-roof": "على السطح الأسود", television: "على التلفاز", lounge: "على الكنبة", fridge: "على الثلاجة", bin: "فوق سلة المهملات", "coffee-table": "فوق طاولة القهوة", sink: "فوق مغسلة المطبخ", computer: "على الكمبيوتر", bookcase: "على خزانة الكتب", "washing-machine": "على الغسالة", "washing-basket": "فوق سلة الغسيل", "ironing-board": "على طاولة الكي", "blue-roof": "على السطح الأزرق" }, voice: "Iapetus" }, aii: { header: "Ayka ileh patati?", score: "Nukte", mistake: "Aha lela patati!", correct_msg: "Aha ileh patati ", world_x: "X", world_y: "Y", keep_searching: "Psh d makhchi", locs: { shower: "go dusha", toilet: "al kursi d bita", bed: "al shwita", wardrobe: "al kanta d masha", lamp: "al lampa", toybox: "go sandoqa d talyathe", "red-roof": "al gari smoqa", "black-roof": "al gari koma", television: "al television", lounge: "al lounge", fridge: "al fridge", bin: "l’alla d sanduqa d lapa", "coffee-table": "l’alla d mesa d qahwa", sink: "l’alla d sink d matbakha", computer: "al computer", bookcase: "al sandaqa d ktave", "washing-machine": "al washing machine", "washing-basket": "l’alla d sanduqa d qamaya", "ironing-board": "al mesa d gautha", "blue-roof": "al gari zurqa" }, voice: "Kore" }, mk: { header: "Каде е мојот компир?", score: "Поени", mistake: "Тоа не е мојот компир!", correct_msg: "Тоа е компирот ", world_x: "X", world_y: "Y", keep_searching: "Продолжи да бараш", locs: { shower: "во тушот", toilet: "на тоалетот", bed: "на креветот", wardrobe: "на плакарот", lamp: "на ламбата", toybox: "во кутијата за играчки", "red-roof": "на црвениот покрив", "black-roof": "на црниот покрив", television: "на телевизорот", lounge: "на троседот", fridge: "на фрижидерот", bin: "над кантата", "coffee-table": "над клуб масичката", sink: "над мијалникот", computer: "на компјутерот", bookcase: "на полицата за книги", "washing-machine": "на машината за перење", "washing-basket": "над корпата за алишта", "ironing-board": "на даската за पेглање", "blue-roof": "на синиот покрив" }, voice: "Erinome" }, hr: { header: "Gdje je moj krumpir?", score: "Bodovi", mistake: "To nije moj krumpir!", correct_msg: "To je krumpir ", world_x: "Svijet X", world_y: "Svijet Y", keep_searching: "Traži dalje", locs: { shower: "u tušu", toilet: "na zahodu", bed: "na krevetu", wardrobe: "na ormaru", lamp: "na svjetiljci", toybox: "u kutiji za igarakčke", "red-roof": "na crvenom krovu", "black-roof": "na crnom krovu", television: "na televizoru", lounge: "na kauču", fridge: "na hladnjaku", bin: "iznad kante", "coffee-table": "iznad stolića za kavu", sink: "iznad sudopera", computer: "na računalu", bookcase: "na polici za knjige", "washing-machine": "na perilici rublja", "washing-basket": "iznad košare za rublje", "ironing-board": "na dasci za glačanje", "blue-roof": "na plavom krovu" }, voice: "Erinome" }, pt: { header: "Onde está a minha batata?", score: "Pontos", mistake: "Essa não é a minha batata!", correct_msg: "É a batata ", world_x: "Mundo X", world_y: "Mundo Y", keep_searching: "Continua a procurar", locs: { shower: "no chuveiro", toilet: "na sanita", bed: "na cama", wardrobe: "no guarda-roupa", lamp: "no candeeiro", toybox: "na caixa de brinquedos", "red-roof": "no telhado vermelho", "black-roof": "no telhado preto", television: "na televisão", lounge: "no sofá", fridge: "no frigorífico", bin: "acima do lixo", "coffee-table": "acima da mesa de centro", sink: "acima da pia", computer: "no computador", bookcase: "na estante", "washing-machine": "na máquina de lavar", "washing-basket": "acima do cesto de roupa", "ironing-board": "na tábua de passar", "blue-roof": "no telhado azul" }, voice: "Umbriel" }, vi: { header: "Khoai tây của tôi đâu?", score: "Điểm", mistake: "Đó không phải là củ khoai tây của tôi!", correct_msg: "Đó là củ khoai tây ", world_x: "X", world_y: "Y", keep_searching: "Tiếp tục tìm kiếm", locs: { shower: "trong vòi hoa sen", toilet: "trên bồn cầu", bed: "trên giường", wardrobe: "trên tủ quần áo", lamp: "trên đèn", toybox: "trong hộp đồ chơi", "red-roof": "trên mái nhà màu đỏ", "black-roof": "trên mái nhà màu đen", television: "trên tivi", lounge: "trên ghế sofa", fridge: "trên tủ lạnh", bin: "phía trên thùng rác", "coffee-table": "phía trên bàn cà phê", sink: "phía trên bồn rửa bát", computer: "trên máy tính", bookcase: "trên kệ sách", "washing-machine": "trên máy giặt", "washing-basket": "phía trên giỏ đựng quần áo", "ironing-board": "trên bàn là", "blue-roof": "trên mái nhà màu xanh" }, voice: "Callirrhoe" }, hi: { header: "मेरी आलू कहाँ है?", score: "अंक", mistake: "वह मेरी आलू नहीं है!", correct_msg: "वह आलू है ", world_x: "दुनिया X", world_y: "Y", keep_searching: "ढूंढते रहो", locs: { shower: "शावर में", toilet: "शौचालय पर", bed: "बिस्तर पर", wardrobe: "अलमारी पर", lamp: "दीपक पर", toybox: "खिलौनों के डिब्बे में", "red-roof": "लाल छत पर", "black-roof": "काली छत पर", television: "टीवी पर", lounge: "सोफे पर", fridge: "फ्रिज पर", bin: "कूड़ेदान के ऊपर", "coffee-table": "कॉफ़ी टेबल के ऊपर", sink: "सिंक के ऊपर", computer: "कंप्यूटर पर", bookcase: "बुककेस पर", "washing-machine": "वाशिंग मशीन पर", "washing-basket": "कपड़े की टोकरी के ऊपर", "ironing-board": "इस्त्री बोर्ड पर", "blue-roof": "नीली छत पर" }, voice: "Algieba" }, he: { header: "איפה תפוח האדמה שלי?", score: "נקודות", mistake: "זה לא תפוח האדמה שלי!", correct_msg: "זה תפוח האדמה ", world_x: "עולם X", world_y: "עולם Y", keep_searching: "המשך לחפש", locs: { shower: "במקלחת", toilet: "על השירותים", bed: "על המיטה", wardrobe: "על הארון", lamp: "על המנורה", toybox: "בארגז הצעצועים", "red-roof": "על הגג האדום", "black-roof": "על הגג השחור", television: "על הטלוויזיה", lounge: "על הספה", fridge: "על המקרר", bin: "מעל הפח", "coffee-table": "מעל שولחן הקפה", sink: "מעל הכיור", "washing-machine": "על מכונת הכביסה", "washing-basket": "מעל סל הכביסה", "ironing-board": "על קרש הגיהוץ", "blue-roof": "על הגג הכחול" }, voice: "Despina" } }; const TARGET_FPS = 60, TARGET_MS = 1000 / TARGET_FPS; let lastTime = 0, images = {}, audio = {}, gameStarted = false, score = 0, isModalOpen = false, isSettingsOpen = false, debugMode = false; let successAnims = [], potatoes = [], currentTarget = null, currentLang = 'en', sfxVolume = 0.4, musicVolume = 0.3, ttsVolume = 1.0, ttsCache = {}; const gravity = 0.125, friction = 0.8, jumpForce = -5.5, moveSpeed = 3.0; const platforms = [ { x: -5000, y: 815, w: 20000, h: 200, type: 'solid' }, { x: 457, y: 700, w: 375, h: 10, id: 'red-roof-plat', type: 'solid' }, { x: 1067, y: 682, w: 355, h: 18, id: 'black-roof-plat', type: 'solid' }, { x: 1664, y: 695, w: 371, h: 10, id: 'blue-roof-plat', type: 'solid' } ]; const landmarks = [ { id: 'forest1', x: -450, y: 385, w: 900, h: 450 }, { id: 'house2', x: 450, y: 600, w: 200, h: 200 }, { id: 'house', x: 1050, y: 600, w: 200, h: 200 }, { id: 'house3', x: 1650, y: 600, w: 200, h: 200 }, { id: 'tree', x: 2350, y: 650, w: 40, h: 150 }, { id: 'bucket', x: 150, y: 760, w: 40, h: 40 } ]; let player = { x: 920, y: 730, vx: 0, vy: 0, w: 50, h: 70, grounded: false, facingRight: true, animFrame: 0, animTimer: 0, state: 'idle' }; let cameraY = 0, targetScale = 1; const keys = {}; function init() { window.addEventListener('resize', resize); resize(); audio.reward = new Audio(AUDIO_URLS.reward); audio.reward.volume = sfxVolume; audio.music = new Audio(AUDIO_URLS.music); audio.music.volume = musicVolume; audio.music.loop = true; let count = 0, total = Object.keys(SPRITE_URLS).length; Object.entries(SPRITE_URLS).forEach(([k, u]) => { images[k] = new Image(); images[k].onload = () => { if(++count === total) { ['house', 'house2', 'house3', 'forest1'].forEach(id => { let img = images[id === 'house' ? 'house1' : (id === 'house2' ? 'house2' : (id === 'house3' ? 'house3' : 'forest1'))]; const lm = landmarks.find(l => l.id === id); if (img && img.complete && lm) lm.w = lm.h * (img.width / img.height); }); document.getElementById('start-button').onclick = launchGame; }}; images[k].src = u; }); window.addEventListener('keydown', e => keys[e.code] = true); window.addEventListener('keyup', e => keys[e.code] = false); canvas.addEventListener('mousemove', e => { if (!gameStarted || targetScale === 0) return; const rect = canvas.getBoundingClientRect(); const sx = e.clientX - rect.left, sy = e.clientY - rect.top; const camX = -player.x + (canvas.width / 2) / targetScale; const worldX = Math.round((sx / targetScale) - camX), worldY = Math.round((sy / targetScale) - cameraY); document.getElementById('coord-display').innerText = `${worldX}, ${worldY}`; }); document.getElementById('close-feedback-btn').onclick = closeFeedback; document.getElementById('settings-trigger').onclick = () => toggleSettings(true); document.getElementById('resume-button').onclick = () => toggleSettings(false); document.getElementById('debug-toggle').onclick = toggleDebug; document.getElementById('tts-button').onclick = playCachedTTS; document.getElementById('sfx-volume').oninput = (e) => { sfxVolume = e.target.value; audio.reward.volume = sfxVolume; }; document.getElementById('music-volume').oninput = (e) => { musicVolume = e.target.value; if(audio.music) audio.music.volume = musicVolume; }; document.getElementById('tts-volume').oninput = (e) => { ttsVolume = e.target.value; Object.values(ttsCache).forEach(a => a.volume = ttsVolume); }; const setupBtn = (id, k) => { const b = document.getElementById(id); b.addEventListener('touchstart', e => { e.preventDefault(); keys[k] = true; }); b.addEventListener('touchend', e => { e.preventDefault(); keys[k] = false; }); }; setupBtn('btn-left', 'ArrowLeft'); setupBtn('btn-right', 'ArrowRight'); setupBtn('btn-jump', 'ArrowUp'); setupBtn('btn-down', 'ArrowDown'); } function toggleSettings(open) { isSettingsOpen = open; document.getElementById('settings-overlay').style.display = open ? 'flex' : 'none'; } function toggleDebug() { debugMode = !debugMode; const btn = document.getElementById('debug-toggle'); btn.innerText = `Debug Mode: ${debugMode ? 'ON' : 'OFF'}`; btn.className = `menu-btn btn-debug ${debugMode ? 'active' : ''}`; document.getElementById('coord-display').style.display = debugMode ? 'block' : 'none'; } async function launchGame() { currentLang = document.getElementById('lang-select').value; document.getElementById('title-screen').style.display = 'none'; document.getElementById('score-card').style.display = 'flex'; document.getElementById('settings-trigger').style.display = 'block'; initAudioCache(); audio.music.play().catch(e => {}); startGame(); } async function initAudioCache() { const langData = TRANSLATIONS[currentLang], locs = langData.locs, ttsLocs = langData.ttsLocs || locs, voice = langData.voice; // Staggered sequence to avoid quota issues for (const [id, text] of Object.entries(ttsLocs)) { try { const prompt = currentLang === 'en' ? `Speak: ${text}` : (currentLang === 'zh-pinyin' ? `Read this Chinese text: ${text}` : (currentLang === 'sa' ? `Pronounce this Sanskrit text: ${text}` : `Say: ${text}`)); const res = await fetchGeminiTTS(prompt, voice); const part = res?.candidates?.[0]?.content?.parts?.[0]?.inlineData; if (part?.data) { const binary = Uint8Array.from(atob(part.data), c => c.charCodeAt(0)); const rate = parseInt(part.mimeType?.split('rate=')[1]) || 24000; const url = URL.createObjectURL(new Blob([pcmToWav(binary, rate)], { type: 'audio/wav' })); const a = new Audio(url); a.volume = ttsVolume; ttsCache[id] = a; } } catch (e) { console.error("Cache fail", id, e); } await new Promise(r => setTimeout(r, 150)); } } function playCachedTTS() { if (!currentTarget) return; const a = ttsCache[currentTarget.locId]; if (a) { a.currentTime = 0; a.play().catch(e => {}); } else { document.getElementById('tts-button').classList.add('loading'); setTimeout(() => { document.getElementById('tts-button').classList.remove('loading'); playCachedTTS(); }, 800); } } async function fetchGeminiTTS(text, voice) { const payload = { contents: [{ parts: [{ text }] }], generationConfig: { responseModalities: ["AUDIO"], speechConfig: { voiceConfig: { prebuiltVoiceConfig: { voiceName: voice } } } }, model: "gemini-2.5-flash-preview-tts" }; let delay = 1000; for (let i = 0; i < 5; i++) { try { const res = await fetch("https://generativelanguage.googleapis.com/v1beta/models/gemini-2.5-flash-preview-tts:generateContent?key=" + apiKey, { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify(payload) }); if (!res.ok) throw new Error('API Error'); const json = await res.json(); if (!json.candidates?.[0]?.content?.parts?.[0]) throw new Error('Malformed Response'); return json; } catch (e) { if (i === 4) throw e; await new Promise(r => setTimeout(r, delay)); delay *= 2; } } } function pcmToWav(pcm, rate) { const buf = new ArrayBuffer(44 + pcm.length), view = new DataView(buf); const wStr = (o, s) => { for(let i=0; i<s.length; i++) view.setUint8(o+i, s.charCodeAt(i)); }; wStr(0, 'RIFF'); view.setUint32(4, 36 + pcm.length, true); wStr(8, 'WAVE'); wStr(12, 'fmt '); view.setUint32(16, 16, true); view.setUint16(20, 1, true); view.setUint16(22, 1, true); view.setUint32(24, rate, true); view.setUint32(28, rate * 2, true); view.setUint16(32, 2, true); view.setUint16(34, 16, true); wStr(36, 'data'); view.setUint32(40, pcm.length, true); for (let i = 0; i < pcm.length; i++) view.setUint8(44 + i, pcm[i]); return buf; } function spawnPotatoes() { potatoes = []; const data = [ {x: 528, y: 754, id: 'shower'}, {x: 627, y: 769, id: 'toilet'}, {x: 677, y: 780, id: 'bed'}, {x: 761, y: 735, id: 'wardrobe'}, {x: 794, y: 747, id: 'lamp'}, {x: 722, y: 778, id: 'toybox'}, {x: 652, y: 662, id: 'red-roof'}, {x: 1256, y: 672, id: 'black-roof'}, {x: 1368, y: 752, id: 'television'}, {x: 1277, y: 778, id: 'lounge'}, {x: 1221, y: 737, id: 'fridge'}, {x: 1240, y: 777, id: 'bin'}, {x: 1326, y: 773, id: 'coffee-table'}, {x: 1177, y: 743, id: 'sink'}, {x: 1740, y: 754, id: 'computer'}, {x: 1827, y: 736, id: 'bookcase'}, {x: 1870, y: 765, id: 'washing-machine'}, {x: 1901, y: 770, id: 'washing-basket'}, {x: 1947, y: 772, id: 'ironing-board'}, {x: 1854, y: 665, id: 'blue-roof'} ]; data.forEach(d => potatoes.push({ x: d.x - 7.5, y: d.y - 18, w: 15, h: 18, locId: d.id, collected: false, hiddenByMistake: false })); } function newQuest() { potatoes.forEach(p => p.hiddenByMistake = false); const avail = potatoes.filter(p => !p.collected); if(avail.length === 0) { spawnPotatoes(); return newQuest(); } currentTarget = avail[Math.floor(Math.random() * avail.length)]; const lang = TRANSLATIONS[currentLang]; document.getElementById('quest-header').innerText = lang.header; const scoreLabel = document.getElementById('score-card').querySelector('div:first-child'); if(scoreLabel) scoreLabel.innerText = lang.score; document.getElementById('instruction-text').innerText = lang.locs[currentTarget.locId]; document.getElementById('score').innerText = score.toString().padStart(2, '0'); } function triggerCorrection(p) { isModalOpen = true; p.hiddenByMistake = true; score = Math.max(0, score - 1); document.getElementById('score').innerText = score.toString().padStart(2, '0'); const lang = TRANSLATIONS[currentLang]; document.getElementById('feedback-header').innerText = lang.mistake; document.getElementById('feedback-text').innerText = lang.correct_msg + lang.locs[p.locId]; document.getElementById('close-feedback-btn').innerText = lang.keep_searching; document.getElementById('feedback-overlay').classList.remove('hidden'); const c = ttsCache[p.locId]; if (c) { c.currentTime = 0; c.play().catch(e=>{}); } } function closeFeedback() { isModalOpen = false; document.getElementById('feedback-overlay').classList.add('hidden'); } function startGame() { if (gameStarted) return; gameStarted = true; spawnPotatoes(); newQuest(); resize(); requestAnimationFrame(mainLoop); } function resize() { const container = document.getElementById('game-container'); if(!container) return; canvas.width = container.clientWidth; canvas.height = container.clientHeight; targetScale = Math.max(0.1, canvas.height / (70 * 5)); cameraY = (canvas.height * 0.85 / targetScale) - 815; } function mainLoop(now) { if (!lastTime) lastTime = now; const dt = Math.min((now - lastTime) / TARGET_MS, 3.0); lastTime = now; if (!isModalOpen && !isSettingsOpen) update(dt); draw(); requestAnimationFrame(mainLoop); } function update(dt) { if (dt === 0) return; let moving = false, cSpeed = moveSpeed, isCrawl = (keys['ArrowDown'] || keys['KeyS'] || keys['btn-down']) && player.grounded; if (isCrawl) cSpeed *= 0.6; if (keys['ArrowLeft'] || keys['KeyA']) { player.vx = -cSpeed; player.facingRight = false; moving = true; } else if (keys['ArrowRight'] || keys['KeyD']) { player.vx = cSpeed; player.facingRight = true; moving = true; } else { player.vx *= Math.pow(friction, dt); if(Math.abs(player.vx) < 0.1) player.vx = 0; } if (!isCrawl && (keys['ArrowUp'] || keys['Space'] || keys['KeyW'] || keys['btn-jump']) && player.grounded) { player.vy = jumpForce; player.grounded = false; } player.vy += gravity * dt; player.x += player.vx * dt; player.y += player.vy * dt; player.grounded = false; const hbW = (player.state === 'crawl') ? 50 : 25; const hbX = player.x + (50 - hbW) / 2; platforms.forEach(plat => { const hOverlap = hbX < plat.x + plat.w && hbX + hbW > plat.x; if (hOverlap) { if (player.vy >= 0 && player.y + 70 >= plat.y && player.y + 70 <= plat.y + 15 + Math.abs(player.vy * dt)) { player.y = plat.y - 70; player.vy = 0; player.grounded = true; } else if (plat.type === 'solid' && player.vy < 0 && player.y <= plat.y + plat.h && player.y >= plat.y) { player.y = plat.y + plat.h; player.vy = 0; } } }); player.state = isCrawl ? 'crawl' : (!player.grounded ? 'jump' : (Math.abs(player.vx) > 0.5 && moving ? 'walk' : 'idle')); player.animTimer += dt; const thres = player.state === 'crawl' ? 8 : 12; if (player.animTimer > thres) { player.animFrame = (player.animFrame + 1) % 2; player.animTimer = 0; } if (player.state === 'crawl' && !moving) player.animFrame = 0; successAnims.forEach((anim, i) => { if (anim.delay > 0) anim.delay -= dt; else { if (anim.vy === 0) anim.vy = -12; anim.y += anim.vy * dt; anim.vy -= 0.8 * dt; } if (anim.y < player.y - 2000) successAnims.splice(i, 1); }); const feetY = player.y + 70, hOffset = (player.state === 'crawl' ? 70 * 5/9 : 0), headY = player.y + hOffset; for (const pot of potatoes) { if(!pot.collected && !pot.hiddenByMistake && hbX < pot.x + pot.w && hbX + hbW > pot.x && headY < pot.y + pot.h && feetY > pot.y) { if(pot === currentTarget) { audio.reward.currentTime = 0; audio.reward.play().catch(e=>{}); score += 10; pot.collected = true; successAnims.push({ x: pot.x, y: pot.y, vy: 0, delay: 20, w: pot.w, h: pot.h }); newQuest(); document.getElementById('quest-box').classList.add('pop-effect'); setTimeout(() => document.getElementById('quest-box').classList.remove('pop-effect'), 400); break; } else { triggerCorrection(pot); break; } } } const dCamY = (canvas.height * 0.85 / targetScale) - 815, pSY = (player.y + cameraY) * targetScale; cameraY += ((pSY < canvas.height * 0.5 ? (canvas.height * 0.5 / targetScale) - player.y : dCamY) - cameraY) * 0.1 * dt; if(player.y > 2000) { player.x = 920; player.y = 730; player.vy = 0; } } function draw() { if (!gameStarted) return; ctx.clearRect(0, 0, canvas.width, canvas.height); ctx.save(); ctx.scale(targetScale, targetScale); const camX = -player.x + (canvas.width / 2) / targetScale; if (images.background && images.background.complete && images.grass && images.grass.complete) { const gA = images.grass.width / images.grass.height, dW = (140) * gA, bW = (dW * 4) * 0.75, bHeight = bW / (images.background.width / images.background.height); const parallaxX = camX * 0.9; ctx.save(); ctx.translate(parallaxX, cameraY); for (let x = -bW * 8; x < 20000; x += bW) ctx.drawImage(images.background, x, 825 - bHeight, bW, bHeight); ctx.restore(); } ctx.translate(camX, cameraY); if (images.grass && images.grass.complete) { const dH = 140, dW = dH * (images.grass.width / images.grass.height); platforms.forEach(plat => { if (plat.id === 'red-roof-plat' || plat.id === 'black-roof-plat' || plat.id === 'blue-roof-plat') return; for (let x = plat.x; x < plat.x + plat.w; x += dW) ctx.drawImage(images.grass, x, 800, Math.min(dW, plat.x + plat.w - x), dH); }); } landmarks.forEach(lm => { let img = null; if (lm.id === 'house') img = images.house1; else if (lm.id === 'house2') img = images.house2; else if (lm.id === 'house3') img = images.house3; else if (lm.id === 'forest1') img = images.forest1; if (img && img.complete) ctx.drawImage(img, lm.x, lm.y + (lm.id.startsWith('house') ? (lm.h/5) : 0), lm.w, lm.h); }); const time = performance.now() / 400; potatoes.forEach(pot => { if(!pot.collected && !pot.hiddenByMistake && images.cherback && images.cherback.complete) ctx.drawImage(images.cherback, pot.x, pot.y + Math.sin(time + pot.x * 0.05) * 5, pot.w, pot.h); }); successAnims.forEach(anim => { if(images.cherfront && images.cherfront.complete) ctx.drawImage(images.cherfront, anim.x, anim.y, anim.w, anim.h); }); let sprite = player.state === 'crawl' ? (player.animFrame === 0 ? images.crawl1 : images.crawl2) : (player.state === 'jump' ? images.jump : (player.state === 'walk' ? (player.animFrame === 0 ? images.walk1 : images.walk2) : (player.animFrame === 0 ? images.idle1 : images.idle2))); if (sprite && sprite.complete) { let rH = player.state === 'crawl' ? 70 * 4/9 : (player.state === 'jump' ? 70 * 0.8 : 70), rW = rH * (sprite.width / sprite.height), oX = (50 - rW) / 2, oY = (70 - rH); ctx.save(); if (!player.facingRight) { ctx.scale(-1, 1); ctx.translate(-(player.x + 25) * 2, 0); } ctx.drawImage(sprite, player.x + oX, player.y + oY, rW, rH); ctx.restore(); } if (debugMode) { ctx.lineWidth = 1; ctx.font = "10px monospace"; ctx.strokeStyle = "#22c55e"; platforms.forEach(p => ctx.strokeRect(p.x, p.y, p.w, p.h)); ctx.strokeStyle = "#facc15"; potatoes.forEach(p => { if (!p.collected && !p.hiddenByMistake) { ctx.strokeRect(p.x, p.y, p.w, p.h); ctx.fillStyle = "white"; ctx.fillText(Math.round(p.x) + "," + Math.round(p.y), p.x, p.y - 5); } }); let hbW = (player.state === 'crawl' ? 50 : 25), hbX = player.x + (50 - hbW) / 2, hOff = (player.state === 'crawl' ? 70 * 5/9 : 0); ctx.strokeStyle = "#ef4444"; ctx.strokeRect(hbX, player.y + hOff, hbW, 70 - hOff); ctx.fillStyle = "red"; ctx.fillText(`P: ${Math.round(player.x)},${Math.round(player.y)}`, player.x, player.y - 10); } ctx.restore(); } init(); </script> </body> </html> width="100%" height="100%" style="border: none;" allow="autoplay" >
