- Starting solo game with physics
This commit is contained in:
Kum1ta
2024-08-29 18:43:23 +02:00
parent dc0b8fb950
commit 773d996627
5 changed files with 121 additions and 101 deletions

View File

@ -6,7 +6,7 @@
/* By: edbernar <edbernar@student.42angouleme. +#+ +:+ +#+ */
/* +#+#+#+#+#+ +#+ */
/* Created: 2024/08/28 12:07:39 by edbernar #+# #+# */
/* Updated: 2024/08/29 00:19:01 by edbernar ### ########.fr */
/* Updated: 2024/08/29 13:58:06 by edbernar ### ########.fr */
/* */
/* ************************************************************************** */
@ -32,6 +32,7 @@ class SoloGame
renderer = new THREE.WebGLRenderer({antialias: true});
renderer.shadowMap.enabled = true;
renderer.shadowMap.type = THREE.PCFSoftShadowMap;
Ball.create(scene);
Map.create(scene);
camera = new THREE.PerspectiveCamera(40, window.innerWidth / window.innerHeight);
camera.rotation.x = -Math.PI / 2;
@ -39,15 +40,11 @@ class SoloGame
scene.background = new THREE.Color(0x252525);
document.body.appendChild(renderer.domElement);
Players.create(scene);
Ball.create(scene);
controls = new OrbitControls(camera, renderer.domElement);
camera.position.set(0, 20, 0);
// camera.position.set(20, 5, 20);
renderer.setAnimationLoop(loop);
setTimeout(() => {
Ball.moveBall();
}, 1000);
}
static dispose()
@ -78,6 +75,8 @@ function loop()
{
stats.begin();
controls.update();
Ball.update();
Map.update();
Players.update();
renderer.render(scene, camera);
stats.end();

View File

@ -6,7 +6,7 @@
/* By: edbernar <edbernar@student.42angouleme. +#+ +:+ +#+ */
/* +#+#+#+#+#+ +#+ */
/* Created: 2024/08/28 15:58:03 by edbernar #+# #+# */
/* Updated: 2024/08/29 00:44:26 by edbernar ### ########.fr */
/* Updated: 2024/08/29 13:45:02 by edbernar ### ########.fr */
/* */
/* ************************************************************************** */
@ -23,12 +23,10 @@ class Ball
{
static create(scene)
{
ball = createBall();
scene.add(ball);
ball.rotateY(0.8);
ball.rotateY(2.39);
}
static dispose()
@ -36,36 +34,10 @@ class Ball
ball = null;
}
static moveBall()
static update()
{
createInterval();
}
static stopBall()
{
if (interval)
clearInterval(interval);
}
}
function createInterval()
{
interval = setInterval(() => {
console.log(ball.position);
moveForward();
bounceWallTop();
bounceWallTBottom();
bouncePlayer1();
}, 16);
}
function moveForward()
{
const direction = new THREE.Vector3(0, 0, dir);
direction.applyQuaternion(ball.quaternion);
ball.position.add(direction.multiplyScalar(speed));
}
function createBall()
@ -81,55 +53,4 @@ function createBall()
return (mesh);
}
function bounceWallTop()
{
const origin = new THREE.Vector3(ball.position.x, ball.position.y, ball.position.z);
const direction = new THREE.Vector3(ball.position.x, ball.position.y, ball.position.z - 1);
direction.normalize();
const raycaster = new THREE.Raycaster(origin, direction);
const objects = [ wallTop ];
const intersects = raycaster.intersectObjects(objects);
if (intersects.length > 0)
{
if (intersects[0].distance <= 0.5)
ball.rotation.y = Math.PI - ball.rotation.y
}
}
function bounceWallTBottom()
{
const origin = new THREE.Vector3(ball.position.x, ball.position.y, ball.position.z);
const direction = new THREE.Vector3(ball.position.x, ball.position.y, ball.position.z + 1);
direction.normalize();
const raycaster = new THREE.Raycaster(origin, direction);
const objects = [ wallBottom ];
const intersects = raycaster.intersectObjects(objects);
if (intersects.length > 0)
{
if (intersects[0].distance <= 0.4)
ball.rotation.y = Math.PI - ball.rotation.y;
}
}
function bouncePlayer1()
{
const origin = new THREE.Vector3(ball.position.x, ball.position.y, ball.position.z);
const direction = new THREE.Vector3(ball.position.x - 1, ball.position.y, ball.position.z);
direction.normalize();
const raycaster = new THREE.Raycaster(origin, direction);
const objects = [ player1 ];
const intersects = raycaster.intersectObjects(objects);
if (intersects.length > 0)
{
if (intersects[0].distance <= 0.4)
ball.rotation.y = Math.PI - ball.rotation.y;
}
}
export { Ball };
export { Ball, ball };

