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

Standardized widget sizing, added logging library, cleaned up dualshock implementation.

Browse Source
This commit is contained in:
Michael Mainguy 2023-07-26 16:54:07 -05:00
parent ff0f8c7816
commit d55b82833d
11 changed files with 97 additions and 90 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
package-lock.json generated
View File

@ -22,6 +22,7 @@
"express": "^4.18.2",
"express-http-proxy": "^1.6.3",
"google-static-maps-tile": "1.0.0",
"loglevel": "^1.8.1",
"query-string": "^8.1.0",
"ring-client-api": "^11.8.0",
"uuid": "^9.0.0",
@ -2907,6 +2908,18 @@
"url": "https://github.com/sponsors/sindresorhus"
}
},
"node_modules/loglevel": {
"version": "1.8.1",
"resolved": "https://registry.npmjs.org/loglevel/-/loglevel-1.8.1.tgz",
"integrity": "sha512-tCRIJM51SHjAayKwC+QAg8hT8vg6z7GSgLJKGvzuPb1Wc+hLzqtuVLxp6/HzSPOozuK+8ErAhy7U/sVzw8Dgfg==",
"engines": {
"node": ">= 0.6.0"
},
"funding": {
"type": "tidelift",
"url": "https://tidelift.com/funding/github/npm/loglevel"
}
},
"node_modules/long": {
"version": "5.2.3",
"resolved": "https://registry.npmjs.org/long/-/long-5.2.3.tgz",

1
package.json
View File

@ -26,6 +26,7 @@
"google-static-maps-tile": "1.0.0",
"query-string": "^8.1.0",
"vite-express": "^0.9.1",
"loglevel": "^1.8.1",
"express-http-proxy": "^1.6.3",
"earcut": "^2.2.4",
"uuid": "^9.0.0"

48
src/app.ts
View File

@ -132,54 +132,6 @@ export class App {
}
});
const buttonMap = [
{buttonIndex: 3, objectName: "right-controller"},
{buttonIndex: 3, objectName: "right-Controller"},
{buttonIndex: 4, objectName: "right-Controller"},
{buttonIndex: 4, objectName: "right-Controller"},
];
/*
gamepad.onButtonDownObservable.add((button, state) => {
console.log(buttonIndex);
console.log(buttonMap);
if (buttonIndex < 4) {
window.dispatchEvent(new CustomEvent('pa-button-state-change', {
detail: {
objectName: buttonMap[buttonIndex].objectName,
pressed: true,
touched: false,
buttonIndex: buttonMap[buttonIndex].buttonIndex,
value: 1
}
}
));
}
});
gamepad.onButtonUpObservable.add((buttonIndex, state) => {
console.log(buttonIndex);
console.log(state);
if (buttonIndex < 4) {
window.dispatchEvent( new CustomEvent('pa-button-state-change', {
detail: {
objectName: buttonMap[buttonIndex].objectName,
pressed: false,
touched: false,
buttonIndex: buttonMap[buttonIndex].buttonIndex,
value: 0
}
}
));
}
});
*/
gamepad.onleftstickchanged((values) => {
window.dispatchEvent(
new CustomEvent('pa-analog-value-change', {

1
src/controllers/base.ts
View File

@ -11,6 +11,7 @@ import {
import {MeshConverter} from "../diagram/meshConverter";
import {DiagramManager} from "../diagram/diagramManager";
import {DiagramEvent, DiagramEventType} from "../diagram/diagramEntity";
import log from 'loglevel';
export class Base {
static stickVector = Vector3.Zero();

5
src/controllers/left.ts
View File

@ -22,6 +22,11 @@ export class Left extends Base {
this.moveMovable(value);
}
});
init.components['xr-standard-thumbstick'].onButtonStateChangedObservable.add((value) => {
if (value.pressed) {
Controllers.controllerObserver.notifyObservers({type: 'decreaseVelocity', value: value.value});
}
});
}
});

2
src/controllers/right.ts
View File

@ -72,7 +72,7 @@ export class Right extends Base {
});
thumbstick.onButtonStateChangedObservable.add((value) => {
if (value.pressed) {
Controllers.toggleMovementMode();
Controllers.controllerObserver.notifyObservers({type: 'increaseVelocity', value: value.value});
}
});
}

61
src/controllers/rigplatform.ts
View File

