109 lines
3.8 KiB
TypeScript
109 lines
3.8 KiB
TypeScript
import {Color3, Engine, FreeCamera, Observable, Scene, Vector3, WebGPUEngine} from "@babylonjs/core";
|
|
import '@babylonjs/loaders';
|
|
import {DiagramManager} from "./diagram/diagramManager";
|
|
import log, {Logger} from "loglevel";
|
|
import {CustomEnvironment} from "./util/customEnvironment";
|
|
import {Spinner} from "./objects/spinner";
|
|
import {addSceneInspector} from "./util/functions/sceneInspector";
|
|
import {groundMeshObserver} from "./util/functions/groundMeshObserver";
|
|
import {exportGltf} from "./util/functions/exportGltf";
|
|
import {DefaultScene} from "./defaultScene";
|
|
import {Introduction} from "./tutorial/introduction";
|
|
import {PouchData} from "./integration/database/pouchData";
|
|
|
|
const webGpu = false;
|
|
|
|
log.setLevel('error', false);
|
|
export default class VrApp {
|
|
//preTasks = [havokModule];
|
|
private logger: Logger = log.getLogger('App');
|
|
private _canvas: HTMLCanvasElement;
|
|
private _db: PouchData;
|
|
private _dbName: string;
|
|
private _engine: Engine | WebGPUEngine;
|
|
|
|
constructor(canvas: HTMLCanvasElement, dbname: string) {
|
|
this._canvas = canvas;
|
|
this._dbName = dbname;
|
|
console.log('VrApp constructor');
|
|
this.initializeEngine().then(() => {
|
|
this.logger.info('Engine initialized');
|
|
});
|
|
}
|
|
|
|
public async initialize(scene: Scene) {
|
|
setMainCamera(scene);
|
|
const spinner = new Spinner();
|
|
spinner.show();
|
|
const diagramReadyObservable = new Observable<boolean>();
|
|
const diagramManager = new DiagramManager(diagramReadyObservable);
|
|
diagramReadyObservable.add((ready) => {
|
|
if (ready) {
|
|
const db = new PouchData(this._dbName);
|
|
db.setDiagramManager(diagramManager);
|
|
this._db = db;
|
|
} else {
|
|
this.logger.error('DiagramManager not ready');
|
|
}
|
|
});
|
|
initEnvironment(diagramManager, spinner);
|
|
addSceneInspector();
|
|
const el = document.querySelector('#download');
|
|
if (el) {
|
|
el.addEventListener('click', () => {
|
|
exportGltf();
|
|
})
|
|
} else {
|
|
this.logger.error('Download button not found');
|
|
}
|
|
if (!localStorage.getItem('tutorialCompleted')) {
|
|
this.logger.info('Starting tutorial');
|
|
const intro = new Introduction();
|
|
}
|
|
this.logger.info('Render loop started');
|
|
}
|
|
|
|
public dispose() {
|
|
this._engine.dispose();
|
|
DefaultScene.Scene.dispose();
|
|
DefaultScene.Scene = null;
|
|
}
|
|
private async initializeEngine() {
|
|
if (!this._canvas) {
|
|
console.error('Canvas not found');
|
|
return;
|
|
}
|
|
this._engine = null;
|
|
if (webGpu) {
|
|
this._engine = new WebGPUEngine(this._canvas);
|
|
await (this._engine as WebGPUEngine).initAsync();
|
|
} else {
|
|
this._engine = new Engine(this._canvas, true);
|
|
}
|
|
this._engine.setHardwareScalingLevel(1 / window.devicePixelRatio);
|
|
const scene = new Scene(this._engine);
|
|
DefaultScene.Scene = scene;
|
|
scene.ambientColor = new Color3(.1, .1, .1);
|
|
await this.initialize(scene);
|
|
this._engine.runRenderLoop(() => {
|
|
scene.render();
|
|
});
|
|
}
|
|
}
|
|
|
|
function setMainCamera(scene: Scene) {
|
|
const CAMERA_NAME = 'Main Camera';
|
|
const camera: FreeCamera = new FreeCamera(CAMERA_NAME,
|
|
new Vector3(0, 1.6, 0), scene);
|
|
scene.setActiveCameraByName(CAMERA_NAME);
|
|
}
|
|
|
|
|
|
function initEnvironment(diagramManager: DiagramManager, spinner: Spinner) {
|
|
const environment = new CustomEnvironment("default", diagramManager.config);
|
|
environment.groundMeshObservable.add((ground) => {
|
|
groundMeshObserver(ground, diagramManager, spinner).then(() => {
|
|
|
|
});
|
|
}, -1, false, this);
|
|
} |