Meta Description" name="description" />
from pathlib import Path
html = r'''<!doctype html>
<html><head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no">
<title>Dog Jump</title>
<style>
*{box-sizing:border-box}body{margin:0;background:#6dd5ff;font-family:Arial;text-align:center;overflow:hidden}
#hud{position:fixed;top:10px;left:0;right:0;font-size:22px;font-weight:bold;color:white;text-shadow:2px 2px #246}
canvas{display:block;margin:auto;background:linear-gradient(#66cfff 0 68%,#83d65b 68%)}
#controls{position:fixed;bottom:18px;left:0;right:0;display:flex;justify-content:space-between;padding:0 25px}
button{width:92px;height:70px;border-radius:35px;border:4px solid white;background:#ffb52e;color:white;font-size:28px;font-weight:bold;box-shadow:0 5px #a86600}
#msg{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;color:white;font-size:34px;font-weight:bold;text-shadow:3px 3px #245;pointer-events:none}
</style></head><body>
<div id="hud">🐶 কয়েন: <span id="score">0</span></div>
<canvas id="c" width="900" height="500"></canvas>
<div id="msg">DOG JUMP<br><small style="font-size:18px">লাফ দিতে JUMP চাপ</small></div>
<div id="controls"><button id="restart">↻</button><button id="jump">JUMP</button></div>
<script>
const c=document.getElementById('c'),x=c.getContext('2d'),S=document.getElementById('score'),M=document.getElementById('msg');
let dog,obs,coins,score,run,started;
function reset(){dog={x:120,y:365,w:70,h:55,vy:0};obs=[];coins=[];score=0;run=0;started=false;S.textContent=0;M.style.display='flex';}
function jump(){started=true;M.style.display='none';if(dog.y>=365)dog.vy=-15}
document.getElementById('jump').onclick=jump;document.getElementById('restart').onclick=reset;
addEventListener('keydown',e=>{if(e.code==='Space'||e.code==='ArrowUp')jump()});
c.addEventListener('touchstart',jump);
function rect(a,b){return a.x<b.x+b.w&&a.x+a.w>b.x&&a.y<b.y+b.h&&a.y+a.h>b.y}
function loop(){
x.clearRect(0,0,900,500);
// clouds
x.fillStyle='rgba(255,255,255,.75)';for(let i=0;i<5;i++){x.beginPath();x.arc((i*210-run*.2)%1050,90+(i%2)*50,35,0,7);x.fill()}
// ground
x.fillStyle='#6b3f20';x.fillRect(0,420,900,80);x.fillStyle='#42a83c';x.fillRect(0,410,900,18);
if(started){
run+=6; dog.vy+=.75;dog.y+=dog.vy;if(dog.y>365){dog.y=365;dog.vy=0}
if(Math.random()<.018)obs.push({x:920,y:375,w:35,h:45});
if(Math.random()<.025)coins.push({x:920,y:280+Math.random()*80,w:28,h:28});
obs.forEach(o=>o.x-=6);coins.forEach(o=>o.x-=6);
obs=obs.filter(o=>o.x>-60);coins=coins.filter(o=>o.x>-40);
for(const o of obs)if(rect(dog,o)){started=false;M.innerHTML='গেম ওভার 😵<br><small style="font-size:18px">↻ চাপ দিয়ে আবার খেল</small>';M.style.display='flex'}
coins=coins.filter(q=>{if(rect(dog,q)){score++;S.textContent=score;return false}return true});
}
// coins
for(const q of coins){x.fillStyle='#ffd52e';x.beginPath();x.arc(q.x+14,q.y+14,14,0,7);x.fill();x.fillStyle='#f2a400';x.fillRect(q.x+11,q.y+5,6,18)}
// obstacles
for(const o of obs){x.fillStyle='#e74c3c';x.fillRect(o.x,o.y,o.w,o.h);x.fillStyle='white';x.fillRect(o.x+8,o.y+10,6,6)}
// dog
x.save();x.translate(dog.x,dog.y);
x.fillStyle='#c97928';x.fillRect(10,15,55,35);x.beginPath();x.arc(55,15,22,0,7);x.fill();
x.fillStyle='#8b4b18';x.beginPath();x.ellipse(20,5,12,25,-.5,0,7);x.fill();
x.fillStyle='white';x.beginPath();x.arc(62,10,6,0,7);x.fill();x.fillStyle='#111';x.beginPath();x.arc(64,10,3,0,7);x.fill();
x.fillStyle='#222';x.beginPath();x.arc(73,20,6,0,7);x.fill();
x.fillStyle='#d33';x.fillRect(20,38,42,8);x.fillStyle='#fff';x.fillText('🐾',32,47);
x.restore();
requestAnimationFrame(loop)
}
reset();loop();
</script></body></html>'''
p=Path('/mnt/data/dog_jump_game.html')
p.write_text(html, encoding='utf-8')
print(p)
1
1
4KB
4KB
172.0ms
208.0ms
172.0ms