skycraft: now with celestial bodies

This commit is contained in:
Paul Mathieu 2022-10-18 14:45:17 -07:00
parent 3e9bad8929
commit 2fccb1fb7c

View File

@ -4,6 +4,43 @@ import * as se3 from '../se3';
import {loadTexture, makeProgram} from '../gl';
import {makeFace, makeBufferFromFaces} from '../geometry';
const linalg = {
cross: (a, b) => {
return [
a[1] * b[2] - a[2] * b[1],
a[2] * b[0] - a[0] * b[2],
a[0] * b[1] - a[1] * b[0],
];
},
diff: (a, b) => {
return [
a[0] - b[0],
a[1] - b[1],
a[2] - b[2],
];
},
add: (a, b) => {
return [
a[0] + b[0],
a[1] + b[1],
a[2] + b[2],
];
},
norm: a => {
return Math.sqrt(a[0]**2 + a[1]**2 + a[2]**2);
},
dot: (a, b) => {
return a[0] * b[0] + a[1] * b[1] + a[2] * b[2];
},
scale: (a, s) => {
return [
a[0] * s,
a[1] * s,
a[2] * s,
];
},
};
const VSHADER = `
attribute vec3 aPosition;
attribute vec3 aNormal;
@ -218,6 +255,385 @@ function getOrbitDrawContext(gl) {
};
}
const BlockType = {
UNDEFINED: 0,
AIR: 1,
DIRT: 2,
GRASS: 3,
STONE: 4,
WATER: 5,
TREE: 6,
LEAVES: 7,
SUN: 8,
};
const CHUNKSIZE = 32;
/** seed: some kind of number uniquely defining the body
* x, y, z: space coordinates in the body's frame
*
* returns: a chunk
*/
function getChunk(seed, x, y, z) {
// XXX: for now, return a premade chunk: a 24x24x24 cube of dirt
// surrounded by 4 blocks of air all around
const cs = CHUNKSIZE;
if (seed !== 1337) {
return {};
}
// if (Math.abs
const blocks = new Array(cs * cs * cs);
blocks.fill(BlockType.AIR);
const dirt = new Array(24).fill(BlockType.DIRT);
for (let i = 0; i < 24; i++) {
for (let j = 4; j < 28; j++) {
const offset = cs * cs * (i + 4) + cs * j;
blocks.splice(offset + 4, 24, ...dirt);
}
}
const half = cs / 2;
return {
position: [-half, -half, -half],
blocks,
underground: false,
};
}
function getBodyChunks(seed) {
if (seed === 0) {
return makeSun();
}
return [getChunk(seed, 0, 0, 0)];
}
function faceTexture(type, dir) {
switch (type) {
case BlockType.GRASS:
switch (dir) {
case '+y': return [0, 15];
case '-y': return [2, 15];
default: return [1, 15];
}
case BlockType.DIRT: return [2, 15];
case BlockType.STONE: return [3, 15];
case BlockType.WATER: return [4, 15];
case BlockType.TREE:
switch (dir) {
case '+y':
case '-y':
return [5, 15];
default: return [6, 15];
}
case BlockType.LEAVES: return [7, 15];
case BlockType.SUN: return [0, 4];
default: return [0, 0];
}
}
function* makeChunkFaces(chunk) {
const cs = CHUNKSIZE;
function faceCenter(pos, dir) {
switch (dir) {
case '-x': return [pos[0] - 0.5, pos[1], pos[2]];
case '+x': return [pos[0] + 0.5, pos[1], pos[2]];
case '-y': return [pos[0], pos[1] - 0.5, pos[2]];
case '+y': return [pos[0], pos[1] + 0.5, pos[2]];
case '-z': return [pos[0], pos[1], pos[2] - 0.5];
case '+z': return [pos[0], pos[1], pos[2] + 0.5];
}
}
function* neighbors(x, y, z) {
const idx = (
z * cs * cs +
y * cs +
x
);
if (x > 0) {
yield {
block: chunk.blocks[idx - 1],
dir: '-x',
};
} else {
yield {
block: BlockType.AIR,
dir: '-x',
};
}
if (x < 31) {
yield {
block: chunk.blocks[idx + 1],
dir: '+x',
};
} else {
yield {
block: BlockType.AIR,
dir: '+x',
};
}
if (y > 0) {
yield {
block: chunk.blocks[idx - cs],
dir: '-y',
};
} else {
yield {
block: BlockType.AIR,
dir: '-y',
};
}
if (y < 31) {
yield {
block: chunk.blocks[idx + cs],
dir: '+y',
};
} else {
yield {
block: BlockType.AIR,
dir: '+y',
};
}
if (z > 0) {
yield {
block: chunk.blocks[idx - cs * cs],
dir: '-z',
};
} else {
yield {
block: BlockType.AIR,
dir: '-z',
};
}
if (z < 31) {
yield {
block: chunk.blocks[idx + cs * cs],
dir: '+z',
};
} else {
yield {
block: BlockType.AIR,
dir: '+z',
};
}
}
for (let x = 0; x < cs; x++) {
for (let y = 0; y < cs; y++) {
for (let z = 0; z < cs; z++) {
const idx = (
z * cs * cs +
y * cs +
x
);
const chpos = chunk.position;
const bkpos = [
chpos[0] + x,
chpos[1] + y,
chpos[2] + z,
];
const bt = chunk.blocks[idx];
if (bt === BlockType.AIR) {
continue;
}
for (const {block, dir} of neighbors(x, y, z)) {
if (block !== BlockType.AIR) {
continue;
}
yield makeFace(dir, faceTexture(bt), faceCenter(bkpos, dir));
}
}
}
}
}
function closeToPlanet(context) {
const body = findSoi(context);
const relativePos = linalg.diff(context.player.position, body.position);
return linalg.norm(relativePos) < 20;
}
function makeSun(seed) {
const radius = 79;
const radiusChunks = Math.floor(radius / CHUNKSIZE);
const chunks = [];
function makeSunChunk(i, j, k) {
const cs = CHUNKSIZE;
const half = cs / 2;
const blocks = new Array(cs**3);
blocks.fill(BlockType.SUN);
let underground = true;
for (let x = 0; x < cs; x++) {
for (let y = 0; y < cs; y++) {
for (let z = 0; z < cs; z++) {
const pos = [
x + i * cs - half,
y + j * cs - half,
z + k * cs - half,
];
const idx = (
z * cs * cs +
y * cs +
x
);
if (pos[0]**2 + pos[1]**2 + pos[2]**2 > radius**2) {
blocks[idx] = BlockType.AIR;
underground = false;
}
}
}
}
return {
position: [i * cs - half, j * cs - half, k * cs - half],
blocks,
underground,
};
}
for (let i = -radiusChunks; i <= radiusChunks; i++) {
for (let j = -radiusChunks; j <= radiusChunks; j++) {
for (let k = -radiusChunks; k <= radiusChunks; k++) {
chunks.push(makeSunChunk(i, j, k));
}
}
}
return chunks;
}
function getBodyGeometry(seed) {
const faces = getBodyChunks(seed)
.filter(chunk => !chunk.underground)
.map(chunk => [...makeChunkFaces(chunk)]);
return faces.reduce((a, b) => a.concat(b));
}
function getSolarSystem(seed) {
/// XXX: only returns 1 body for now
return {
name: 'Tat',
mass: 1000.0,
spin: [0, 0, 0.2],
geometry: getBodyGeometry(0),
children: [
{
name: 'Quicksilver',
seed: 1336,
mass: 0.1,
spin: [0.0, 0.0, 0.05],
geometry: makeCube([0, 4]),
orbit: {
excentricity: 0.0,
semimajorAxis: 200,
inclination: 0.8,
ascendingNodeLongitude: 0,
periapsisArgument: 0,
t0: 0,
},
},
{
name: 'Satourne',
seed: 1338,
mass: 0.1,
spin: [0.0, 0.5, 0.0],
geometry: makeCube([0, 5]),
orbit: {
excentricity: 0.0,
semimajorAxis: 900,
inclination: 0.0,
ascendingNodeLongitude: 0,
periapsisArgument: 0,
t0: 0,
},
children: [
{
name: 'Kyoujin',
seed: 13381,
mass: 0.01,
spin: [0.0, 0.0, 0.05],
geometry: makeCube([0, 6]),
orbit: {
excentricity: 0.0,
semimajorAxis: 20,
inclination: Math.PI / 2,
ascendingNodeLongitude: 0,
periapsisArgument: 0,
t0: 0,
},
},
],
},
{
name: 'Tataooine',
seed: 1337,
mass: 50,
spin: [0.0, 0.0, 0.05],
geometry: getBodyGeometry(1337),
orbit: {
excentricity: 0.3,
semimajorAxis: 500,
inclination: 0.0,
ascendingNodeLongitude: 0,
periapsisArgument: 0,
t0: 0,
},
children: [
{
name: 'Mun',
seed: 13371,
mass: 0.01,
spin: [0.0, 0.0, 0.05],
geometry: makeCube([0, 7]),
orbit: {
excentricity: 0.0,
semimajorAxis: 50,
inclination: Math.PI / 2,
ascendingNodeLongitude: 0,
periapsisArgument: 0,
t0: 0,
},
},
],
},
],
};
}
function initUiListeners(canvas, context) {
const canvasClickHandler = () => {
canvas.requestPointerLock();
@ -240,13 +656,20 @@ function initUiListeners(canvas, context) {
switch (e.code) {
case 'KeyF':
// context.flying = !context.flying;
context.flying = !context.flying;
context.player.velocity = [0, 0, 0];
delete context.orbit;
return false;
case 'KeyL':
if (closeToPlanet(context)) {
context.landing = True;
}
return false;
case 'Space':
if (!context.flying) {
if (context.jumpAmount > 0) {
const amount = context.jumpForce;
context.camera.velocity[1] = amount;
context.player.velocity[1] = amount;
context.jumpAmount -= 1;
}
}
@ -257,12 +680,12 @@ function initUiListeners(canvas, context) {
}
};
const moveListener = e => {
context.camera.orientation[1] -= e.movementX / 500;
context.camera.orientation[0] -= e.movementY / 500;
context.camera.orientation[0] = Math.min(Math.max(
context.camera.orientation[0], -Math.PI / 2
), Math.PI / 2);
context.camera.orientation[1] -= e.movementX / 500;
context.camera.tf = se3.product(
se3.roty(context.camera.orientation[1]),
se3.rotx(context.camera.orientation[0]),
);
};
const changeListener = () => {
if (document.pointerLockElement === canvas) {
@ -294,63 +717,216 @@ function initUiListeners(canvas, context) {
function handleInput(context) {
const move = (forward, right) => {
const dir = [right, 0, -forward, 1.0];
const ori = se3.roty(context.camera.orientation[1]);
const tf = se3.apply(ori, dir);
const maxSpeed = 8;
const airMovement = 0.08;
if (context.keys.has('ShiftLeft')) {
forward *= 10;
right *= 10;
}
const tf = se3.product(
se3.orientationOnly(context.player.tf),
context.camera.tf,
);
const dir = [right, 0, -forward, 10];
if (context.flying) {
context.camera.position[0] += tf[0] / 60;
context.camera.position[2] += tf[2] / 60;
}
if (context.isOnGround) {
context.camera.velocity[0] = tf[0];
context.camera.velocity[2] = tf[2];
context.player.tf = [
context.player.tf,
context.camera.tf,
se3.translation(...dir),
].reduce(se3.product);
context.camera.tf = se3.identity();
context.camera.orientation = [0, 0, 0];
} else {
const vel = context.camera.velocity;
vel[0] += tf[0] * airMovement;
vel[2] += tf[2] * airMovement;
const curVel = Math.sqrt(vel[0] * vel[0] + vel[2] * vel[2]);
if (curVel > maxSpeed) {
vel[0] *= maxSpeed / curVel;
vel[2] *= maxSpeed / curVel;
}
const vel = context.player.velocity;
const dv = linalg.scale(se3.apply(tf, dir), 1/dir[3]);
context.player.velocity = linalg.add(vel, dv);
delete context.orbit;
}
};
context.keys.forEach(key => {
switch (key) {
case 'KeyW':
move(8, 0.0);
move(0.5, 0.0);
return;
case 'KeyA':
move(0.0, -8);
move(0.0, -0.5);
return;
case 'KeyS':
move(-8, 0.0);
move(-0.5, 0.0);
return;
case 'KeyD':
move(0.0, 8);
return;
case 'Space':
if (context.flying) {
context.camera.position[1] += 8 / 60;
}
return;
case 'ShiftLeft':
context.camera.position[1] -= 8 / 60;
move(0.0, 0.5);
return;
}
});
}
function updateBodyPhysics(time, body, parentBody) {
if (parentBody !== undefined) {
const mu = parentBody.mass;
const {position, velocity} = getCartesianState(body.orbit, mu, time);
body.position = [
parentBody.position[0] + position[0],
parentBody.position[1] + position[1],
parentBody.position[2] + position[2],
];
body.velocity = [
parentBody.velocity[0] + velocity[0],
parentBody.velocity[1] + velocity[1],
parentBody.velocity[2] + velocity[2],
];
} else {
body.position = [0, 0, 0];
body.velocity = [0, 0, 0];
}
body.orientation = getOrientation(body, time);
if (body.children !== undefined) {
for (const child of body.children) {
updateBodyPhysics(time, child, body);
}
}
}
function findSoi(context) {
const bodies = [context.universe];
let body;
while (bodies.length > 0) {
body = bodies.shift();
if (body.children === undefined) {
return body;
}
for (const child of body.children) {
const soi = child.orbit.semimajorAxis * Math.pow(child.mass / body.mass, 2/5);
const pos = context.player.position;
const bod = child.position;
const dr = [pos[0] - bod[0], pos[1] - bod[1], pos[2] - bod[2]];
if (dr[0]**2 + dr[1]**2 + dr[2]**2 < soi**2) {
bodies.push(child);
}
}
}
return body;
}
function computeOrbit(player, body, time) {
const {cross, diff, norm, dot, scale} = linalg;
const rvec = diff(player.position, body.position);
const r = norm(rvec);
if (norm(player.velocity) < 1e-6) {
// cheating
console.log('cheating');
player.velocity = scale(cross([1, 1, 1], rvec), 0.01/(r**2));
}
const vvec = diff(player.velocity, body.velocity);
const v = norm(vvec);
const Hvec = cross(rvec, vvec);
const H = norm(Hvec);
const mu = body.mass;
const p = H**2 / mu;
const resinnu = Math.sqrt(p/mu) * dot(vvec, rvec)
const recosnu = p - r;
const e = Math.sqrt(resinnu**2 + recosnu**2) / r;
// should also work for hyperbolic orbits
const a = p/(1-e**2);
const x = scale(rvec, 1/r);
const yy = cross(Hvec, rvec);
const y = scale(yy, 1/norm(yy));
const z = scale(Hvec, 1/H);
// Om i and w can be skipped when we just give tf...
let Om = Math.atan2(Hvec[0], -Hvec[1]);
if (Hvec[0] === 0 && Hvec[1] === 0) {
Om = 0;
}
let i = Math.atan2(Math.sqrt(Hvec[0]**2 + Hvec[1]**2), Hvec[2]);
if (i * Math.sign((Hvec[0] || 1) * Math.sin(Om)) < 0) {
i *= -1;
}
const nu = Math.atan2(resinnu, recosnu);
let w = Math.atan2(rvec[2] / r / Math.sin(i), y[2] / Math.sin(i)) || 0 - nu;
let t0;
let E;
if (a < 0) {
E = 2 * Math.atanh(Math.sqrt((e-1)/(e+1)) * Math.tan(nu/2));
const n = Math.sqrt(-mu / (a**3));
t0 = time - (e*Math.sinh(E) - E) / n;
} else {
E = 2 * Math.atan(Math.sqrt((1-e)/(1+e)) * Math.tan(nu/2));
const n = Math.sqrt(mu / (a**3));
t0 = time - (1/n)*(E - e*Math.sin(E));
}
// column-major... see se3.js
const tf = se3.product([
x[0], x[1], x[2], 0,
y[0], y[1], y[2], 0,
z[0], z[1], z[2], 0,
0, 0, 0, 1,
], se3.rotz(-nu));
const orbit = {
excentricity: e,
semimajorAxis: a,
inclination: i,
ascendingNodeLongitude: Om,
periapsisArgument: w,
t0,
tf,
lastE: E,
};
return orbit;
}
function updatePhysics(time, context) {
const {player} = context;
const dt = time - (context.lastTime || 0);
context.lastTime = time;
player.position = se3.apply(player.tf, [0, 0, 0, 1]);
updateBodyPhysics(time, context.universe);
if (!context.flying) {
if (context.orbit === undefined) {
const newPos = linalg.add(player.position, linalg.scale(player.velocity, dt));
const dx = linalg.diff(newPos, player.position);
player.tf = se3.product(se3.translation(...dx), player.tf);
const body = findSoi(context);
context.orbit = computeOrbit(player, body, time);
console.log(`orbiting ${body.name}, excentricity: ${context.orbit.excentricity}`);
context.orbitBody = body;
} else {
const {position: orbitPos, velocity: orbitVel} = getCartesianState(
context.orbit, context.orbitBody.mass, time);
if (orbitPos === undefined) {
const newPos = linalg.add(player.position, linalg.scale(player.velocity, dt));
const dx = linalg.diff(newPos, player.position);
player.tf = se3.product(se3.translation(...dx), player.tf);
} else {
const position = linalg.add(orbitPos, context.orbitBody.position);
const velocity = linalg.add(orbitVel, context.orbitBody.velocity);
player.velocity = velocity;
const dx = linalg.diff(position, player.position);
player.tf = se3.product(se3.translation(...dx), player.tf);
}
}
}
}
function updateGeometry(context, timeout_ms = 10) {
@ -358,7 +934,7 @@ function updateGeometry(context, timeout_ms = 10) {
function normalizeAngle(theta) {
const twopi = 2 * Math.PI;
return theta - twopi * Math.floor((theta + twopi) / twopi);
return theta - twopi * Math.floor((theta + Math.PI) / twopi);
}
/** Let's be honest I should clean this up.
@ -449,7 +1025,7 @@ function makeOrbitObject(context, orbit, parentPosition) {
const glContext = context.orbitGlContext;
const orientation = [
se3.rotz(orbit.ascendingNodeLongitude),
se3.roty(-orbit.inclination),
se3.rotx(orbit.inclination),
se3.rotz(orbit.periapsisArgument),
].reduce(se3.product);
@ -482,43 +1058,43 @@ function makeOrbitObject(context, orbit, parentPosition) {
};
}
function getObjects(context, body, time, parentBody, parentPosition) {
const kGravitationalConstant = 6.674e-11;
const kGravitationalConstant = 6.674e-11;
function getObjects(context, body, parentPosition) {
const objects = [];
const {gl, glContext} = context;
let position = [0, 0, 0];
if (parentBody !== undefined) {
// const mu = kGravitationalConstant * parentBody.mass;
const mu = 10;
const coord = getCartesianPosition(body.orbit, mu, time);
position = [
parentPosition[0] + coord[0],
parentPosition[1] + coord[1],
parentPosition[2] + coord[2],
];
const {position, orientation} = body;
objects.push(makeOrbitObject(context, body.orbit, parentPosition));
if (body.glBuffer === undefined) {
body.glBuffer = makeBufferFromFaces(gl, body.geometry);
}
objects.push({
geometry: makeBufferFromFaces(gl, body.geometry),
orientation: getOrientation(body, time),
geometry: body.glBuffer,
orientation,
position,
glContext,
});
if (parentPosition !== undefined) {
const orbitObject = makeOrbitObject(context, body.orbit, parentPosition);
objects.push(orbitObject);
}
if (body.children !== undefined) {
for (const child of body.children) {
objects.push(...getObjects(context, child, time, body, position));
objects.push(...getObjects(context, child, position));
}
}
return objects;
}
function draw(context, time) {
const {gl, camera, universe} = context;
const objects = getObjects(context, universe, time * 0.001);
function draw(context) {
const {gl, camera, player, universe} = context;
const objects = getObjects(context, universe);
if (context.orbit !== undefined && context.orbit.excentricity < 1) {
objects.push(makeOrbitObject(context, context.orbit, context.orbitBody.position));
}
gl.clearColor(...context.skyColor, 1.0);
gl.clearDepth(1.0);
@ -532,13 +1108,7 @@ function draw(context, time) {
gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT);
const camrot = camera.orientation;
const campos = camera.position;
const viewMatrix = se3.product(
se3.rotxyz(-camrot[0], -camrot[1], -camrot[2]),
se3.translation(-campos[0], -campos[1], -campos[2])
);
const viewMatrix = se3.inverse(se3.product(context.player.tf, context.camera.tf));
let lastGlContext;
for (const {position, orientation, geometry, glContext} of objects) {
@ -565,9 +1135,9 @@ function draw(context, time) {
function tick(time, context) {
handleInput(context);
updatePhysics(time, context);
updatePhysics(time * 0.001, context);
const campos = context.camera.position;
const campos = context.player.position;
// world generation / geometry update
{
@ -577,7 +1147,7 @@ function tick(time, context) {
updateGeometry(context, timeLeft);
}
draw(context, time);
draw(context);
const dt = (time - context.lastFrameTime) * 0.001;
context.lastFrameTime = time;
@ -617,55 +1187,6 @@ function makeObjects(gl) {
];
}
function makeSolarSystem(gl) {
return {
mass: 1.0,
spin: [0, 1.0, 0],
geometry: makeCube([0, 4]),
children: [
{
mass: 0.1,
spin: [0.2, 0.0, 0.0],
geometry: makeCube([0, 8]),
orbit: {
excentricity: 0,
semimajorAxis: 3,
inclination: 0,
ascendingNodeLongitude: 0,
periapsisArgument: 0,
trueAnomaly: 0,
},
},
{
mass: 0.1,
spin: [0.2, 0.0, 0.0],
geometry: makeCube([0, 1]),
orbit: {
excentricity: 0.8,
semimajorAxis: 5,
inclination: 0,
ascendingNodeLongitude: 0,
periapsisArgument: 0,
trueAnomaly: 0,
},
},
{
mass: 0.1,
spin: [0.0, 0.0, 1.0],
geometry: makeCube([9, 9]),
orbit: {
excentricity: 0.3,
semimajorAxis: 5,
inclination: 1.0,
ascendingNodeLongitude: 0,
periapsisArgument: 0,
trueAnomaly: 0,
},
},
],
}
}
async function main() {
const canvas = document.querySelector('#game');
// adjust canvas aspect ratio to that of the screen
@ -679,12 +1200,16 @@ async function main() {
const context = {
gl,
projMatrix: se3.perspective(Math.PI / 3, canvas.clientWidth / canvas.clientHeight, 0.1, 100.0),
camera: {
projMatrix: se3.perspective(Math.PI / 3, canvas.clientWidth / canvas.clientHeight, 0.1, 10000.0),
player: {
tf: se3.translation(0.0, 0.0, 2.0),
position: [0.0, 0.0, 2.0],
orientation: [0.0, 0.0, 0.0],
velocity: [0, 0, 0],
},
camera: {
orientation: [0, 0, 0],
tf: se3.identity(),
},
keys: new Set(),
lightDirection: [-0.2, -0.5, 0.4],
skyColor: [0.10, 0.15, 0.2],
@ -695,7 +1220,7 @@ async function main() {
gravity: -17,
jumpForce: 6.5,
// objects: makeObjects(gl),
universe: makeSolarSystem(gl),
universe: getSolarSystem(0),
};
context.glContext = await initWorldGl(gl);