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

📷

Browse Source
This commit is contained in:
= 2020-08-20 21:55:44 -06:00
parent 6634947107
commit 8bde9fde0e
3 changed files with 77 additions and 63 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

61
webclient/src/Footer.js
View File

@ -1,69 +1,14 @@
import React, { useRef, useEffect } from 'react';
import { Container, Icon } from 'semantic-ui-react';
import * as THREE from 'three/build/three.module';
import { Ship } from './spaceport/Ship';
import { scene } from './spaceport/scene';
export const Footer = () => {
const footerRef = useRef();
useEffect(() => {
if (!footerRef.current) return;
let t = 0.01;
const shipInterval = 2;
let nextShip = shipInterval;
var scene = new THREE.Scene();
const renderer = new THREE.WebGLRenderer({ antialias: true });
renderer.setSize(
footerRef.current.clientWidth,
footerRef.current.clientHeight
);
const camera = new THREE.PerspectiveCamera(65, 1, 0.01, 1000);
camera.position.set(4, 1, 4);
camera.lookAt(new THREE.Vector3(-8, 0, -2));
scene.add(camera);
footerRef.current.appendChild(renderer.domElement);
let ships = [];
const ship = new Ship();
scene.add(ship.mesh);
ships.push(ship);
const animate = () => {
const deltaTime = 0.075;
t += deltaTime;
// get mouse
if (t > nextShip) {
console.log('bing');
const ship = new Ship();
scene.add(ship.mesh);
ships.push(ship);
nextShip += shipInterval + (Math.random() - 0.5) * 2;
}
for (const ship of ships) {
ship.update({ deltaTime });
if (ship.kill) {
console.log('killing ship');
scene.remove(ship.mesh);
}
}
ships = ships.filter((s) => !s.kill);
requestAnimationFrame(animate);
renderer.render(scene, camera);
};
animate();
renderer.render(scene, camera);
scene({ ref: footerRef });
}, [footerRef]);
return (

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

@ -4,12 +4,12 @@ const SHIP_SIZE = 1;
export class Ship {
constructor() {
this.life = Math.random() * 5 + 3;
this.life = Math.random() * 5 + 7;
this.flyIn = true;
const shipGeo = new THREE.BoxGeometry(
SHIP_SIZE * 0.3,
SHIP_SIZE * 0.3,
SHIP_SIZE * 0.1,
SHIP_SIZE * 0.1,
SHIP_SIZE
);
this.mesh = new THREE.Mesh(
@ -39,7 +39,7 @@ export class Ship {
this.flyIn = false;
this.mesh.scale.z = 0.5;
this.mesh.material.color.set(
new THREE.Color(`hsl(${this.hue},70%,100%)`)
new THREE.Color(`hsl(${this.hue},0%,30%)`)
);
}
} else {
@ -58,7 +58,7 @@ export class Ship {
// accelerate away
}
if (this.mesh.position.z > 5) {
if (this.mesh.position.z > 55) {
this.kill = true;
}
}

69
webclient/src/spaceport/scene.js Normal file
View File

@ -0,0 +1,69 @@
import * as THREE from 'three/build/three.module';
import { Ship } from './Ship';
export const scene = ({ ref }) => {
let t = 0.01;
const shipInterval = 2;
let nextShip = shipInterval;
var scene = new THREE.Scene();
const renderer = new THREE.WebGLRenderer({ antialias: true });
const width = ref.current.clientWidth;
const height = ref.current.clientHeight;
renderer.setSize(width, height);
const camera = new THREE.PerspectiveCamera(65, width / height, 0.01, 1000);
camera.position.set(3, 0.5, 5);
camera.lookAt(new THREE.Vector3(-9, 0, 3));
scene.add(camera);
ref.current.appendChild(renderer.domElement);
var sphere = new THREE.SphereBufferGeometry(1);
var object = new THREE.Mesh(sphere, new THREE.MeshBasicMaterial(0xff0000));
var boxHelp = new THREE.BoxHelper(object, 0xffff00);
// scene.add(boxHelp);
let ships = [];
const ship = new Ship();
scene.add(ship.mesh);
ships.push(ship);
const animate = () => {
const deltaTime = 0.075;
t += deltaTime;
// register mouse event for 'onmove'
// get mouse x & y
// const mu = mousex / ref.width
// const mv = mousey / ref.heigh
// camera.x = sin(mu * Math.PI * 2)
// camera.z = cos(mu * Math.PI * 2)
if (t > nextShip) {
console.log('bing');
const ship = new Ship();
scene.add(ship.mesh);
ships.push(ship);
nextShip += shipInterval + (Math.random() - 0.5) * 2;
}
for (const ship of ships) {
ship.update({ deltaTime });
if (ship.kill) {
console.log('killing ship');
scene.remove(ship.mesh);
}
}
ships = ships.filter((s) => !s.kill);
requestAnimationFrame(animate);
renderer.render(scene, camera);
};
animate();
renderer.render(scene, camera);
};