@gg-web-engine/core 0.0.38 → 0.0.40

package/dist/base/components/physics/i-physics-world.component.d.ts

@@ -1,12 +1,16 @@
-import { GgWorld, PhysicsTypeDocRepo } from '../../gg-world';
-import { IDebugPhysicsDrawer } from '../../interfaces/i-debug-physics-drawer';
+import { PhysicsTypeDocRepo } from '../../gg-world';
 import { IComponent } from '../i-component';
 import { CollisionGroup } from '../../models/body-options';
+import { Subject } from 'rxjs';
 export interface IPhysicsWorldComponent<D, R, TypeDoc extends PhysicsTypeDocRepo<D, R> = PhysicsTypeDocRepo<D, R>> extends IComponent {
     readonly factory: TypeDoc['factory'];
     gravity: D;
-    timeScale: number;
-    get physicsDebugViewActive(): boolean;
+    /** event emitter, emits newly added physics components */
+    readonly added$: Subject<TypeDoc['rigidBody'] | TypeDoc['trigger'] | any>;
+    /** event emitter, emits just removed physics components */
+    readonly removed$: Subject<TypeDoc['rigidBody'] | TypeDoc['trigger'] | any>;
+    /** list of currently added to world physics components */
+    readonly children: (TypeDoc['rigidBody'] | TypeDoc['trigger'] | any)[];
     init(): Promise<void>;
     /**
      * Runs simulation of the physics world.
@@ -16,6 +20,4 @@ export interface IPhysicsWorldComponent<D, R, TypeDoc extends PhysicsTypeDocRepo
     simulate(delta: number): void;
     registerCollisionGroup(): CollisionGroup;
     deregisterCollisionGroup(group: CollisionGroup): void;
-    startDebugger(world: GgWorld<D, R>, drawer: IDebugPhysicsDrawer<D, R>): void;
-    stopDebugger(world: GgWorld<D, R>): void;
 }

package/dist/base/components/rendering/i-renderer.component.d.ts

@@ -25,8 +25,12 @@ export declare abstract class IRendererComponent<D, R, VTypeDoc extends VisualTy
     readonly canvas?: HTMLCanvasElement | undefined;
     entity: IEntity | null;
     /** Specifies the options for the renderer. */
-    readonly rendererOptions: RendererOptions;
-    protected constructor(scene: IVisualSceneComponent<D, R, VTypeDoc>, canvas?: HTMLCanvasElement | undefined, options?: Partial<RendererOptions>);
+    readonly rendererOptions: RendererOptions & Partial<VTypeDoc['rendererExtraOpts']>;
+    /** get flag whether renderer shows physics debugger view */
+    abstract get physicsDebugViewActive(): boolean;
+    /** turns on/off physics debugger view for this renderer */
+    abstract set physicsDebugViewActive(value: boolean);
+    protected constructor(scene: IVisualSceneComponent<D, R, VTypeDoc>, canvas?: HTMLCanvasElement | undefined, options?: Partial<RendererOptions & VTypeDoc['rendererExtraOpts']>);
     /**
      * Renders the scene.
      */

package/dist/base/components/rendering/i-visual-scene.component.d.ts

@@ -1,10 +1,6 @@
-import { IDebugPhysicsDrawer } from '../../interfaces/i-debug-physics-drawer';
 import { IComponent } from '../i-component';
 import { VisualTypeDocRepo } from '../../gg-world';
 export interface IVisualSceneComponent<D, R, TypeDoc extends VisualTypeDocRepo<D, R> = VisualTypeDocRepo<D, R>> extends IComponent {
     readonly factory: TypeDoc['factory'];
-    readonly debugPhysicsDrawerClass?: {
-        new (): IDebugPhysicsDrawer<D, R, TypeDoc>;
-    };
     init(): Promise<void>;
 }

package/dist/base/entities/controllers/inline-controller.d.ts

@@ -1,3 +1,3 @@
 import { GgWorld } from '../../gg-world';
 import { Observable } from 'rxjs';
-export declare function createInlineTickController(world: GgWorld<any, any>, tickOrder?: number): Observable<[number, number]>;
+export declare function createInlineTickController(world: GgWorld<any, any>, tickOrder?: number, name?: string): Observable<[number, number]>;

package/dist/base/entities/controllers/inline-controller.js

@@ -6,8 +6,11 @@ class InlineTickController extends IEntity {
         this.tickOrder = tickOrder;
     }
 }
