mmainguy/immersive2
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Slight simplification refactor (no functional change)

Browse Source
This commit is contained in:
Michael Mainguy 2024-05-07 19:33:06 -05:00
parent 24ae4aad41
commit 3ade3d4d6a
7 changed files with 64 additions and 94 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
public/sw.js
View File

@ -1,5 +1,5 @@
importScripts('https://storage.googleapis.com/workbox-cdn/releases/7.1.0/workbox-sw.js');
const VERSION = '4';
const VERSION = '5';
const CACHE = "deepdiagram";
const IMAGEDELIVERY_CACHE = "deepdiagram-images";

32
src/diagram/diagramManager.ts
View File

@ -35,9 +35,7 @@ export class DiagramManager {
this.onDiagramEventObservable.add(this.onDiagramEvent, DiagramEventObserverMask.FROM_DB, true, this);
this.logger.debug("DiagramManager constructed");
this._scene.onMeshRemovedObservable.add((mesh) => {
if (isDiagramEntity(mesh)) {
this.cleanupOrphanConnections(mesh)
}
cleanupOrphanConnections(mesh, this.onDiagramEventObservable);
});
document.addEventListener('uploadImage', (event: CustomEvent) => {
let position = {x: 0, y: 1.6, z: 0};
@ -56,16 +54,12 @@ export class DiagramManager {
rotation: {x: 0, y: Math.PI, z: 0},
scale: {x: 1, y: 1, z: 1},
}
console.log(diagramEntity);
//const newMesh = buildMeshFromDiagramEntity(diagramEntity, this._scene);
if (this.onDiagramEventObservable) {
this.onDiagramEventObservable.notifyObservers({
type: DiagramEventType.ADD,
entity: diagramEntity
}, DiagramEventObserverMask.ALL);
//this.onDiagramEventObservable.notifyObservers({type: DiagramEventType.ADD, entity: diagramEntity}, DiagramEventObserverMask.FROM_DB);
}
})
}
@ -77,6 +71,7 @@ export class DiagramManager {
public createClickMenu(mesh: AbstractMesh, grip: WebXRInputSource): ClickMenu {
return this._diagramMenuManager.createClickMenu(mesh, grip);
}
private notifyAll(event: DiagramEvent) {
this.onDiagramEventObservable.notifyObservers(event, DiagramEventObserverMask.ALL);
}
@ -110,24 +105,27 @@ export class DiagramManager {
}
return newMesh;
}
public get config(): AppConfig {
return this._config;
}
private cleanupOrphanConnections(mesh: AbstractMesh) {
if (mesh.metadata.template != '#connection-template') {
this._scene.meshes.forEach((m) => {
if (m?.metadata?.to == mesh.id || m?.metadata?.from == mesh.id) {
this.logger.debug("removing connection", m.id);
this.notifyAll({type: DiagramEventType.REMOVE, entity: toDiagramEntity(m)});
}
});
}
}
private onDiagramEvent(event: DiagramEvent) {
diagramEventHandler(
event, this._scene, this._diagramMenuManager.toolbox, this._config.current.physicsEnabled,
this._diagramEntityActionManager);
}
}
function cleanupOrphanConnections(mesh: AbstractMesh, diagramEventObservable: Observable<DiagramEvent>) {
if (isDiagramEntity(mesh)) {
if (mesh.metadata.template != '#connection-template') {
mesh.getScene().meshes.forEach((m) => {
if (m?.metadata?.to == mesh.id || m?.metadata?.from == mesh.id) {
diagramEventObservable.notifyObservers({type: DiagramEventType.REMOVE, entity: toDiagramEntity(m)});
}
});
}
}
}

6
src/util/appConfig.ts
View File

