wgge 0.0.1

package/game/menu/item/MenuItemRenderer.js

@@ -0,0 +1,40 @@
+import DomRenderer from "../../../core/renderer/dom/DomRenderer";
+import DirtyValueRenderer from "../../../core/renderer/dom/DirtyValueRenderer";
+
+export default class MenuItemRenderer extends DomRenderer {
+
+	/**
+	 * @type MenuItemModel
+	 */
+	model;
+
+	constructor(game, model, dom) {
+		super(game, model, dom);
+
+		this.model = model;
+	}
+
+	activateInternal() {
+		this.container = this.addElement('h2', 'item');
+		this.container.addEventListener(
+			'click',
+			(e) => {
+				e.preventDefault();
+				this.model.triggerEvent('click');
+			}
+		);
+		this.addChild(
+			new DirtyValueRenderer(
+				this.game,
+				this.model.text,
+				this.container
+			)
+		);
+	}
+
+	deactivateInternal() {
+		this.resetChildren();
+		this.removeElement(this.container);
+	}
+
+}

package/game/resources/3d/3DModel.js

@@ -0,0 +1,30 @@
+import DirtyValue from "../../../core/model/value/DirtyValue";
+import IdentifiedModelNode from "../../../core/model/collection/table/IdentifiedModelNode";
+import Vector3 from "../../../core/model/vector/Vector3";
+
+export default class Model3dModel extends IdentifiedModelNode {
+
+	/**
+	 * @type DirtyValue
+	 */
+	name;
+
+	/**
+	 * @type DirtyValue
+	 */
+	uri;
+
+	/**
+	 * @type Vector3
+	 */
+	scale;
+
+	constructor(id) {
+		super(id);
+
+		this.name = this.addProperty('name', new DirtyValue(`3D Model ${id}`));
+		this.uri = this.addProperty('uri', new DirtyValue('glb/races/male.glb'));
+		this.scale = this.addProperty('scale', new Vector3(1, 1, 1));
+	}
+
+}

package/game/resources/ResourcesModel.js

@@ -0,0 +1,26 @@
+import ModelNodeTable from "../../core/model/collection/table/ModelNodeTable";
+import MaterialModel from "./material/MaterialModel";
+import ObjectModel from "../../core/model/ObjectModel";
+import Model3dModel from "./3d/3DModel";
+
+export default class ResourcesModel extends ObjectModel {
+
+	/**
+	 * @type ModelNodeTable
+	 */
+	materials;
+
+	/**
+	 * @type ModelNodeTable<Model3dModel>
+	 */
+	models3d;
+
+	constructor() {
+		super();
+
+		this.materials = this.addProperty('materials', new ModelNodeTable((id) => new MaterialModel(id)));
+		this.models3d = this.addProperty('models3d', new ModelNodeTable((id) => new Model3dModel(id)));
+
+	}
+
+}

package/game/resources/assets/AssetCache.js

