Gra Matematyczna<\/title>\r\n\r\n<style>\r\nhtml,body{\r\n height:100%;\r\n margin:0;\r\n}\r\n\r\nbody{\r\n font-family:Arial;\r\n display:flex;\r\n justify-content:center;\r\n align-items:flex-start;\r\n padding-top:30px;\r\n background:linear-gradient(to bottom right,#a1c4fd,#c2e9fb);\r\n}\r\n\r\n\/* \ud83d\udce6 PANEL GRY *\/\r\n.box{\r\n background:#fff;\r\n padding:20px;\r\n border-radius:20px;\r\n width:110%;\r\n max-width:500px;\r\n text-align:center\r\n}\r\n\r\n\/* \ud83d\udd18 PRZYCISKI *\/\r\nbutton{\r\n width:100%;\r\n padding:14px;\r\n margin:6px 0;\r\n font-size:18px;\r\n border:none;\r\n border-radius:12px;\r\n}\r\n\r\n\/* \ud83d\udcca PASEK *\/\r\n.bar{background:#ddd;border-radius:10px;height:20px;margin:10px 0}\r\n.bar-inner{background:#4CAF50;height:100%}\r\n\r\n\/* \ud83d\udd25 UI G\u00d3RNE (PRO FIX) *\/\r\n#ui{\r\n position:fixed;\r\n top:calc(env(safe-area-inset-top, 0px) + 80px); \/* \ud83d\udd25 PRO FIX *\/\r\n left:50%;\r\n transform:translateX(-50%);\r\n display:flex;\r\n gap:30px;\r\n font-size:22px;\r\n color:#fff;\r\n background:rgba(0,0,0,0.6);\r\n padding:10px 20px;\r\n border-radius:12px;\r\n\r\n backdrop-filter: blur(6px); \/* \ud83d\udd25 efekt *\/\r\n box-shadow:0 4px 12px rgba(0,0,0,0.4);\r\n}\r\n\r\n#ui span{\r\n color:#00e5ff;\r\n}\r\n<\/style>\r\n<\/head>\r\n\r\n<body>\r\n<div id=\"app\" class=\"box\"><\/div>\r\n\r\n<script>\r\nlet step=0,name=\"\",range=10,mode=\"+\",timeLimit=10,correct=0,timeLeft=0,timer,score=0;\r\n\r\n\/* ===== MATH GAME ===== *\/\r\n\r\nfunction render(){\r\n const app=document.getElementById('app');\r\n\r\n if(step===0){\r\n app.innerHTML=\"<h2>Cze\u015b\u0107 \ud83d\udc4b<\/h2><input id='name' placeholder='Imi\u0119'><button onclick='next()'>Dalej<\/button>\";\r\n }\r\n\r\n if(step===1){\r\n app.innerHTML=\"<h2>Zakres<\/h2>\"+[10,20,30,40,50,100]\r\n .map(n=>\"<button onclick='setRange(\"+n+\")'>\"+n+\"<\/button>\").join(\"\");\r\n }\r\n\r\n if(step===2){\r\n app.innerHTML=\"<h2>Dzia\u0142ania<\/h2>\"+['+','-','*','\/','all']\r\n .map(o=>\"<button onclick=\\\"setMode('\"+o+\"')\\\">\"+(o==='all'?'Wszystko':o)+\"<\/button>\").join(\"\");\r\n }\r\n\r\n if(step===3){\r\n app.innerHTML=\"<h2>Czas<\/h2>\"+[5,10,15]\r\n .map(t=>\"<button onclick='setTime(\"+t+\")'>\"+t+\"s<\/button>\").join(\"\");\r\n }\r\n\r\n if(step===4){\r\n score=0;\r\n question();\r\n }\r\n}\r\n\r\nfunction next(){name=document.getElementById('name').value||'Graczu';step=1;render()}\r\nfunction setRange(n){range=n;step=2;render()}\r\nfunction setMode(m){mode=m;step=3;render()}\r\nfunction setTime(t){timeLimit=t;step=4;render()}\r\nfunction rand(n){return Math.floor(Math.random()*n)+1}\r\n\r\nfunction question(){\r\n clearInterval(timer);\r\n\r\n let op=mode==='all'?['+','-','*','\/'][Math.floor(Math.random()*4)]:mode;\r\n let a=1,b=1;\r\n\r\n if(op==='+'){do{a=rand(range);b=rand(range)}while(a+b>range);correct=a+b}\r\n if(op==='-'){a=rand(range);b=rand(a);correct=a-b}\r\n if(op==='*'){do{a=rand(range);b=rand(range)}while(a*b>range);correct=a*b}\r\n if(op==='\/'){let r=rand(range);b=rand(range);a=r*b;while(a>range){r=rand(range);b=rand(range);a=r*b}correct=r}\r\n\r\n let w1=correct+1,w2=correct>1?correct-1:correct+2;\r\n let opts=[correct,w1,w2].sort(()=>Math.random()-0.5);\r\n\r\n timeLeft=timeLimit;\r\n\r\n const app=document.getElementById('app');\r\n app.innerHTML=\r\n \"<h3>\"+name+\", ile to?<\/h3>\"+\r\n \"<h1>\"+a+\" \"+op+\" \"+b+\"<\/h1>\"+\r\n \"<p>Punkty: \"+score+\"\/10<\/p>\"+\r\n \"<div class='bar'><div class='bar-inner' style='width:\"+(score*10)+\"%'><\/div><\/div>\"+\r\n \"<p><span id='time'>\"+timeLeft+\"<\/span>s<\/p>\"+\r\n opts.map(o=>\"<button onclick='ans(\"+o+\",this)'>\"+o+\"<\/button>\").join(\"\");\r\n\r\n timer=setInterval(function(){\r\n timeLeft--;\r\n const t=document.getElementById('time');\r\n if(t){\r\n t.innerHTML=timeLeft+\"\";\r\n t.style.opacity=\"0.99\";\r\n setTimeout(()=>t.style.opacity=\"1\",10);\r\n }\r\n if(timeLeft<=0){clearInterval(timer);question()}\r\n },1000);\r\n}\r\n\r\nfunction ans(v,el){\r\n clearInterval(timer);\r\n\r\n if(v===correct){\r\n score++;\r\n el.style.background=\"#4CAF50\";\r\n }else{\r\n score=Math.max(0,score-1);\r\n el.style.background=\"#e74c3c\";\r\n }\r\n\r\n if(score>=10){\r\n setTimeout(startTankGame,500);\r\n return;\r\n }\r\n\r\n setTimeout(question,500);\r\n}\r\n\r\n\/* ===== TANK GAME ===== *\/\r\n\r\nfunction startTankGame(){\r\n\r\n document.getElementById('app').style.display=\"none\";\r\n\r\n const container=document.createElement(\"div\");\r\n container.style.position=\"fixed\";\r\n container.style.top=\"0\";\r\n container.style.left=\"0\";\r\n container.style.width=\"100vw\";\r\n container.style.height=\"100vh\";\r\n container.style.background=\"#000\";\r\n container.style.display=\"flex\";\r\n container.style.justifyContent=\"center\";\r\n container.style.alignItems=\"center\";\r\n\r\n container.innerHTML=`\r\n <div id=\"ui\">\r\n <div>\ud83c\udfc6 Punkty: <span id=\"score\">0<\/span><\/div>\r\n <div>\u23f1\ufe0f Czas: <span id=\"time2\">60<\/span><\/div>\r\n <\/div>\r\n <canvas id=\"game\"><\/canvas>\r\n `;\r\n\r\n document.body.appendChild(container);\r\n\r\n const canvas=document.getElementById(\"game\");\r\n const ctx=canvas.getContext(\"2d\");\r\n\r\n const GAME_WIDTH=800;\r\n const GAME_HEIGHT=500;\r\n\r\n canvas.width=GAME_WIDTH;\r\n canvas.height=GAME_HEIGHT;\r\n canvas.style.width=(GAME_WIDTH*0.8)+\"px\";\r\n canvas.style.height=(GAME_HEIGHT*0.8)+\"px\";\r\n\r\n let tank={x:400,y:440};\r\n let bullets=[],targets=[],explosions=[];\r\n let score=0,time=60;\r\n\r\n const scoreEl=document.getElementById(\"score\");\r\n const timeEl=document.getElementById(\"time2\");\r\n\r\n setInterval(()=>targets.push({\r\n x:Math.random()*700+50,\r\n y:Math.random()*200+40,\r\n size:40,\r\n vx:(Math.random()*2-1)*1.5\r\n }),1000);\r\n\r\n setInterval(()=>{\r\n time--;\r\n timeEl.innerHTML=time;\r\n if(time<=0){\r\n container.remove();\r\n document.getElementById('app').style.display=\"block\";\r\n step=1; render();\r\n }\r\n },1000);\r\n\r\n canvas.addEventListener(\"touchstart\",e=>{\r\n const rect=canvas.getBoundingClientRect();\r\n const t=e.touches[0];\r\n const x=(t.clientX-rect.left)*(GAME_WIDTH\/rect.width);\r\n const y=(t.clientY-rect.top)*(GAME_HEIGHT\/rect.height);\r\n const angle=Math.atan2(y-tank.y,x-tank.x);\r\n bullets.push({x:tank.x,y:tank.y,dx:Math.cos(angle)*10,dy:Math.sin(angle)*10});\r\n });\r\n\r\n function loop(){\r\n ctx.clearRect(0,0,800,500);\r\n\r\n ctx.fillStyle=\"#4CAF50\";\r\n ctx.fillRect(tank.x-25,tank.y-15,50,30);\r\n\r\n bullets.forEach(b=>{\r\n b.x+=b.dx; b.y+=b.dy;\r\n ctx.beginPath(); ctx.arc(b.x,b.y,5,0,6.28); ctx.fillStyle=\"yellow\"; ctx.fill();\r\n });\r\n\r\n targets.forEach((t,i)=>{\r\n t.x+=t.vx;\r\n\r\n const rings=[\r\n {r:20,c:\"#fff\"},\r\n {r:15,c:\"#e53935\"},\r\n {r:10,c:\"#fff\"},\r\n {r:5,c:\"#e53935\"}\r\n ];\r\n\r\n rings.forEach(r=>{\r\n ctx.beginPath();\r\n ctx.fillStyle=r.c;\r\n ctx.arc(t.x,t.y,r.r,0,6.28);\r\n ctx.fill();\r\n });\r\n\r\n bullets.forEach((b,bi)=>{\r\n const d=Math.hypot(b.x-t.x,b.y-t.y);\r\n if(d<20){\r\n\r\n let pts=10;\r\n if(d<5) pts=100;\r\n else if(d<10) pts=50;\r\n else if(d<15) pts=25;\r\n\r\n score+=pts;\r\n scoreEl.innerHTML=score;\r\n\r\n explosions.push({x:t.x,y:t.y,r:5,life:20});\r\n\r\n targets.splice(i,1);\r\n bullets.splice(bi,1);\r\n }\r\n });\r\n });\r\n\r\n explosions.forEach(e=>{\r\n ctx.beginPath();\r\n ctx.strokeStyle=\"orange\";\r\n ctx.arc(e.x,e.y,e.r,0,6.28);\r\n ctx.stroke();\r\n e.r+=2;\r\n e.life--;\r\n });\r\n\r\n explosions=explosions.filter(e=>e.life>0);\r\n\r\n requestAnimationFrame(loop);\r\n }\r\n loop();\r\n}\r\n\r\nrender();\r\n<\/script>\r\n<\/body>\r\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Gra Matematyczna<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"site-sidebar-layout":"no-sidebar","site-content-layout":"","ast-site-content-layout":"full-width-container","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"disabled","ast-breadcrumbs-content":"","ast-featured-img":"disabled","footer-sml-layout":"","ast-disable-related-posts":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"class_list":["post-80","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/aral-tech.pl\/Szensztat\/wp-json\/wp\/v2\/pages\/80","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/aral-tech.pl\/Szensztat\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/aral-tech.pl\/Szensztat\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/aral-tech.pl\/Szensztat\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/aral-tech.pl\/Szensztat\/wp-json\/wp\/v2\/comments?post=80"}],"version-history":[{"count":468,"href":"https:\/\/aral-tech.pl\/Szensztat\/wp-json\/wp\/v2\/pages\/80\/revisions"}],"predecessor-version":[{"id":558,"href":"https:\/\/aral-tech.pl\/Szensztat\/wp-json\/wp\/v2\/pages\/80\/revisions\/558"}],"wp:attachment":[{"href":"https:\/\/aral-tech.pl\/Szensztat\/wp-json\/wp\/v2\/media?parent=80"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

\n\t\t\t\t

\n\t\t\t\t\t

\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t

\n\t\t\t\t\t

\n\t\t\t\t

\n\t\t\t\t\t\r\n\r\n\r\n\r\n\r\nGra Matematyczna<\/title>\r\n\r\n<style>\r\nhtml,body{\r\n height:100%;\r\n margin:0;\r\n}\r\n\r\nbody{\r\n font-family:Arial;\r\n display:flex;\r\n justify-content:center;\r\n align-items:flex-start;\r\n padding-top:30px;\r\n background:linear-gradient(to bottom right,#a1c4fd,#c2e9fb);\r\n}\r\n\r\n\/* \ud83d\udce6 PANEL GRY *\/\r\n.box{\r\n background:#fff;\r\n padding:20px;\r\n border-radius:20px;\r\n width:110%;\r\n max-width:500px;\r\n text-align:center\r\n}\r\n\r\n\/* \ud83d\udd18 PRZYCISKI *\/\r\nbutton{\r\n width:100%;\r\n padding:14px;\r\n margin:6px 0;\r\n font-size:18px;\r\n border:none;\r\n border-radius:12px;\r\n}\r\n\r\n\/* \ud83d\udcca PASEK *\/\r\n.bar{background:#ddd;border-radius:10px;height:20px;margin:10px 0}\r\n.bar-inner{background:#4CAF50;height:100%}\r\n\r\n\/* \ud83d\udd25 UI G\u00d3RNE (PRO FIX) *\/\r\n#ui{\r\n position:fixed;\r\n top:calc(env(safe-area-inset-top, 0px) + 80px); \/* \ud83d\udd25 PRO FIX *\/\r\n left:50%;\r\n transform:translateX(-50%);\r\n display:flex;\r\n gap:30px;\r\n font-size:22px;\r\n color:#fff;\r\n background:rgba(0,0,0,0.6);\r\n padding:10px 20px;\r\n border-radius:12px;\r\n\r\n backdrop-filter: blur(6px); \/* \ud83d\udd25 efekt *\/\r\n box-shadow:0 4px 12px rgba(0,0,0,0.4);\r\n}\r\n\r\n#ui span{\r\n color:#00e5ff;\r\n}\r\n<\/style>\r\n<\/head>\r\n\r\n<body>\r\n<div id=\"app\" class=\"box\"><\/div>\r\n\r\n<script>\r\nlet step=0,name=\"\",range=10,mode=\"+\",timeLimit=10,correct=0,timeLeft=0,timer,score=0;\r\n\r\n\/* ===== MATH GAME ===== *\/\r\n\r\nfunction render(){\r\n const app=document.getElementById('app');\r\n\r\n if(step===0){\r\n app.innerHTML=\"<h2>Cze\u015b\u0107 \ud83d\udc4b<\/h2><input id='name' placeholder='Imi\u0119'><button onclick='next()'>Dalej<\/button>\";\r\n }\r\n\r\n if(step===1){\r\n app.innerHTML=\"<h2>Zakres<\/h2>\"+[10,20,30,40,50,100]\r\n .map(n=>\"<button onclick='setRange(\"+n+\")'>\"+n+\"<\/button>\").join(\"\");\r\n }\r\n\r\n if(step===2){\r\n app.innerHTML=\"<h2>Dzia\u0142ania<\/h2>\"+['+','-','*','\/','all']\r\n .map(o=>\"<button onclick=\\\"setMode('\"+o+\"')\\\">\"+(o==='all'?'Wszystko':o)+\"<\/button>\").join(\"\");\r\n }\r\n\r\n if(step===3){\r\n app.innerHTML=\"<h2>Czas<\/h2>\"+[5,10,15]\r\n .map(t=>\"<button onclick='setTime(\"+t+\")'>\"+t+\"s<\/button>\").join(\"\");\r\n }\r\n\r\n if(step===4){\r\n score=0;\r\n question();\r\n }\r\n}\r\n\r\nfunction next(){name=document.getElementById('name').value||'Graczu';step=1;render()}\r\nfunction setRange(n){range=n;step=2;render()}\r\nfunction setMode(m){mode=m;step=3;render()}\r\nfunction setTime(t){timeLimit=t;step=4;render()}\r\nfunction rand(n){return Math.floor(Math.random()*n)+1}\r\n\r\nfunction question(){\r\n clearInterval(timer);\r\n\r\n let op=mode==='all'?['+','-','*','\/'][Math.floor(Math.random()*4)]:mode;\r\n let a=1,b=1;\r\n\r\n if(op==='+'){do{a=rand(range);b=rand(range)}while(a+b>range);correct=a+b}\r\n if(op==='-'){a=rand(range);b=rand(a);correct=a-b}\r\n if(op==='*'){do{a=rand(range);b=rand(range)}while(a*b>range);correct=a*b}\r\n if(op==='\/'){let r=rand(range);b=rand(range);a=r*b;while(a>range){r=rand(range);b=rand(range);a=r*b}correct=r}\r\n\r\n let w1=correct+1,w2=correct>1?correct-1:correct+2;\r\n let opts=[correct,w1,w2].sort(()=>Math.random()-0.5);\r\n\r\n timeLeft=timeLimit;\r\n\r\n const app=document.getElementById('app');\r\n app.innerHTML=\r\n \"<h3>\"+name+\", ile to?<\/h3>\"+\r\n \"<h1>\"+a+\" \"+op+\" \"+b+\"<\/h1>\"+\r\n \"<p>Punkty: \"+score+\"\/10<\/p>\"+\r\n \"<div class='bar'><div class='bar-inner' style='width:\"+(score*10)+\"%'><\/div><\/div>\"+\r\n \"<p><span id='time'>\"+timeLeft+\"<\/span>s<\/p>\"+\r\n opts.map(o=>\"<button onclick='ans(\"+o+\",this)'>\"+o+\"<\/button>\").join(\"\");\r\n\r\n timer=setInterval(function(){\r\n timeLeft--;\r\n const t=document.getElementById('time');\r\n if(t){\r\n t.innerHTML=timeLeft+\"\";\r\n t.style.opacity=\"0.99\";\r\n setTimeout(()=>t.style.opacity=\"1\",10);\r\n }\r\n if(timeLeft<=0){clearInterval(timer);question()}\r\n },1000);\r\n}\r\n\r\nfunction ans(v,el){\r\n clearInterval(timer);\r\n\r\n if(v===correct){\r\n score++;\r\n el.style.background=\"#4CAF50\";\r\n }else{\r\n score=Math.max(0,score-1);\r\n el.style.background=\"#e74c3c\";\r\n }\r\n\r\n if(score>=10){\r\n setTimeout(startTankGame,500);\r\n return;\r\n }\r\n\r\n setTimeout(question,500);\r\n}\r\n\r\n\/* ===== TANK GAME ===== *\/\r\n\r\nfunction startTankGame(){\r\n\r\n document.getElementById('app').style.display=\"none\";\r\n\r\n const container=document.createElement(\"div\");\r\n container.style.position=\"fixed\";\r\n container.style.top=\"0\";\r\n container.style.left=\"0\";\r\n container.style.width=\"100vw\";\r\n container.style.height=\"100vh\";\r\n container.style.background=\"#000\";\r\n container.style.display=\"flex\";\r\n container.style.justifyContent=\"center\";\r\n container.style.alignItems=\"center\";\r\n\r\n container.innerHTML=`\r\n <div id=\"ui\">\r\n <div>\ud83c\udfc6 Punkty: <span id=\"score\">0<\/span><\/div>\r\n <div>\u23f1\ufe0f Czas: <span id=\"time2\">60<\/span><\/div>\r\n <\/div>\r\n <canvas id=\"game\"><\/canvas>\r\n `;\r\n\r\n document.body.appendChild(container);\r\n\r\n const canvas=document.getElementById(\"game\");\r\n const ctx=canvas.getContext(\"2d\");\r\n\r\n const GAME_WIDTH=800;\r\n const GAME_HEIGHT=500;\r\n\r\n canvas.width=GAME_WIDTH;\r\n canvas.height=GAME_HEIGHT;\r\n canvas.style.width=(GAME_WIDTH*0.8)+\"px\";\r\n canvas.style.height=(GAME_HEIGHT*0.8)+\"px\";\r\n\r\n let tank={x:400,y:440};\r\n let bullets=[],targets=[],explosions=[];\r\n let score=0,time=60;\r\n\r\n const scoreEl=document.getElementById(\"score\");\r\n const timeEl=document.getElementById(\"time2\");\r\n\r\n setInterval(()=>targets.push({\r\n x:Math.random()*700+50,\r\n y:Math.random()*200+40,\r\n size:40,\r\n vx:(Math.random()*2-1)*1.5\r\n }),1000);\r\n\r\n setInterval(()=>{\r\n time--;\r\n timeEl.innerHTML=time;\r\n if(time<=0){\r\n container.remove();\r\n document.getElementById('app').style.display=\"block\";\r\n step=1; render();\r\n }\r\n },1000);\r\n\r\n canvas.addEventListener(\"touchstart\",e=>{\r\n const rect=canvas.getBoundingClientRect();\r\n const t=e.touches[0];\r\n const x=(t.clientX-rect.left)*(GAME_WIDTH\/rect.width);\r\n const y=(t.clientY-rect.top)*(GAME_HEIGHT\/rect.height);\r\n const angle=Math.atan2(y-tank.y,x-tank.x);\r\n bullets.push({x:tank.x,y:tank.y,dx:Math.cos(angle)*10,dy:Math.sin(angle)*10});\r\n });\r\n\r\n function loop(){\r\n ctx.clearRect(0,0,800,500);\r\n\r\n ctx.fillStyle=\"#4CAF50\";\r\n ctx.fillRect(tank.x-25,tank.y-15,50,30);\r\n\r\n bullets.forEach(b=>{\r\n b.x+=b.dx; b.y+=b.dy;\r\n ctx.beginPath(); ctx.arc(b.x,b.y,5,0,6.28); ctx.fillStyle=\"yellow\"; ctx.fill();\r\n });\r\n\r\n targets.forEach((t,i)=>{\r\n t.x+=t.vx;\r\n\r\n const rings=[\r\n {r:20,c:\"#fff\"},\r\n {r:15,c:\"#e53935\"},\r\n {r:10,c:\"#fff\"},\r\n {r:5,c:\"#e53935\"}\r\n ];\r\n\r\n rings.forEach(r=>{\r\n ctx.beginPath();\r\n ctx.fillStyle=r.c;\r\n ctx.arc(t.x,t.y,r.r,0,6.28);\r\n ctx.fill();\r\n });\r\n\r\n bullets.forEach((b,bi)=>{\r\n const d=Math.hypot(b.x-t.x,b.y-t.y);\r\n if(d<20){\r\n\r\n let pts=10;\r\n if(d<5) pts=100;\r\n else if(d<10) pts=50;\r\n else if(d<15) pts=25;\r\n\r\n score+=pts;\r\n scoreEl.innerHTML=score;\r\n\r\n explosions.push({x:t.x,y:t.y,r:5,life:20});\r\n\r\n targets.splice(i,1);\r\n bullets.splice(bi,1);\r\n }\r\n });\r\n });\r\n\r\n explosions.forEach(e=>{\r\n ctx.beginPath();\r\n ctx.strokeStyle=\"orange\";\r\n ctx.arc(e.x,e.y,e.r,0,6.28);\r\n ctx.stroke();\r\n e.r+=2;\r\n e.life--;\r\n });\r\n\r\n explosions=explosions.filter(e=>e.life>0);\r\n\r\n requestAnimationFrame(loop);\r\n }\r\n loop();\r\n}\r\n\r\nrender();\r\n<\/script>\r\n<\/body>\r\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Gra Matematyczna<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"site-sidebar-layout":"no-sidebar","site-content-layout":"","ast-site-content-layout":"full-width-container","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"disabled","ast-breadcrumbs-content":"","ast-featured-img":"disabled","footer-sml-layout":"","ast-disable-related-posts":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"class_list":["post-80","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/aral-tech.pl\/Szensztat\/wp-json\/wp\/v2\/pages\/80","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/aral-tech.pl\/Szensztat\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/aral-tech.pl\/Szensztat\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/aral-tech.pl\/Szensztat\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/aral-tech.pl\/Szensztat\/wp-json\/wp\/v2\/comments?post=80"}],"version-history":[{"count":468,"href":"https:\/\/aral-tech.pl\/Szensztat\/wp-json\/wp\/v2\/pages\/80\/revisions"}],"predecessor-version":[{"id":558,"href":"https:\/\/aral-tech.pl\/Szensztat\/wp-json\/wp\/v2\/pages\/80\/revisions\/558"}],"wp:attachment":[{"href":"https:\/\/aral-tech.pl\/Szensztat\/wp-json\/wp\/v2\/media?parent=80"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}