#dz-one-word{font-family:Arial,sans-serif;background:linear-gradient(145deg,#111a43,#293f78);color:white;padding:18px;border-radius:18px;max-width:580px;margin:20px auto;text-align:center;box-sizing:border-box} #dz-one-word *{box-sizing:border-box} #dz-one-word h2{color:#ffdf62;margin:0 0 8px} #dz-one-word .stats{display:flex;justify-content:center;gap:9px;flex-wrap:wrap;margin:12px 0} #dz-one-word .stats span{background:#ffffff20;border-radius:9px;padding:9px 12px;font-weight:bold} #dz-one-word canvas{display:block;width:100%;max-width:500px;height:auto;margin:auto;border:3px solid #91aaff;border-radius:12px;background:#0b1230} #dz-one-word .choices{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;max-width:500px;margin:14px auto} #dz-one-word button{border:0;border-radius:10px;padding:13px 4px;font-size:19px;font-weight:bold;cursor:pointer;touch-action:manipulation} #dz-one-word [data-art="DER"]{background:#48caff;color:#102044} #dz-one-word [data-art="DIE"]{background:#ff719b;color:#38132a} #dz-one-word [data-art="DAS"]{background:#bd96ff;color:#251444} #dz-one-word .start{background:#55e3b2;color:#102044;font-size:16px;padding:12px 18px} #dz-one-word .message{min-height:28px;font-weight:bold} #dz-one-word .hint{font-size:13px;line-height:1.6;color:#e0e7ff}

🎯 DEUTSCHZENTRUM: DER, DIE, DAS

Apasă ÎNCEPE și pregătește-te!

▶ ÎNCEPE JOCUL

Cuvântul cade de sus. Alege DER, DIE sau DAS. După răspuns, cuvântul ajunge jos și apare următorul!