View File

@ -6,23 +6,35 @@
/* By: edbernar <edbernar@student.42angouleme. +#+ +:+ +#+ */
/* +#+#+#+#+#+ +#+ */
/* Created: 2024/08/28 12:23:48 by edbernar #+# #+# */
/* Updated: 2024/08/28 17:01:17 by edbernar ### ########.fr */
/* Updated: 2024/08/29 18:42:55 by edbernar ### ########.fr */
/* */
/* ************************************************************************** */
import * as CANNON from 'cannon-es';
import * as THREE from 'three';
import { ball } from './Ball.js'
const width = 25;
const height = 12.5;
let spotLight = null;
let wallTop = null;
let wallBottom = null;
const width = 25;
const height = 12.5;
let ground = null;
let spotLight = null;
let wallTop = null;
let wallBottom = null;
let world = null;
const timeStep = 1 / 60;
let groundBody = null;
let wallTopBody = null;
let wallBottomBody = null;
let ballBody = null;
class Map
{
static create(scene)
{
createGround(scene);
world = new CANNON.World({
gravity: new CANNON.Vec3(0, -9.81, 0),
});
ground = createGround(scene);
wallBottom = createWall(false);
wallTop = createWall(true);
spotLight = new THREE.SpotLight({color: 0xffffff});
@ -33,6 +45,33 @@ class Map
scene.add(wallTop);
scene.add(wallBottom);
scene.add(new THREE.AmbientLight(0xffffff, 0.5));
wallTopBody = new CANNON.Body({
shape: new CANNON.Box(new CANNON.Vec3(width, 0.7, 0.2)),
type: CANNON.Body.STATIC,
})
wallTopBody.position.z = -6.15;
wallTopBody.position.y += 0.35;
world.addBody(wallTopBody);
wallBottomBody = new CANNON.Body({
shape: new CANNON.Box(new CANNON.Vec3(width, 0.7, 0.2)),
type: CANNON.Body.STATIC,
})
wallBottomBody.position.z = 6.15;
wallBottomBody.position.y += 0.35;
world.addBody(wallBottomBody);
groundBody = new CANNON.Body({
shape: new CANNON.Plane(),
type: CANNON.Body.STATIC,
});
groundBody.quaternion.setFromEuler(-Math.PI / 2, 0, 0);
world.addBody(groundBody);
ballBody = new CANNON.Body({
shape: new CANNON.Sphere(0.3),
mass: 1
});
ballBody.position.set(0, 2, 0);
ballBody.velocity.set(0, 0, 0);
world.addBody(ballBody);
}
static dispose()
@ -41,6 +80,19 @@ class Map
spotLight.dispose();
spotLight = null;
}
static update()
{
world.step(timeStep);
ground.position.copy(groundBody.position);
ground.quaternion.copy(groundBody.quaternion);
ball.position.copy(ballBody.position);
ball.quaternion.copy(ballBody.quaternion);
wallBottom.position.copy(wallBottomBody.position);
wallBottom.quaternion.copy(wallBottomBody.quaternion);
wallTop.position.copy(wallTopBody.position);
wallTop.quaternion.copy(wallTopBody.quaternion);
}
}
function createGround(scene)
@ -52,6 +104,7 @@ function createGround(scene)
mesh.rotateX(-Math.PI / 2);
mesh.position.set(0, 0, 0);
scene.add(mesh);
return (mesh);
}
function createWall(onTop)
@ -60,11 +113,11 @@ function createWall(onTop)
const material = new THREE.MeshPhysicalMaterial({color: 0x333333});
const mesh = new THREE.Mesh(geometry, material);
if (onTop)
mesh.position.z = -6.15;
else
mesh.position.z = 6.15;
mesh.position.y += 0.35;
// if (onTop)
// mesh.position.z = -6.15;
// else
// mesh.position.z = 6.15;
// mesh.position.y += 0.35;
return (mesh);
}