@@ -0,0 +1,193 @@
+import Dictionary from "../../../core/Dictionary";
+import Collection from "../../../core/Collection";
+import NumberHelper from "../../../core/helper/NumberHelper";
+import ImageLoader from "./loader/ImageLoader";
+import GlbLoader from "./loader/GlbLoader";
+import AudioLoader from "./loader/AudioLoader";
+import MaterialLoader from "./loader/MaterialLoader";
+import Model3dLoader from "./loader/Model3dLoader";
+import SpriteLoader from "./loader/SpriteLoader";
+import NodeWithEvents from "../../../core/model/event/NodeWithEvents";
+
+const ASSET_TYPE_LOADERS = {
+	'aud': AudioLoader,
+	'img': ImageLoader,
+	'glb': GlbLoader,
+	'mat': MaterialLoader,
+	'm3d': Model3dLoader,
+	'spr': SpriteLoader
+}
+
+/**
+ * Keeps cached raw resources like images, sounds and 3D models
+ */
+export default class AssetCache extends NodeWithEvents {
+
+	/**
+	 * @type ResourcesModel
+	 */
+	resources;
+
+	/**
+	 * @type Dictionary
+	 */
+	cache;
+
+	/**
+	 * @type Collection
+	 */
+	loaders;
+
+	/**
+	 * @type int
+	 */
+	totalLoaders = 0;
+
+	/**
+	 * @type int
+	 */
+	blockingLoaders = 0;
+
+	/**
+	 * @type int
+	 */
+	sessionTotalLoaders = 0;
+
+	/**
+	 * @type int
+	 */
+	sessionFinishedLoaders = 0;
+
+	constructor(resources) {
+		super();
+		this.resources = resources;
+		this.cache = new Dictionary();
+		this.loaders = new Collection();
+		this.loaders.addOnAddListener((loader) => this.loaderAdded(loader));
+		this.loaders.addOnRemoveListener((loader) => this.loaderRemoved(loader));
+
+	}
+
+	loaderAdded(loader) {
+		this.updateLoadingState();
+		if (!loader.isPreloading) {
+			this.sessionTotalLoaders++;
+			this.triggerEvent('session-total-loaders-changed', this.sessionTotalLoaders);
+		}
+
+	}
+
+	loaderRemoved(loader) {
+		this.updateLoadingState();
+		if (!loader.isPreloading) {
+			this.sessionFinishedLoaders++;
+			if (this.blockingLoaders === 0) {
+				this.sessionFinishedLoaders = 0;
+				this.sessionTotalLoaders = 0;
+			}
+			this.triggerEvent('session-finished-loaders-changed', this.sessionFinishedLoaders);
+		}
+	}
+
+	updateLoadingState() {
+		const total = this.loaders.count();
+		if (this.totalLoaders !== total) {
+			this.totalLoaders = total;
+			this.triggerEvent('total-loaders-changed', total);
+		}
+		const blocking = this.loaders.filter((l) => l.isPreloading === false).length;
+		if (this.blockingLoaders !== blocking) {
+			this.blockingLoaders = blocking;
+			this.triggerEvent('blocking-loaders-changed', blocking);
+		}
+	}
+
+	resetCache(name = null) {
+		if (name) {
+			this.cache.remove(name);
+		} else {
+			this.cache.reset();
+		}
+	}
+
+	loaderFailed(loader, msg, onError) {
+		console.error(`Loading of asset '${loader.uri}' failed: ${msg}`);
+
+		if (onError) onError(msg);
+
+		this.loaders.remove(loader);
+	}
+
+	loaderSucceeded(loader, resource, onLoaded) {
+		if (this.cache.exists(loader.uri)) {
+			this.cache.set(loader.uri, resource);
+			console.warn(`Resource ${loader.uri} was already present then loaded and replaced.`);
+		} else {
+			this.cache.add(loader.uri, resource);
+		}
+
+		if (onLoaded) onLoaded(resource);
+
+		this.loaders.remove(loader);
+	}
+
+	getAsset(uri, onLoaded = null, onError = null) {
+		if (typeof uri !== 'string') {
+			console.log('uri is not a string', uri);
+			return;
+		}
+
+		if (this.cache.exists(uri)) {
+			if (onLoaded) {
+				onLoaded(this.cache.get(uri));
+			}
+		} else {
+			const existingLoader = this.loaders.find((l) => l.uri === uri);
+			if (existingLoader) {
+				if (onLoaded || onError) {
+					existingLoader.addLoaderEventsListeners(onLoaded, onError);
+				}
+				return;
+			}
+
+			const assetType = NumberHelper.extractId(uri, 0);
+			if (ASSET_TYPE_LOADERS[assetType] === undefined) {
+				console.error(`Valid resource type could not be inferred from URI '${uri}'!`);
+			}
+
+			const loaderType = ASSET_TYPE_LOADERS[assetType];
+			const loader = new loaderType(this, uri, onLoaded === null);
+			this.loaders.add(loader);
+			loader.load(
+				(resource) => this.loaderSucceeded(loader, resource, onLoaded),
+				(msg) => this.loaderFailed(loader, msg, onError)
+			);
+		}
+	}
+
+	loadMaterial(materialId, onLoaded) {
+		this.getAsset(`mat/${materialId}`, onLoaded);
+	}
+
+	resetMaterial(materialId) {
+		this.resetCache(`mat/${materialId}`);
+	}
+
+	loadModel3d(modelId, onLoaded) {
+		this.getAsset(`m3d/${modelId}`, onLoaded);
+	}
+
+	loadSprite(spriteId, onLoaded) {
+		this.getAsset(`spr/${spriteId}`, onLoaded);
+	}
+
+	preload(resources) {
+		console.log('Preloading:', resources);
+		resources.forEach((r) => this.getAsset(r));
+	}
+
+	load(resources) {
+		console.log('Loading:', resources);
+		resources.forEach((r) => this.getAsset(r, () => undefined));
+	}
+}