(()=>{ const root=document.getElementById('dz-one-word'); if(root.dataset.ready)return; root.dataset.ready='1'; const canvas=root.querySelector('#dzo-canvas'); const ctx=canvas.getContext('2d'); const W=500,H=400; const words=[ ['Hund','DER','câine'],['Katze','DIE','pisică'],['Haus','DAS','casă'], ['Tisch','DER','masă'],['Schule','DIE','școală'],['Buch','DAS','carte'], ['Apfel','DER','măr'],['Blume','DIE','floare'],['Auto','DAS','mașină'], ['Stuhl','DER','scaun'],['Lampe','DIE','lampă'],['Kind','DAS','copil'], ['Ball','DER','minge'],['Tür','DIE','ușă'],['Fenster','DAS','fereastră'], ['Vater','DER','tată'],['Mutter','DIE','mamă'],['Mädchen','DAS','fată'], ['Lehrer','DER','profesor'],['Tasche','DIE','geantă'],['Messer','DAS','cuțit'], ['Kuchen','DER','prăjitură'],['Zeitung','DIE','ziar'],['Wasser','DAS','apă'], ['Bleistift','DER','creion'],['Flasche','DIE','sticlă'],['Telefon','DAS','telefon'], ['Freund','DER','prieten'],['Jacke','DIE','jachetă'],['Brot','DAS','pâine'], ['Garten','DER','grădină'],['Uhr','DIE','ceas'],['Zimmer','DAS','cameră'], ['Schlüssel','DER','cheie'],['Milch','DIE','lapte'],['Ei','DAS','ou'] ]; const colors={DER:'#48caff',DIE:'#ff719b',DAS:'#bd96ff'}; let current=null,used=[],score=0,lives=5,count=0; let running=false,falling=false,y=65,raf=null,last=0; let message='',messageUntil=0,showTranslation=false; function stats(){ root.querySelector('#dzo-score').textContent=score; root.querySelector('#dzo-lives').textContent=lives; root.querySelector('#dzo-count').textContent=count; } function roundRect(x,y,w,h,r,fill,stroke){ ctx.beginPath();ctx.roundRect(x,y,w,h,r); if(fill)ctx.fill();if(stroke)ctx.stroke(); } function draw(){ ctx.clearRect(0,0,W,H); const bg=ctx.createLinearGradient(0,0,0,H); bg.addColorStop(0,'#101a42');bg.addColorStop(1,'#1c3266'); ctx.fillStyle=bg;ctx.fillRect(0,0,W,H); // Stele decorative, fără coloane. ctx.fillStyle='#ffffff10'; for(let i=0;i<20;i++){ ctx.beginPath();ctx.arc((i*83)%W,(i*57)%H,2,0,Math.PI*2);ctx.fill(); } ctx.textAlign='center'; ctx.fillStyle='#dce6ff';ctx.font='bold 14px Arial'; ctx.fillText('CE ARTICOL SE POTRIVEȘTE?',W/2,28); // Linia de aterizare. ctx.strokeStyle='#ffdf62';ctx.lineWidth=3; ctx.setLineDash([7,7]); ctx.beginPath();ctx.moveTo(35,315);ctx.lineTo(W-35,315);ctx.stroke(); ctx.setLineDash([]); ctx.fillStyle='#dce6ff';ctx.font='13px Arial'; ctx.fillText('ZONA DE SOSIRE',W/2,339); if(current){ ctx.shadowColor=colors[current[1]]; ctx.shadowBlur=falling?15:0; ctx.fillStyle=colors[current[1]]; roundRect(80,y,340,76,16,true,false); ctx.shadowBlur=0; ctx.fillStyle='#132044'; ctx.font='bold 30px Arial'; ctx.fillText(current[0],W/2,y+35); ctx.font='16px Arial'; ctx.fillText(showTranslation?current[2]:'???',W/2,y+59); } if(message && performance.now()!used.includes(w[0])); if(available.length===0)used=[]; const pool=words.filter(w=>!used.includes(w[0])); current=pool[Math.floor(Math.random()*pool.length)]; used.push(current[0]); y=55;falling=true;showTranslation=false; last=0; draw(); } function finish(){ running=false;falling=false; if(raf)cancelAnimationFrame(raf); raf=null; message='JOC TERMINAT!'; messageUntil=performance.now()+100000; root.querySelector('#dzo-message').textContent='Joc terminat! Scor final: '+score+'. Apasă pentru a juca din nou.'; draw(); } function tick(time=0){ if(!running){raf=null;return;} const dt=Math.min(40,time-(last||time));last=time; if(falling){ y+=dt*0.055; if(y>=230){ y=230;falling=false; lives--; stats(); root.querySelector('#dzo-message').textContent='Cuvântul a ajuns jos! Era '+current[1]+' '+current[0]+'.'; message='PREA TÂRZIU!'; messageUntil=performance.now()+900; if(lives{ if(running&&!falling){nextWord();root.querySelector('#dzo-message').textContent='Alege articolul pentru noul cuvânt!';} },1000); } } draw(); raf=requestAnimationFrame(tick); } function choose(art){ if(!running||!falling||!current)return; falling=false; if(art===current[1]){ score+=10; count++; message='RICHTIG! +10'; root.querySelector('#dzo-message').textContent='Corect! '+current[1]+' '+current[0]+' = '+current[2]+'.'; showTranslation=true; }else{ score=Math.max(0,score-2); lives--; message='LEARN: '+current[1]+' '+current[0]; root.querySelector('#dzo-message').textContent='Răspuns corect: '+current[1]+' '+current[0]+' („'+current[2]+'”).'; showTranslation=true; } stats(); y=230; messageUntil=performance.now()+950; draw(); if(lives{ if(running&&!falling){ nextWord(); root.querySelector('#dzo-message').textContent='Următorul cuvânt! Alege articolul corect.'; } },1100); } root.querySelectorAll('[data-art]').forEach(btn=>{ btn.addEventListener('click',()=>choose(btn.dataset.art)); }); root.querySelector('#dzo-start').addEventListener('click',()=>{ if(raf)cancelAnimationFrame(raf); score=0;lives=5;count=0;used=[];running=true;falling=false; message='';stats(); root.querySelector('#dzo-message').textContent='Primul cuvânt vine de sus!'; nextWord(); raf=requestAnimationFrame(tick); }); document.addEventListener('keydown',e=>{ if(!root.isConnected)return; if(e.key==='1')choose('DER'); if(e.key==='2')choose('DIE'); if(e.key==='3')choose('DAS'); }); stats();draw(); })();