File size: 12,612 Bytes
a30e88c
 
 
 
 
 
 
0fd1d06
a30e88c
 
 
 
 
 
0e6c440
a30e88c
f027a73
 
 
0fd1d06
96897f0
f027a73
 
 
 
 
 
 
 
 
 
 
 
accbf92
 
 
 
 
f027a73
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
accbf92
f027a73
 
 
accbf92
f027a73
 
 
accbf92
0e6c440
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
accbf92
f027a73
0e6c440
 
 
 
 
 
 
 
 
 
 
 
 
f027a73
 
0e6c440
 
 
 
 
 
 
f027a73
 
 
 
 
a30e88c
 
f027a73
 
 
 
 
 
 
 
 
0e6c440
96897f0
f027a73
96897f0
 
 
0e6c440
 
96897f0
 
f027a73
0e6c440
96897f0
a30e88c
96897f0
 
f027a73
0fd1d06
96897f0
 
 
 
 
 
 
 
 
 
 
 
f027a73
96897f0
 
f027a73
a30e88c
96897f0
a30e88c
96897f0
f027a73
a30e88c
96897f0
 
 
 
 
f027a73
a30e88c
96897f0
 
 
a30e88c
96897f0
 
 
 
 
 
 
a30e88c
96897f0
 
f027a73
 
0e6c440
0fd1d06
 
a30e88c
f027a73
0fd1d06
f027a73
0fd1d06
96897f0
a30e88c
96897f0
 
 
 
 
 
f027a73
 
 
 
0fd1d06
96897f0
 
 
 
 
a30e88c
96897f0
 
 
 
a30e88c
96897f0
 
 
 
 
f027a73
a30e88c
 
 
f027a73
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
0e6c440
96897f0
 
 
 
 
 
 
accbf92
a30e88c
96897f0
 
 
accbf92
96897f0
 
 
 
 
accbf92
220212e
accbf92
96897f0
accbf92
96897f0
 
 
 
 
 
 
 
 
0e6c440
a30e88c
 
0e6c440
 
253e4b2
0e6c440
 
 
57a9965
 
 
0e6c440
 
 
 
 
 
253e4b2
b96edd4
accbf92
678cd65
0e6c440
 
 
 
253e4b2
0e6c440
 
 
253e4b2
0e6c440
 
 
 
 
 
57a9965
253e4b2
f027a73
0e6c440
 
 
f027a73
0e6c440
 
 
 
f027a73
0e6c440
 
 
 
 
96897f0
a30e88c
0e6c440
 
 
 
 
f027a73
253e4b2
0e6c440
 
 
 
253e4b2
0e6c440
57a9965
 
0e6c440
 
 
 
f027a73
a30e88c
 
0e6c440
accbf92
 
 
 
 
96897f0
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
import * as THREE from 'three';
import { GLTFLoader } from 'three/addons/loaders/GLTFLoader.js';
import { PointerLockControls } from 'three/addons/controls/PointerLockControls.js';

// κ²Œμž„ μƒμˆ˜
const GAME_DURATION = 180;
const MAP_SIZE = 2000;
const TANK_HEIGHT = 0.5;
const ENEMY_GROUND_HEIGHT = 0;
const ENEMY_SCALE = 10;
const MAX_HEALTH = 1000;
const ENEMY_MOVE_SPEED = 0.1;
const ENEMY_COUNT_MAX = 5;
const PARTICLE_COUNT = 15;
const BUILDING_COUNT = 30;
const ENEMY_CONFIG = {
    ATTACK_RANGE: 100,
    ATTACK_INTERVAL: 2000,
    BULLET_SPEED: 2
};

// TankPlayer 클래슀
class TankPlayer {
    constructor() {
        this.body = null;
        this.turret = null;
        this.position = new THREE.Vector3(0, 0, 0);
        this.rotation = new THREE.Euler(0, 0, 0);
        this.turretRotation = 0;
        this.moveSpeed = 0.5;
        this.turnSpeed = 0.03;
        this.turretGroup = new THREE.Group();
        this.health = MAX_HEALTH;
        this.isLoaded = false;
        this.ammo = 10;
        this.lastShootTime = 0;
        this.shootInterval = 1000;
        this.bullets = [];
    }

    async initialize(scene, loader) {
        try {
            const bodyResult = await loader.loadAsync('/models/abramsBody.glb');
            this.body = bodyResult.scene;
            this.body.position.copy(this.position);
            
            const turretResult = await loader.loadAsync('/models/abramsTurret.glb');
            this.turret = turretResult.scene;
            
            this.turretGroup.position.y = 0.2;
            this.turretGroup.add(this.turret);
            this.body.add(this.turretGroup);
            
            this.body.traverse((child) => {
                if (child.isMesh) {
                    child.castShadow = true;
                    child.receiveShadow = true;
                }
            });
            
            this.turret.traverse((child) => {
                if (child.isMesh) {
                    child.castShadow = true;
                    child.receiveShadow = true;
                }
            });

            scene.add(this.body);
            this.isLoaded = true;
            
        } catch (error) {
            console.error('Error loading tank models:', error);
            this.isLoaded = false;
        }
    }

