cha0s/silphius
1
1
Fork 0
Code Issues 11 Pull Requests Actions Packages Projects Releases Wiki Activity

Compare commits

base: cha0s:29df4c3dcba1eb3349c977068469f939d83a795f
Branches Tags
cha0s:master
..
compare: cha0s:219ee71c2c113c4a8662d9ea0a6f6e3f0cd491d9
Branches Tags
cha0s:master

No commits in common. "29df4c3dcba1eb3349c977068469f939d83a795f" and "219ee71c2c113c4a8662d9ea0a6f6e3f0cd491d9" have entirely different histories.
29df4c3dcb ... 219ee71c2c

30 changed files with 288 additions and 786 deletions
Show Stats Expand all files Collapse all files

111
app/client/interpolator.js
View File

@ -1,111 +0,0 @@
export default class Interpolator {
duration = 0;
latest;
location = 0;
penultimate;
tracking = [];
accept(state) {
const packet = state;
if ('Tick' !== packet.type) {
postMessage(packet);
return;
}
this.penultimate = this.latest;
this.latest = packet;
this.tracking = [];
if (this.penultimate) {
this.duration = this.penultimate.payload.elapsed;
const [from, to] = [this.penultimate.payload.ecs, this.latest.payload.ecs];
for (const entityId in from) {
for (const componentName in from[entityId]) {
if (
['Camera', 'Position'].includes(componentName)
&& to[entityId]?.[componentName]
) {
this.tracking.push({
entityId,
componentName,
properties: ['x', 'y'],
});
}
}
}
}
this.location = 0;
}
interpolate(elapsed) {
if (0 === this.tracking.length) {
return undefined;
}
this.location += elapsed;
const fraction = Math.min(1, this.location / this.duration);
const [from, to] = [this.penultimate.payload.ecs, this.latest.payload.ecs];
const interpolated = {};
for (const {entityId, componentName, properties} of this.tracking) {
if (!interpolated[entityId]) {
interpolated[entityId] = {};
}
if (!interpolated[entityId][componentName]) {
interpolated[entityId][componentName] = {};
}
for (const property of properties) {
if (
!(property in from[entityId][componentName])
|| !(property in to[entityId][componentName])
) {
continue;
}
interpolated[entityId][componentName][property] = (
from[entityId][componentName][property]
+ (
fraction
* (to[entityId][componentName][property] - from[entityId][componentName][property])
)
);
}
}
return {
type: 'Tick',
payload: {
ecs: interpolated,
elapsed,
frame: this.penultimate.payload.frame + fraction,
},
};
}
}
let handle;
const interpolator = new Interpolator();
let last;
const interpolate = (now) => {
const elapsed = (now - last) / 1000;
last = now;
const interpolated = interpolator.interpolate(elapsed);
if (interpolated) {
handle = requestAnimationFrame(interpolate);
postMessage(interpolated);
}
else {
handle = null;
}
}
onmessage = async (event) => {
interpolator.accept(event.data);
if (interpolator.penultimate && 'Tick' === event.data.type) {
postMessage({
type: 'Tick',
payload: {
ecs: interpolator.penultimate.payload.ecs,
elapsed: last ? (performance.now() - last) / 1000 : 0,
frame: interpolator.penultimate.payload.frame,
},
});
if (!handle) {
last = performance.now();
handle = requestAnimationFrame(interpolate);
}
}
};

76
app/client/local.js
View File

