tanner/spaceport
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

handling window resize events

Browse Source
This commit is contained in:
Elijah Lucian 2021-03-17 10:51:19 -06:00
parent 8f536b0242
commit 03687402c9
2 changed files with 11 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
webclient/src/light.css
View File

@ -128,6 +128,7 @@ body {
.footer canvas { .footer canvas {
grid-row: 1/2; grid-row: 1/2;
grid-column: 1/2; grid-column: 1/2;
margin: auto;
} }
/* grid top */ /* grid top */

10
webclient/src/spaceport/scene.js
View File

@ -11,7 +11,9 @@ export const scene = ({ ref }) => {
let nextShip = shipInterval; let nextShip = shipInterval;
var scene = new THREE.Scene(); var scene = new THREE.Scene();
const renderer = new THREE.WebGLRenderer({ antialias: true }); const renderer = new THREE.WebGLRenderer({ antialias: true });
const width = ref.current.clientWidth; const width = ref.current.clientWidth;
const height = ref.current.clientHeight; const height = ref.current.clientHeight;
renderer.setSize(width, height); renderer.setSize(width, height);
@ -72,7 +74,15 @@ export const scene = ({ ref }) => {
ships = ships.filter((s) => !s.kill); ships = ships.filter((s) => !s.kill);
window.addEventListener('resize', onWindowResize, false);
function onWindowResize() {
camera.updateProjectionMatrix();
renderer.setSize(ref.current.clientWidth, ref.current.clientHeight);
}
requestAnimationFrame(animate); requestAnimationFrame(animate);
renderer.render(scene, camera); renderer.render(scene, camera);
}; };