package/game/resources/assets/loader/AssetLoader.js

@@ -0,0 +1,56 @@
+import NodeWithEvents from "../../../../core/model/event/NodeWithEvents";
+
+/**
+ * Loads a single raw resource.
+ */
+export default class AssetLoader extends NodeWithEvents {
+
+	uri;
+
+	/**
+	 * @type AssetCache
+	 */
+	assets;
+
+	constructor(assets, uri, preload = false) {
+		super();
+		this.assets = assets;
+		this.uri = uri;
+		this.isPreloading = preload;
+	}
+
+	load(onLoaded, onError = null) {
+		this.addLoaderEventsListeners(onLoaded, onError);
+		this.loadInternal();
+	}
+
+	/**
+	 * Override this and then call this.finish(result) or this.fail(msg)
+	 */
+	loadInternal() {
+		// do something
+		this.fail('No loadInternal method override!');
+	}
+
+	finish(result) {
+		this.triggerEvent('load', result);
+	}
+
+	fail(msg) {
+		this.triggerEvent('error', msg);
+	}
+
+	addLoaderEventsListeners(onLoaded = null, onError = null) {
+		if (onLoaded) this.addEventListener('load', onLoaded);
+		if (onError) this.addEventListener('error', onError);
+	}
+
+	url() {
+		return AssetLoader.urlFromUri(this.uri);
+	}
+
+	static urlFromUri(uri) {
+		return 'assets/' + uri;
+	}
+
+}

package/game/resources/assets/loader/AudioLoader.js

@@ -0,0 +1,15 @@
+import AssetLoader from "./AssetLoader";
+
+/**
+ * Loads a single audio file (Audio object)
+ */
+export default class AudioLoader extends AssetLoader {
+
+	loadInternal() {
+		const audio = new Audio();
+		audio.addEventListener('canplaythrough', () => this.finish(audio));
+		audio.onerror = (msg) => this.fail(msg);
+		audio.src = this.url();
+	}
+
+}

package/game/resources/assets/loader/GlbLoader.js

@@ -0,0 +1,16 @@
+import AssetLoader from "./AssetLoader";
+import {GLTFLoader} from "three/examples/jsm/loaders/GLTFLoader";
+
+export default class GlbLoader extends AssetLoader {
+
+	loadInternal() {
+		const loader = new GLTFLoader();
+		loader.load(
+			this.url(),
+			(gltf) => this.finish(gltf),
+			null,
+			(err) => this.fail(`Glb '${this.url()}' not loaded: ${err}`)
+		);
+	}
+
+}

package/game/resources/assets/loader/ImageLoader.js

@@ -0,0 +1,15 @@
+import AssetLoader from "./AssetLoader";
+
+/**
+ * Loads a single Image
+ */
+export default class ImageLoader extends AssetLoader {
+
+	loadInternal() {
+		const image = new Image();
+		image.onload = () => this.finish(image);
+		image.onerror = (msg) => this.fail(msg);
+		image.src = this.url();
+	}
+
+}

package/game/resources/assets/loader/MaterialLoader.js