@ -1,84 +1,24 @@
import Client from '@/net/client.js';
import {decode, encode} from '@/net/packets/index.js';
import {CLIENT_INTERPOLATION, CLIENT_PREDICTION} from '@/util/constants.js';
export default class LocalClient extends Client {
server = null;
interpolator = null;
predictor = null;
async connect() {
this.server = new Worker(
this.worker = new Worker(
new URL('../server/worker.js', import.meta.url),
{type: 'module'},
);
if (CLIENT_INTERPOLATION) {
this.interpolator = new Worker(
new URL('./interpolator.js', import.meta.url),
{type: 'module'},
);
this.interpolator.addEventListener('message', (event) => {
this.accept(event.data);
});
}
if (CLIENT_PREDICTION) {
this.predictor = new Worker(
new URL('./predictor.js', import.meta.url),
{type: 'module'},
);
this.predictor.addEventListener('message', (event) => {
const [flow, packet] = event.data;
switch (flow) {
case 0: {
const packed = encode(packet);
this.throughput.$$up += packed.byteLength;
this.server.postMessage(packed);
break;
}
case 1: {
if (CLIENT_INTERPOLATION) {
this.interpolator.postMessage(packet);
}
else {
this.accept(packet);
}
break;
}
}
});
}
this.server.addEventListener('message', (event) => {
this.worker.addEventListener('message', (event) => {
if (0 === event.data) {
this.server.terminate();
this.server = null;
this.worker.terminate();
this.worker = undefined;
return;
}
this.throughput.$$down += event.data.byteLength;
const packet = decode(event.data);
if (CLIENT_PREDICTION) {
this.predictor.postMessage([1, packet]);
}
else if (CLIENT_INTERPOLATION) {
this.interpolator.postMessage(packet);
}
else {
this.accept(packet);
}
this.accept(event.data);
});
}
disconnect() {
this.server.postMessage(0);
if (CLIENT_INTERPOLATION) {
this.interpolator.terminate();
}
this.worker.postMessage(0);
}
transmit(packet) {
if (CLIENT_PREDICTION) {
this.predictor.postMessage([0, packet]);
}
else {
const packed = encode(packet);
this.throughput.$$up += packed.byteLength;
this.server.postMessage(packed);
}
transmit(packed) {
this.worker.postMessage(packed);
}
}

34
app/client/prediction.js Normal file
View File

@ -0,0 +1,34 @@
import {encode} from '@/net/packets/index.js';
import {withResolvers} from '@/util/promise.js';
let connected = false;
let socket;
function onMessage(event) {
postMessage(event.data);
}
onmessage = async (event) => {
if (!connected) {
const url = new URL(`wss://${event.data.host}/ws`)
socket = new WebSocket(url.href);
socket.binaryType = 'arraybuffer';
const {promise, resolve} = withResolvers();
socket.addEventListener('open', resolve);
socket.addEventListener('error', () => {
postMessage(encode({type: 'ConnectionStatus', payload: 'aborted'}));
close();
});
await promise;
socket.removeEventListener('open', resolve);
socket.addEventListener('message', onMessage);
socket.addEventListener('close', () => {
postMessage(encode({type: 'ConnectionStatus', payload: 'aborted'}));
close();
});
postMessage(encode({type: 'ConnectionStatus', payload: 'connected'}));
connected = true;
return;
}
socket.send(event.data);
};

176
app/client/predictor.js
View File

@ -1,176 +0,0 @@
import {LRUCache} from 'lru-cache';
import Components from '@/ecs/components/index.js';
import Ecs from '@/ecs/ecs.js';
import Systems from '@/ecs/systems/index.js';
import {withResolvers} from '@/util/promise.js';
const cache = new LRUCache({
max: 128,
});
class PredictionEcs extends Ecs {
async readAsset(uri) {
if (!cache.has(uri)) {
const {promise, resolve, reject} = withResolvers();
cache.set(uri, promise);
fetch(uri)
.then((response) => resolve(response.ok ? response.arrayBuffer() : new ArrayBuffer(0)))
.catch(reject);
}
return cache.get(uri);
}
}
const Flow = {
UP: 0,
DOWN: 1,
};
const Stage = {
UNACK: 0,
ACK: 1,
FINISHING: 2,
FINISHED: 3,
};
const actions = new Map();
let ecs = new PredictionEcs({Components, Systems});
let mainEntityId = 0;
function applyClientActions(elapsed) {
if (actions.size > 0) {
const main = ecs.get(mainEntityId);
const {Controlled} = main;
const finished = [];
for (const [id, action] of actions) {
if (Stage.UNACK === action.stage) {
if (!Controlled.locked) {
switch (action.action.type) {
case 'moveUp':
case 'moveRight':
case 'moveDown':
case 'moveLeft': {
Controlled[action.action.type] = action.action.value;
break;
}
}
}
action.steps.push(elapsed);
}
if (Stage.FINISHING === action.stage) {
if (!Controlled.locked) {
switch (action.action.type) {
case 'moveUp':
case 'moveRight':
case 'moveDown':
case 'moveLeft': {
Controlled[action.action.type] = 0;
break;
}
}
}
action.stage = Stage.FINISHED;
}
if (Stage.FINISHED === action.stage) {
action.steps.shift();
if (0 === action.steps.length) {
finished.push(id);
continue;
}
}
let leap = 0;
for (const step of action.steps) {
leap += step;
}
if (leap > 0) {
ecs.predict(main, leap);
}
}
for (const id of finished) {
actions.delete(id);
}
}
}
let downPromise;
const pending = new Map();
onmessage = async (event) => {
const [flow, packet] = event.data;
switch (flow) {
case Flow.UP: {
switch (packet.type) {
case 'Action': {
switch (packet.payload.type) {
case 'moveUp':
case 'moveRight':
case 'moveDown':
case 'moveLeft': {
if (0 === packet.payload.value) {
const ack = pending.get(packet.payload.type);
const action = actions.get(ack);
action.stage = Stage.FINISHING;
pending.delete(packet.payload.type);
}
else {
const tx = {
action: packet.payload,
stage: Stage.UNACK,
steps: [],
};
packet.payload.ack = Math.random();
pending.set(packet.payload.type, packet.payload.ack);
actions.set(packet.payload.ack, tx);
}
}
}
break;
}
}
postMessage([0, packet]);
break;
}
case Flow.DOWN: {
downPromise = Promise.resolve(downPromise).then(async () => {
switch (packet.type) {
case 'ActionAck': {
const action = actions.get(packet.payload.ack);
action.stage = Stage.ACK;
return;
}
case 'EcsChange': {
ecs = new PredictionEcs({Components, Systems});
break;
}
case 'Tick': {
for (const entityId in packet.payload.ecs) {
if (packet.payload.ecs[entityId]) {
if (packet.payload.ecs[entityId].MainEntity) {
mainEntityId = parseInt(entityId);
}
}
}
await ecs.apply(packet.payload.ecs);
if (actions.size > 0) {
const main = ecs.get(mainEntityId);
const authoritative = structuredClone(main.toNet(main));
applyClientActions(packet.payload.elapsed);
if (ecs.diff[mainEntityId]) {
packet.payload.ecs[mainEntityId] = ecs.diff[mainEntityId];
}
await ecs.apply({[mainEntityId]: authoritative});
}
ecs.setClean();
break;
}
}
postMessage([1, packet]);
});
break;
}
}
};

132
app/client/remote.js
View File

@ -1,87 +1,63 @@
import Client from '@/net/client.js';
import {decode, encode} from '@/net/packets/index.js';
import {CLIENT_INTERPOLATION, CLIENT_PREDICTION} from '@/util/constants.js';
import {encode} from '@/net/packets/index.js';
import {CLIENT_PREDICTION} from '@/util/constants.js';
import {withResolvers} from '@/util/promise.js';
export default class RemoteClient extends Client {
socket = null;
interpolator = null;
predictor = null;
async connect(host) {
this.interpolator = new Worker(
new URL('./interpolator.js', import.meta.url),
{type: 'module'},
);
if (CLIENT_INTERPOLATION) {
this.interpolator = new Worker(
new URL('./interpolator.js', import.meta.url),
{type: 'module'},
);
this.interpolator.addEventListener('message', (event) => {
this.accept(event.data);
});
}
constructor() {
super();
if (CLIENT_PREDICTION) {
this.predictor = new Worker(
new URL('./predictor.js', import.meta.url),
{type: 'module'},
);
this.predictor.addEventListener('message', (event) => {
const [flow, packet] = event.data;
switch (flow) {
case 0: {
const packed = encode(packet);
this.throughput.$$up += packed.byteLength;
this.socket.send(packed);
break;
}
case 1: {
if (CLIENT_INTERPOLATION) {
this.interpolator.postMessage(packet);
}
else {
this.accept(packet);
}
break;
}
}
});
}
const url = new URL(`wss://${host}/ws`)
this.socket = new WebSocket(url.href);
this.socket.binaryType = 'arraybuffer';
this.socket.addEventListener('message', (event) => {
this.throughput.$$down += event.data.byteLength;
const packet = decode(event.data);
if (CLIENT_PREDICTION) {
this.predictor.postMessage([1, packet]);
}
else if (CLIENT_INTERPOLATION) {
this.interpolator.postMessage(packet);
}
else {
this.accept(packet);
}
});
this.socket.addEventListener('close', () => {
this.accept({type: 'ConnectionStatus', payload: 'aborted'});
});
this.socket.addEventListener('error', () => {
this.accept({type: 'ConnectionStatus', payload: 'aborted'});
});
this.accept({type: 'ConnectionStatus', payload: 'connected'});
}
disconnect() {
if (CLIENT_INTERPOLATION) {
this.interpolator.terminate();
}
}
transmit(packet) {
if (CLIENT_PREDICTION) {
this.predictor.postMessage([0, packet]);
this.worker = undefined;
}
else {
this.socket = undefined;
}
}
async connect(host) {
if (CLIENT_PREDICTION) {
this.worker = new Worker(
new URL('./prediction.js', import.meta.url),
{type: 'module'},
);
this.worker.postMessage({host});
this.worker.onmessage = (event) => {
this.accept(event.data);
};
}
else {
const url = new URL(`wss://${host}/ws`)
this.socket = new WebSocket(url.href);
this.socket.binaryType = 'arraybuffer';
const onMessage = (event) => {
this.accept(event.data);
}
const {promise, resolve} = withResolvers();
this.socket.addEventListener('open', resolve);
this.socket.addEventListener('error', () => {
this.accept(encode({type: 'ConnectionStatus', payload: 'aborted'}));
});
await promise;
this.socket.removeEventListener('open', resolve);
this.socket.addEventListener('message', onMessage);
this.socket.addEventListener('close', () => {
this.accept(encode({type: 'ConnectionStatus', payload: 'aborted'}));
});
this.accept(encode({type: 'ConnectionStatus', payload: 'connected'}));
}
}
disconnect() {
if (CLIENT_PREDICTION) {
this.worker.terminate();
}
else {
this.socket.close();
}
}
transmit(packed) {
if (CLIENT_PREDICTION) {
this.worker.postMessage(packed);
}
else {
const packed = encode(packet);
this.throughput.$$up += packed.byteLength;
this.socket.send(packed);
}
}

17
app/ecs/component.js
View File

@ -61,13 +61,13 @@ export default class Component {
}
}
}
const keys = new Set(Object.keys(defaults));
const promises = [];
for (let i = 0; i < entries.length; ++i) {
const [entityId, values] = entries[i];
const instance = allocated[i];
instance.entity = entityId;
this.instances[entityId] = instance;
const keys = new Set(Object.keys(defaults));
for (const key in values) {
keys.delete(key);
}
@ -144,22 +144,11 @@ export default class Component {
}
Component.ecs.markChange(this.entity, {[Component.constructor.componentName]: values})
}
toFullJSON() {
const {properties} = concrete;
const json = {};
for (const key in properties) {
json[key] = this[key];
}
return json;
}
toNet(recipient, data) {
if (data) {
return data;
}
return this.toFullJSON();
return data || Component.constructor.filterDefaults(this);
}
toJSON() {
return this.toFullJSON();
return Component.constructor.filterDefaults(this);
}
async update(values) {
for (const key in values) {

21
app/ecs/component.test.js
View File

@ -2,28 +2,27 @@ import {expect, test} from 'vitest';
import Component from './component.js';
const fakeEcs = {markChange() {}};
test('creates instances', async () => {
test('creates instances', () => {
class CreatingComponent extends Component {
static properties = {
foo: {defaultValue: 'bar', type: 'string'},
};
}
const ComponentInstance = new CreatingComponent(fakeEcs);
await ComponentInstance.create(1);
const ComponentInstance = new CreatingComponent();
ComponentInstance.create(1);
expect(ComponentInstance.get(1).entity)
.to.equal(1);
});
test('does not serialize default values', async () => {
test('does not serialize default values', () => {
class CreatingComponent extends Component {
static properties = {
foo: {defaultValue: 'bar', type: 'string'}, bar: {type: 'uint8'},
};
}
const fakeEcs = {markChange() {}};
const ComponentInstance = new CreatingComponent(fakeEcs);
await ComponentInstance.create(1)
ComponentInstance.create(1)
expect(ComponentInstance.get(1).toJSON())
.to.deep.equal({});
ComponentInstance.get(1).bar = 1;
@ -31,14 +30,14 @@ test('does not serialize default values', async () => {
.to.deep.equal({bar: 1});
});
test('reuses instances', async () => {
test('reuses instances', () => {
class ReusingComponent extends Component {
static properties = {
foo: {type: 'string'},
};
}
const ComponentInstance = new ReusingComponent(fakeEcs);
await ComponentInstance.create(1);
const ComponentInstance = new ReusingComponent();
ComponentInstance.create(1);
const instance = ComponentInstance.get(1);
ComponentInstance.destroy(1);
expect(ComponentInstance.get(1))
@ -47,7 +46,7 @@ test('reuses instances', async () => {
ComponentInstance.destroy(1);
})
.to.throw();
await ComponentInstance.create(1);
ComponentInstance.create(1);
expect(ComponentInstance.get(1))
.to.equal(instance);
});

2
app/ecs/components/emitter.js
View File

@ -38,7 +38,7 @@ export default class EmitterComponent extends Component {
}
mergeDiff(original, update) {
const merged = {};
if (original.emit || update.emit) {
if (update.emit) {
merged.emit = {
...original.emit,
...update.emit,

2
app/ecs/components/interlocutor.js
View File

@ -3,7 +3,7 @@ import Component from '@/ecs/component.js';
export default class Interlocutor extends Component {
mergeDiff(original, update) {
const merged = {};
if (original.dialogue || update.dialogue) {
if (update.dialogue) {
merged.dialogue = {
...original.dialogue,
...update.dialogue,

2
app/ecs/components/sound.js
View File

@ -3,7 +3,7 @@ import Component from '@/ecs/component.js';
export default class Sound extends Component {
mergeDiff(original, update) {
const merged = {};
if (original.play || update.play) {
if (update.play) {
merged.play = [
...(original.play ?? []),
...update.play,

2
app/ecs/components/vulnerable.js
View File

@ -9,7 +9,7 @@ export const DamageTypes = {
export default class Vulnerable extends Component {
mergeDiff(original, update) {
const merged = {};
if (original.damage || update.damage) {
if (update.damage) {
merged.damage = {
...original.damage,
...update.damage,

39
app/ecs/ecs.js
View File

@ -23,6 +23,8 @@ export default class Ecs {
deferredChanges = {}
$$deindexing = new Set();
$$destructionDependencies = new Map();
$$detached = new Set();
@ -33,6 +35,8 @@ export default class Ecs {
$$entityFactory = new EntityFactory();
$$reindexing = new Set();
Systems = {};
constructor({Systems, Components} = {}) {
@ -141,9 +145,9 @@ export default class Ecs {
attach(entityIds) {
for (const entityId of entityIds) {
this.$$detached.delete(entityId);
this.$$reindexing.add(entityId);
this.applyDeferredChanges(entityId);
}
this.reindex(entityIds);
}
changed(criteria) {
@ -238,13 +242,13 @@ export default class Ecs {
await Promise.all(promises);
for (let i = 0; i < specificsList.length; i++) {
const [entityId, components] = specificsList[i];
this.$$reindexing.add(entityId);
this.rebuild(entityId, () => Object.keys(components));
if (this.$$detached.has(entityId)) {
continue;
}
this.applyDeferredChanges(entityId);
}
this.reindex(entityIds);
return entityIds;
}
@ -311,8 +315,9 @@ export default class Ecs {
destroyMany(entityIds) {
const destroying = {};
this.deindex(entityIds);
// this.deindex(entityIds);
for (const entityId of entityIds) {
this.$$deindexing.add(entityId);
if (!this.$$entities[entityId]) {
throw new Error(`can't destroy non-existent entity ${entityId}`);
}
@ -328,16 +333,15 @@ export default class Ecs {
}
for (const entityId of entityIds) {
delete this.$$entities[entityId];
delete this.deferredChanges[entityId];
this.diff[entityId] = false;
}
}
detach(entityIds) {
for (const entityId of entityIds) {
this.$$deindexing.add(entityId);
this.$$detached.add(entityId);
}
this.deindex(entityIds);
}
get entities() {
@ -377,9 +381,9 @@ export default class Ecs {
}
await Promise.all(promises);
for (const [entityId, components] of entities) {
this.$$reindexing.add(entityId);
this.rebuild(entityId, (componentNames) => [...new Set(componentNames.concat(Object.keys(components)))]);
}
this.reindex(unique);
}
markChange(entityId, components) {
@ -408,16 +412,6 @@ export default class Ecs {
}
}
predict(entity, elapsed) {
for (const systemName in this.Systems) {
const System = this.Systems[systemName];
if (!System.predict) {
continue;
}
System.predict(entity, elapsed);
}
}
async readJson(uri) {
const key = ['$$json', uri].join(':');
if (!cache.has(key)) {
@ -516,9 +510,9 @@ export default class Ecs {
this.Components[componentName].destroyMany(removing[componentName]);
}
for (const [entityId, components] of entities) {
this.$$reindexing.add(entityId);
this.rebuild(entityId, (componentNames) => componentNames.filter((type) => !components.includes(type)));
}
this.reindex(unique);
}
static serialize(ecs, view) {
@ -569,6 +563,15 @@ export default class Ecs {
this.$$destructionDependencies.delete(entityId);
}
}
// update indices
if (this.$$deindexing.size > 0) {
this.deindex(this.$$deindexing);
this.$$deindexing.clear();
}
if (this.$$reindexing.size > 0) {
this.reindex(this.$$reindexing);
this.$$reindexing.clear();
}
}
toJSON() {
@ -594,12 +597,14 @@ export default class Ecs {
const updating = {};
const unique = new Set();
for (const [entityId, components] of entities) {
this.rebuild(entityId);
for (const componentName in components) {
if (!updating[componentName]) {
updating[componentName] = [];
}
updating[componentName].push([entityId, components[componentName]]);
}
this.$$reindexing.add(entityId);
unique.add(entityId);
}
const promises = [];

41
app/ecs/ecs.test.js
View File

@ -3,21 +3,25 @@ import {expect, test} from 'vitest';
import Component from './component.js';
import Ecs from './ecs.js';
import System from './system.js';
import {wrapComponents} from './test-helper.js';
const Components = wrapComponents([
['Empty', {}],
['Momentum', {x: {type: 'int32'}, y: {type: 'int32'}, z: {type: 'int32'}}],
['Name', {name: {type: 'string'}}],
['Position', {x: {type: 'int32', defaultValue: 32}, y: {type: 'int32'}, z: {type: 'int32'}}],
]);
function wrapProperties(name, properties) {
return class WrappedComponent extends Component {
static componentName = name;
static properties = properties;
};
}
const {
Empty,
Momentum,
Position,
Name,
} = Components;
const Empty = wrapProperties('Empty', {});
const Name = wrapProperties('Name', {
name: {type: 'string'},
});
const Position = wrapProperties('Position', {
x: {type: 'int32', defaultValue: 32},
y: {type: 'int32'},
z: {type: 'int32'},
});
function asyncTimesTwo(x) {
return new Promise((resolve) => {
@ -127,6 +131,11 @@ test('inserts components into entities', async () => {
});
test('ticks systems', async () => {
const Momentum = wrapProperties('Momentum', {
x: {type: 'int32'},
y: {type: 'int32'},
z: {type: 'int32'},
});
const ecs = new Ecs({
Components: {Momentum, Position},
Systems: {
@ -341,10 +350,10 @@ test('applies update patches', async () => {
.to.equal(128);
});
test('applies entity deletion patches', async () => {
test('applies entity deletion patches', () => {
const ecs = new Ecs({Components: {Position}});
await ecs.createSpecific(16, {Position: {x: 64}});
await ecs.apply({16: false});
ecs.createSpecific(16, {Position: {x: 64}});
ecs.apply({16: false});
expect(Array.from(ecs.entities).length)
.to.equal(0);
});

17
app/ecs/query.test.js
View File

@ -1,14 +1,23 @@
import {expect, test} from 'vitest';
import Ecs from './ecs.js';
import {wrapComponents} from './test-helper.js';
import Ecs from './ecs';
import Component from './component.js';
import Query from './query.js';
const Components = wrapComponents([
const Components = [
['A', {a: {type: 'int32', defaultValue: 64}}],
['B', {b: {type: 'int32', defaultValue: 32}}],
['C', {c: {type: 'int32'}}],
]);
]
.reduce((Components, [componentName, properties]) => {
return {
...Components,
[componentName]: class extends Component {
static componentName = componentName;
static properties = properties;
},
};
}, {})
const ecsTest = test.extend({
ecs: async ({}, use) => {

34
app/ecs/systems/apply-control-movement.js
View File

@ -3,10 +3,6 @@ import {normalizeVector} from '@/util/math.js';
export default class ApplyControlMovement extends System {
predict(entity) {
this.tickSingle(entity);
}
static get priority() {
return {
before: 'IntegratePhysics',
@ -20,25 +16,17 @@ export default class ApplyControlMovement extends System {
}
tick() {
for (const entity of this.select('default')) {
this.tickSingle(entity);
}
}
tickSingle(entity) {
const {Controlled, Forces, Speed} = entity;
if (!Controlled || !Forces | !Speed) {
return;
}
if (!Controlled.locked) {
const movement = normalizeVector({
x: (Controlled.moveRight - Controlled.moveLeft),
y: (Controlled.moveDown - Controlled.moveUp),
});
Forces.applyImpulse({
x: Speed.speed * movement.x,
y: Speed.speed * movement.y,
});
for (const {Controlled, Forces, Speed} of this.select('default')) {
if (!Controlled.locked) {
const movement = normalizeVector({
x: (Controlled.moveRight - Controlled.moveLeft),
y: (Controlled.moveDown - Controlled.moveUp),
});
Forces.applyImpulse({
x: Speed.speed * movement.x,
y: Speed.speed * movement.y,
});
}
}
}

50
app/ecs/systems/control-direction.js
View File

@ -3,39 +3,27 @@ import {TAU} from '@/util/math.js';
export default class ControlDirection extends System {
predict(entity) {
this.tickSingle(entity);
}
tick() {
for (const entity of this.ecs.changed(['Controlled'])) {
this.tickSingle(entity);
for (const {Controlled, Direction} of this.ecs.changed(['Controlled'])) {
const {locked, moveUp, moveRight, moveDown, moveLeft} = Controlled;
if (locked) {
continue;
}
if (
0 === moveRight
&& 0 === moveDown
&& 0 === moveLeft
&& 0 === moveUp
) {
continue;
}
Direction.direction = (
TAU + Math.atan2(
moveDown - moveUp,
moveRight - moveLeft,
)
) % TAU;
}
}
tickSingle(entity) {
const {Controlled, Direction} = entity;
if (!Controlled || !Direction) {
return;
}
const {locked, moveUp, moveRight, moveDown, moveLeft} = Controlled;
if (locked) {
return;
}
if (
0 === moveRight
&& 0 === moveDown
&& 0 === moveLeft
&& 0 === moveUp
) {
return;
}
Direction.direction = (
TAU + Math.atan2(
moveDown - moveUp,
moveRight - moveLeft,
)
) % TAU;
}
}

18
app/ecs/systems/follow-camera.js
View File

@ -5,16 +5,6 @@ import {System} from '@/ecs/index.js';
export default class FollowCamera extends System {
predict(entity, elapsed) {
this.tickSingle(entity, elapsed);
}
static get priority() {
return {
after: 'IntegratePhysics',
};
}
static queries() {
return {
default: ['Camera', 'Position'],
@ -29,15 +19,11 @@ export default class FollowCamera extends System {
}
tick(elapsed) {
for (const entity of this.select('default')) {
this.tickSingle(entity, elapsed);
for (const {id} of this.select('default')) {
this.updateCamera(elapsed * 3, this.ecs.get(id));
}
}
tickSingle(entity, elapsed) {
this.updateCamera(elapsed * 3, entity);
}
updateCamera(portion, entity) {
const {Camera, Position} = entity;
if (Camera && Position) {

18
app/ecs/systems/integrate-physics.js
View File

@ -2,10 +2,6 @@ import {System} from '@/ecs/index.js';
export default class IntegratePhysics extends System {
predict(entity, elapsed) {
this.tickSingle(entity, elapsed);
}
static queries() {
return {
default: ['Position', 'Forces'],
@ -13,18 +9,10 @@ export default class IntegratePhysics extends System {
}
tick(elapsed) {
for (const entity of this.select('default')) {
this.tickSingle(entity, elapsed);
for (const {Position, Forces} of this.select('default')) {
Position.x = Position.$$x + elapsed * (Forces.$$impulseX + Forces.$$forceX);
Position.y = Position.$$y + elapsed * (Forces.$$impulseY + Forces.$$forceY);
}
}
tickSingle(entity, elapsed) {
const {Forces, Position} = entity;
if (!Forces || !Position) {
return;
}
Position.x = Position.$$x + elapsed * (Forces.$$impulseX + Forces.$$forceX);
Position.y = Position.$$y + elapsed * (Forces.$$impulseY + Forces.$$forceY);
}
}

42
app/ecs/systems/reset-forces.js
View File

@ -2,10 +2,6 @@ import {System} from '@/ecs/index.js';
export default class ResetForces extends System {
predict(entity, elapsed) {
this.tickSingle(entity, elapsed);
}
static get priority() {
return {phase: 'post'};
}
@ -17,32 +13,24 @@ export default class ResetForces extends System {
}
tick(elapsed) {
for (const entity of this.select('default')) {
this.tickSingle(entity, elapsed);
}
}
tickSingle(entity, elapsed) {
const {Forces} = entity;
if (!Forces) {
return;
}
if (0 !== Forces.forceX) {
const factorX = Math.pow(1 - Forces.dampingX, elapsed);
Forces.forceX *= factorX;
if (Math.abs(Forces.forceX) <= 1) {
Forces.forceX = 0;
for (const {Forces} of this.select('default')) {
if (0 !== Forces.forceX) {
const factorX = Math.pow(1 - Forces.dampingX, elapsed);
Forces.forceX *= factorX;
if (Math.abs(Forces.forceX) <= 1) {
Forces.forceX = 0;
}
}
}
if (0 !== Forces.forceY) {
const factorY = Math.pow(1 - Forces.dampingY, elapsed);
Forces.forceY *= factorY;
if (Math.abs(Forces.forceY) <= 1) {
Forces.forceY = 0;
if (0 !== Forces.forceY) {
const factorY = Math.pow(1 - Forces.dampingY, elapsed);
Forces.forceY *= factorY;
if (Math.abs(Forces.forceY) <= 1) {
Forces.forceY = 0;
}
}
Forces.impulseX = 0;
Forces.impulseY = 0;
}
Forces.impulseX = 0;
Forces.impulseY = 0;
}
}

30
app/ecs/systems/run-animations.js
View File

@ -2,10 +2,6 @@ import {System} from '@/ecs/index.js';
export default class RunAnimations extends System {
predict(entity, elapsed) {
this.tickSingle(entity, elapsed);
}
static queries() {
return {
default: ['Sprite'],
@ -13,23 +9,15 @@ export default class RunAnimations extends System {
}
tick(elapsed) {
for (const entity of this.select('default')) {
this.tickSingle(entity, elapsed);
}
}
tickSingle(entity, elapsed) {
const {Sprite} = entity;
if (!Sprite) {
return;
}
if (0 === Sprite.speed || !Sprite.isAnimating) {
return;
}
Sprite.elapsed += elapsed / Sprite.speed;
while (Sprite.elapsed >= 1) {
Sprite.elapsed -= 1;
Sprite.frame += 1;
for (const {Sprite} of this.select('default')) {
if (0 === Sprite.speed || !Sprite.isAnimating) {
continue;
}
Sprite.elapsed += elapsed / Sprite.speed;
while (Sprite.elapsed > 1) {
Sprite.elapsed -= 1;
Sprite.frame += 1;
}
}
}

72
app/ecs/systems/sprite-direction.js
View File

@ -2,16 +2,6 @@ import {System} from '@/ecs/index.js';
export default class SpriteDirection extends System {
predict(entity) {
this.tickSingle(entity);
}
static get priority() {
return {
after: 'ControlDirection',
};
}
static queries() {
return {
default: ['Sprite'],
@ -19,43 +9,35 @@ export default class SpriteDirection extends System {
}
tick() {
for (const entity of this.select('default')) {
this.tickSingle(entity);
}
}
tickSingle(entity) {
const parts = [];
const {Controlled, Direction, Sprite} = entity;
if (!Sprite) {
return;
}
if (Controlled) {
const {locked, moveUp, moveRight, moveDown, moveLeft} = Controlled;
if (locked) {
return;
for (const {Controlled, Direction, Sprite} of this.select('default')) {
const parts = [];
if (Controlled) {
const {locked, moveUp, moveRight, moveDown, moveLeft} = Controlled;
if (locked) {
continue;
}
if ((moveUp > 0 || moveRight > 0 || moveDown > 0 || moveLeft > 0)) {
parts.push('moving');
}
else {
parts.push('idle');
}
}
if ((moveUp > 0 || moveRight > 0 || moveDown > 0 || moveLeft > 0)) {
parts.push('moving');
if (Direction) {
if (!Sprite.rotates) {
const name = {
0: 'right',
1: 'down',
2: 'left',
3: 'up',
};
parts.push(name[Direction.quantize(4)]);
}
}
else {
parts.push('idle');
}
}
if (Direction) {
if (!Sprite.rotates) {
const name = {
0: 'right',
1: 'down',
2: 'left',
3: 'up',
};
parts.push(name[Direction.quantize(4)]);
}
}
if (parts.length > 0) {
if (Sprite.hasAnimation(parts.join(':'))) {
Sprite.animation = parts.join(':');
if (parts.length > 0) {
if (Sprite.hasAnimation(parts.join(':'))) {
Sprite.animation = parts.join(':');
}
}
}
}

14
app/ecs/test-helper.js
View File

@ -1,14 +0,0 @@
import Component from './component.js';
export function wrapComponents(Components) {
return Components
.reduce((Components, [componentName, properties]) => {
return {
...Components,
[componentName]: class extends Component {
static componentName = componentName;
static properties = properties;
},
};
}, {})
}

19
app/net/client.js
View File

@ -1,24 +1,11 @@
import {CLIENT_LATENCY, CLIENT_PREDICTION} from '@/util/constants.js';
import {CLIENT_LATENCY} from '@/util/constants.js';
import EventEmitter from '@/util/event-emitter.js';
export default class Client {
emitter = new EventEmitter();
rtt = 0;
throughput = {$$down: 0, down: 0, $$up: 0, up: 0};
constructor() {
setInterval(() => {
const {throughput} = this;
throughput.down = throughput.$$down * 4;
throughput.up = throughput.$$up * 4;
throughput.$$down = throughput.$$up = 0;
}, 250);
this.emitter = new EventEmitter();
}
accept(packet) {
if ('Heartbeat' === packet.type) {
this.rtt = packet.payload.rtt;
this.send(packet);
return;
}
this.emitter.invoke(packet.type, packet.payload);
}
addPacketListener(type, listener) {
@ -28,7 +15,7 @@ export default class Client {
this.emitter.removeListener(type, listener);
}
send(packet) {
if (CLIENT_LATENCY > 0 && !CLIENT_PREDICTION) {
if (CLIENT_LATENCY > 0) {
setTimeout(() => {
this.transmit(packet);
}, CLIENT_LATENCY);

3
app/net/packets/action-ack.js
View File

@ -1,3 +0,0 @@
import Packet from '@/net/packet.js';
export default class ActionAck extends Packet {}

3
app/net/packets/heartbeat.js
View File

@ -1,3 +0,0 @@
import Packet from '@/net/packet.js';
export default class Heartbeat extends Packet {}

5
app/react/components/devtools.jsx
View File

@ -2,7 +2,6 @@ import {useCallback, useState} from 'react';
import {Tab, Tabs, TabList, TabPanel} from 'react-tabs';
import 'react-tabs/style/react-tabs.css';
import {useClient} from '@/react/context/client.js';
import {useEcsTick} from '@/react/context/ecs.js';
import {useMainEntity} from '@/react/context/main-entity.js';
@ -13,7 +12,6 @@ import Tiles from './devtools/tiles.jsx';
export default function Devtools({
eventsChannel,
}) {
const client = useClient();
const [mainEntity] = useMainEntity();
const [mainEntityJson, setMainEntityJson] = useState('');
const onEcsTick = useCallback((payload, ecs) => {
@ -34,9 +32,6 @@ export default function Devtools({
<div className={styles.dashboard}>
<form>
<div className={styles.engineBar}>
<div>{Math.round(client.rtt * 100) / 100}rtt</div>
<div>{Math.round(((client.throughput.down * 8) / 1024) * 10) / 10}kb/s down</div>
<div>{Math.round(((client.throughput.up * 8) / 1024) * 10) / 10}kb/s up</div>
</div>
</form>
<pre><code><small>{mainEntityJson}</small></code></pre>

12
app/routes/_main-menu.play.$/route.jsx
View File

@ -1,6 +1,8 @@
import {useEffect, useState} from 'react';
import {Outlet, useParams} from 'react-router-dom';
import {decode, encode} from '@/net/packets/index.js';
import styles from './play.module.css';
export default function Play() {
@ -18,7 +20,15 @@ export default function Play() {
({default: Client} = await import('@/client/remote.js'));
break;
}
setClient(() => Client);
class SilphiusClient extends Client {
accept(packed) {
super.accept(decode(packed));
}
transmit(packet) {
super.transmit(encode(packet));
}
}
setClient(() => SilphiusClient);
}
loadClient();
}, [type]);

2
app/server/create/player.js
View File

@ -37,7 +37,7 @@ export default async function createPlayer(id) {
Magnet: {strength: 24},
Player: {},
Position: {x: 128, y: 448},
Speed: {speed: 100},
Speed: {speed: 300},
Sound: {},
Sprite: {
anchorX: 0.5,

76
app/server/engine.js
View File

@ -6,7 +6,6 @@ import {
CHUNK_SIZE,
RESOLUTION,
TPS,
UPS,
} from '@/util/constants.js';
import {withResolvers} from '@/util/promise.js';
@ -17,8 +16,6 @@ import createHouse from './create/house.js';
import createPlayer from './create/player.js';
import createTown from './create/town.js';
const UPS_PER_S = 1 / UPS;
const cache = new LRUCache({
max: 128,
});
@ -32,9 +29,8 @@ export default class Engine {
frame = 0;
handle;
incomingActions = new Map();
last;
last = Date.now();
server;
updateElapsed = 0;
constructor(Server) {
this.ecses = {};
@ -121,24 +117,6 @@ export default class Engine {
}
this.incomingActions.get(connection).push(payload);
});
this.server.addPacketListener('Heartbeat', (connection) => {
const playerData = this.connectedPlayers.get(connection);
const {distance} = playerData;
const now = performance.now();
distance.rtt = (now - distance.last) / 1000;
playerData.heartbeat = setTimeout(() => {
distance.last = performance.now();
this.server.send(
connection,
{
type: 'Heartbeat',
payload: {
rtt: distance.rtt,
},
},
);
}, 1000);
});
}
acceptActions() {
@ -249,17 +227,6 @@ export default class Engine {
break;
}
}
if (payload.ack) {
this.server.send(
connection,
{
type: 'ActionAck',
payload: {
ack: payload.ack,
},
},
);
}
}
this.incomingActions.set(connection, []);
}
@ -272,26 +239,18 @@ export default class Engine {
}
const ecs = this.ecses[entityJson.Ecs.path];
const entity = ecs.get(await ecs.create(entityJson));
entity.Player.id = id;
const playerData = {
distance: {last: performance.now(), rtt: 0},
entity,
id,
memory: {
chunks: new Map(),
nearby: new Set(),
},
};
this.server.send(
entity.Player.id = id
this.connectedPlayers.set(
connection,
{
type: 'Heartbeat',
payload: {
rtt: 0,
entity,
id,
memory: {
chunks: new Map(),
nearby: new Set(),
},
},
);
this.connectedPlayers.set(connection, playerData);
}
createEcs() {
@ -305,8 +264,7 @@ export default class Engine {
}
this.connectedPlayers.delete(connection);
this.incomingActions.delete(connection);
const {entity, heartbeat, id} = connectedPlayer;
clearTimeout(heartbeat);
const {entity, id} = connectedPlayer;
const json = entity.toJSON();
const ecs = this.ecses[entity.Ecs.path];
return Promise.all([
@ -413,20 +371,14 @@ export default class Engine {
}
start() {
this.last = performance.now() / 1000;
const loop = async () => {
const now = performance.now() / 1000;
const elapsed = now - this.last;
this.updateElapsed += elapsed;
this.last = now;
this.acceptActions();
const elapsed = (Date.now() - this.last) / 1000;
this.last = Date.now();
this.tick(elapsed);
if (this.updateElapsed >= UPS_PER_S) {
this.update(this.updateElapsed);
this.setClean();
this.frame += 1;
this.updateElapsed = this.updateElapsed % UPS_PER_S;
}
this.update(elapsed);
this.setClean();
this.frame += 1;
this.handle = setTimeout(loop, 1000 / TPS);
};
loop();

4
app/util/constants.js
View File

@ -2,8 +2,6 @@ export const CHUNK_SIZE = 32;
export const CLIENT_LATENCY = 0;
export const CLIENT_INTERPOLATION = true;
export const CLIENT_PREDICTION = true;
export const IRL_MINUTES_PER_GAME_DAY = 20;
@ -16,5 +14,3 @@ export const RESOLUTION = {
export const SERVER_LATENCY = 0;
export const TPS = 60;
export const UPS = 15;