@gg-web-engine/core 0.0.49 → 0.0.57

package/dist/base/models/body-options.js

@@ -1 +1,65 @@
-export {};
+export class DebugBodySettings {
+    get revision() {
+        // force check of color
+        let _ = this.color;
+        return this._revision;
+    }
+    get type() {
+        return this._type;
+    }
+    set type(value) {
+        this._type = value;
+        this._revision++;
+    }
+    get shape() {
+        return this._shape;
+    }
+    set shape(value) {
+        this._shape = value;
+        this._revision++;
+    }
+    get ignoreTransform() {
+        return this._ignoreTransform;
+    }
+    set ignoreTransform(value) {
+        this._ignoreTransform = value;
+        this._revision++;
+    }
+    get color() {
+        let color = 0;
+        if (this._color !== undefined) {
+            color = this._color;
+        }
+        else {
+            switch (this.type.type) {
+                case 'RIGID_DYNAMIC':
+                    color = this.type.sleeping() ? 0x0000ff : 0xff0000;
+                    break;
+                case 'RIGID_STATIC':
+                    color = 0x00ff00;
+                    break;
+                case 'TRIGGER':
+                    color = this.type.activated() ? 0xff9900 : 0xffff00;
+                    break;
+            }
+        }
+        if (color !== this.lastRetrievedColorCache) {
+            this._revision++;
+            this.lastRetrievedColorCache = color;
+        }
+        return color;
+    }
+    set color(value) {
+        this._color = value;
+    }
+    constructor(_type, _shape, _ignoreTransform = false, _color = undefined) {
+        this._type = _type;
+        this._shape = _shape;
+        this._ignoreTransform = _ignoreTransform;
+        this._color = _color;
+        // this value changes on each change inside the settings.
+        // Debug view skips updating anything if value stays the same
+        this._revision = 0;
+        this.lastRetrievedColorCache = 0;
+    }
+}

package/dist/dev/gg-console.ui.js

@@ -7,6 +7,7 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
         step((generator = generator.apply(thisArg, _arguments || [])).next());
     });
 };
