admin/34307-vm
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix the player movement direction keys

Browse Source
This commit is contained in:
Flatlogic Bot 2025-09-29 17:15:51 +00:00
parent 2f1c0bce8c
commit 5681888e69
1 changed files with 80 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

87
assets/js/game.js
View File

@ -33,6 +33,79 @@ field.rotation.x = -Math.PI / 2;
field.receiveShadow = true;
scene.add(field);
// Field Lines
const lineMaterial = new THREE.LineBasicMaterial({ color: 0xffffff });
// Outer boundary
const boundary = new THREE.BufferGeometry().setFromPoints([
new THREE.Vector3(-30, 0.01, -50),
new THREE.Vector3(30, 0.01, -50),
new THREE.Vector3(30, 0.01, 50),
new THREE.Vector3(-30, 0.01, 50),
new THREE.Vector3(-30, 0.01, -50)
]);
const boundaryLine = new THREE.Line(boundary, lineMaterial);
scene.add(boundaryLine);
// Center line
const centerLineGeo = new THREE.BufferGeometry().setFromPoints([
new THREE.Vector3(-30, 0.01, 0),
new THREE.Vector3(30, 0.01, 0)
]);
const centerLine = new THREE.Line(centerLineGeo, lineMaterial);
scene.add(centerLine);
// Center circle
const centerCirclePoints = [];
const centerCircleRadius = 8;
for (let i = 0; i <= 64; i++) {
const theta = (i / 64) * Math.PI * 2;
centerCirclePoints.push(new THREE.Vector3(Math.cos(theta) * centerCircleRadius, 0.01, Math.sin(theta) * centerCircleRadius));
}
const centerCircleGeo = new THREE.BufferGeometry().setFromPoints(centerCirclePoints);
const centerCircleLine = new THREE.Line(centerCircleGeo, lineMaterial);
scene.add(centerCircleLine);
// Penalty Boxes
const penaltyBox1Geo = new THREE.BufferGeometry().setFromPoints([
new THREE.Vector3(15, 0.01, -50),
new THREE.Vector3(15, 0.01, -35),
new THREE.Vector3(-15, 0.01, -35),
new THREE.Vector3(-15, 0.01, -50),
new THREE.Vector3(15, 0.01, -50)
]);
const penaltyBox1 = new THREE.Line(penaltyBox1Geo, lineMaterial);
scene.add(penaltyBox1);
const penaltyBox2Geo = new THREE.BufferGeometry().setFromPoints([
new THREE.Vector3(15, 0.01, 50),
new THREE.Vector3(15, 0.01, 35),
new THREE.Vector3(-15, 0.01, 35),
new THREE.Vector3(-15, 0.01, 50),
new THREE.Vector3(15, 0.01, 50)
]);
const penaltyBox2 = new THREE.Line(penaltyBox2Geo, lineMaterial);
scene.add(penaltyBox2);
// Goals
const goalGeometry = new THREE.BoxGeometry(20, 5, 2);
const goalMaterial = new THREE.MeshStandardMaterial({ color: 0xCCCCCC, metalness: 0.8, roughness: 0.2 });
const goal1 = new THREE.Group();
const post1_1 = new THREE.Mesh(new THREE.BoxGeometry(1, 5, 1), goalMaterial);
post1_1.position.set(-10, 2.5, 0);
const post1_2 = new THREE.Mesh(new THREE.BoxGeometry(1, 5, 1), goalMaterial);
post1_2.position.set(10, 2.5, 0);
const crossbar1 = new THREE.Mesh(new THREE.BoxGeometry(21, 1, 1), goalMaterial);
crossbar1.position.set(0, 5, 0);
goal1.add(post1_1, post1_2, crossbar1);
goal1.position.z = -50;
scene.add(goal1);
const goal2 = goal1.clone();
goal2.position.z = 50;
scene.add(goal2);
// Player
const playerGeometry = new THREE.CapsuleGeometry(1, 2, 4, 8);
const playerMaterial = new THREE.MeshStandardMaterial({ color: 0xff0000 }); // Red player
@ -64,17 +137,17 @@ const playerSpeed = 0.2;
function updatePlayerPosition() {
if (keyboardState['ArrowUp']) {
player.position.z -= playerSpeed;
}
if (keyboardState['ArrowDown']) {
player.position.z += playerSpeed;
}
if (keyboardState['ArrowLeft']) {
player.position.x -= playerSpeed;
}
if (keyboardState['ArrowRight']) {
if (keyboardState['ArrowDown']) {
player.position.x += playerSpeed;
}
if (keyboardState['ArrowLeft']) {
player.position.z += playerSpeed;
}
if (keyboardState['ArrowRight']) {
player.position.z -= playerSpeed;
}
}
// Animation Loop