Spaces:

yoon2566
/

game1

Running

App Files Files Community

Update index.html

by qwerdlqslek - opened Jan 23, 2025

base: refs/heads/main

←

from: refs/pr/3

Discussion Files changed

-289

Files changed (1) hide show

index.html +0 -289

index.html CHANGED Viewed

@@ -1,289 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-<head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>Zombie Survival</title>
-    <style>
-        body {
-            margin: 0;
-            overflow: hidden;
-            background: #333;
-            font-family: Arial, sans-serif;
-            cursor: crosshair;
-        }
-        #score, #health, #timer {
-            position: fixed;
-            color: white;
-            font-size: 20px;
-            z-index: 100;
-        }
-        #score {
-            top: 10px;
-            left: 10px;
-        }
-        #health {
-            top: 10px;
-            right: 10px;
-        }
-        #timer {
-            top: 10px;
-            left: 50%;
-            transform: translateX(-50%);
-        }
-        #startScreen {
-            position: fixed;
-            top: 0;
-            left: 0;
-            width: 100%;
-            height: 100%;
-            background: rgba(0, 0, 0, 0.8);
-            color: white;
-            display: flex;
-            justify-content: center;
-            align-items: center;
-            flex-direction: column;
-            z-index: 1000;
-        }
-        #startButton {
-            padding: 10px 20px;
-            font-size: 18px;
-            background: green;
-            color: white;
-            border: none;
-            cursor: pointer;
-            border-radius: 5px;
-            margin-top: 20px;
-        }
-        #player {
-            position: absolute;
-            width: 40px;
-            height: 40px;
-            background: lime;
-            border-radius: 50%;
-            transform-origin: center;
-        }
-        .zombie {
-            position: absolute;
-            width: 40px;
-            height: 40px;
-            background: crimson;
-            border-radius: 50%;
-        }
-        .bullet {
-            position: absolute;
-            width: 8px;
-            height: 8px;
-            background: yellow;
-            border-radius: 50%;
-        }
-    </style>
-</head>
-<body>
-    <div id="startScreen">
-        <h1>Zombie Survival</h1>
-        <button id="startButton">Start Game</button>
-    </div>
-    <div id="score">Score: 0</div>
-    <div id="health">Health: 100</div>
-    <div id="timer">Time: 0</div>
-    <div id="player"></div>
-    <script>
-        const startScreen = document.getElementById('startScreen');
-        const startButton = document.getElementById('startButton');
-        const player = document.getElementById('player');
-        const scoreDisplay = document.getElementById('score');
-        const healthDisplay = document.getElementById('health');
-        const timerDisplay = document.getElementById('timer');
-        let score = 0;
-        let health = 100;
-        let gameRunning = false;
-        let bullets = [];
-        let zombies = [];
-        let mouseX = 0, mouseY = 0;
-        let playerX = window.innerWidth / 2;
-        let playerY = window.innerHeight / 2;
-        let gameTime = 0;
-        let zombieSpeedMultiplier = 1;
-        let timeInterval;
-        // 플레이어 이동 업데이트
-        function updatePlayer() {
-            player.style.left = `${playerX - 20}px`;
-            player.style.top = `${playerY - 20}px`;
-        }
-        // 좀비 생성
-        function spawnZombie() {
-            if (!gameRunning) return;
-            const zombie = document.createElement('div');
-            zombie.className = 'zombie';
-            const size = 40;
-            const side = Math.floor(Math.random() * 4); // 0: 위, 1: 오른쪽, 2: 아래, 3: 왼쪽
-            let x, y;
-            if (side === 0) { // 위쪽에서 생성
-                x = Math.random() * window.innerWidth;
-                y = -size;
-            } else if (side === 1) { // 오른쪽에서 생성
-                x = window.innerWidth + size;
-                y = Math.random() * window.innerHeight;
-            } else if (side === 2) { // 아래쪽에서 생성
-                x = Math.random() * window.innerWidth;
-                y = window.innerHeight + size;
-            } else { // 왼쪽에서 생성
-                x = -size;
-                y = Math.random() * window.innerHeight;
-            }
-            document.body.appendChild(zombie);
-            zombies.push({ element: zombie, x, y, speed: (1.5 + Math.random() * 2) * zombieSpeedMultiplier });
-            updateZombies();
-        }
-        // 좀비 이동 및 충돌 처리
-        function updateZombies() {
-            zombies.forEach((zombie, index) => {
-                const angle = Math.atan2(playerY - zombie.y, playerX - zombie.x);
-                zombie.x += Math.cos(angle) * zombie.speed;
-                zombie.y += Math.sin(angle) * zombie.speed;
-                zombie.element.style.left = `${zombie.x - 20}px`;
-                zombie.element.style.top = `${zombie.y - 20}px`;
-                const distanceToPlayer = Math.hypot(zombie.x - playerX, zombie.y - playerY);
-                if (distanceToPlayer < 40) {
-                    health -= 10;
-                    healthDisplay.textContent = `Health: ${health}`;
-                    zombie.element.remove();
-                    zombies.splice(index, 1);
-                    if (health <= 0) {
-                        endGame();
-                    }
-                }
-            });
-        }
-        // 총알 생성
-        function shootBullet() {
-            if (!gameRunning) return;
-            const bullet = document.createElement('div');
-            bullet.className = 'bullet';
-            const angle = Math.atan2(mouseY - playerY, mouseX - playerX);
-            const speed = 10;
-            bullets.push({
-                element: bullet,
-                x: playerX,
-                y: playerY,
-                vx: Math.cos(angle) * speed,
-                vy: Math.sin(angle) * speed
-            });
-            document.body.appendChild(bullet);
-        }
-        // 총알 업데이트
-        function updateBullets() {
-            bullets.forEach((bullet, index) => {
-                bullet.x += bullet.vx;
-                bullet.y += bullet.vy;
-                bullet.element.style.left = `${bullet.x - 4}px`;
-                bullet.element.style.top = `${bullet.y - 4}px`;
-                // 화면 밖으로 나간 총알 제거
-                if (bullet.x < 0 || bullet.x > window.innerWidth || bullet.y < 0 || bullet.y > window.innerHeight) {
-                    bullet.element.remove();
-                    bullets.splice(index, 1);
-                }
-                // 좀비와 충돌 체크
-                zombies.forEach((zombie, zombieIndex) => {
-                    const distance = Math.hypot(bullet.x - zombie.x, bullet.y - zombie.y);
-                    if (distance < 20) {
-                        bullet.element.remove();
-                        zombie.element.remove();
-                        bullets.splice(index, 1);
-                        zombies.splice(zombieIndex, 1);
-                        score += 10;
-                        scoreDisplay.textContent = `Score: ${score}`;
-                    }
-                });
-            });
-        }
-        // 게임 루프
-        function gameLoop() {
-            if (!gameRunning) return;
-            updateBullets();
-            updateZombies();
-            requestAnimationFrame(gameLoop);
-        }
-        // 게임 시간 업데이트
-        function updateTimer() {
-            if (!gameRunning) return;
-            gameTime++;
-            timerDisplay.textContent = `Time: ${gameTime}`;
-            if (gameTime % 10 === 0) {
-                zombieSpeedMultiplier *= 2;
-                zombies.forEach(zombie => {
-                    zombie.speed = (1.5 + Math.random() * 2) * zombieSpeedMultiplier;
-                });
-             }
-        }
-        // 게임 시작
-        startButton.addEventListener('click', () => {
-            startScreen.style.display = 'none';
-            gameRunning = true;
-            health = 100;
-            score = 0;
-            gameTime = 0;
-            zombieSpeedMultiplier = 1;
-            healthDisplay.textContent = `Health: ${health}`;
-            scoreDisplay.textContent = `Score: ${score}`;
-            timerDisplay.textContent = `Time: ${gameTime}`;
-            spawnZombie();
-            setInterval(spawnZombie, 1000);
-            gameLoop();
-            timeInterval = setInterval(updateTimer, 1000);
-        });
-        // 게임 종료
-        function endGame() {
-            gameRunning = false;
-            clearInterval(timeInterval);
-            alert(`Game Over! Final Score: ${score}, Time: ${gameTime}`);
-            location.reload();
-        }
-        // 마우스 이동
-        document.addEventListener('mousemove', (e) => {
-            mouseX = e.clientX;
-            mouseY = e.clientY;
-        });
-        // 총알 발사
-        document.addEventListener('click', shootBullet);
-        // 초기 플레이어 위치
-        updatePlayer();
-    </script>
-</body>
-</html>