Create minecrawt

gra
github · Dec 8, 2024 · 2d53187 · 2d53187
1 parent b8d2c39
commit 2d53187
Showing 1 changed file with 176 additions and 0 deletions.
diff --git a/minecrawt b/minecrawt
@@ -0,0 +1,176 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Minecraft Clone</title>
+    <style>
+        body {
+            margin: 0;
+            overflow: hidden;
+        }
+        canvas {
+            display: block;
+        }
+    </style>
+</head>
+<body>
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/0.152.2/three.min.js"></script>
+    <script>
+        // Ustawienia sceny i renderera
+        const scene = new THREE.Scene();
+        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);
+
+        // Światło
+        const light = new THREE.DirectionalLight(0xffffff, 1);
+        light.position.set(10, 10, 10).normalize();
+        scene.add(light);
+
+        // Siatka i podłoga
+        const gridHelper = new THREE.GridHelper(50, 50, 0x000000, 0xaaaaaa);
+        scene.add(gridHelper);
+
+        const groundGeometry = new THREE.PlaneGeometry(50, 50);
+        const groundMaterial = new THREE.MeshBasicMaterial({ color: 0x9B7653 });
+        const ground = new THREE.Mesh(groundGeometry, groundMaterial);
+        ground.rotation.x = -Math.PI / 2;
+        scene.add(ground);
+
+        // Drzewa
+        function addTree(x, z) {
+            const trunkGeometry = new THREE.BoxGeometry(1, 3, 1);
+            const trunkMaterial = new THREE.MeshBasicMaterial({ color: 0x8B4513 });
+            const trunk = new THREE.Mesh(trunkGeometry, trunkMaterial);
+            trunk.position.set(x, 1.5, z);
+            scene.add(trunk);
+
+            const leavesGeometry = new THREE.SphereGeometry(1.5, 8, 8);
+            const leavesMaterial = new THREE.MeshBasicMaterial({ color: 0x228B22 });
+            const leaves = new THREE.Mesh(leavesGeometry, leavesMaterial);
+            leaves.position.set(x, 3.5, z);
+            scene.add(leaves);
+        }
+
+        // Losowe drzewa
+        for (let i = 0; i < 20; i++) {
+            const x = Math.floor(Math.random() * 50 - 25);
+            const z = Math.floor(Math.random() * 50 - 25);
+            addTree(x, z);
+        }
+
+        // Postać gracza
+        function createCharacter() {
+            const character = new THREE.Group();
+
+            // Głowa
+            const headGeometry = new THREE.BoxGeometry(1, 1, 1);
+            const headMaterial = new THREE.MeshBasicMaterial({ color: 0xffcc99 });
+            const head = new THREE.Mesh(headGeometry, headMaterial);
+            head.position.y = 2.5;
+            character.add(head);
+
+            // Tułów
+            const bodyGeometry = new THREE.BoxGeometry(1, 1.5, 0.5);
+            const bodyMaterial = new THREE.MeshBasicMaterial({ color: 0x0000ff });
+            const body = new THREE.Mesh(bodyGeometry, bodyMaterial);
+            body.position.y = 1.5;
+            character.add(body);
+
+            // Nogi
+            const legGeometry = new THREE.BoxGeometry(0.5, 1, 0.5);
+            const legMaterial = new THREE.MeshBasicMaterial({ color: 0x0000ff });
+            const leftLeg = new THREE.Mesh(legGeometry, legMaterial);
+            leftLeg.position.set(-0.25, 0.5, 0);
+            character.add(leftLeg);
+            const rightLeg = new THREE.Mesh(legGeometry, legMaterial);
+            rightLeg.position.set(0.25, 0.5, 0);
+            character.add(rightLeg);
+
+            // Ręce
+            const armGeometry = new THREE.BoxGeometry(0.5, 1, 0.5);
+            const armMaterial = new THREE.MeshBasicMaterial({ color: 0x00ff00 });
+            const leftArm = new THREE.Mesh(armGeometry, armMaterial);
+            leftArm.position.set(-0.75, 2, 0);
+            character.add(leftArm);
+            const rightArm = new THREE.Mesh(armGeometry, armMaterial);
+            rightArm.position.set(0.75, 2, 0);
+            character.add(rightArm);
+
+            character.position.set(0, 0.5, 0);
+            return character;
+        }
+
+        const player = createCharacter();
+        scene.add(player);
+
+        // Kamera i poruszanie
+        camera.position.set(5, 10, 20);
+        camera.lookAt(0, 0, 0);
+
+        const keys = {};
+        window.addEventListener('keydown', (event) => {
+            keys[event.key] = true;
+        });
+        window.addEventListener('keyup', (event) => {
+            keys[event.key] = false;
+        });
+
+        function moveCharacter() {
+            const speed = 0.2;
+            if (keys['w']) player.position.z -= speed; // Do przodu
+            if (keys['s']) player.position.z += speed; // Do tyłu
+            if (keys['a']) player.position.x -= speed; // W lewo
+            if (keys['d']) player.position.x += speed; // W prawo
+
+            // Powiększanie świata
+            if (
+                Math.abs(player.position.x) > 20 ||
+                Math.abs(player.position.z) > 20
+            ) {
+                gridHelper.scale.multiplyScalar(1.5);
+                ground.scale.multiplyScalar(1.5);
+            }
+        }
+
+        // Zmiana kamery
+        window.addEventListener('keydown', (event) => {
+            if (event.key === '1') camera.position.set(5, 10, 20);
+            if (event.key === '2') camera.position.set(0, 15, 0);
+            if (event.key === '3') camera.position.set(20, 10, 0);
+            if (event.key === '4') camera.position.set(0, 5, 20);
+            if (event.key === '5') camera.position.set(-10, 10, -10);
+            camera.lookAt(player.position);
+        });
+
+        // Kopanie i budowanie
+        let isTwoFinger = false;
+        window.addEventListener('mousedown', () => {
+            isTwoFinger = false;
+        });
+        window.addEventListener('mouseup', (event) => {
+            if (event.buttons === 2) {
+                isTwoFinger = true;
+                const blockGeometry = new THREE.BoxGeometry(1, 1, 1);
+                const blockMaterial = new THREE.MeshBasicMaterial({ color: 0x228B22 });
+                const block = new THREE.Mesh(blockGeometry, blockMaterial);
+                block.position.set(
+                    Math.floor(player.position.x),
+                    1,
+                    Math.floor(player.position.z)
+                );
+                scene.add(block);
+            }
+        });
+
+        function animate() {
+            requestAnimationFrame(animate);
+            moveCharacter();
+            renderer.render(scene, camera);
+        }
+        animate();
+    </script>
+</body>
+</html>