Engaaa44 #1653
Description
<title>engaaa44</title>
<style>
body { margin:0; overflow:hidden; }
canvas { display:block; }
#info {
position:absolute;
top:10px;
left:10px;
color:white;
font-family:Arial;
}
</style>
engaaa44 - WASD / Dokun & Sürükle
<script src="https://cdn.jsdelivr.net/npm/three@0.160.0/build/three.min.js"></script>
<script>
const scene = new THREE.Scene();
scene.background = new THREE.Color(0x87ceeb);
const camera = new THREE.PerspectiveCamera(75, window.innerWidth/window.innerHeight, 0.1, 1000);
const renderer = new THREE.WebGLRenderer({ antialias: true });
renderer.setSize(window.innerWidth, window.innerHeight);
document.body.appendChild(renderer.domElement);
// Zemin
const groundGeo = new THREE.PlaneGeometry(50, 50);
const groundMat = new THREE.MeshBasicMaterial({ color: 0x228B22 });
const ground = new THREE.Mesh(groundGeo, groundMat);
ground.rotation.x = -Math.PI/2;
scene.add(ground);
// Oyuncu (Roblox tarzı küp)
const playerGeo = new THREE.BoxGeometry(1,1,1);
const playerMat = new THREE.MeshBasicMaterial({ color: 0xff0000 });
const player = new THREE.Mesh(playerGeo, playerMat);
player.position.y = 0.5;
scene.add(player);
camera.position.set(0,5,8);
camera.lookAt(player.position);
// Hareket
let keys = {};
document.addEventListener("keydown", e => keys[e.key.toLowerCase()] = true);
document.addEventListener("keyup", e => keys[e.key.toLowerCase()] = false);
// Mobil dokunma
let touchStartX = 0;
document.addEventListener("touchstart", e => {
touchStartX = e.touches[0].clientX;
});
document.addEventListener("touchmove", e => {
let deltaX = e.touches[0].clientX - touchStartX;
player.position.x += deltaX * 0.01;
touchStartX = e.touches[0].clientX;
});
function animate() {
requestAnimationFrame(animate);
if(keys["w"]) player.position.z -= 0.1;
if(keys["s"]) player.position.z += 0.1;
if(keys["a"]) player.position.x -= 0.1;
if(keys["d"]) player.position.x += 0.1;
camera.position.x = player.position.x;
camera.position.z = player.position.z + 8;
camera.lookAt(player.position);
renderer.render(scene, camera);
}
animate();
</script>