Spaces:
Running
Running
Create game.js
Browse files
game.js
ADDED
@@ -0,0 +1,170 @@
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
1 |
+
// Define variables
|
2 |
+
var scene, camera, renderer, controls, clock;
|
3 |
+
var geometry, material, mesh;
|
4 |
+
var raycaster, mouse;
|
5 |
+
var enemies = [];
|
6 |
+
var towers = [];
|
7 |
+
var projectiles = [];
|
8 |
+
|
9 |
+
// Initialize game
|
10 |
+
init();
|
11 |
+
animate();
|
12 |
+
|
13 |
+
function init() {
|
14 |
+
// Create scene
|
15 |
+
scene = new THREE.Scene();
|
16 |
+
|
17 |
+
// Create camera
|
18 |
+
camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 1000);
|
19 |
+
camera.position.set(0, 10, 20);
|
20 |
+
|
21 |
+
// Create renderer
|
22 |
+
renderer = new THREE.WebGLRenderer();
|
23 |
+
renderer.setSize(window.innerWidth, window.innerHeight);
|
24 |
+
document.body.appendChild(renderer.domElement);
|
25 |
+
|
26 |
+
// Add controls
|
27 |
+
controls = new THREE.OrbitControls(camera, renderer.domElement);
|
28 |
+
|
29 |
+
// Add clock
|
30 |
+
clock = new THREE.Clock();
|
31 |
+
|
32 |
+
// Create ground
|
33 |
+
geometry = new THREE.PlaneGeometry(100, 100);
|
34 |
+
material = new THREE.MeshBasicMaterial({color: 0x00ff00, side: THREE.DoubleSide});
|
35 |
+
mesh = new THREE.Mesh(geometry, material);
|
36 |
+
mesh.rotateX(-Math.PI / 2);
|
37 |
+
scene.add(mesh);
|
38 |
+
|
39 |
+
// Add towers
|
40 |
+
addTower(5, 0, 5);
|
41 |
+
addTower(-5, 0, -5);
|
42 |
+
|
43 |
+
// Add enemies
|
44 |
+
addEnemy(0, 0, -10);
|
45 |
+
addEnemy(0, 0, -20);
|
46 |
+
|
47 |
+
// Add raycaster and mouse
|
48 |
+
raycaster = new THREE.Raycaster();
|
49 |
+
mouse = new THREE.Vector2();
|
50 |
+
|
51 |
+
// Add event listeners
|
52 |
+
window.addEventListener('resize', onWindowResize, false);
|
53 |
+
window.addEventListener('click', onClick, false);
|
54 |
+
}
|
55 |
+
|
56 |
+
function animate() {
|
57 |
+
requestAnimationFrame(animate);
|
58 |
+
|
59 |
+
// Move enemies
|
60 |
+
for (var i = 0; i < enemies.length; i++) {
|
61 |
+
var enemy = enemies[i];
|
62 |
+
enemy.position.z += 0.1;
|
63 |
+
|
64 |
+
// Check if enemy is at end of path
|
65 |
+
if (enemy.position.z > 10) {
|
66 |
+
scene.remove(enemy);
|
67 |
+
enemies.splice(i, 1);
|
68 |
+
}
|
69 |
+
}
|
70 |
+
|
71 |
+
// Check for tower range and shoot
|
72 |
+
for (var i = 0; i < towers.length; i++) {
|
73 |
+
var tower = towers[i];
|
74 |
+
var towerPosition = tower.position.clone();
|
75 |
+
towerPosition.y = 0.5;
|
76 |
+
|
77 |
+
// Find nearest enemy
|
78 |
+
var nearestEnemy = null;
|
79 |
+
var nearestDistance = Infinity;
|
80 |
+
for (var j = 0; j < enemies.length; j++) {
|
81 |
+
var enemy = enemies[j];
|
82 |
+
var distance = enemy.position.distanceTo(towerPosition);
|
83 |
+
if (distance < nearestDistance) {
|
84 |
+
nearestEnemy = enemy;
|
85 |
+
nearestDistance = distance;
|
86 |
+
}
|
87 |
+
}
|
88 |
+
|
89 |
+
// Shoot projectile
|
90 |
+
if (nearestEnemy && nearestDistance <= 5) {
|
91 |
+
var projectile = new THREE.Mesh(new THREE.SphereGeometry(0.1, 8, 8), new THREE.MeshBasicMaterial({color: 0xff0000}));
|
92 |
+
projectile.position.set(tower.position.x, tower.position.y + 0.5, tower.position.z);
|
93 |
+
projectiles.push(projectile);
|
94 |
+
scene.add(projectile);
|
95 |
+
// Remove enemy if hit
|
96 |
+
var index = enemies.indexOf(nearestEnemy);
|
97 |
+
if (index !== -1) {
|
98 |
+
scene.remove(nearestEnemy);
|
99 |
+
enemies.splice(index, 1);
|
100 |
+
}
|
101 |
+
}
|
102 |
+
}
|
103 |
+
|
104 |
+
// Move projectiles
|
105 |
+
for (var i = 0; i < projectiles.length; i++) {
|
106 |
+
var projectile = projectiles[i];
|
107 |
+
projectile.position.z -= 0.5;
|
108 |
+
|
109 |
+
// Remove projectile if it hits enemy or end of path
|
110 |
+
for (var j = 0; j < enemies.length; j++) {
|
111 |
+
var enemy = enemies[j];
|
112 |
+
if (projectile.position.distanceTo(enemy.position) <= 0.5) {
|
113 |
+
scene.remove(enemy);
|
114 |
+
enemies.splice(j, 1);
|
115 |
+
scene.remove(projectile);
|
116 |
+
projectiles.splice(i, 1);
|
117 |
+
break;
|
118 |
+
}
|
119 |
+
}
|
120 |
+
if (projectile.position.z < -10) {
|
121 |
+
scene.remove(projectile);
|
122 |
+
projectiles.splice(i, 1);
|
123 |
+
}
|
124 |
+
}
|
125 |
+
|
126 |
+
// Render scene
|
127 |
+
renderer.render(scene, camera);
|
128 |
+
|
129 |
+
// Update controls
|
130 |
+
controls.update();
|
131 |
+
|
132 |
+
// Update clock
|
133 |
+
var delta = clock.getDelta();
|
134 |
+
}
|
135 |
+
|
136 |
+
function addTower(x, y, z) {
|
137 |
+
var tower = new THREE.Mesh(new THREE.BoxGeometry(1, 2, 1), new THREE.MeshBasicMaterial({color: 0xff0000}));
|
138 |
+
tower.position.set(x, y + 1, z);
|
139 |
+
towers.push(tower);
|
140 |
+
scene.add(tower);
|
141 |
+
}
|
142 |
+
|
143 |
+
function addEnemy(x, y, z) {
|
144 |
+
var enemy = new THREE.Mesh(new THREE.BoxGeometry(1, 1, 1), new THREE.MeshBasicMaterial({color: 0x0000ff}));
|
145 |
+
enemy.position.set(x, y + 0.5, z);
|
146 |
+
enemies.push(enemy);
|
147 |
+
scene.add(enemy);
|
148 |
+
}
|
149 |
+
|
150 |
+
function onWindowResize() {
|
151 |
+
camera.aspect = window.innerWidth / window.innerHeight;
|
152 |
+
camera.updateProjectionMatrix();
|
153 |
+
renderer.setSize(window.innerWidth, window.innerHeight);
|
154 |
+
}
|
155 |
+
|
156 |
+
function onClick(event) {
|
157 |
+
// Calculate mouse position
|
158 |
+
mouse.x = (event.clientX / window.innerWidth) * 2 - 1;
|
159 |
+
mouse.y = -(event.clientY / window.innerHeight) * 2 + 1;
|
160 |
+
|
161 |
+
// Cast ray from camera
|
162 |
+
raycaster.setFromCamera(mouse, camera);
|
163 |
+
|
164 |
+
// Check for tower placement
|
165 |
+
var intersects = raycaster.intersectObjects([mesh]);
|
166 |
+
if (intersects.length > 0) {
|
167 |
+
var point = intersects[0].point;
|
168 |
+
addTower(point.x, point.y, point.z);
|
169 |
+
}
|
170 |
+
}
|