Spaces:

THEZYZSTUDIO
/

Z_cam

Paused

App Files Files Community

THEZYZSTUDIO commited on Jun 6

Commit

f1f2d15

verified ·

1 Parent(s): cd0f8ef

Create minecraft created by the z ai agent beta

Browse files

Files changed (1) hide show

minecraft created by the z ai agent beta +397 -0

minecraft created by the z ai agent beta ADDED Viewed

	@@ -0,0 +1,397 @@

+<!DOCTYPE html>
+<html lang="ar" dir="rtl">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>THE Z-CRAFT PRO | BY THE ZYZ STUDIO</title>
+    <style>
+        :root {
+            --primary-color: #4CAF50;
+            --bg-dark: rgba(0, 0, 0, 0.9);
+            --accent-color: #f1c40f;
+        }
+        body { margin: 0; overflow: hidden; font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; background-color: #000; }
+        canvas { display: block; }
+        /* شاشة البداية */
+        #overlay {
+            position: absolute; top: 0; left: 0; width: 100%; height: 100%;
+            background: var(--bg-dark); color: white;
+            display: flex; flex-direction: column; justify-content: center; align-items: center;
+            z-index: 1000; transition: opacity 0.5s ease;
+        }
+        #overlay h1 { font-size: 5rem; margin-bottom: 10px; color: var(--primary-color); text-shadow: 4px 4px #000; letter-spacing: 5px; }
+        #overlay p { font-size: 1.2rem; margin-bottom: 30px; opacity: 0.8; }
+        .menu-btn {
+            padding: 15px 50px; font-size: 1.5rem; cursor: pointer;
+            background: var(--primary-color); color: white; border: none; border-radius: 8px;
+            transition: 0.3s; box-shadow: 0 6px #2E7D32; font-weight: bold; margin: 10px;
+        }
+        .menu-btn:hover { background: #66BB6A; transform: translateY(-3px); box-shadow: 0 9px #2E7D32; }
+        /* واجهة الإعدادات */
+        #settings-menu {
+            position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);
+            background: rgba(40, 40, 40, 0.98); color: white; padding: 30px;
+            border-radius: 15px; display: none; z-index: 2000; border: 4px solid var(--primary-color);
+            min-width: 350px; box-shadow: 0 0 30px rgba(0,0,0,0.5);
+        }
+        .setting-item { display: flex; justify-content: space-between; margin: 15px 0; align-items: center; font-size: 1.1rem; }
+        .key-btn {
+            background: #444; color: #fff; border: 2px solid #666;
+            padding: 8px 15px; cursor: pointer; width: 100px; text-align: center; border-radius: 5px;
+        }
+        .key-btn.waiting { background: var(--accent-color); color: #000; animation: blink 0.5s infinite; border-color: #fff; }
+        @keyframes blink { 50% { opacity: 0.5; } }
+        /* شريط الأدوات (Hotbar) */
+        #hotbar {
+            position: absolute; bottom: 30px; left: 50%; transform: translateX(-50%);
+            display: flex; gap: 12px; background: rgba(0,0,0,0.6); padding: 12px;
+            border-radius: 15px; border: 3px solid #fff;
+        }
+        .slot {
+            width: 55px; height: 55px; border: 4px solid #555;
+            display: flex; justify-content: center; align-items: center;
+            background: #777; position: relative; transition: 0.2s;
+        }
+        .slot.active { border-color: var(--accent-color); box-shadow: 0 0 20px var(--accent-color); background: #aaa; transform: scale(1.1); }
+        .slot-num { position: absolute; top: 2px; right: 4px; font-size: 12px; color: white; font-weight: bold; }
+        .block-preview { width: 30px; height: 30px; border: 1px solid #000; }
+        #crosshair {
+            position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);
+            color: white; font-size: 28px; pointer-events: none; user-select: none;
+        }
+        #instructions {
+            position: absolute; top: 20px; left: 20px; color: white;
+            background: rgba(0,0,0,0.5); padding: 15px; border-radius: 10px; font-size: 14px;
+            border-left: 5px solid var(--primary-color);
+        }
+    </style>
+</head>
+<body>
+    <div id="overlay">
+        <h1>THE Z-CRAFT</h1>
+        <p>صنع بواسطة The ZYZ Studio | Yassine Hamrouni</p>
+        <button class="menu-btn" id="start-btn">ابدأ المغامرة</button>
+        <button class="menu-btn" id="open-settings-btn" style="background: #555; box-shadow: 0 6px #333;">الإعدادات</button>
+    </div>
+    <div id="settings-menu">
+        <h2 style="text-align: center; color: var(--primary-color);">⚙️ إعدادات التحكم</h2>
+        <div id="keys-container"></div>
+        <div class="setting-item">
+            <span>حساسية الماوس:</span>
+            <input type="range" id="sensitivity-slider" min="0.001" max="0.01" step="0.001" value="0.002">
+        </div>
+        <button class="menu-btn" id="close-settings" style="width: 100%; margin-top: 20px;">حفظ وإغلاق</button>
+    </div>
+    <div id="crosshair">+</div>
+    <div id="instructions">
+        تحرك: <span id="key-forward">W</span>, <span id="key-back">S</span>, <span id="key-left">A</span>, <span id="key-right">D</span><br>
+        قفز: <span id="key-jump">Space</span> | إعدادات: <span id="key-settings">E</span><br>
+        <b>بناء: كليك يمين | هدم: كلي�� يسار</b>
+    </div>
+    <div id="hotbar">
+        <div class="slot active" data-id="1"><span class="slot-num">1</span><div class="block-preview" style="background: #4CAF50;"></div></div>
+        <div class="slot" data-id="2"><span class="slot-num">2</span><div class="block-preview" style="background: #8B4513;"></div></div>
+        <div class="slot" data-id="3"><span class="slot-num">3</span><div class="block-preview" style="background: #808080;"></div></div>
+        <div class="slot" data-id="4"><span class="slot-num">4</span><div class="block-preview" style="background: #FFD700;"></div></div>
+        <div class="slot" data-id="5"><span class="slot-num">5</span><div class="block-preview" style="background: #0000FF;"></div></div>
+    </div>
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/r128/three.min.js"></script>
+    <script>
+        /**
+         * THE Z-CRAFT PRO ENGINE
+         * Fixed: Start Button & Pointer Lock Logic
+         */
+        let controls = {
+            forward: 'KeyW',
+            backward: 'KeyS',
+            left: 'KeyA',
+            right: 'KeyD',
+            jump: 'Space',
+            settings: 'KeyE'
+        };
+        let mouseSensitivity = 0.002;
+        const blockTypes = {
+            1: { color: 0x4CAF50, name: 'Grass' },
+            2: { color: 0x8B4513, name: 'Dirt' },
+            3: { color: 0x808080, name: 'Stone' },
+            4: { color: 0xFFD700, name: 'Gold' },
+            5: { color: 0x0000FF, name: 'Water' }
+        };
+        let selectedBlock = 1;
+        let scene, camera, renderer, clock;
+        let moveForward = false, moveBackward = false, moveLeft = false, moveRight = false, canJump = false;
+        let velocity = new THREE.Vector3();
+        let direction = new THREE.Vector3();
+        let objects = [];
+        let isLocked = false;
+        const overlay = document.getElementById('overlay');
+        const startBtn = document.getElementById('start-btn');
+        const settingsMenu = document.getElementById('settings-menu');
+        const closeSettings = document.getElementById('close-settings');
+        const openSettingsBtn = document.getElementById('open-settings-btn');
+        function init() {
+            scene = new THREE.Scene();
+            scene.background = new THREE.Color(0x87CEEB);
+            scene.fog = new THREE.Fog(0x87CEEB, 0, 100);
+            camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 1000);
+            camera.rotation.order = 'YXZ';
+            camera.position.set(0, 2, 5);
+            const ambientLight = new THREE.AmbientLight(0xffffff, 0.6);
+            scene.add(ambientLight);
+            const sunLight = new THREE.DirectionalLight(0xffffff, 0.8);
+            sunLight.position.set(10, 20, 10);
+            scene.add(sunLight);
+            renderer = new THREE.WebGLRenderer({ antialias: true });
+            renderer.setPixelRatio(window.devicePixelRatio);
+            renderer.setSize(window.innerWidth, window.innerHeight);
+            document.body.appendChild(renderer.domElement);
+            clock = new THREE.Clock();
+            // أرضية البداية
+            for (let x = -15; x < 15; x++) {
+                for (let z = -15; z < 15; z++) {
+                    createBlock(x, 0, z, 1);
+                }
+            }
+            setupEventListeners();
+            renderSettings();
+            animate();
+        }
+        function createBlock(x, y, z, type) {
+            const geometry = new THREE.BoxGeometry(1, 1, 1);
+            const material = new THREE.MeshLambertMaterial({ color: blockTypes[type].color });
+            const block = new THREE.Mesh(geometry, material);
+            block.position.set(x, y, z);
+            scene.add(block);
+            objects.push(block);
+            return block;
+        }
+        function setupEventListeners() {
+            // --- إصلاح زر البداية ---
+            startBtn.addEventListener('click', () => {
+                document.body.requestPointerLock();
+            });
+            openSettingsBtn.addEventListener('click', () => {
+                settingsMenu.style.display = 'block';
+            });
+            document.addEventListener('pointerlockchange', () => {
+                if (document.pointerLockElement === document.body) {
+                    isLocked = true;
+                    overlay.style.opacity = '0';
+                    setTimeout(() => overlay.style.display = 'none', 500);
+                } else {
+                    isLocked = false;
+                    overlay.style.display = 'flex';
+                    overlay.style.opacity = '1';
+                }
+            });
+            document.addEventListener('keydown', (e) => {
+                if (!isLocked) return;
+                if (e.code === controls.forward) moveForward = true;
+                if (e.code === controls.backward) moveBackward = true;
+                if (e.code === controls.left) moveLeft = true;
+                if (e.code === controls.right) moveRight = true;
+                if (e.code === controls.jump && canJump) {
+                    velocity.y += 5;
+                    canJump = false;
+                }
+                if (e.code === controls.settings) {
+                    document.exitPointerLock();
+                    settingsMenu.style.display = 'block';
+                }
+                if (e.key >= 1 && e.key <= 5) {
+                    selectedBlock = parseInt(e.key);
+                    updateHotbarUI();
+                }
+            });
+            document.addEventListener('keyup', (e) => {
+                if (e.code === controls.forward) moveForward = false;
+                if (e.code === controls.backward) moveBackward = false;
+                if (e.code === controls.left) moveLeft = false;
+                if (e.code === controls.right) moveRight = false;
+            });
+            document.addEventListener('mousemove', (e) => {
+                if (!isLocked) return;
+                camera.rotation.y -= e.movementX * mouseSensitivity;
+                camera.rotation.x -= e.movementY * mouseSensitivity;
+                camera.rotation.x = Math.max(-Math.PI/2, Math.min(Math.PI/2, camera.rotation.x));
+            });
+            document.addEventListener('mousedown', (e) => {
+                if (!isLocked) return;
+                const raycaster = new THREE.Raycaster();
+                raycaster.setFromCamera(new THREE.Vector2(0, 0), camera);
+                const intersects = raycaster.intersectObjects(objects);
+                if (intersects.length > 0) {
+                    const intersect = intersects[0];
+                    if (e.button === 0) { // يسار: هدم
+                        if (intersect.object.position.y !== 0 || objects.length > 100) {
+                            scene.remove(intersect.object);
+                            objects = objects.filter(obj => obj !== intersect.object);
+                        }
+                    } else if (e.button === 2) { // يمين: بناء
+                        const pos = intersect.object.position.clone().add(intersect.face.normal);
+                        createBlock(pos.x, pos.y, pos.z, selectedBlock);
+                    }
+                }
+            });
+            document.addEventListener('contextmenu', e => e.preventDefault());
+            closeSettings.addEventListener('click', () => {
+                mouseSensitivity = parseFloat(document.getElementById('sensitivity-slider').value);
+                settingsMenu.style.display = 'none';
+                document.body.requestPointerLock();
+            });
+        }
+        function updateHotbarUI() {
+            document.querySelectorAll('.slot').forEach(slot => {
+                slot.classList.remove('active');
+                if (slot.dataset.id == selectedBlock) slot.classList.add('active');
+            });
+        }
+        function renderSettings() {
+            const container = document.getElementById('keys-container');
+            container.innerHTML = '';
+            for (let action in controls) {
+                const div = document.createElement('div');
+                div.className = 'setting-item';
+                div.innerHTML = `<span>${action === 'forward' ? 'للأمام' : action === 'backward' ? 'للخلف' : action === 'left' ? 'يسار' : action === 'right' ? 'يمين' : action === 'jump' ? 'قفز' : 'إعدادات'}:</span>
+                                 <button class="key-btn" id="btn-${action}">${controls[action]}</button>`;
+                container.appendChild(div);
+                const btn = div.querySelector('.key-btn');
+                btn.onclick = () => {
+                    btn.classList.add('waiting');
+                    btn.innerText = '...';
+                    const captureKey = (e) => {
+                        e.preventDefault();
+                        controls[action] = e.code;
+                        btn.innerText = e.code;
+                        btn.classList.remove('waiting');
+                        document.removeEventListener('keydown', captureKey);
+                        updateInstructionLabels();
+                    };
+                    document.addEventListener('keydown', captureKey);
+                };
+            }
+        }
+        function updateInstructionLabels() {
+            document.getElementById('key-forward').innerText = controls.forward.replace('Key', '');
+            document.getElementById('key-back').innerText = controls.backward.replace('Key', '');
+            document.getElementById('key-left').innerText = controls.left.replace('Key', '');
+            document.getElementById('key-right').innerText = controls.right.replace('Key', '');
+            document.getElementById('key-jump').innerText = controls.jump;
+            document.getElementById('key-settings').innerText = controls.settings.replace('Key', '');
+        }
+        function animate() {
+            requestAnimationFrame(animate);
+            if (!isLocked) {
+                renderer.render(scene, camera);
+                return;
+            }
+            const delta = clock.getDelta();
+            velocity.x -= velocity.x * 10.0 * delta;
+            velocity.z -= velocity.z * 10.0 * delta;
+            velocity.y -= 9.8 * 2.0 * delta;
+            direction.z = Number(moveForward) - Number(moveBackward);
+            direction.x = Number(moveRight) - Number(moveLeft);
+            direction.normalize();
+            if (moveForward || moveBackward) velocity.z -= direction.z * 400.0 * delta;
+            if (moveLeft || moveRight) velocity.x -= direction.x * 400.0 * delta;
+            const moveVector = new THREE.Vector3();
+            camera.getWorldDirection(moveVector);
+            moveVector.y = 0;
+            moveVector.normalize();
+            const sideVector = new THREE.Vector3();
+            sideVector.crossVectors(camera.up, moveVector).normalize();
+            const nextPos = camera.position.clone();
+            nextPos.addScaledVector(moveVector, -velocity.z * delta * 0.05);
+            nextPos.addScaledVector(sideVector, velocity.x * delta * 0.05);
+            nextPos.y += velocity.y * delta;
+            let collided = false;
+            const playerRadius = 0.3;
+            for (let obj of objects) {
+                const blockBox = new THREE.Box3().setFromObject(obj);
+                const playerBox = new THREE.Box3().setFromCenterAndSize(
+                    nextPos, new THREE.Vector3(playerRadius * 2, 1.8, playerRadius * 2)
+                );
+                if (blockBox.intersectsBox(playerBox)) {
+                    collided = true;
+                    if (camera.position.y >= blockBox.max.y) {
+                        velocity.y = 0;
+                        nextPos.y = blockBox.max.y + 0.1;
+                        canJump = true;
+                    } else {
+                        nextPos.copy(camera.position);
+                    }
+                    break;
+                }
+            }
+            if (!collided) camera.position.copy(nextPos);
+            else if (velocity.y < 0) camera.position.copy(nextPos);
+            if (camera.position.y < 2) {
+                velocity.y = 0;
+                camera.position.y = 2;
+                canJump = true;
+            }
+            renderer.render(scene, camera);
+        }
+        window.addEventListener('resize', () => {
+            camera.aspect = window.innerWidth / window.innerHeight;
+            camera.updateProjectionMatrix();
+            renderer.setSize(window.innerWidth, window.innerHeight);
+        });
+        init();
+    </script>
+</body>
+</html>