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() { #setupKeyboard() {
///simplify this with a map ///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() { #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 { import {
AdvancedDynamicTexture, AdvancedDynamicTexture,
Button3D, Button3D,
@ -22,9 +30,7 @@ export class Bmenu {
private textInput: any; private textInput: any;
constructor(scene: Scene, xr: WebXRExperienceHelper) { constructor(scene: Scene, xr: WebXRExperienceHelper) {
// this.textInput = document.createElement("input");
//this.textInput.type = "text";
// document.body.appendChild(this.textInput);
this.scene = scene; this.scene = scene;
this.xr = xr; this.xr = xr;
this.gizmoManager = new GizmoManager(scene); this.gizmoManager = new GizmoManager(scene);
@ -65,20 +71,44 @@ export class Bmenu {
case BmenuState.LABELING: case BmenuState.LABELING:
const mesh = pointerInfo.pickInfo.pickedMesh; const mesh = pointerInfo.pickInfo.pickedMesh;
console.log("labeling " + mesh.id); console.log("labeling " + mesh.id);
const myPlane = MeshBuilder.CreatePlane("myPlane", {width: .1, height: .1}, this.scene); const myPlane = MeshBuilder.CreatePlane("myPlane", {width: 1, height: .125}, this.scene);
myPlane.parent=mesh; //myPlane.parent=mesh;
myPlane.position= new Vector3(1,1,1); const pos = mesh.absolutePosition;
pos.y += .2;
const advancedTexture2 = AdvancedDynamicTexture.CreateForMesh(myPlane, 1024, 1024); 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"); 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); advancedTexture2.addControl(inputText);
inputText.scaleY = 5; const textInput = document.createElement("input");
inputText.scaleX = 5; textInput.type = "text";
document.body.appendChild(textInput);
textInput.value = "";
inputText.focus(); inputText.focus();
inputText.onTextChangedObservable.add((text) => { textInput.focus();
console.log(text);
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; break;
} }