ufo

1,398 kevekıbhack

Remix Open In Editor Fullscreen Discuss Publish Your Code

HTML

<!DOCTYPE html>
<html>
<head>
    <title>3 Katlı Uçan Daire Simülasyonu</title>
    <style>
        body { margin: 0; overflow: hidden; }
        canvas { display: block; }
    </style>
</head>
<body>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/r128/three.min.js"></script>
    <script>
        // Sahne, kamera ve renderer
        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);
        renderer.setClearColor(0x000033); // Koyu mavi gece gökyüzü
        document.body.appendChild(renderer.domElement);

// Işık
        const light1 = new THREE.DirectionalLight(0x55aaff, 1);
        light1.position.set(0, 20, 10);
        scene.add(light1);
        
        const light2 = new THREE.PointLight(0xff5555, 2, 50);
        light2.position.set(5, 5, 5);
        scene.add(light2);
        
        scene.add(new THREE.AmbientLight(0x404040));

// Pist ve çevre (futuristik tema)
        createFuturisticEnvironment();

// 3 Katlı Uçan Daire
        const ufo = create3StoryUFO();
        ufo.position.set(0, 15, 50);
        scene.add(ufo);

// Kamera pozisyonu
        camera.position.set(10, 10, 40);
        camera.lookAt(0, 0, 0);

// Işınlanma efektleri için partiküller
        const particles = [];
        let animationPhase = 0; // 0: yaklaşma, 1: iniş, 2: ışınlanma
        let particleTimer = 0;

function createFuturisticEnvironment() {
            // Pist (ışıklı)
            const runwayGeometry = new THREE.CircleGeometry(15, 32);
            const runwayMaterial = new THREE.MeshStandardMaterial({ 
                color: 0x111122,
                emissive: 0x444477,
                emissiveIntensity: 0.5
            });
            const runway = new THREE.Mesh(runwayGeometry, runwayMaterial);
            runway.rotation.x = -Math.PI / 2;
            runway.position.z = -30;
            scene.add(runway);

// Pist ışıkları (dairesel)
            const lightPoints = [];
            for (let i = 0; i < 32; i++) {
                const angle = (i / 32) * Math.PI * 2;
                const x = Math.cos(angle) * 15;
                const z = Math.sin(angle) * 15 - 30;
                
                const light = new THREE.PointLight(0x00ffff, 1, 5);
                light.position.set(x, 0.2, z);
                scene.add(light);
                
                // Işık küreleri
                const sphere = new THREE.Mesh(
                    new THREE.SphereGeometry(0.2, 8, 8),
                    new THREE.MeshBasicMaterial({ color: 0x00ffff })
                );
                sphere.position.set(x, 0.2, z);
                scene.add(sphere);
            }

// Binalar (futuristik)
            for (let i = 0; i < 5; i++) {
                const building = new THREE.Mesh(
                    new THREE.CylinderGeometry(2 + Math.random(), 1 + Math.random(), 5 + Math.random() * 10, 6),
                    new THREE.MeshStandardMaterial({ 
                        color: Math.random() * 0xffffff,
                        metalness: 0.7,
                        roughness: 0.3
                    })
                );
                building.position.set(
                    (Math.random() - 0.5) * 50,
                    0,
                    -50 - Math.random() * 30
                );
                building.rotation.y = Math.random() * Math.PI;
                scene.add(building);
            }
        }

// Animasyon
        function animate() {
            requestAnimationFrame(animate);

// UFO hareketi
            if (animationPhase === 0) {
                // Yaklaşma
                ufo.position.z -= 0.3;
                if (ufo.position.z < 10) {
                    animationPhase = 1;
                }
            } else if (animationPhase === 1) {
                // İniş
                ufo.position.z -= 0.1;
                ufo.position.y = Math.max(2, ufo.position.y - 0.05);
                
                // Hafif sallanma efekti
                ufo.rotation.z = Math.sin(Date.now() * 0.002) * 0.05;
                ufo.rotation.x = Math.sin(Date.now() * 0.003) * 0.03;
                
                if (ufo.position.z < -25) {
                    animationPhase = 2;
                }
            } else if (animationPhase === 2) {
                // Işınlanma efekti
                particleTimer += 0.1;
                if (particleTimer > 0.5 && particles.length < 50) {
                    createParticle();
                    particleTimer = 0;
                }
                
                // Partikülleri hareket ettir
                particles.forEach((p, index) => {
                    p.mesh.position.addScaledVector(p.direction, p.speed);
                    p.mesh.scale.multiplyScalar(0.98);
                    
                    if (p.mesh.scale.x < 0.1) {
                        scene.remove(p.mesh);
                        particles.splice(index, 1);
                    }
                });
            }

// UFO alt ışığının parlaması
            ufo.children[5].intensity = 3 + Math.sin(Date.now() * 0.01) * 2;

// Kamera hareketi
            if (animationPhase < 2) {
                camera.position.z = ufo.position.z + 20;
                camera.lookAt(ufo.position);
            } else {
                camera.lookAt(0, 0, -30);
            }

renderer.render(scene, camera);
        }

// Pencere boyutu değişikliği
        window.addEventListener('resize', () => {
            camera.aspect = window.innerWidth / window.innerHeight;
            camera.updateProjectionMatrix();
            renderer.setSize(window.innerWidth, window.innerHeight);
        });

animate();
    </script>
</body>
</html>

CSS