    shoot(scene) {
        const currentTime = Date.now();
        if (currentTime - this.lastShootTime < this.shootInterval || this.ammo <= 0) return null;

        const bulletGeometry = new THREE.SphereGeometry(0.2);
        const bulletMaterial = new THREE.MeshBasicMaterial({ color: 0x00ff00 });
        const bullet = new THREE.Mesh(bulletGeometry, bulletMaterial);

        const bulletOffset = new THREE.Vector3(0, 0.5, 2);
        bulletOffset.applyQuaternion(this.turretGroup.quaternion);
        bulletOffset.applyQuaternion(this.body.quaternion);
        bullet.position.copy(this.body.position).add(bulletOffset);

        const direction = new THREE.Vector3(0, 0, 1);
        direction.applyQuaternion(this.turretGroup.quaternion);
        direction.applyQuaternion(this.body.quaternion);
        bullet.velocity = direction.multiplyScalar(2);

        scene.add(bullet);
        this.bullets.push(bullet);
        this.ammo--;
        this.lastShootTime = currentTime;

        document.getElementById('ammo').textContent = `Ammo: ${this.ammo}/10`;
        
        return bullet;
    }

    update(mouseX, mouseY) {
        if (!this.body || !this.turretGroup) return;
        
        for (let i = this.bullets.length - 1; i >= 0; i--) {
            const bullet = this.bullets[i];
            bullet.position.add(bullet.velocity);

            if (Math.abs(bullet.position.x) > MAP_SIZE/2 || 
                Math.abs(bullet.position.z) > MAP_SIZE/2) {
                scene.remove(bullet);
                this.bullets.splice(i, 1);
            }
        }
    }

    move(direction) {
        if (!this.body) return;
        
        const moveVector = new THREE.Vector3();
        moveVector.x = direction.x * this.moveSpeed;
        moveVector.z = direction.z * this.moveSpeed;
        
        this.body.position.add(moveVector);
    }

    rotate(angle) {
        if (!this.body) return;
        this.body.rotation.y += angle * this.turnSpeed;
    }

    getPosition() {
        return this.body ? this.body.position : new THREE.Vector3();
    }

    takeDamage(damage) {
        this.health -= damage;
        return this.health <= 0;
    }
}

class Enemy {
    constructor(scene, position, type = 'tank') {
        this.scene = scene;
        this.position = position;
        this.mesh = null;
        this.type = type;
        this.health = type === 'tank' ? 100 : 200;
        this.lastAttackTime = 0;
        this.bullets = [];
        this.isLoaded = false;
        this.moveSpeed = type === 'tank' ? ENEMY_MOVE_SPEED : ENEMY_MOVE_SPEED * 0.7;
    }

    async initialize(loader) {
        try {
            const modelPath = this.type === 'tank' ? '/models/enemy1.glb' : '/models/enemy4.glb';
            const result = await loader.loadAsync(modelPath);
            this.mesh = result.scene;
            this.mesh.position.copy(this.position);
            this.mesh.scale.set(ENEMY_SCALE, ENEMY_SCALE, ENEMY_SCALE);
            
            this.mesh.traverse((child) => {
                if (child.isMesh) {
                    child.castShadow = true;
                    child.receiveShadow = true;
                }
            });
            
            this.scene.add(this.mesh);
            this.isLoaded = true;
        } catch (error) {
            console.error('Error loading enemy model:', error);
            this.isLoaded = false;
        }
    }

    update(playerPosition) {
        if (!this.mesh || !this.isLoaded) return;

        const direction = new THREE.Vector3()
            .subVectors(playerPosition, this.mesh.position)
            .normalize();
        
        this.mesh.lookAt(playerPosition);
        this.mesh.position.add(direction.multiplyScalar(this.moveSpeed));

        for (let i = this.bullets.length - 1; i >= 0; i--) {
            const bullet = this.bullets[i];
            bullet.position.add(bullet.velocity);

            if (Math.abs(bullet.position.x) > MAP_SIZE || 
                Math.abs(bullet.position.z) > MAP_SIZE) {
                this.scene.remove(bullet);
                this.bullets.splice(i, 1);
            }
        }
    }

    shoot(playerPosition) {
        const currentTime = Date.now();
        const attackInterval = this.type === 'tank' ? 
            ENEMY_CONFIG.ATTACK_INTERVAL : 
            ENEMY_CONFIG.ATTACK_INTERVAL * 1.5;

        if (currentTime - this.lastAttackTime < attackInterval) return;

        const bulletGeometry = new THREE.SphereGeometry(this.type === 'tank' ? 0.2 : 0.3);
        const bulletMaterial = new THREE.MeshBasicMaterial({ 
            color: this.type === 'tank' ? 0xff0000 : 0xff6600 
        });
        const bullet = new THREE.Mesh(bulletGeometry, bulletMaterial);

        bullet.position.copy(this.mesh.position);
        
        const direction = new THREE.Vector3()
            .subVectors(playerPosition, this.mesh.position)
            .normalize();
        
        const bulletSpeed = this.type === 'tank' ? 
            ENEMY_CONFIG.BULLET_SPEED : 
            ENEMY_CONFIG.BULLET_SPEED * 0.8;
        
        bullet.velocity = direction.multiplyScalar(bulletSpeed);
        
        this.scene.add(bullet);
        this.bullets.push(bullet);
        this.lastAttackTime = currentTime;
    }