@@ -0,0 +1,49 @@
+import * as THREE from "three";
+import AssetLoader from "./AssetLoader";
+import NumberHelper from "../../../../core/helper/NumberHelper";
+
+/**
+ * Loads a single THREE material.
+ */
+export default class MaterialLoader extends AssetLoader {
+
+	loadInternal() {
+
+		const id = NumberHelper.extractId(this.uri);
+		const definition = this.assets.resources.materials.getById(id);
+		if (!definition) {
+			this.fail(`material ID ${this.uri} not found`);
+			return;
+		}
+
+		const params = {
+			color: definition.color.get()
+		};
+
+		if (definition.useTexture.get()) {
+			this.assets.getAsset(
+				definition.uri.get(),
+				(img) => {
+					const texture = new THREE.Texture();
+					texture.image = img;
+					texture.needsUpdate = true;
+					texture.wrapS = definition.wrapS.get();
+					texture.wrapT = definition.wrapT.get();
+					texture.repeat.set(
+						definition.repeatX.get(),
+						definition.repeatY.get()
+					);
+					params.map = texture;
+					this.finish(this.createMaterial(definition.threeType.get(), params));
+				}
+			);
+		} else {
+			this.finish(this.createMaterial(definition.threeType.get(), params));
+		}
+	}
+
+	createMaterial(threeType, params) {
+		return new THREE[threeType](params);
+	}
+
+}

package/game/resources/assets/loader/Model3dLoader.js

@@ -0,0 +1,21 @@
+import AssetLoader from "./AssetLoader";
+import NumberHelper from "../../../../core/helper/NumberHelper";
+
+/**
+ * Loads a 3d model
+ */
+export default class Model3dLoader extends AssetLoader {
+
+	loadInternal() {
+
+		const id = NumberHelper.extractId(this.uri);
+		const model = this.assets.resources.models3d.getById(id);
+
+		this.assets.getAsset(model.uri.get(), (gltf) => {
+			const mesh = gltf.scene.clone();
+			mesh.scale.set(model.scale.x, model.scale.y, model.scale.z);
+			this.finish(mesh);
+		});
+	}
+
+}

package/game/resources/assets/loader/SpriteLoader.js

@@ -0,0 +1,40 @@
+import * as THREE from "three";
+import AssetLoader from "./AssetLoader";
+import NumberHelper from "../../../../core/helper/NumberHelper";
+
+/**
+ * Loads a single Sprite
+ */
+export default class SpriteLoader extends AssetLoader {
+
+	loadInternal() {
+
+		const spriteId = NumberHelper.extractId(this.uri);
+		const sprite = this.assets.resources.sprites.getById(spriteId);
+
+		if (!sprite) {
+			this.fail(`Sprite ${spriteId} not found!`);
+			return;
+		}
+
+		this.assets.getAsset(sprite.uri.get(), (img) => {
+			const texture = new THREE.Texture();
+			texture.image = img;
+			texture.needsUpdate = true;
+			texture.wrapS = THREE.RepeatWrapping;
+			texture.wrapT = THREE.RepeatWrapping;
+			texture.repeat.set(1, 1);
+			const mesh = new THREE.Mesh(new THREE.PlaneGeometry(sprite.size.x, sprite.size.y), new THREE.MeshBasicMaterial({
+				transparent: true,
+				map: texture
+			}));
+			//const mesh = new THREE.Sprite(new THREE.SpriteMaterial({map: texture}));
+			mesh.position.set(sprite.coordinates.x, sprite.coordinates.y, sprite.coordinates.z);
+			const target = mesh.position.clone().add(new THREE.Vector3(-1, 1, -1));
+			mesh.lookAt(target.x, target.y, target.z);
+			this.finish(mesh);
+		});
+
+	}
+
+}

package/game/resources/image/DualImageModel.js

@@ -0,0 +1,34 @@
+import ModelNodeCollection from "../../../core/model/collection/ModelNodeCollection";
+import ImageModel from "./ImageModel";
+import Vector2 from "../../../core/model/vector/Vector2";
+
+export default class DualImageModel extends ModelNodeCollection {
+
+	/**
+	 * @type ImageModel
+	 */
+	imageA;
+
+	/**
+	 * @type ImageModel
+	 */
+	imageB;
+
+	/**
+	 * @type Vector2
+	 */
+	size;
+
+	constructor(persistent) {
+		super(null, persistent);
+
+		this.imageA = this.addProperty('imageA', new ImageModel());
+		this.imageB = this.addProperty('imageB', new ImageModel());
+		this.size = this.addProperty('size', new Vector2());
+
+		this.add(this.imageA);
+		this.add(this.imageB);
+
+	}
+
+}