+import { VERSION } from '../version';
 export class GgConsoleUI {
     constructor() {
         this.output = `
@@ -20,11 +21,12 @@ export class GgConsoleUI {
                 ░ ░   ░ ░ ░   ░      ░   ░     ░    ░    ░ 
                       ░       ░        ░       ░  ░ ░      
                                                          ░ 
+                             Version: ${VERSION}
              >>> https://github.com/AndyGura/gg-web-engine <<<
 Welcome to GG web engine UI console. 
 Enter command in input below.
 
-List of available commands: `.replace(/ /g, '&nbsp;') + `<span style="color:yellow">ls_commands</span>`;
+List of available commands: `.replace(/ /g, '&nbsp;') + `<span style='color:yellow'>commands</span>`;
         this.commandHistory = [];
         this.currentCommandIndex = 0; // for repeating command using up/down arrow keys
         this.elements = null;
@@ -98,9 +100,14 @@ List of available commands: `.replace(/ /g, '&nbsp;') + `<span style="color:yell
             if (value.trim() === '') {
                 return;
             }
-            let autocompletion = window.ggstatic.availableCommands.find((c) => c[0].startsWith(value));
-            if (autocompletion && autocompletion[0].length > value.length) {
-                this.elements.input.value = autocompletion[0];
+            let autocompletion = null;
+            for (let [command] of window.ggstatic.availableCommands) {
+                if (command.startsWith(value) && (!autocompletion || autocompletion.length > command.length)) {
+                    autocompletion = command;
+                }
+            }
+            if (autocompletion && autocompletion.length > value.length) {
+                this.elements.input.value = autocompletion;
                 this.elements.input.setSelectionRange(value.length, this.elements.input.value.length);
             }
         };
@@ -135,6 +142,9 @@ List of available commands: `.replace(/ /g, '&nbsp;') + `<span style="color:yell
     onInput() {
         return __awaiter(this, void 0, void 0, function* () {
             const command = this.elements.input.value;
+            if (command.length === 0) {
+                return;
+            }
             this.elements.input.value = '';
             this.stdout('\n> ' + command);
             this.stdout('\n' + (yield window.ggstatic.console(command)));

package/dist/dev/gg-debugger.ui.d.ts

@@ -4,11 +4,11 @@ export declare class GgDebuggerUI {
     private statsRemoved$;
     get showStats(): boolean;
     private currentWorld;
-    setShowStats(selectedWorld: GgWorld<any, any>, value: boolean): void;
+    setShowStats(selectedWorld: GgWorld<any, any> | null, value: boolean): void;
     private debugControlsRemoved$;
     private viewUpdated$;
     get showDebugControls(): boolean;
-    setShowDebugControls(selectedWorld: GgWorld<any, any>, value: boolean): void;
+    setShowDebugControls(selectedWorld: GgWorld<any, any> | null, value: boolean): void;
     private snapshot;
     perfStatsMode: 'AVG' | 'PEAK';
     private performanceStatsSnapshot;

package/dist/dev/gg-debugger.ui.js

@@ -1,4 +1,4 @@
-import { createInlineTickController, IRendererEntity } from '../base';
+import { createInlineTickController } from '../base';
 import { animationFrameScheduler, fromEvent, of, Subject, takeUntil } from 'rxjs';
 import Stats from 'stats.js';
 import { repeat } from 'rxjs/operators';
@@ -69,7 +69,7 @@ export class GgDebuggerUI {
             }
         }
         this.currentWorld = selectedWorld;
-        if (value) {
+        if (selectedWorld && value) {
             const stats = new Stats();
             this.ui.stats = stats;
             stats.dom.style.left = 'unset';
@@ -139,18 +139,11 @@ export class GgDebuggerUI {
         }
     }
     makeSnapshot() {
-        const renderers = [];
-        let performanceMeter = null;
-        for (const e of this.currentWorld.children) {
-            if (e instanceof IRendererEntity) {
-                renderers.push(e);
-            }
-            else if (e instanceof PerformanceMeterEntity) {
-                performanceMeter = e;
-            }
-        }
+        var _a, _b, _c;
+        const renderers = ((_a = this.currentWorld) === null || _a === void 0 ? void 0 : _a.renderers) || [];
+        let performanceMeter = (((_b = this.currentWorld) === null || _b === void 0 ? void 0 : _b.children) || []).find(e => e instanceof PerformanceMeterEntity);
         return {
-            timeScale: this.currentWorld.worldClock.timeScale,
+            timeScale: ((_c = this.currentWorld) === null || _c === void 0 ? void 0 : _c.worldClock.timeScale) || NaN,
             renderers: renderers.map(r => ({
                 name: r.name,
                 entity: r,
@@ -160,9 +153,10 @@ export class GgDebuggerUI {
         };
     }
     makePerformanceStatsSnapshot() {
+        var _a;
         if (!this.snapshot.performanceStatsEnabled)
             return null;
-        let performanceMeter = this.currentWorld.children.find(e => e instanceof PerformanceMeterEntity);
+        let performanceMeter = (((_a = this.currentWorld) === null || _a === void 0 ? void 0 : _a.children) || []).find(e => e instanceof PerformanceMeterEntity);
         if (performanceMeter) {
             if (this.perfStatsMode === 'AVG') {
                 return performanceMeter.avgReport;
@@ -178,19 +172,19 @@ export class GgDebuggerUI {
         for (const { entity, physicsDebugViewActive } of this.snapshot.renderers) {
             html += `
       <div ${this.css}>
-        <input type='checkbox' name='checkbox' id='physics_debugger_checkbox_id_${entity.name}' value='1'${physicsDebugViewActive ? ' checked' : ''}>
+        <input type='checkbox' name='checkbox' id='physics_debugger_checkbox_id_${entity.name}' onkeydown='event.preventDefault()' value='1'${physicsDebugViewActive ? ' checked' : ''}>
         <label for='physics_debugger_checkbox_id_${entity.name}' style='user-select: none;'>Physics debugger${this.snapshot.renderers.length > 1 ? ' (' + entity.name + ')' : ''}</label>
       </div>`;
         }
         html += `
       <div ${this.css}>
-        <input id='time_scale_slider' type='range' min='0' max='5' step='0.01' style='flex-grow:1' value='${this.snapshot.timeScale}'/>
+        <input id='time_scale_slider' type='range' min='0' max='5' step='0.01' onkeydown='event.preventDefault()' style='flex-grow:1' value='${this.snapshot.timeScale}'/>
         <label for='time_scale_slider' style='user-select: none;'>Time scale</label>
       </div>`;
         html +=
             `
       <div ${this.css}>
-        <input type='checkbox' name='checkbox' id='perf_stats_checkbox_id' value='1'${this.snapshot.performanceStatsEnabled ? ' checked' : ''}>
+        <input type='checkbox' name='checkbox' id='perf_stats_checkbox_id' onkeydown='event.preventDefault()' value='1'${this.snapshot.performanceStatsEnabled ? ' checked' : ''}>
         <label for='perf_stats_checkbox_id' style='user-select: none;'>Entities performance distribution</label>
       </div>
     ` +
@@ -233,12 +227,13 @@ export class GgDebuggerUI {
         fromEvent(document.getElementById('perf_stats_checkbox_id'), 'change')
             .pipe(takeUntil(this.debugControlsRemoved$), takeUntil(this.viewUpdated$))
             .subscribe(e => {
-            const entity = this.currentWorld.children.find(x => x instanceof PerformanceMeterEntity);
+            var _a;
+            const entity = (((_a = this.currentWorld) === null || _a === void 0 ? void 0 : _a.children) || []).find(x => x instanceof PerformanceMeterEntity);
             if (e.target.checked == !entity) {
                 if (entity) {
                     this.currentWorld.removeEntity(entity);
                 }
-                else {
+                else if (this.currentWorld) {
                     this.currentWorld.addEntity(new PerformanceMeterEntity());
                 }
             }
@@ -265,7 +260,7 @@ export class GgDebuggerUI {
             html += `
           <div ${pCss}>
             <label for='stat_progress' ${labelCss}>${total.toFixed(2)}ms</label>
-            <progress id="stat_progress" ${progressCss} max="16" value="${total}"></progress>
+            <progress id='stat_progress' ${progressCss} max='16' value='${total}'></progress>
             <span ${spanCss}>Total frame time</span>
           </div>`;
             for (const [i, [name, value]] of this.performanceStatsSnapshot.entries.entries()) {

package/dist/dev/gg-static.d.ts

@@ -7,12 +7,17 @@ export declare class GgStatic {
     get devConsoleEnabled(): boolean;
     consoleKeyPressEventListener: (event: KeyboardEvent) => void;
     set devConsoleEnabled(value: boolean);
+    toggleDevConsole(value: boolean): void;
+    private showStats$;
     get showStats(): boolean;
     set showStats(value: boolean);
+    private showDebugControls$;
     get showDebugControls(): boolean;
     set showDebugControls(value: boolean);
-    private _selectedWorld;
+    private _selectedWorld$;
     get selectedWorld(): GgWorld<any, any> | null;
+    private set selectedWorld(value);
+    private autoAssignSelectedWorld;
     get availableCommands(): [string, {
         handler: (...args: string[]) => Promise<string>;
         doc?: string;

package/dist/dev/gg-static.js

@@ -7,13 +7,14 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
         step((generator = generator.apply(thisArg, _arguments || [])).next());
     });
 };
-import { GgWorld } from '../base';
+import { GgWorld, KeyboardInput } from '../base';
 import { GgConsoleUI } from './gg-console.ui';
 import { GgDebuggerUI } from './gg-debugger.ui';
+import { BehaviorSubject, combineLatest, filter, fromEvent, NEVER, Subject, switchMap, take, takeUntil, takeWhile, } from 'rxjs';
 export class GgStatic {
     static get instance() {
         if (!window.ggstatic) {
-            window.ggstatic = new GgStatic();
+            return new GgStatic();
         }
         return window.ggstatic;
     }
@@ -35,25 +36,52 @@ export class GgStatic {
             }
         }
     }
+    toggleDevConsole(value) {
+        if (value === this.consoleUI.isUIShown)
+            return;
+        if (this.consoleUI.isUIShown) {
+            this.consoleUI.destroyUI();
+        }
+        else {
+            this.consoleUI.createUI();
+        }
+    }
     get showStats() {
-        return this.debuggerUI.showStats;
+        return this.showStats$.getValue();
     }
     set showStats(value) {
-        this.debuggerUI.setShowStats(this.selectedWorld, value);
+        if (value === this.showStats)
+            return;
+        this.showStats$.next(value);
     }
     get showDebugControls() {
-        return this.debuggerUI.showDebugControls;
+        return this.showDebugControls$.getValue();
     }
     set showDebugControls(value) {
-        this.debuggerUI.setShowDebugControls(this.selectedWorld, value);
+        if (value === this.showDebugControls)
+            return;
+        this.showDebugControls$.next(value);
     }
     get selectedWorld() {
-        return this._selectedWorld || GgWorld.documentWorlds[0] || null;
+        return this._selectedWorld$.getValue();
+    }
+    set selectedWorld(w) {
+        this._selectedWorld$.next(w);
+    }
+    autoAssignSelectedWorld() {
+        if (GgWorld.documentWorlds.length > 0) {
+            this.selectedWorld = GgWorld.documentWorlds[0];
+        }
+        else {
+            GgWorld.worldCreated$
+                .pipe(takeWhile(() => !this.selectedWorld), take(1))
+                .subscribe(w => (this.selectedWorld = w));
+        }
     }
     get availableCommands() {
         let commands = this.consoleCommands.get(null) || {};
         if (this.selectedWorld) {
-            commands = Object.assign(Object.assign({}, (this.consoleCommands.get(this.selectedWorld) || {})), commands);
+            commands = Object.assign(Object.assign({}, commands), (this.consoleCommands.get(this.selectedWorld) || {}));
         }
         return Object.entries(commands);
     }
@@ -72,37 +100,88 @@ export class GgStatic {
                 }
             }
         };
-        this._selectedWorld = null;
+        this.showStats$ = new BehaviorSubject(false);
+        this.showDebugControls$ = new BehaviorSubject(false);
+        this._selectedWorld$ = new BehaviorSubject(null);
         this.consoleCommands = new Map();
-        this.registerConsoleCommand(null, 'ls_commands', () => __awaiter(this, void 0, void 0, function* () {
+        this.registerConsoleCommand(null, 'commands', () => __awaiter(this, void 0, void 0, function* () {
             return this.availableCommands
                 .map(([key, value]) => `<span style='color:yellow'>${key}</span>${value.doc ? '\t<span style="color:#aaa">// ' + value.doc + '</span>' : ''}`)
-                .sort()
                 .join('\n\n');
-        }), 'no args; print all available commands');
-        this.registerConsoleCommand(null, 'ls_worlds', () => __awaiter(this, void 0, void 0, function* () {
+        }), 'no args; Print all available commands. List includes global commands and commands, ' +
+            'specific to currently selected world. Run "world" to check which world is currently ' +
+            'selected and "world {world_name}" to select desired world');
+        this.registerConsoleCommand(null, 'help', (keyword) => __awaiter(this, void 0, void 0, function* () {
+            var _a;
+            const command = (_a = this.availableCommands.find(([key]) => key === keyword)) === null || _a === void 0 ? void 0 : _a[1];
+            if (!command) {
+                throw new Error(`Unrecognized command: ${keyword}`);
+            }
+            return `<span style='color:#aaa'>${command.doc || 'No doc string given'}</span>`;
+        }), 'args: [ string ]; Print doc string of provided command');
+        this.registerConsoleCommand(null, 'worlds', () => __awaiter(this, void 0, void 0, function* () {
             return GgWorld.documentWorlds
                 .map(w => (w === this.selectedWorld ? `<span style='color:lightgreen;'>* ${w.name}</span>` : `  ${w.name}`))
                 .join('\n');
-        }), 'no args; print all available worlds');
-        this.registerConsoleCommand(null, 'select_world', (...args) => __awaiter(this, void 0, void 0, function* () {
+        }), 'no args; Print all currently available worlds');
+        this.registerConsoleCommand(null, 'world', (...args) => __awaiter(this, void 0, void 0, function* () {
             var _a;
             for (const w of GgWorld.documentWorlds) {
                 if (w.name === args[0]) {
-                    this._selectedWorld = w;
+                    this.selectedWorld = w;
                     break;
                 }
             }
             return ((_a = this.selectedWorld) === null || _a === void 0 ? void 0 : _a.name) || 'null';
-        }), 'args: [string]; select world by name');
-        this.registerConsoleCommand(null, 'show_debugger', (...args) => __awaiter(this, void 0, void 0, function* () {
-            this.showDebugControls = ['1', 'true', '+'].includes(args[0]);
-            return '' + this.showDebugControls;
-        }), 'args: [0 or 1]; turn on/off debug panel. Default value is 0');
-        this.registerConsoleCommand(null, 'show_stats', (...args) => __awaiter(this, void 0, void 0, function* () {
-            this.showStats = ['1', 'true', '+'].includes(args[0]);
-            return '' + this.showStats;
-        }), 'args: [0 or 1]; turn on/off stats. Default value is 0');
+        }), 'args: [ string? ]; Get name of selected world or select world by name. Use ' +
+            '"worlds" to get list of currently available worlds');
+        this.registerConsoleCommand(null, 'stats_panel', (...args) => __awaiter(this, void 0, void 0, function* () {
+            this.showStats = args[0] === undefined ? !this.showStats : args[0] === '1';
+            return this.showStats ? '1' : '0';
+        }), 'args: [ 0|1? ]; Turn on/off stats panel, skip argument to toggle value');
+        this.registerConsoleCommand(null, 'debug_panel', (...args) => __awaiter(this, void 0, void 0, function* () {
+            this.showDebugControls = args[0] === undefined ? !this.showDebugControls : args[0] === '1';
+            return this.showDebugControls ? '1' : '0';
+        }), 'args: [ 0|1? ]; Turn on/off debug panel, skip argument to toggle value');
+        let unbindKey$ = new Subject();
+        this.registerConsoleCommand(null, 'bind_key', (keyCode, command, ...args) => __awaiter(this, void 0, void 0, function* () {
+            fromEvent(window, 'keydown')
+                .pipe(takeUntil(unbindKey$.pipe(filter(x => x === keyCode))), filter(e => {
+                if (e.code !== keyCode) {
+                    return false;
+                }
+                if (document.activeElement) {
+                    for (const k of KeyboardInput.externalFocusBlacklist) {
+                        if (document.activeElement instanceof k) {
+                            return false;
+                        }
+                    }
+                }
+                return true;
+            }))
+                .subscribe(() => {
+                this.runConsoleCommand(command, args);
+            });
+            return 'Ok';
+        }), 'args: [ string, ...string ]; Bind a keyboard key by code to console command. Check key codes' +
+            ' <a target="_blank" rel="noopener noreferrer" href="https://www.toptal.com/developers/keycode">here</a>. Use "unbind_key" command to unbind it');
+        this.registerConsoleCommand(null, 'unbind_key', (...args) => __awaiter(this, void 0, void 0, function* () {
+            unbindKey$.next(args[0]);
+            return 'Ok';
+        }), 'args: [ string ]; Unbind a keyboard key from console command');
+        window.ggstatic = this;
+        this.autoAssignSelectedWorld();
+        this._selectedWorld$.pipe(switchMap(w => (w ? w.disposed$ : NEVER))).subscribe(() => {
+            this.selectedWorld = null;
+            this.autoAssignSelectedWorld();
+        });
+        window.dispatchEvent(new Event('ggstatic_added'));
+        combineLatest([this._selectedWorld$, this.showDebugControls$]).subscribe(([world, showControls]) => {
+            this.debuggerUI.setShowDebugControls(world, !!world && showControls);
+        });
+        combineLatest([this._selectedWorld$, this.showStats$]).subscribe(([world, showStats]) => {
+            this.debuggerUI.setShowStats(world, !!world && showStats);
+        });
     }
     registerConsoleCommand(world, command, handler, doc) {
         let commands = {};

package/dist/index.d.ts

@@ -1,4 +1,6 @@
+import { VERSION } from './version';
 export * from './base';
 export * from './2d';
 export * from './3d';
 export * from './dev';
+export { VERSION };

package/dist/index.js

@@ -1,4 +1,7 @@
+import { VERSION } from './version';
+window.gg_version = VERSION;
 export * from './base';
 export * from './2d';
 export * from './3d';
 export * from './dev';
+export { VERSION };

package/dist/version.d.ts

@@ -0,0 +1 @@
+export declare const VERSION = "0.0.57";

package/dist/version.js

@@ -0,0 +1 @@
+export const VERSION = '0.0.57';

package/package.json

@@ -1,14 +1,15 @@
 {
   "name": "@gg-web-engine/core",
-  "version": "0.0.49",
+  "version": "0.0.57",
   "description": "An attempt to create open source game engine for browser",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
   "scripts": {
     "test": "jest",
     "prettier-format": "prettier --config .prettierrc 'src/**/*.ts' --write",
-    "prepublish": "rm -rf ./dist/ && tsc",
-    "build": "tsc"
+    "prepublish": "rm -rf ./dist/ && npm run build",
+    "update-version": "VERSION=$(grep '\"version\":' package.json | sed -E 's/.*\"version\": *\"([^\"]+)\".*/\\1/') && echo \"export const VERSION = '$VERSION';\" > src/version.ts",
+    "build": "npm run update-version && tsc"
   },
   "repository": {
     "type": "git",