View File

@ -6,7 +6,11 @@
"": {
"dependencies": {
"@rollup/rollup-darwin-arm64": "^4.21.0",
"cannon-es": "^0.20.0",
"rollup": "^4.21.0",
"stats": "^1.0.0",
"stats-js": "^1.0.1",
"statsjs": "^1.0.7",
"three": "^0.167.1",
"vite": "^5.4.1"
}
@ -592,6 +596,20 @@
"integrity": "sha512-/kYRxGDLWzHOB7q+wtSUQlFrtcdUccpfy+X+9iMBpHK8QLLhx2wIPYuS5DYtR9Wa/YlZAbIovy7qVdB1Aq6Lyw==",
"license": "MIT"
},
"node_modules/cannon-es": {
"version": "0.20.0",
"resolved": "https://registry.npmjs.org/cannon-es/-/cannon-es-0.20.0.tgz",
"integrity": "sha512-eZhWTZIkFOnMAJOgfXJa9+b3kVlvG+FX4mdkpePev/w/rP5V8NRquGyEozcjPfEoXUlb+p7d9SUcmDSn14prOA==",
"license": "MIT"
},
"node_modules/commander": {
"version": "0.5.2",
"resolved": "https://registry.npmjs.org/commander/-/commander-0.5.2.tgz",
"integrity": "sha512-/IKo89++b1UhClEhWvKk00gKgw6iwvwD8TOPTqqN9AyvjgPCnf9OrjnDNY3dPDOj+K+OhN9SRjYQH0AfX0bROw==",
"engines": {
"node": ">= 0.4.x"
}
},
"node_modules/esbuild": {
"version": "0.21.5",
"resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.21.5.tgz",
@ -740,6 +758,31 @@
"node": ">=0.10.0"
}
},
"node_modules/stats": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/stats/-/stats-1.0.0.tgz",
"integrity": "sha512-YmKiMSrDaYA8Iu8/mPbZQmQLfzUrCstea60zPLkBMjpUveRh89GLipU/7AuMRAAX3aMmnseSuJtkgpPv29VoqA==",
"dependencies": {
"commander": "0.5.2"
},
"bin": {
"stats": "bin/stats"
},
"engines": {
"node": ">=0.4.x"
}
},
"node_modules/stats-js": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/stats-js/-/stats-js-1.0.1.tgz",
"integrity": "sha512-EAwEFghGNv8mlYC4CZzI5kWghsnP8uBKXw6VLRHtXkOk5xySfUKLTqTkjgJFfDluIkf/O7eZwi5MXP50VeTbUg==",
"license": "MIT"
},
"node_modules/statsjs": {
"version": "1.0.7",
"resolved": "https://registry.npmjs.org/statsjs/-/statsjs-1.0.7.tgz",
"integrity": "sha512-fch+88pDPk8y4BwFwStMQR52vgJnrTHPtY15UBSkR8QAAjVBkntrFIiuDTRdknoIabfMEF7qaGhOBI+V4RtMkA=="
},
"node_modules/three": {
"version": "0.167.1",
"resolved": "https://registry.npmjs.org/three/-/three-0.167.1.tgz",

View File

@ -4,7 +4,11 @@
},
"dependencies": {
"@rollup/rollup-darwin-arm64": "^4.21.0",
"cannon-es": "^0.20.0",
"rollup": "^4.21.0",
"stats": "^1.0.0",
"stats-js": "^1.0.1",
"statsjs": "^1.0.7",
"three": "^0.167.1",
"vite": "^5.4.1"
}