Added text input. Removed keyboard controls.

This commit is contained in:
Michael Mainguy 2023-07-26 12:22:49 -05:00
parent 2515f80461
commit ff0f8c7816
2 changed files with 43 additions and 51 deletions

View File

@ -181,46 +181,8 @@ export class Rigplatform {
#setupKeyboard() {
///simplify this with a map
window.addEventListener("keydown", (ev) => {
if (this.bMenu.getState() !== BmenuState.MODIFYING) {
switch (ev.key) {
case "w":
this.forwardback(-.1);
break;
case "s":
this.forwardback(.1);
break;
case "a":
this.leftright(-.2);
break;
case "d":
this.leftright(.2);
break;
case "q":
this.turn(-1);
break;
case "e":
this.turn(1);
break;
case "W":
this.updown(-.1);
break;
case "S":
this.updown(.1);
break;
case " ":
}
}
});
window.addEventListener("keyup", (ev) => {
const keys = "wsadqeWS";
if (keys.indexOf(ev.key) > -1) {
this.stop();
this.turn(0);
}
});
}
#fixRotation() {

View File

@ -1,4 +1,12 @@
import {GizmoManager, MeshBuilder, PointerEventTypes, Scene, Vector3, WebXRExperienceHelper} from "@babylonjs/core";
import {
Angle,
GizmoManager,
MeshBuilder,
PointerEventTypes,
Scene,
Vector3,
WebXRExperienceHelper
} from "@babylonjs/core";
import {
AdvancedDynamicTexture,
Button3D,
@ -22,9 +30,7 @@ export class Bmenu {
private textInput: any;
constructor(scene: Scene, xr: WebXRExperienceHelper) {
// this.textInput = document.createElement("input");
//this.textInput.type = "text";
// document.body.appendChild(this.textInput);
this.scene = scene;
this.xr = xr;
this.gizmoManager = new GizmoManager(scene);
@ -65,20 +71,44 @@ export class Bmenu {
case BmenuState.LABELING:
const mesh = pointerInfo.pickInfo.pickedMesh;
console.log("labeling " + mesh.id);
const myPlane = MeshBuilder.CreatePlane("myPlane", {width: .1, height: .1}, this.scene);
myPlane.parent=mesh;
myPlane.position= new Vector3(1,1,1);
const advancedTexture2 = AdvancedDynamicTexture.CreateForMesh(myPlane, 1024, 1024);
const myPlane = MeshBuilder.CreatePlane("myPlane", {width: 1, height: .125}, this.scene);
//myPlane.parent=mesh;
const pos = mesh.absolutePosition;
pos.y += .2;
myPlane.position= pos;
myPlane.rotation.y = Angle.FromDegrees(180).radians();
const advancedTexture2 = AdvancedDynamicTexture.CreateForMesh(myPlane, 1024, 128);
myPlane.material.backFaceCulling = false;
const inputText = new InputText("input");
inputText.color= "white";
inputText.background = "black";
inputText.height= "128px";
inputText.width= "1024px";
inputText.maxWidth= "1024px";
inputText.margin="0px";
inputText.fontSize= "48px";
advancedTexture2.addControl(inputText);
inputText.scaleY = 5;
inputText.scaleX = 5;
const textInput = document.createElement("input");
textInput.type = "text";
document.body.appendChild(textInput);
textInput.value = "";
inputText.focus();
inputText.onTextChangedObservable.add((text) => {
console.log(text);
textInput.focus();
textInput.addEventListener('input', (event)=> {
inputText.text = textInput.value;
console.log(event);
});
textInput.addEventListener('keydown', (event)=> {
console.log(event);
if (event.key == "Enter") {
textInput.blur();
textInput.remove();
inputText.dispose();
}
});
break;
}