package/game/resources/image/ImageModel.js

@@ -0,0 +1,43 @@
+import ObjectModel from "../../../core/model/ObjectModel";
+import StringValue from "../../../core/model/value/StringValue";
+import FloatValue from "../../../core/model/value/FloatValue";
+import Vector2 from "../../../core/model/vector/Vector2";
+
+export default class ImageModel extends ObjectModel {
+
+	/**
+	 * @type StringValue
+	 */
+	uri;
+
+	/**
+	 * @type FloatValue
+	 */
+	opacity;
+
+	/**
+	 * @type Vector2
+	 */
+	coordinates;
+
+	/**
+	 * @type FloatValue
+	 */
+	zoom;
+
+	/**
+	 * @type Vector2
+	 */
+	size;
+
+	constructor(persistent = true) {
+		super(persistent);
+
+		this.uri = this.addProperty('uri', new StringValue());
+		this.opacity = this.addProperty('opacity', new FloatValue());
+		this.coordinates = this.addProperty('coordinates', new Vector2());
+		this.size = this.addProperty('size', new Vector2());
+		this.zoom = this.addProperty('startZoom', new FloatValue(1));
+	}
+
+}

package/game/resources/material/MaterialModel.js

@@ -0,0 +1,69 @@
+import DirtyValue from "../../../core/model/value/DirtyValue";
+import IdentifiedModelNode from "../../../core/model/collection/table/IdentifiedModelNode";
+import * as THREE from "three";
+import BoolValue from "../../../core/model/value/BoolValue";
+import IntValue from "../../../core/model/value/IntValue";
+
+export default class MaterialModel extends IdentifiedModelNode {
+
+	/**
+	 * @type DirtyValue
+	 */
+	name;
+
+	/**
+	 * @type DirtyValue
+	 */
+	threeType;
+
+	/**
+	 * @type DirtyValue
+	 */
+	color;
+
+	/**
+	 * @type BoolValue
+	 */
+	useTexture;
+
+	/**
+	 * @type DirtyValue
+	 */
+	uri;
+
+	/**
+	 * @type IntValue
+	 */
+	wrapS;
+
+	/**
+	 * @type IntValue
+	 */
+	wrapT;
+
+	/**
+	 * @type IntValue
+	 */
+	repeatX;
+
+	/**
+	 * @type IntValue
+	 */
+	repeatY;
+
+	constructor(id) {
+		super(id);
+
+		this.name = this.addProperty('name', new DirtyValue(`Material ${id}`));
+		this.threeType = this.addProperty('threeType', new DirtyValue('MeshBasicMaterial'));
+		this.color = this.addProperty('color', new DirtyValue('#700000'));
+
+		this.useTexture = this.addProperty('useTexture', new BoolValue(true));
+		this.uri = this.addProperty('uri', new DirtyValue('img/texture/dirt.png'));
+		this.wrapS = this.addProperty('wrapS', new IntValue(THREE.RepeatWrapping));
+		this.wrapT = this.addProperty('wrapT', new IntValue(THREE.RepeatWrapping));
+		this.repeatX = this.addProperty('repeatX', new IntValue(2));
+		this.repeatY = this.addProperty('repeatY', new IntValue(2));
+	}
+
+}

package/game/save/SaveGameController.js

@@ -0,0 +1,21 @@
+import ControllerBase from "../../core/controller/ControllerBase";
+
+export default class SaveGameController extends ControllerBase {
+
+	/**
+	 * @type SaveGameModel
+	 */
+	model;
+
+	constructor(game, model) {
+		super(game, model);
+
+		this.model = model;
+	}
+
+	update(delta) {
+		if (this.game.menu.isSet()) return;
+		super.update(delta);
+	}
+
+}

package/game/save/SaveGameModel.js

@@ -0,0 +1,5 @@
+import ObjectModel from "../../core/model/ObjectModel";
+
+export default class SaveGameModel extends ObjectModel {
+
+}