-export function createInlineTickController(world, tickOrder = TickOrder.CONTROLLERS) {
+export function createInlineTickController(world, tickOrder = TickOrder.CONTROLLERS, name) {
     const controller = new InlineTickController(tickOrder);
+    if (name) {
+        controller.name = name;
+    }
     world.addEntity(controller);
     return controller.tick$.pipe(finalize(() => {
         world.removeEntity(controller, true);

package/dist/base/entities/i-entity.d.ts

@@ -34,7 +34,7 @@ export declare abstract class IEntity<D = any, R = any, VTypeDoc extends VisualT
     /**
      * The flag whether entity should listen to ticks. If set to false, ticks will not be propagated to this entity
      * */
-    protected _active: boolean;
+    protected _selfActive: boolean;
     get active(): boolean;
     set active(value: boolean);
     parent: IEntity | null;

package/dist/base/entities/i-entity.js

@@ -26,7 +26,7 @@ export class IEntity {
         /**
          * The flag whether entity should listen to ticks. If set to false, ticks will not be propagated to this entity
          * */
-        this._active = true;
+        this._selfActive = true;
         this.parent = null;
         this._children = [];
         this._components = [];
@@ -43,10 +43,10 @@ export class IEntity {
         this._name = value;
     }
     get active() {
-        return this._active;
+        return this._selfActive && (!this.parent || this.parent.active);
     }
     set active(value) {
-        this._active = value;
+        this._selfActive = value;
     }
     get children() {
         return [...this._children];

package/dist/base/entities/i-renderer.entity.d.ts

@@ -23,6 +23,10 @@ export declare abstract class IRendererEntity<D, R, TypeDoc extends VisualTypeDo
      */
     get rendererSize(): Point2 | null;
     get rendererOptions(): RendererOptions;
+    /** get flag whether renderer shows physics debugger view */
+    get physicsDebugViewActive(): boolean;
+    /** turns on/off physics debugger view for this renderer */
+    set physicsDebugViewActive(value: boolean);
     /**
      Initializes a new instance of the BaseGgRenderer class.
      * @param renderer

package/dist/base/entities/i-renderer.entity.js

@@ -38,6 +38,14 @@ export class IRendererEntity extends IEntity {
     get rendererOptions() {
         return this.renderer.rendererOptions;
     }
+    /** get flag whether renderer shows physics debugger view */
+    get physicsDebugViewActive() {
+        return this.renderer.physicsDebugViewActive;
+    }
+    /** turns on/off physics debugger view for this renderer */
+    set physicsDebugViewActive(value) {
+        this.renderer.physicsDebugViewActive = value;
+    }
     onSpawned(world) {
         this._rendererSize$.next(null);
         if (this.rendererOptions.size == 'fullscreen' || typeof this.rendererOptions.size === 'function') {

package/dist/base/gg-world.d.ts

@@ -1,8 +1,10 @@
 import { IDisplayObjectComponent, IEntity, IPhysicsWorldComponent, IPositionable, IRenderableEntity, IRendererComponent, IRigidBodyComponent, ITriggerComponent, IVisualSceneComponent, KeyboardInput, PausableClock } from '../base';
+import { Subject } from 'rxjs';
 export declare type VisualTypeDocRepo<D, R> = {
     factory: unknown;
     displayObject: IDisplayObjectComponent<D, R>;
     renderer: IRendererComponent<D, R>;
+    rendererExtraOpts: {};
 };
 export declare type PhysicsTypeDocRepo<D, R> = {
     factory: unknown;
@@ -12,14 +14,17 @@ export declare type PhysicsTypeDocRepo<D, R> = {
 export declare abstract class GgWorld<D, R, VTypeDoc extends VisualTypeDocRepo<D, R> = VisualTypeDocRepo<D, R>, PTypeDoc extends PhysicsTypeDocRepo<D, R> = PhysicsTypeDocRepo<D, R>, VS extends IVisualSceneComponent<D, R, VTypeDoc> = IVisualSceneComponent<D, R, VTypeDoc>, PW extends IPhysicsWorldComponent<D, R, PTypeDoc> = IPhysicsWorldComponent<D, R, PTypeDoc>> {
     readonly visualScene: VS;
     readonly physicsWorld: PW;
+    private static default_name_counter;
+    private static _documentWorlds;
+    static get documentWorlds(): GgWorld<any, any>[];
     readonly worldClock: PausableClock;
     readonly keyboardInput: KeyboardInput;
-    private static default_name_counter;
     name: string;
     readonly children: IEntity[];
     protected readonly tickListeners: IEntity[];
-    private static _documentWorlds;
-    static get documentWorlds(): GgWorld<any, any>[];
+    readonly tickStarted$: Subject<void>;
+    readonly tickForwardTo$: Subject<IEntity | 'PHYSICS_WORLD'>;
+    readonly tickForwardedTo$: Subject<IEntity | 'PHYSICS_WORLD'>;
     protected constructor(visualScene: VS, physicsWorld: PW);
     init(): Promise<void>;
     start(): void;
@@ -34,6 +39,4 @@ export declare abstract class GgWorld<D, R, VTypeDoc extends VisualTypeDocRepo<D
     position?: D, rotation?: R, material?: unknown): IPositionable<D, R> & IRenderableEntity<D, R, VTypeDoc>;
     addEntity(entity: IEntity): void;
     removeEntity(entity: IEntity, dispose?: boolean): void;
-    get physicsDebugViewActive(): boolean;
-    set physicsDebugViewActive(value: boolean);
 }

package/dist/base/gg-world.js

@@ -7,7 +7,9 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
         step((generator = generator.apply(thisArg, _arguments || [])).next());
     });
 };
-import { GgGlobalClock, KeyboardInput, TickOrder, } from '../base';
+import { GgGlobalClock, IRendererEntity, KeyboardInput, TickOrder, } from '../base';
+import { lastValueFrom, Subject, take } from 'rxjs';
+import { PerformanceMeterEntity } from '../dev';
 export class GgWorld {
     constructor(visualScene, physicsWorld) {
         this.visualScene = visualScene;
@@ -18,25 +20,74 @@ export class GgWorld {
         this.children = [];
         // the same as children, but sorted by tick order
         this.tickListeners = [];
+        // events
+        this.tickStarted$ = new Subject();
+        this.tickForwardTo$ = new Subject();
+        this.tickForwardedTo$ = new Subject();
         GgWorld._documentWorlds.push(this);
         this.keyboardInput.start();
         if (window.ggstatic) {
-            window.ggstatic.registerConsoleCommand(this, 'show_debugger', (...args) => __awaiter(this, void 0, void 0, function* () {
-                window.ggstatic.showDebugControls = ['1', 'true', '+'].includes(args[0]);
-                return '' + window.ggstatic.showDebugControls;
-            }), 'args: [0 or 1]; turn on/off debug panel. Default value is 0');
-            window.ggstatic.registerConsoleCommand(this, 'show_stats', (...args) => __awaiter(this, void 0, void 0, function* () {
-                window.ggstatic.showStats = ['1', 'true', '+'].includes(args[0]);
-                return '' + window.ggstatic.showStats;
-            }), 'args: [0 or 1]; turn on/off stats. Default value is 0');
             window.ggstatic.registerConsoleCommand(this, 'ph_timescale', (...args) => __awaiter(this, void 0, void 0, function* () {
-                this.physicsWorld.timeScale = +args[0];
-                return JSON.stringify(this.physicsWorld.timeScale);
+                this.worldClock.timeScale = +args[0];
+                return JSON.stringify(this.worldClock.timeScale);
             }), 'args: [float]; change time scale of physics engine. Default value is 1.0');
+            window.ggstatic.registerConsoleCommand(this, 'ls_renderers', () => __awaiter(this, void 0, void 0, function* () {
+                return this.children
+                    .filter(e => e instanceof IRendererEntity)
+                    .map(r => r.name)
+                    .join('\n');
+            }), 'no args; print all renderers in selected world');
             window.ggstatic.registerConsoleCommand(this, 'dr_drawphysics', (...args) => __awaiter(this, void 0, void 0, function* () {
-                this.physicsDebugViewActive = ['1', 'true', '+'].includes(args[0]);
-                return '' + this.physicsWorld.physicsDebugViewActive;
-            }), 'args: [0 or 1]; turn on/off physics debug view. Default value is 0');
+                const value = ['1', 'true', '+'].includes(args[0]);
+                const rendererName = args[1];
+                let renderer;
+                if (rendererName) {
+                    renderer = this.children.find(x => x instanceof IRendererEntity && x.name === rendererName);
+                }
+                else {
+                    renderer = this.children.find(x => x instanceof IRendererEntity);
+                }
+                if (renderer) {
+                    renderer.physicsDebugViewActive = value;
+                    return '' + value;
+                }
+                return 'false';
+            }), 'args: [0 or 1] or [0 or 1, string]; turn on/off physics debug view. Second argument expects renderer ' +
+                'name, if not provided first renderer will be picked. Look up for renderer names using command "ls_renderers"');
+            window.ggstatic.registerConsoleCommand(this, 'performance_report', (...args) => __awaiter(this, void 0, void 0, function* () {
+                let mode = 'avg';
+                let samples = 20;
+                for (let i = 0; i < 2; i++) {
+                    if (['avg', 'peak'].includes(args[i])) {
+                        mode = args[i];
+                    }
+                    else if (!isNaN(+args[i])) {
+                        samples = +args[i];
+                    }
+                }
+                const meter = new PerformanceMeterEntity(samples, 250);
+                this.addEntity(meter);
+                yield lastValueFrom(this.worldClock.tick$.pipe(take(samples)));
+                const report = mode === 'avg' ? meter.avgReport : meter.peakReport;
+                this.removeEntity(meter);
+                const renderItems = report.entries.map(([name, value]) => `<span style='color:lightgray;'>${name}:</span>` +
+                    new Array(Math.max(0, 26 - name.length)).join('&nbsp;') +
+                    `${value.toFixed(2)} ms` +
+                    (mode === 'avg' ? ` (${((value * 100) / report.totalTime).toFixed(2)}%)` : ''));
+                let totalColor = 'lightgreen';
+                if (report.totalTime > 12) {
+                    totalColor = report.totalTime < 16 ? 'yellow' : 'red';
+                }
+                const title = `${mode === 'avg' ? 'Average' : 'Peak'} Frame time`;
+                renderItems.unshift(title +
+                    ':' +
+                    new Array(Math.max(0, 26 - title.length)).join('&nbsp;') +
+                    `<span style='color:${totalColor};'>${report.totalTime.toFixed(2)} ms</span>`);
+                renderItems.unshift(`Performance report (${samples} samples)`);
+                return renderItems.join('\n');
+            }), 'args: [int, avg|peak]; [avg|peak, int]; [avg|peak]; [int] or []; measure how much time was spent per ' +
+                'entity in world. Arguments are samples amount (20 by default) and "peak" or "avg" choice, both arguments are ' +
+                'optional. "avg" report sorts entities by average time consumed, "peak" records highest value for each entity');
         }
     }
     static get documentWorlds() {
@@ -45,24 +96,30 @@ export class GgWorld {
     init() {
         return __awaiter(this, void 0, void 0, function* () {
             yield Promise.all([this.physicsWorld.init(), this.visualScene.init()]);
+            const forwardTick = (listener, elapsed, delta) => {
+                if (listener.active) {
+                    this.tickForwardTo$.next(listener);
+                    listener.tick$.next([elapsed, delta]);
+                    this.tickForwardedTo$.next(listener);
+                }
+            };
             this.worldClock.tick$.subscribe(([elapsed, delta]) => {
+                this.tickStarted$.next();
                 let i = 0;
                 // emit tick to all entities with tick order < GGTickOrder.PHYSICS_SIMULATION
                 for (i; i < this.tickListeners.length; i++) {
                     if (this.tickListeners[i].tickOrder >= TickOrder.PHYSICS_SIMULATION) {
                         break;
                     }
-                    if (this.tickListeners[i].active) {
-                        this.tickListeners[i].tick$.next([elapsed, delta]);
-                    }
+                    forwardTick(this.tickListeners[i], elapsed, delta);
                 }
-                // run phycics simulation
+                // run physics simulation
+                this.tickForwardTo$.next('PHYSICS_WORLD');
                 this.physicsWorld.simulate(delta);
+                this.tickForwardedTo$.next('PHYSICS_WORLD');
                 // emit tick to all remained entities
                 for (i; i < this.tickListeners.length; i++) {
-                    if (this.tickListeners[i].active) {
-                        this.tickListeners[i].tick$.next([elapsed, delta]);
-                    }
+                    forwardTick(this.tickListeners[i], elapsed, delta);
                 }
             });
         });
@@ -94,6 +151,9 @@ export class GgWorld {
         }
         this.worldClock.stop();
         this.keyboardInput.stop();
+        this.tickStarted$.complete();
+        this.tickForwardTo$.complete();
+        this.tickForwardedTo$.complete();
         for (let i = 0; i < this.children.length; i++) {
             this.children[i].onRemoved();
             this.children[i].dispose();
@@ -126,24 +186,6 @@ export class GgWorld {
             entity.dispose();
         }
     }
-    get physicsDebugViewActive() {
-        return this.physicsWorld.physicsDebugViewActive;
-    }
-    set physicsDebugViewActive(value) {
-        if (this.physicsDebugViewActive === value) {
-            return;
-        }
-        if (value) {
-            const cls = this.visualScene.debugPhysicsDrawerClass;
-            if (!cls) {
-                throw new Error('Debug drawer is not available');
-            }
-            this.physicsWorld.startDebugger(this, new cls());
-        }
-        else {
-            this.physicsWorld.stopDebugger(this);
-        }
-    }
 }
 GgWorld.default_name_counter = 0;
 GgWorld._documentWorlds = [];

package/dist/base/index.d.ts

@@ -21,7 +21,6 @@ export * from './inputs/direction.keyboard.input';
 export * from './inputs/i-input';
 export * from './inputs/keyboard.input';
 export * from './inputs/mouse.input';
-export * from './interfaces/i-debug-physics-drawer';
 export * from './interfaces/i-positionable';
 export * from './models/axis-directions';
 export * from './models/body-options';

package/dist/base/index.js

@@ -21,7 +21,6 @@ export * from './inputs/direction.keyboard.input';
 export * from './inputs/i-input';
 export * from './inputs/keyboard.input';
 export * from './inputs/mouse.input';
-export * from './interfaces/i-debug-physics-drawer';
 export * from './interfaces/i-positionable';
 export * from './models/axis-directions';
 export * from './models/body-options';

package/dist/base/inputs/mouse.input.js

@@ -162,11 +162,16 @@ export class MouseInput extends IInput {
             .pipe(takeUntil(this.stopped$))
             .subscribe((event) => {
             if (pointers.length === 0) {
-                if (this.options.canvas) {
-                    this.options.canvas.setPointerCapture(event.pointerId);
+                try {
+                    if (this.options.canvas) {
+                        this.options.canvas.setPointerCapture(event.pointerId);
+                    }
+                    this._element.addEventListener('pointerup', onPointerUp);
+                    this._element.addEventListener('pointercancel', onPointerUp);
+                }
+                catch (err) {
+                    console.error(err);
                 }
-                this._element.addEventListener('pointerup', onPointerUp);
-                this._element.addEventListener('pointercancel', onPointerUp);
             }
             pointers.push(event);
             if (event.pointerType === 'touch') {

package/dist/base/models/body-options.d.ts

@@ -7,3 +7,12 @@ export interface BodyOptions {
     ownCollisionGroups: CollisionGroup[] | 'all';
     interactWithCollisionGroups: CollisionGroup[] | 'all';
 }
+export declare type DebugBodySettings = {
+    shape: any;
+    ignoreTransform?: boolean;
+} & ({
+    type: 'RIGID_STATIC' | 'TRIGGER';
+} | {
+    type: 'RIGID_DYNAMIC';
+    sleeping: boolean;
+});

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

@@ -67,31 +67,39 @@ List of available commands: `.replace(/ /g, '&nbsp;') + `<span style="color:yell
         };
         document.getElementById('gg-console-close-icon').onmousedown = () => this.destroyUI();
         this.elements.input.onkeydown = event => {
-            if ((event === null || event === void 0 ? void 0 : event.keyCode) === 13) {
+            var _a;
+            if ((event === null || event === void 0 ? void 0 : event.code) === 'Enter') {
                 event.preventDefault();
                 this.onInput().then();
             }
-            else if ((event === null || event === void 0 ? void 0 : event.keyCode) === 38) {
+            else if ((event === null || event === void 0 ? void 0 : event.code) === 'ArrowUp') {
                 event.preventDefault();
                 this.onUsePreviousCommand();
             }
-            else if ((event === null || event === void 0 ? void 0 : event.keyCode) === 40) {
+            else if ((event === null || event === void 0 ? void 0 : event.code) === 'ArrowDown') {
                 event.preventDefault();
                 this.onUseNextCommand();
             }
+            else if ((event === null || event === void 0 ? void 0 : event.code) === 'Backspace') {
+                let input = (_a = this.elements) === null || _a === void 0 ? void 0 : _a.input;
+                if (input) {
+                    let value = input.value || '';
+                    // backspace pressed while input had completion selected.
+                    // Native logic will remove selected text (completion part), we remove one additional character
+                    if ((input.selectionStart || value.length) < value.length && input.selectionEnd == value.length) {
+                        this.elements.input.value = value.substring(0, input.selectionStart || value.length - 1);
+                    }
+                }
+            }
         };
         this.elements.input.oninput = event => {
             var _a;
             let value = ((_a = this.elements) === null || _a === void 0 ? void 0 : _a.input.value) || '';
-            // backspace
-            if (value.length > 0 && event.data === null) {
-                value = value.substring(0, value.length - 1);
-            }
             if (value.trim() === '') {
                 return;
             }
             let autocompletion = window.ggstatic.availableCommands.find((c) => c[0].startsWith(value));
-            if (autocompletion) {
+            if (autocompletion && autocompletion[0].length > value.length) {
                 this.elements.input.value = autocompletion[0];
                 this.elements.input.setSelectionRange(value.length, this.elements.input.value.length);
             }

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

@@ -6,6 +6,15 @@ export declare class GgDebuggerUI {
     private currentWorld;
     setShowStats(selectedWorld: GgWorld<any, any>, value: boolean): void;
     private debugControlsRemoved$;
+    private viewUpdated$;
     get showDebugControls(): boolean;
     setShowDebugControls(selectedWorld: GgWorld<any, any>, value: boolean): void;
+    private snapshot;
+    perfStatsMode: 'AVG' | 'PEAK';
+    private performanceStatsSnapshot;
+    private makeSnapshot;
+    private makePerformanceStatsSnapshot;
+    css: string;
+    private renderControls;
+    private renderPerformanceStats;
 }