@ -10,7 +10,7 @@ import {
PhysicsShapeType,
Quaternion,
Scene,
StandardMaterial,
StandardMaterial, TransformNode,
Vector3,
WebXRDefaultExperience
} from "@babylonjs/core";
@ -18,13 +18,11 @@ import {Right} from "./right";
import {Left} from "./left";
import {Bmenu} from "../menus/bmenu";
import {Controllers} from "./controllers";
import {BmenuState} from "../menus/MenuState";
export class Rigplatform {
static LINEAR_VELOCITY = 4;
static ANGULAR_VELOCITY = 3;
static x90 = Quaternion.RotationAxis(Vector3.Up(), 1.5708);
private velocityIndex = 2;
private readonly velocityArray = [0.01, 0.1, 1, 2, 5];
public bMenu: Bmenu;
private scene: Scene;
public static instance: Rigplatform;
@ -34,6 +32,7 @@ export class Rigplatform {
public rigMesh: Mesh;
private camera: Camera;
private turning: boolean = false;
private velocity: Vector3 = Vector3.Zero();
constructor(scene: Scene, xr: WebXRDefaultExperience) {
@ -41,11 +40,19 @@ export class Rigplatform {
Rigplatform.xr = xr;
Rigplatform.instance = this;
this.bMenu = new Bmenu(scene, xr.baseExperience);
this.camera = scene.activeCamera;
this.rigMesh = MeshBuilder.CreateBox("platform", {width: 2, height: .02, depth: 2}, scene);
//new Hud(this.rigMesh, scene);
const transform = new TransformNode("transform", scene);
transform.parent=this.rigMesh;
transform.position = new Vector3(0, 1.6, -5);
const pointer = MeshBuilder.CreateSphere("pointer", {diameter: .1}, scene);
pointer.parent = transform;
pointer.position = this.velocity;
for (const cam of scene.cameras) {
cam.parent = this.rigMesh;
@ -80,33 +87,23 @@ export class Rigplatform {
}
public forwardback(val: number) {
const ray = this.camera.getForwardRay();
this.body.setLinearVelocity(ray.direction.scale(val * -1));
}
public forwardbackleftright(x: number, y: number) {
const ray = this.camera.getForwardRay();
const direction = ray.direction.applyRotationQuaternion(Rigplatform.x90).scale(x);
direction.z = y;
this.body.setLinearVelocity(direction);
this.velocity.z = (val * this.velocityArray[this.velocityIndex])*-1;
const vel = this.velocity.applyRotationQuaternion(this.camera.absoluteRotation);
this.body.setLinearVelocity(vel);
}
public leftright(val: number) {
const ray = this.camera.getForwardRay();
const direction = ray.direction.applyRotationQuaternion(Rigplatform.x90).scale(val);
this.body.setLinearVelocity(direction);
this.velocity.x = (val * this.velocityArray[this.velocityIndex]);
const vel = this.velocity.applyRotationQuaternion(this.camera.absoluteRotation);
this.body.setLinearVelocity(vel);
}
public stop() {
this.body.setLinearVelocity(Vector3.Zero());
this.body.setAngularVelocity(Vector3.Zero());
}
public updown(val: number) {
let direction = Vector3.Zero();
this.body.getLinearVelocityToRef(direction);
direction.y = (val * -1);
this.body.setLinearVelocity(direction);
this.velocity.y = (val * this.velocityArray[this.velocityIndex])*-1;
const vel = this.velocity.applyRotationQuaternion(this.camera.absoluteRotation);
this.body.setLinearVelocity(vel);
}
public turn(val: number) {
@ -141,6 +138,20 @@ export class Rigplatform {
Right.instance = new Right(source, this.scene, Rigplatform.xr);
Controllers.controllerObserver.add((event: { type: string, value: number }) => {
switch (event.type) {
case "increaseVelocity":
if (this.velocityIndex < this.velocityArray.length -1) {
this.velocityIndex++;
} else {
this.velocityIndex = 0;
}
break;
case "decreaseVelocity":
if (this.velocityIndex > 0) {
this.velocityIndex--;
} else {
this.velocityIndex = this.velocityArray.length-1;
}
break;
case "turn":
this.turn(event.value);
break;

8
src/diagram/diagramManager.ts
View File

@ -14,7 +14,8 @@ import {MeshConverter} from "./meshConverter";
export class DiagramManager {
private persistenceManager: IPersistenceManager = new IndexdbPersistenceManager("diagram");
static onDiagramEventObservable = new Observable();
static onDiagramEventObservable: Observable<DiagramEvent> = new Observable();
private readonly scene: Scene;
private xr: WebXRExperienceHelper;
static currentMesh: AbstractMesh;
@ -47,7 +48,6 @@ export class DiagramManager {
const nodeMaterial = new NodeMaterial("nodeMaterial", this.scene, { emitComments: true });
const positionInput = new InputBlock("position");
positionInput.setAsAttribute("position");
}
#onDiagramEvent(event: DiagramEvent) {
const entity = event.entity;
@ -66,6 +66,7 @@ export class DiagramManager {
case DiagramEventType.ADD:
break;
case DiagramEventType.MODIFY:
this.persistenceManager.modify(mesh);
break;
case DiagramEventType.REMOVE:
if (mesh) {
@ -75,7 +76,4 @@ export class DiagramManager {
break;
}
}
#createMesh(entity: DiagramEntity) {
return MeshConverter.fromDiagramEntity(entity, this.scene);
}
}

22
src/menus/bmenu.ts
View File

@ -62,7 +62,17 @@ export class Bmenu {
if (this.gizmoManager.gizmos.boundingBoxGizmo.attachedMesh?.id == pointerInfo.pickInfo?.pickedMesh?.id) {
this.gizmoManager.gizmos.boundingBoxGizmo.attachedMesh = null;
} else {
this.gizmoManager.attachToMesh(pointerInfo.pickInfo.pickedMesh);
const mesh = pointerInfo.pickInfo.pickedMesh;
this.gizmoManager.attachToMesh(mesh);
this.gizmoManager.gizmos.boundingBoxGizmo.onScaleBoxDragObservable.add(() => {
DiagramManager.onDiagramEventObservable.notifyObservers({
type: DiagramEventType.MODIFY,
entity: MeshConverter.toDiagramEntity(mesh),
}
)
console.log(mesh.scaling);
});
}
}
@ -71,7 +81,7 @@ export class Bmenu {
case BmenuState.LABELING:
const mesh = pointerInfo.pickInfo.pickedMesh;
console.log("labeling " + mesh.id);
const myPlane = MeshBuilder.CreatePlane("myPlane", {width: 1, height: .125}, this.scene);
/* const myPlane = MeshBuilder.CreatePlane("myPlane", {width: 1, height: .125}, this.scene);
//myPlane.parent=mesh;
const pos = mesh.absolutePosition;
pos.y += .2;
@ -88,16 +98,14 @@ export class Bmenu {
inputText.margin="0px";
inputText.fontSize= "48px";
advancedTexture2.addControl(inputText);
*/
const textInput = document.createElement("input");
textInput.type = "text";
document.body.appendChild(textInput);
textInput.value = "";
inputText.focus();
textInput.focus();
textInput.addEventListener('input', (event)=> {
inputText.text = textInput.value;
console.log(event);
});
textInput.addEventListener('keydown', (event)=> {
@ -105,10 +113,8 @@ export class Bmenu {
if (event.key == "Enter") {
textInput.blur();
textInput.remove();
inputText.dispose();
}
});
break;
}

15
src/toolbox/toolbox.ts
View File

@ -86,7 +86,9 @@ export class Toolbox {
private calculatePosition(i: number) {
return (i/this.gridsize)-.5-(1/this.gridsize/2);
}
private static WIDGET_SIZE = .1;
private buildColor(color: Color3) {
const width = 1;
const depth = .2;
const material = new StandardMaterial("material-" + color.toHexString(), this.scene);
@ -102,7 +104,10 @@ export class Toolbox {
newItem.position = new Vector3(this.calculatePosition(++i), .1, 0);
}
}
const myPlane = MeshBuilder.CreatePlane("myPlane", {width: .1, height: .1}, this.scene);
const myPlane = MeshBuilder
.CreatePlane("myPlane",
{width: Toolbox.WIDGET_SIZE,
height: Toolbox.WIDGET_SIZE}, this.scene);
myPlane.parent=mesh;
myPlane.position= new Vector3(this.calculatePosition(++i), .1, 0);
@ -117,6 +122,9 @@ export class Toolbox {
material.name = "material-" + value.toHexString();
mesh.id = "toolbox-color-" + value.toHexString();
mesh.name = "toolbox-color-" + value.toHexString();
console.log(mesh.getChildren( (node) => {
return (node?.parent?.id!="toolbox") &&
(node?.parent?.parent?.id != "toolbox")}));
});
advancedTexture2.addControl(colorPicker);
@ -164,7 +172,10 @@ export class Toolbox {
if (tool === ToolType.PLANE) {
newItem.material.backFaceCulling = false;
}
newItem.scaling = new Vector3(0.1, 0.1, 0.1);
newItem.scaling = new Vector3(Toolbox.WIDGET_SIZE,
Toolbox.WIDGET_SIZE,
Toolbox.WIDGET_SIZE);
newItem.parent = parent;
if (!newItem.material) {
newItem.material = parent.material;

11
src/util/DualshockEventMapper.ts
View File

@ -68,7 +68,16 @@ export class DualshockEventMapper {
case 15:
console.log('D-Pad Right');
break;
case 10:
console.log('L3');
buttonEvent.objectName = "left-controller";
buttonEvent.buttonIndex = 0;
break;
case 11:
console.log('R3');
buttonEvent.objectName = "right-controller";
buttonEvent.buttonIndex = 0;
break;
default:
console.log(buttonid);