    takeDamage(damage) {
        this.health -= damage;
        return this.health <= 0;
    }

    destroy() {
        if (this.mesh) {
            this.scene.remove(this.mesh);
            this.bullets.forEach(bullet => this.scene.remove(bullet));
            this.bullets = [];
            this.isLoaded = false;
        }
    }
}

class Particle {
    constructor(scene, position) {
        const geometry = new THREE.SphereGeometry(0.1);
        const material = new THREE.MeshBasicMaterial({ color: 0xff0000 });
        this.mesh = new THREE.Mesh(geometry, material);
        this.mesh.position.copy(position);
        
        this.velocity = new THREE.Vector3(
            (Math.random() - 0.5) * 0.3,
            Math.random() * 0.2,
            (Math.random() - 0.5) * 0.3
        );
        
        this.gravity = -0.01;
        this.lifetime = 60;
        this.age = 0;
        
        scene.add(this.mesh);
    }

    update() {
        this.velocity.y += this.gravity;
        this.mesh.position.add(this.velocity);
        this.age++;
        return this.age < this.lifetime;
    }

    destroy(scene) {
        scene.remove(this.mesh);
    }
}

class Game {
    constructor() {
        this.scene = new THREE.Scene();
        this.camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 1000);
        this.renderer = new THREE.WebGLRenderer({ antialias: true });
        this.renderer.setSize(window.innerWidth, window.innerHeight);
        this.renderer.shadowMap.enabled = true;
        document.getElementById('gameContainer').appendChild(this.renderer.domElement);

        this.tank = new TankPlayer();
        this.enemies = [];
        this.particles = [];
        this.buildings = [];
        this.loader = new GLTFLoader();
        this.controls = null;
        this.gameTime = GAME_DURATION;
        this.score = 0;
        this.isGameOver = false;
        this.isLoading = true;
        this.previousTankPosition = new THREE.Vector3();
        this.lastTime = performance.now();

        this.mouse = { x: 0, y: 0 };
        this.keys = {
            forward: false,
            backward: false,
            left: false,
            right: false
        };

        this.setupEventListeners();
        this.initialize();
        this.disposedObjects = new Set();
    }

    // 여기에 Game 클래슀의 λ‚˜λ¨Έμ§€ λ©”μ„œλ“œλ“€μ΄ λ“€μ–΄κ°‘λ‹ˆλ‹€...
    // (initialize, setupEventListeners, handleMovement, animate, checkCollisions, updateUI, endGame λ“±)

    createExplosion(position) {
        for (let i = 0; i < PARTICLE_COUNT; i++) {
            this.particles.push(new Particle(this.scene, position));
        }
    }

    updateParticles() {
        for (let i = this.particles.length - 1; i >= 0; i--) {
            const particle = this.particles[i];
            if (!particle.update()) {
                particle.destroy(this.scene);
                this.particles.splice(i, 1);
            }
        }
    }

    async createBuildings() {
        for (let i = 0; i < BUILDING_COUNT; i++) {
            const x = (Math.random() - 0.5) * MAP_SIZE;
            const z = (Math.random() - 0.5) * MAP_SIZE;
            
            const geometry = new THREE.BoxGeometry(10, 20, 10);
            const material = new THREE.MeshStandardMaterial({ color: 0x808080 });
            const building = new THREE.Mesh(geometry, material);
            
            building.position.set(x, 10, z);
            building.castShadow = true;
            building.receiveShadow = true;
            
            this.scene.add(building);
            this.buildings.push(building);
        }
    }

    spawnEnemies() {
        const spawnInterval = setInterval(() => {
            if (this.isGameOver || this.enemies.length >= ENEMY_COUNT_MAX) return;

            const angle = Math.random() * Math.PI * 2;
            const distance = 100 + Math.random() * 50;
            const x = Math.cos(angle) * distance;
            const z = Math.sin(angle) * distance;

            const enemyType = Math.random() > 0.7 ? 'heavy' : 'tank';
            const enemy = new Enemy(this.scene, new THREE.Vector3(x, ENEMY_GROUND_HEIGHT, z), enemyType);
            enemy.initialize(this.loader);
            this.enemies.push(enemy);
        }, 3000);
    }

    startGameTimer() {
        const timerInterval = setInterval(() => {
            if (this.isGameOver) {
                clearInterval(timerInterval);
                return;
            }

            this.gameTime--;
            if (this.gameTime <= 0) {
                this.endGame();
                clearInterval(timerInterval);
            }
        }, 1000);
    }

    handleLoadingError() {
        this.isLoading = false;
        document.getElementById('loading').style.display = 'none';
        document.getElementById('error').style.display = 'block';
    }
}

// κ²Œμž„ μ‹œμž‘
window.startGame = function() {
    document.getElementById('startScreen').style.display = 'none';
    document.body.requestPointerLock();
};

const game = new Game();