@ -13,7 +13,6 @@ export class AppConfig {
newRelicKey: null,
newRelicAccount: null,
physicsEnabled: false,
demoCompleted: false,
flyMode: true
}
@ -75,11 +74,6 @@ export class AppConfig {
this.save();
}
public setDemoCompleted(demoCompleted: boolean) {
this._currentConfig.demoCompleted = demoCompleted;
this.save();
}
private save() {
localStorage.setItem('appConfig', JSON.stringify(this._currentConfig));
this.onConfigChangedObservable.notifyObservers(this._currentConfig, -1);

1
src/util/appConfigType.ts
View File

@ -8,7 +8,6 @@ export type AppConfigType = {
physicsEnabled?: boolean,
newRelicKey?: string,
newRelicAccount?: string,
demoCompleted?: boolean,
passphrase?: string,
flyMode?: boolean,

3
src/util/customEnvironment.ts
View File

@ -113,6 +113,8 @@ export class CustomEnvironment {
private createWall(position: Vector3, rotation: Vector3, color1: Color3, color2: Color3) {
const scene = this.scene;
const wall = MeshBuilder.CreatePlane("wall", {width: 20, height: 20}, scene);
wall.isPickable = false;
wall.isNearPickable = false;
wall.position = position;
wall.rotation = rotation;
wall.material = createGridMaterial(color1, color2);
@ -163,7 +165,6 @@ function createGridMaterial(lineColor: Color3, mainColor: Color3): Material {
material.majorUnitFrequency = 10;
material.mainColor = mainColor;
material.lineColor = lineColor;
return material;
}

8
src/util/functions/groundMeshObserver.ts
View File

@ -56,7 +56,10 @@ export async function groundMeshObserver(ground: AbstractMesh,
logger.debug(ev);
});
});
xr.baseExperience.sessionManager.onXRSessionEnded.add(() => {
logger.debug('session ended');
window.location.reload();
});
xr.baseExperience.onStateChangedObservable.add((state) => {
logger.debug(WebXRState[state]);
switch (state) {
@ -70,9 +73,8 @@ export async function groundMeshObserver(ground: AbstractMesh,
break;
case WebXRState.EXITING_XR:
setTimeout(() => {
logger.debug('reloading');
logger.debug('EXITING_XR, reloading');
window.location.reload();
}, 500);
}

106
src/vrApp.ts
View File

@ -16,9 +16,10 @@ import {Introduction} from "./tutorial/introduction";
const webGpu = false;
log.setLevel('error', false);
const canvas = (document.querySelector('#gameCanvas') as HTMLCanvasElement);
export class VrApp {
private engine: WebGPUEngine | Engine;
//preTasks = [havokModule];
private logger: Logger = log.getLogger('App');
@ -28,62 +29,15 @@ export class VrApp {
});
}
public async initialize() {
const scene = DefaultScene.Scene;
const camera: FreeCamera = new FreeCamera("Main Camera",
new Vector3(0, 1.6, 0), scene);
scene.setActiveCameraByName("Main Camera");
public async initialize(scene: Scene) {
setMainCamera(scene);
const spinner = new Spinner();
spinner.show();
const diagramManager = new DiagramManager();
const db = new PouchdbPersistenceManager();
db.setDiagramManager(diagramManager);
await db.initialize();
const environment = new CustomEnvironment("default", diagramManager.config);
environment.groundMeshObservable.add((ground) => {
groundMeshObserver(ground, diagramManager, spinner);
}, -1, false, this);
await initDb(diagramManager);
initEnvironment(diagramManager, spinner);
const gamepadManager = new GamepadManager(scene);
addSceneInspector();
/*
SceneLoader.ImportMesh(null,'https://models.deepdiagram.com/', 'Chair_textured_mesh_lowpoly_glb.glb', scene, (meshes) => {
const transform = new Mesh('chair', scene);
for(const mesh of meshes){
mesh.parent= transform;
}
let {min, max} = transform.getHierarchyBoundingVectors(true);
const parentMesh = MeshBuilder.CreateBox('boundingBox', {width: max.x - min.x, height: max.y - min.y, depth: max.z - min.z}, scene);
for(const mesh of meshes){
mesh.parent= parentMesh;
}
transform.dispose();
//parentMesh.setBoundingInfo(new BoundingInfo(min, max));
parentMesh.showBoundingBox = true;
parentMesh.scaling = new Vector3(.2,.2,.2);
//mesh.metadata = {grabbable: true};
parentMesh.position.y = .5;
parentMesh.position.z = 0;
parentMesh.metadata = {grabbable: true};
const material = new StandardMaterial('chairMaterial', scene);
material.alpha = 0;
parentMesh.material = material;
parentMesh.showBoundingBox = true;
});
*/
/*
const chair = new GaussianSplattingMesh('chair', null, scene);
const m = await chair.loadFileAsync('https://models.deepdiagram.com/house.ply');
chair.position.y = 1.6;
chair.rotation.y = Math.PI;
chair.scaling = chair.scaling.scale(1);
chair.showBoundingBox = true;
*/
const el = document.querySelector('#download');
if (el) {
el.addEventListener('click', () => {
@ -94,36 +48,58 @@ export class VrApp {
this.logger.info('Starting tutorial');
const intro = new Introduction();
}
this.engine.runRenderLoop(() => {
scene.render();
});
this.logger.info('Render loop started');
}
private async initializeEngine() {
const canvas = (document.querySelector('#gameCanvas') as HTMLCanvasElement);
let engine: WebGPUEngine | Engine = null;
if (webGpu) {
this.engine = new WebGPUEngine(canvas);
await (this.engine as WebGPUEngine).initAsync();
engine = new WebGPUEngine(canvas);
await (engine as WebGPUEngine).initAsync();
} else {
this.engine = new Engine(canvas, true);
engine = new Engine(canvas, true);
}
this.engine.setHardwareScalingLevel(1 / window.devicePixelRatio);
engine.setHardwareScalingLevel(1 / window.devicePixelRatio);
window.onresize = () => {
this.engine.resize();
engine.resize();
}
const scene = new Scene(this.engine);
scene.ambientColor = new Color3(.1, .1, .1);
const scene = new Scene(engine);
DefaultScene.Scene = scene;
scene.ambientColor = new Color3(.1, .1, .1);
//log.resetLevel();
//log.setDefaultLevel('error');
this.logger.debug('App', 'gameCanvas created');
await this.initialize();
await this.initialize(scene);
engine.runRenderLoop(() => {
scene.render();
});
}
}
const vrApp = new VrApp();
buildQuestLink();
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);
}
async function initDb(diagramManager: DiagramManager) {
const db = new PouchdbPersistenceManager();
db.setDiagramManager(diagramManager);
await db.initialize();
}
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);
}