From 9ffa524620d205db6e91dc151b0f60f2337cba61 Mon Sep 17 00:00:00 2001 From: KeruWang Date: Thu, 27 May 2021 17:00:25 -0400 Subject: [PATCH 01/11] added material data --- js/render/core/implicit_surfaces/materials.js | 9 +++++++++ 1 file changed, 9 insertions(+) create mode 100644 js/render/core/implicit_surfaces/materials.js diff --git a/js/render/core/implicit_surfaces/materials.js b/js/render/core/implicit_surfaces/materials.js new file mode 100644 index 0000000..4f8b3eb --- /dev/null +++ b/js/render/core/implicit_surfaces/materials.js @@ -0,0 +1,9 @@ +export let materials = {}; +materials['black' ] = { ambient: [.0 ,.0 ,.0 ], diffuse: [0 ,0 ,0 ], specular: [.9,.9,.9,10] }; +materials['blue' ] = { ambient: [.0 ,.0 ,.2 ], diffuse: [0 ,0 ,1 ], specular: [.9,.9,.9,10] }; +materials['brass' ] = { ambient: [.03,.02,.01], diffuse: [.03,.02,.01], specular: [.9,.6,.3,10] }; +materials['cyan' ] = { ambient: [.0 ,.15,.15], diffuse: [0 ,.07,.07], specular: [.0,.7,.7,10] }; +materials['green' ] = { ambient: [.0 ,.2 ,.0 ], diffuse: [0 ,1 ,0 ], specular: [.9,.9,.9,10] }; +materials['red' ] = { ambient: [.2 ,.0 ,.0 ], diffuse: [1 ,0 ,0 ], specular: [.9,.9,.9,10] }; +materials['white' ] = { ambient: [.2 ,.2 ,.2 ], diffuse: [1 ,1 ,1 ], specular: [.9,.9,.9,10] }; +materials['yellow'] = { ambient: [.2 ,.2 ,.0 ], diffuse: [1 ,1 ,0 ], specular: [.9,.9,.9,10] }; From 0aff1e5e69e5e9f50746bb81ff5077796557457d Mon Sep 17 00:00:00 2001 From: KeruWang Date: Thu, 27 May 2021 22:56:29 -0400 Subject: [PATCH 02/11] added sync test demo that moves cube by pressing space key --- js/render/scenes/demoSyncTest.js | 24 ++++++++++++++++++++++++ js/render/scenes/mainScene.js | 4 +++- js/util/input_keyboard.js | 1 + 3 files changed, 28 insertions(+), 1 deletion(-) create mode 100644 js/render/scenes/demoSyncTest.js diff --git a/js/render/scenes/demoSyncTest.js b/js/render/scenes/demoSyncTest.js new file mode 100644 index 0000000..2ff28ab --- /dev/null +++ b/js/render/scenes/demoSyncTest.js @@ -0,0 +1,24 @@ +import { m, renderList } from "../core/renderList.js"; +import { time } from "../core/renderListScene.js"; +import * as keyboardInput from "../../util/input_keyboard.js"; +let posY = 1.5; +document.addEventListener("keydown", (event) => { + if (keyboardInput.keyIsDown(keyboardInput.KEY_SPACE)) { + posY += 0.01; + } + }); + +let DemoSyncTest = function () { + this.background = null; + this.loadGLTF = false; + this.envInd = null; + this.display = () => { + + m.save(); + m.translate(0, posY, 0); + renderList.mCube().size(0.2).turnY(time).color([1,0,0]); + m.restore(); + }; +}; + +export let demoSyncTest = new DemoSyncTest(); diff --git a/js/render/scenes/mainScene.js b/js/render/scenes/mainScene.js index a73067d..0f16ee7 100644 --- a/js/render/scenes/mainScene.js +++ b/js/render/scenes/mainScene.js @@ -28,6 +28,7 @@ import { demoNoiseGrid } from "./demoNoiseGrid.js"; import { demoObjects } from "./demoObjects.js"; import { demoParticles } from "./demoParticles.js"; import { demoRohail } from "./demoRohail.js"; +import { demoSyncTest } from "./demoSyncTest.js"; let loadGLTF = false; let curDemoEnv = []; @@ -62,6 +63,7 @@ export let mainScene = () => { if (demoParticlesState % 2) loadScene(demoParticles); else stopScene(demoParticles); if (demoRohailState % 2) loadScene(demoRohail); else stopScene(demoRohail); if (demoTextState % 2) loadScene(demoText); else stopScene(demoText); + if (demoSyncTestState % 2) loadScene(demoSyncTest); else stopScene(demoSyncTest); }; function loadScene(demo) { @@ -149,6 +151,6 @@ function showNameTag() { } } -window.demoNames = "AirText,Chris,Hands,Ken,Mocap,NoiseGrid,Objects,Particles,Rohail,Speak,Text"; +window.demoNames = "AirText,Chris,Hands,Ken,Mocap,NoiseGrid,Objects,Particles,Rohail,Speak,Text,SyncTest"; addDemoButtons(window.demoNames); window.addNameField(); diff --git a/js/util/input_keyboard.js b/js/util/input_keyboard.js index dc5bbc9..64882c7 100644 --- a/js/util/input_keyboard.js +++ b/js/util/input_keyboard.js @@ -130,3 +130,4 @@ export const KEY_A = 65; export const KEY_D = 68; export const KEY_S = 83; export const KEY_W = 87; +export const KEY_SPACE = 32; From b5e091a36668d702f12200c1387884f2decfde8e Mon Sep 17 00:00:00 2001 From: Zhenyi He Date: Sun, 30 May 2021 17:11:04 +0800 Subject: [PATCH 03/11] :construction: press select button on left controller is now synced --- js/corelink_handler.js | 14 ++++++++++++-- js/immersive-pre.js | 3 ++- js/primitive/avatar.js | 20 ++++++++++++++++++-- js/primitive/event.js | 17 ++++++++++++++++- js/render/core/renderListScene.js | 18 +++++++++++++----- js/render/core/scene.js | 1 + js/render/scenes/demoSyncTest.js | 31 +++++++++++++++++++++---------- js/util/corelink_sender.js | 24 ++++++++++++++++++++++++ js/util/input_event_handler.js | 14 ++++++++++++++ js/util/voip-webrtc.js | 5 +++++ sig21.html | 5 +++-- 11 files changed, 129 insertions(+), 23 deletions(-) create mode 100644 js/util/input_event_handler.js diff --git a/js/corelink_handler.js b/js/corelink_handler.js index 970e5dc..2ba0409 100644 --- a/js/corelink_handler.js +++ b/js/corelink_handler.js @@ -5,10 +5,11 @@ import { initAvatar } from "../js/primitive/avatar.js" const workspace = 'Chalktalk' const protocol = 'ws' -const datatype = ['sync', 'webrtc'] +const datatype = ['sync', 'webrtc', 'event']; var receiverdata = 0.0 export var metaroomSyncSender = "" export var metaroomWebrtcSender = ""; +export var metaroomEventSender = ""; export var metaroomReceiver = ""; const run = async () => { @@ -64,7 +65,7 @@ const run = async () => { // initialize initSelfAvatar(metaroomSyncSender); // start webrtc signalling - window.webrtc_start(); + // window.webrtc_start(); } if (metaroomWebrtcSender = await corelink.createSender({ @@ -75,6 +76,14 @@ const run = async () => { window.webrtc_start(); } + if (metaroomEventSender = await corelink.createSender({ + workspace, protocol, type: 'event', echo: true, alert: true, + }).catch((err) => { console.log(err) })) { + console.log("ZH: metaroomEventSender", metaroomEventSender); + // start webrtc signalling + // window.webrtc_start(); + } + metaroomReceiver = await corelink.createReceiver({ workspace, protocol, type: datatype, echo: true, alert: true, }).catch((err) => { console.log(err) }) @@ -110,6 +119,7 @@ const run = async () => { }).catch((err) => { console.log(err) }) // Start the XR application. + window.initxr = true; initXR(); } } diff --git a/js/immersive-pre.js b/js/immersive-pre.js index b659c20..4243c22 100644 --- a/js/immersive-pre.js +++ b/js/immersive-pre.js @@ -23,7 +23,7 @@ import * as keyboardInput from "./util/input_keyboard.js"; import { InputController } from "./util/input_controller.js"; import { corelink_message } from "./util/corelink_sender.js" -import { metaroomSyncSender } from "./corelink_handler.js" +import { metaroomSyncSender, metaroomEventSender } from "./corelink_handler.js" window.wsport = 8447; window.vr = false; @@ -156,6 +156,7 @@ function onRequestSession() { async function onSessionStarted(session) { session.addEventListener("end", onSessionEnded); + //Each input source should define a primary action. A primary action (which will sometimes be shortened to "select action") is a platform-specific action which responds to the user manipulating it by delivering, in order, the events selectstart, select, and selectend. Each of these events is of type XRInputSourceEvent. session.addEventListener("selectstart", onSelectStart); session.addEventListener("selectend", onSelectEnd); session.addEventListener("select", (ev) => { diff --git a/js/primitive/avatar.js b/js/primitive/avatar.js index d6549fd..a09507d 100644 --- a/js/primitive/avatar.js +++ b/js/primitive/avatar.js @@ -101,10 +101,11 @@ export class Headset { export class Controller { constructor(handedness) { // this.vertices = verts; + this.handedness = handedness; this.position = vec3.fromValues(0, 0, 0); this.orientation = [0, 0, 0, 1]; - // this.analog = new Button(); - // this.trigger = new Button(); + this.analog = new Button(); + this.trigger = new Button(); // this.side = new Button(); // this.x = new Button(); // this.y = new Button(); @@ -118,6 +119,21 @@ export class Controller { this.model.scale = vec3.fromValues(1, 1, 1); this.model.name = "ctrl"; this.model.visible = false; + + this.toJson = function () { + var jsonObj = { + analog: this.analog.pressed, + trigger: this.trigger.pressed, + handedness: this.handedness, + } + // console.log("this.name", this.name, "jsonObj.name", jsonObj.name); + return jsonObj; + } + // fromJson will be called in event.js for unpacking the msg from the server + this.fromJson = function (payload) { + this.analog.pressed = payload["state"]["analog"]; + this.trigger.pressed = payload["state"]["trigger"]; + } } } diff --git a/js/primitive/event.js b/js/primitive/event.js index 528f365..260e4bf 100644 --- a/js/primitive/event.js +++ b/js/primitive/event.js @@ -3,7 +3,8 @@ import { Headset, Controller, Avatar, initAvatar } from "./avatar.js"; import { SyncObject } from "../util/object-sync.js"; import { corelink_message } from "../util/corelink_sender.js"; -import { metaroomSyncSender, metaroomWebrtcSender } from "../corelink_handler.js" +import { metaroomSyncSender, metaroomWebrtcSender, metaroomEventSender } from "../corelink_handler.js" +import { left_controller_trigger } from "../util/input_event_handler.js" export function initSelfAvatar(id) { if (!window.avatars) { @@ -339,6 +340,20 @@ export function init() { // flags[temp] = window[temp]; }); + window.EventBus.subscribe("event", (json) => { + console.log("window.EventBus.subscribe('event'", json); + // for (const [item, operation] of Object.entries(json["state"])) { + switch (json["state"]["item"]) { + case "lt": + //left trigger + left_controller_trigger(json["state"]['operation']); + break; + default: + break; + } + // } + }); + // on success // const response = { // "type": "calibrate", diff --git a/js/render/core/renderListScene.js b/js/render/core/renderListScene.js index 0564607..b4c2bf7 100644 --- a/js/render/core/renderListScene.js +++ b/js/render/core/renderListScene.js @@ -1,5 +1,6 @@ "use strict"; import { mainScene } from "../scenes/mainScene.js"; +import { corelink_event } from "../../util/corelink_sender.js"; export let viewMatrix = [], time = 0, isPressed = false, isDragged = false, isReleased = true; @@ -8,6 +9,7 @@ export let buttonState = { left: [], right: [] }; for (let i = 0; i < 7; i++) buttonState.left[i] = buttonState.right[i] = false; const validHandedness = ["left", "right"]; +window.initxr = false; export let updateController = (avatar, buttonInfo) => { controllerMatrix.left = avatar.leftController.matrix; @@ -18,12 +20,12 @@ export let updateController = (avatar, buttonInfo) => { const b = buttonInfo.buttons; for (let i = 0; i < 7; i++) { - if (b[i].pressed && !buttonState[h][i]) onPress(h, i); - else if (b[i].pressed && buttonState[h][i]) onDrag(h, i); - else if (!b[i].pressed && buttonState[h][i]) onRelease(h, i); + if (b[i].pressed && !buttonState[h][i]) onPress(h, i); + else if (b[i].pressed && buttonState[h][i]) onDrag(h, i); + else if (!b[i].pressed && buttonState[h][i]) onRelease(h, i); - // Update - buttonState[h][i] = b[i].pressed; + // Update + buttonState[h][i] = b[i].pressed; } } }; @@ -33,6 +35,9 @@ let onPress = (hand, button) => { isPressed = true; isReleased = false; isDragged = false; + //ZH + console.log("handleSelect"); + corelink_event({ it: "lt", op: "press" }); }; let onDrag = (hand, button) => { @@ -46,6 +51,9 @@ let onRelease = (hand, button) => { isReleased = true; isPressed = false; isDragged = false; + //ZH + console.log("handleSelect"); + corelink_event({ it: "lt", op: "release" }); }; export let getViews = (views) => { diff --git a/js/render/core/scene.js b/js/render/core/scene.js index 97e1851..7128e90 100644 --- a/js/render/core/scene.js +++ b/js/render/core/scene.js @@ -25,6 +25,7 @@ import { Node } from "./node.js"; import { vec3, quat } from "../math/gl-matrix.js"; import { Ray } from "../math/ray.js"; import { getViews } from "./renderListScene.js"; +import { corelink_event } from "../../util/corelink_sender.js"; export class WebXRView extends RenderView { constructor(view, layer) { diff --git a/js/render/scenes/demoSyncTest.js b/js/render/scenes/demoSyncTest.js index 2ff28ab..23efc76 100644 --- a/js/render/scenes/demoSyncTest.js +++ b/js/render/scenes/demoSyncTest.js @@ -1,23 +1,34 @@ import { m, renderList } from "../core/renderList.js"; import { time } from "../core/renderListScene.js"; import * as keyboardInput from "../../util/input_keyboard.js"; -let posY = 1.5; + +// import { corelink_message } from "../../util/corelink_sender.js"; +// import { metaroomEventSender } from "../../corelink_handler.js" + +window.posY = 1.5; document.addEventListener("keydown", (event) => { - if (keyboardInput.keyIsDown(keyboardInput.KEY_SPACE)) { - posY += 0.01; - } - }); + if (keyboardInput.keyIsDown(keyboardInput.KEY_SPACE)) { + // To Keru: what we have to implement in the code is input handler, such as processing controller information + // We can have a debug event like key press for easy development but the way how we handle input event is necessary. + // sync to the server + // var msg = corelink_message("event", { it: "lt", op: "press" }); + // corelink.send(metaroomEventSender, msg); + + + window.posY += 0.01; + } +}); let DemoSyncTest = function () { this.background = null; this.loadGLTF = false; this.envInd = null; this.display = () => { - - m.save(); - m.translate(0, posY, 0); - renderList.mCube().size(0.2).turnY(time).color([1,0,0]); - m.restore(); + + m.save(); + m.translate(0, window.posY, 0); + renderList.mCube().size(0.2).turnY(time).color([1, 0, 0]); + m.restore(); }; }; diff --git a/js/util/corelink_sender.js b/js/util/corelink_sender.js index 9e735ad..0966cbe 100644 --- a/js/util/corelink_sender.js +++ b/js/util/corelink_sender.js @@ -1,5 +1,7 @@ "use strict"; +import { metaroomEventSender } from "../corelink_handler.js" + export function ab2str(buf) { var rawBuf = String.fromCharCode.apply(null, new Uint16Array(buf)); // we are using json objects everywhere @@ -16,6 +18,13 @@ function str2ab(str) { return buf; } +export function corelink_event(data) { + if (window.initxr) { + var msg = corelink_message("event", data); + corelink.send(metaroomEventSender, msg); + } +} + export function corelink_message(type, data) { let message; switch (type) { @@ -93,6 +102,21 @@ export function corelink_message(type, data) { }; console.log("demo", message); break; + case "event": + console.log(data); + message = { + type: "event", + uid: window.playerid, + ts: Date.now(), + // it: lt[rigger], rt[rigger] + // op: press, release, hold + state: { + item: data["it"], + operation: data["op"], + } + }; + console.log("event", message); + break; default: break; } diff --git a/js/util/input_event_handler.js b/js/util/input_event_handler.js new file mode 100644 index 0000000..fb26e9f --- /dev/null +++ b/js/util/input_event_handler.js @@ -0,0 +1,14 @@ +"use strict"; + +// import { posY } from "../render/scenes/demoSyncTest.js" + +// ZH: process controller input, as an event, for local or remote source + +export function left_controller_trigger(operation) { + console.log("left_controller_trigger", operation); + if (window["demoSyncTestState"] == 1) { + console.log("demoSyncTestState"); + if (operation == "press") + window.posY += 0.1; + } +} \ No newline at end of file diff --git a/js/util/voip-webrtc.js b/js/util/voip-webrtc.js index 99706ff..9de243a 100644 --- a/js/util/voip-webrtc.js +++ b/js/util/voip-webrtc.js @@ -8,6 +8,7 @@ window.localUuid = ""; // window.localStream; window.peerConnections = {}; // key is uuid, values are peer connection object and user defined display name string window.remoteIDs = []; +window.webrtcInit = false; // const AudioContext = window.AudioContext || window.webkitAudioContext; var peerConnectionConfig = { iceServers: [ @@ -53,6 +54,10 @@ function setUserMediaVariable() { } window.webrtc_start = function () { + if (window.webrtcInit) + console.log("window.webrtcInit", window.webrtcInit); + + window.webrtcInit = true; window.localUuid = window.avatars[window.playerid].localUuid; // specify audio for user media // window.maxVideoWidth = 320; diff --git a/sig21.html b/sig21.html index c31a2a4..95838ae 100644 --- a/sig21.html +++ b/sig21.html @@ -52,11 +52,12 @@ + + - - +
From 52e425319eb40e512ec9ea23e58a0a7073d37f14 Mon Sep 17 00:00:00 2001 From: Zhenyi He Date: Fri, 4 Jun 2021 02:22:00 +0800 Subject: [PATCH 04/11] :construction: sync input events every frame by retrieving source.gamepad.buttons in immersive-pre.js and handle it in input_event_handler.js by calling function onPressed, etc in renderListScene.js --- js/corelink_handler.js | 4 +-- js/immersive-pre.js | 19 +++++++++++++- js/primitive/avatar.js | 42 +++++++++++++++++++++++++++++++ js/primitive/event.js | 8 ++++-- js/render/core/renderListScene.js | 14 +++++------ js/render/core/scene.js | 2 +- js/util/input_event_handler.js | 26 ++++++++++++++++++- 7 files changed, 101 insertions(+), 14 deletions(-) diff --git a/js/corelink_handler.js b/js/corelink_handler.js index 2ba0409..8bd19a9 100644 --- a/js/corelink_handler.js +++ b/js/corelink_handler.js @@ -17,8 +17,8 @@ const run = async () => { var config = {} config.username = 'Testuser' config.password = 'Testpassword' - config.host = 'corelink.hpc.nyu.edu' - // config.host = 'localhost' + // config.host = 'corelink.hpc.nyu.edu' + config.host = 'localhost' config.port = 20012 corelink.debug = false; diff --git a/js/immersive-pre.js b/js/immersive-pre.js index 4243c22..54ad94a 100644 --- a/js/immersive-pre.js +++ b/js/immersive-pre.js @@ -23,7 +23,7 @@ import * as keyboardInput from "./util/input_keyboard.js"; import { InputController } from "./util/input_controller.js"; import { corelink_message } from "./util/corelink_sender.js" -import { metaroomSyncSender, metaroomEventSender } from "./corelink_handler.js" +import { metaroomSyncSender } from "./corelink_handler.js" window.wsport = 8447; window.vr = false; @@ -270,6 +270,20 @@ function updateInputSources(session, frame, refSpace) { headPose.transform.orientation; window.avatars[window.playerid].headset.matrix = headPose.transform.matrix; + + for (let source of session.inputSources) { + if (source.handedness && source.gamepad) { + if (source.gamepad.buttons[3].pressed) { + console.log("source.gamepad.buttons[3].pressed", source.gamepad.buttons[3].pressed); + } + if (source.handedness == "left") + window.avatars[window.playerid].leftController.updateButtons(source.gamepad.buttons); + if (source.handedness == "right") + window.avatars[window.playerid].rightController.updateButtons(source.gamepad.buttons); + // console.log("leftController", window.avatars[window.playerid].leftController); + // console.log("rightController", window.avatars[window.playerid].rightController) + } + } } } } @@ -386,6 +400,9 @@ function onXRFrame(t, frame) { updateObjects(); + // ZH: save previous "source.gamepad.buttons" for two controllers, + // check if changes per frame + // send to the server if changes if (window.playerid) { const thisAvatar = window.avatars[window.playerid]; for (let source of session.inputSources) { diff --git a/js/primitive/avatar.js b/js/primitive/avatar.js index a09507d..d847550 100644 --- a/js/primitive/avatar.js +++ b/js/primitive/avatar.js @@ -2,6 +2,7 @@ import { Gltf2Node } from "../render/nodes/gltf2.js"; import { mat4, vec3 } from "../render/math/gl-matrix.js"; +import { corelink_event } from "../util/corelink_sender.js"; export function initAvatar(id) { let headset = new Headset(); @@ -106,6 +107,8 @@ export class Controller { this.orientation = [0, 0, 0, 1]; this.analog = new Button(); this.trigger = new Button(); + this.buttons = null; + this.prevbuttons = null; // this.side = new Button(); // this.x = new Button(); // this.y = new Button(); @@ -120,11 +123,49 @@ export class Controller { this.model.name = "ctrl"; this.model.visible = false; + this.updateButtons = function (newBtns) { + // send corelink msg if changed + if (this.prevbuttons) + console.log("updateButtons", this.prevbuttons[3].pressed, this.buttons[3].pressed); + for (let i = 0; i < 7; i++) { + if ((this.buttons && !this.prevbuttons && this.buttons[i].pressed) + || (this.prevbuttons && this.buttons[i].pressed && !this.prevbuttons[i].pressed)) { + corelink_event({ it: this.handedness + "trigger", op: "press" }); + } + else if ((this.buttons && !this.prevbuttons && this.buttons[i].pressed) + || (this.prevbuttons && this.buttons[i].pressed && this.prevbuttons[i].pressed)) + corelink_event({ it: this.handedness + "trigger", op: "drag" }); + else if ((this.buttons && !this.prevbuttons && !this.buttons[i].pressed) + || (this.prevbuttons && !this.buttons[i].pressed && this.prevbuttons[i].pressed)) + corelink_event({ it: this.handedness + "trigger", op: "release" }); + } + if (this.buttons) { + if (!this.prevbuttons) { + this.prevbuttons = Array.from({ length: 7 }, (v, i) => i); + for (let i = 0; i < 7; i++) { + this.prevbuttons[i] = { + pressed: false, + touched: false, + }; + } + } + + // this.prevbuttons = Array.from(this.buttons); + for (let i = 0; i < 7; i++) { + this.prevbuttons[i].pressed = this.buttons[i].pressed;//JSON.parse(JSON.stringify(this.buttons[i])); + this.prevbuttons[i].touched = this.buttons[i].touched; + } + } + + this.buttons = newBtns; + } + this.toJson = function () { var jsonObj = { analog: this.analog.pressed, trigger: this.trigger.pressed, handedness: this.handedness, + buttons: this.buttons, } // console.log("this.name", this.name, "jsonObj.name", jsonObj.name); return jsonObj; @@ -133,6 +174,7 @@ export class Controller { this.fromJson = function (payload) { this.analog.pressed = payload["state"]["analog"]; this.trigger.pressed = payload["state"]["trigger"]; + this.buttons = payload["state"]["buttons"]; } } } diff --git a/js/primitive/event.js b/js/primitive/event.js index 260e4bf..efdcb56 100644 --- a/js/primitive/event.js +++ b/js/primitive/event.js @@ -4,7 +4,7 @@ import { Headset, Controller, Avatar, initAvatar } from "./avatar.js"; import { SyncObject } from "../util/object-sync.js"; import { corelink_message } from "../util/corelink_sender.js"; import { metaroomSyncSender, metaroomWebrtcSender, metaroomEventSender } from "../corelink_handler.js" -import { left_controller_trigger } from "../util/input_event_handler.js" +import { left_controller_trigger, right_controller_trigger } from "../util/input_event_handler.js" export function initSelfAvatar(id) { if (!window.avatars) { @@ -344,10 +344,14 @@ export function init() { console.log("window.EventBus.subscribe('event'", json); // for (const [item, operation] of Object.entries(json["state"])) { switch (json["state"]["item"]) { - case "lt": + case "lefttrigger": //left trigger left_controller_trigger(json["state"]['operation']); break; + case "righttrigger": + //left trigger + right_controller_trigger(json["state"]['operation']); + break; default: break; } diff --git a/js/render/core/renderListScene.js b/js/render/core/renderListScene.js index b4c2bf7..851b458 100644 --- a/js/render/core/renderListScene.js +++ b/js/render/core/renderListScene.js @@ -30,30 +30,30 @@ export let updateController = (avatar, buttonInfo) => { } }; -let onPress = (hand, button) => { +export let onPress = (hand, button) => { console.log("pressed", hand, "button", button); isPressed = true; isReleased = false; isDragged = false; //ZH - console.log("handleSelect"); - corelink_event({ it: "lt", op: "press" }); + // console.log("handleSelect"); + // corelink_event({ it: "lefttrigger", op: "press" }); }; -let onDrag = (hand, button) => { +export let onDrag = (hand, button) => { isDragged = true; isReleased = false; isPressed = false; }; -let onRelease = (hand, button) => { +export let onRelease = (hand, button) => { console.log("released", hand, "button", button); isReleased = true; isPressed = false; isDragged = false; //ZH - console.log("handleSelect"); - corelink_event({ it: "lt", op: "release" }); + // console.log("handleSelect"); + // corelink_event({ it: "lefttrigger", op: "release" }); }; export let getViews = (views) => { diff --git a/js/render/core/scene.js b/js/render/core/scene.js index 7128e90..4db1171 100644 --- a/js/render/core/scene.js +++ b/js/render/core/scene.js @@ -25,7 +25,7 @@ import { Node } from "./node.js"; import { vec3, quat } from "../math/gl-matrix.js"; import { Ray } from "../math/ray.js"; import { getViews } from "./renderListScene.js"; -import { corelink_event } from "../../util/corelink_sender.js"; +// import { corelink_event } from "../../util/corelink_sender.js"; export class WebXRView extends RenderView { constructor(view, layer) { diff --git a/js/util/input_event_handler.js b/js/util/input_event_handler.js index fb26e9f..94a040e 100644 --- a/js/util/input_event_handler.js +++ b/js/util/input_event_handler.js @@ -1,14 +1,38 @@ "use strict"; // import { posY } from "../render/scenes/demoSyncTest.js" +import { isPressed, isDragged, isReleased, onPress, onDrag, onRelease } from "../render/core/renderListScene.js"; // ZH: process controller input, as an event, for local or remote source export function left_controller_trigger(operation) { - console.log("left_controller_trigger", operation); + // console.log("left_controller_trigger", operation); if (window["demoSyncTestState"] == 1) { console.log("demoSyncTestState"); if (operation == "press") window.posY += 0.1; } + if (operation == "press") { + onPress("left", 0); + } else if (operation == "drag") { + onDrag("left", 0); + } else if (operation == "release") { + onRelease("left", 0); + } +} + +export function right_controller_trigger(operation) { + console.log("right_controller_trigger", operation); + if (window["demoSyncTestState"] == 1) { + console.log("demoSyncTestState"); + if (operation == "press") + window.posY += 0.1; + } + if (operation == "press") { + onPress("right", 0); + } else if (operation == "drag") { + onDrag("right", 0); + } else if (operation == "release") { + onRelease("right", 0); + } } \ No newline at end of file From 272d3d37d218bab208236b4ecf4a26f90df2b7b6 Mon Sep 17 00:00:00 2001 From: KeruWang Date: Fri, 4 Jun 2021 16:15:58 -0400 Subject: [PATCH 05/11] added controller input to sync test --- js/render/scenes/demoNoiseGrid.js | 2 ++ js/render/scenes/demoSyncTest.js | 12 +++++++++++- 2 files changed, 13 insertions(+), 1 deletion(-) diff --git a/js/render/scenes/demoNoiseGrid.js b/js/render/scenes/demoNoiseGrid.js index 5897ed2..6f3db80 100644 --- a/js/render/scenes/demoNoiseGrid.js +++ b/js/render/scenes/demoNoiseGrid.js @@ -237,12 +237,14 @@ let DemoNoiseGrid = function () { this.display = () => { if (isPressed) { + // console.log("pressed") justReleased = true; if (buttonState.left[0] && tMode == 0) { zScale = 1; cursorPath.push([]); } } else if (isDragged && tMode == 0) { + // console.log("dragged") if (buttonState.left[0]) if (controllerMatrix.left) { let P = controllerMatrix.left.slice(12, 15); diff --git a/js/render/scenes/demoSyncTest.js b/js/render/scenes/demoSyncTest.js index 2ff28ab..48db8b9 100644 --- a/js/render/scenes/demoSyncTest.js +++ b/js/render/scenes/demoSyncTest.js @@ -1,6 +1,14 @@ import { m, renderList } from "../core/renderList.js"; import { time } from "../core/renderListScene.js"; import * as keyboardInput from "../../util/input_keyboard.js"; +import { + viewMatrix, + controllerMatrix, + buttonState, + isReleased, + isDragged, + isPressed, +} from "../core/renderListScene.js"; let posY = 1.5; document.addEventListener("keydown", (event) => { if (keyboardInput.keyIsDown(keyboardInput.KEY_SPACE)) { @@ -13,7 +21,9 @@ let DemoSyncTest = function () { this.loadGLTF = false; this.envInd = null; this.display = () => { - + if (isPressed && buttonState.left[0]) { + posY += 0.01; + } m.save(); m.translate(0, posY, 0); renderList.mCube().size(0.2).turnY(time).color([1,0,0]); From 75e6521ed63dc1860a952d5cd3881ee36ebe8369 Mon Sep 17 00:00:00 2001 From: KeruWang Date: Tue, 8 Jun 2021 21:01:46 -0400 Subject: [PATCH 06/11] added simple draw demo --- js/render/scenes/demoDraw.js | 115 ++++++++++++++++++++++++++++++++++ js/render/scenes/mainScene.js | 4 +- 2 files changed, 118 insertions(+), 1 deletion(-) create mode 100644 js/render/scenes/demoDraw.js diff --git a/js/render/scenes/demoDraw.js b/js/render/scenes/demoDraw.js new file mode 100644 index 0000000..2c0c737 --- /dev/null +++ b/js/render/scenes/demoDraw.js @@ -0,0 +1,115 @@ +import { ImprovedNoise } from "../math/improvedNoise.js"; +import { CG } from "../core/CG.js"; +import { + m, + renderList, + mList, + mBeginBuild, + mEndBuild, +} from "../core/renderList.js"; +import { + time, + viewMatrix, + controllerMatrix, + buttonState, + isReleased, + isDragged, + isPressed, +} from "../core/renderListScene.js"; + +const FEET_TO_METERS = 0.3048; + +let flatten = 0, + zScale = 1; +let cursorPath = []; +let tMode = 0; +let justReleased = true; + + +let multiline = (path, rgb, width) => { + for (let n = 0; n < path.length - 1; n++) + if (path[n] && path[n + 1]) line(path[n], path[n + 1], rgb, width); +}; + +let line = (a, b, rgb, width) => { + let c = CG.subtract(b, a); + width = width ? width : 0.01; + m.save(); + m.translate(CG.mix(a, b, 0.5)); + m.aimZ(c); + renderList + .mTube3() + .color(rgb ? rgb : [1, 1, 1]) + .size(width, width, CG.norm(c) / 2 + width * 0.99); + m.restore(); +}; + +let N = 3; + +let vecs = []; +for (let y = -N; y <= N; y++) + for (let x = -N; x <= N; x++) + vecs.push([Math.random() - 0.5, Math.random() - 0.5]); + +let sCurve = (t) => t * t * (3 - 2 * t); + +let nZ = (x, y, d00, d10, d01, d11) => { + return ( + 2 * (d00[0] * x + d00[1] * y) * sCurve(1 - x) * sCurve(1 - y) + + 2 * (d10[0] * (x - 1) + d10[1] * y) * sCurve(x) * sCurve(1 - y) + + 2 * (d01[0] * x + d01[1] * (y - 1)) * sCurve(1 - x) * sCurve(y) + + 2 * (d11[0] * (x - 1) + d11[1] * (y - 1)) * sCurve(x) * sCurve(y) + ); +}; + +let DemoDraw = function () { + // Process Controller Info + this.background = null; + this.loadGLTF = false; + this.envInd = null; + + this.display = () => { + if (isPressed) { + justReleased = true; + if (buttonState.left[0] && tMode == 0) { + zScale = 1; + cursorPath.push([]); + } + } else if (isDragged && tMode == 0) { + if (buttonState.left[0]) + if (controllerMatrix.left) { + let P = controllerMatrix.left.slice(12, 15); + cursorPath[cursorPath.length - 1].push(P); + } + } else if (isReleased) { + if (justReleased) { + justReleased = false; + tMode = (tMode + 1) % 2; + switch (tMode) { + case 0: + flatten = 50; + break; + case 1: + cursorPath = []; + break; + } + } + } + + if (flatten >= 0) { + zScale *= 0.97; + flatten--; + } + + if (cursorPath.length) { + m.save(); + m.translate(0, 0, -0.5 * sCurve(1 - zScale)); + m.scale(1, 1, zScale); + for (let n = 0; n < cursorPath.length; n++) + multiline(cursorPath[n], [10, 0, 10], 0.0013); + m.restore(); + } + }; +}; + +export let demoDraw = new DemoDraw(); diff --git a/js/render/scenes/mainScene.js b/js/render/scenes/mainScene.js index 0f16ee7..9451606 100644 --- a/js/render/scenes/mainScene.js +++ b/js/render/scenes/mainScene.js @@ -29,6 +29,7 @@ import { demoObjects } from "./demoObjects.js"; import { demoParticles } from "./demoParticles.js"; import { demoRohail } from "./demoRohail.js"; import { demoSyncTest } from "./demoSyncTest.js"; +import { demoDraw } from "./demoDraw.js"; let loadGLTF = false; let curDemoEnv = []; @@ -64,6 +65,7 @@ export let mainScene = () => { if (demoRohailState % 2) loadScene(demoRohail); else stopScene(demoRohail); if (demoTextState % 2) loadScene(demoText); else stopScene(demoText); if (demoSyncTestState % 2) loadScene(demoSyncTest); else stopScene(demoSyncTest); + if (demoDrawState % 2) loadScene(demoDraw); else stopScene(demoDraw); }; function loadScene(demo) { @@ -151,6 +153,6 @@ function showNameTag() { } } -window.demoNames = "AirText,Chris,Hands,Ken,Mocap,NoiseGrid,Objects,Particles,Rohail,Speak,Text,SyncTest"; +window.demoNames = "AirText,Chris,Hands,Ken,Mocap,NoiseGrid,Objects,Particles,Rohail,Speak,Text,SyncTest,Draw"; addDemoButtons(window.demoNames); window.addNameField(); From bf7698e5232d3c3c8a32eda82621ad4c13607ee8 Mon Sep 17 00:00:00 2001 From: Zhenyi He Date: Thu, 17 Jun 2021 03:22:20 +0800 Subject: [PATCH 07/11] :sparkles: now we can see other ppl drawing --- js/corelink_handler.js | 8 +++---- js/primitive/avatar.js | 14 +++++++---- js/primitive/event.js | 5 +++- js/render/core/renderListScene.js | 39 +++++++++++++++++++------------ js/render/scenes/demoDraw.js | 26 +++++++++++++-------- js/render/scenes/demoNoiseGrid.js | 9 +++---- js/render/scenes/demoSyncTest.js | 5 +--- js/util/corelink_sender.js | 7 +++--- js/util/input_event_handler.js | 4 ++-- 9 files changed, 67 insertions(+), 50 deletions(-) diff --git a/js/corelink_handler.js b/js/corelink_handler.js index 8bd19a9..de54942 100644 --- a/js/corelink_handler.js +++ b/js/corelink_handler.js @@ -17,8 +17,8 @@ const run = async () => { var config = {} config.username = 'Testuser' config.password = 'Testpassword' - // config.host = 'corelink.hpc.nyu.edu' - config.host = 'localhost' + config.host = 'corelink.hpc.nyu.edu' + // config.host = 'localhost' config.port = 20012 corelink.debug = false; @@ -113,8 +113,8 @@ const run = async () => { receiverdata = ab2str(data) window[streamID + '_data'] = ab2str(data) window.EventBus.publish(receiverdata["type"], receiverdata); - if (receiverdata["type"] != "avatar") - console.log("corelink.on('data', (streamID, data, header)", streamID, window[streamID + '_data']["type"], window[streamID + '_data']) + // if (receiverdata["type"] != "avatar") + // console.log("corelink.on('data', (streamID, data, header)", streamID, window[streamID + '_data']["type"], window[streamID + '_data']) }).catch((err) => { console.log(err) }) diff --git a/js/primitive/avatar.js b/js/primitive/avatar.js index d847550..5d556de 100644 --- a/js/primitive/avatar.js +++ b/js/primitive/avatar.js @@ -46,11 +46,13 @@ export class Avatar { mtx: this.leftController.matrix, pos: this.leftController.position, rot: this.leftController.orientation, + btn: this.leftController.toJson(), }, right: { mtx: this.rightController.matrix, pos: this.rightController.position, rot: this.rightController.orientation, + btn: this.rightController.toJson(), }, }, } @@ -65,9 +67,11 @@ export class Avatar { this.leftController.matrix = payload["state"]["controllers"]["left"]["mtx"]; this.leftController.position = payload["state"]["controllers"]["left"]["pos"]; this.leftController.orientation = payload["state"]["controllers"]["left"]["rot"]; + this.leftController.fromJson(payload["state"]["controllers"]["left"]["btn"]); this.rightController.matrix = payload["state"]["controllers"]["right"]["mtx"]; this.rightController.position = payload["state"]["controllers"]["right"]["pos"]; this.rightController.orientation = payload["state"]["controllers"]["right"]["rot"]; + this.rightController.fromJson(payload["state"]["controllers"]["right"]["btn"]); this.headset.model.visible = true; this.leftController.model.visible = true; this.rightController.model.visible = true; @@ -125,8 +129,8 @@ export class Controller { this.updateButtons = function (newBtns) { // send corelink msg if changed - if (this.prevbuttons) - console.log("updateButtons", this.prevbuttons[3].pressed, this.buttons[3].pressed); + // if (this.prevbuttons) + // console.log("updateButtons", this.prevbuttons[3].pressed, this.buttons[3].pressed); for (let i = 0; i < 7; i++) { if ((this.buttons && !this.prevbuttons && this.buttons[i].pressed) || (this.prevbuttons && this.buttons[i].pressed && !this.prevbuttons[i].pressed)) { @@ -172,9 +176,9 @@ export class Controller { } // fromJson will be called in event.js for unpacking the msg from the server this.fromJson = function (payload) { - this.analog.pressed = payload["state"]["analog"]; - this.trigger.pressed = payload["state"]["trigger"]; - this.buttons = payload["state"]["buttons"]; + this.analog.pressed = payload["analog"]; + this.trigger.pressed = payload["trigger"]; + this.buttons = payload["buttons"]; } } } diff --git a/js/primitive/event.js b/js/primitive/event.js index efdcb56..2b74d14 100644 --- a/js/primitive/event.js +++ b/js/primitive/event.js @@ -340,12 +340,15 @@ export function init() { // flags[temp] = window[temp]; }); + window.eventOwner = -1; window.EventBus.subscribe("event", (json) => { - console.log("window.EventBus.subscribe('event'", json); + window.eventOwner = json["uid"]; + // console.log("window.EventBus.subscribe('event'", json["state"], json); // for (const [item, operation] of Object.entries(json["state"])) { switch (json["state"]["item"]) { case "lefttrigger": //left trigger + // console.log("call left_controller_trigger", json["state"]['operation']); left_controller_trigger(json["state"]['operation']); break; case "righttrigger": diff --git a/js/render/core/renderListScene.js b/js/render/core/renderListScene.js index 851b458..6030e25 100644 --- a/js/render/core/renderListScene.js +++ b/js/render/core/renderListScene.js @@ -2,7 +2,10 @@ import { mainScene } from "../scenes/mainScene.js"; import { corelink_event } from "../../util/corelink_sender.js"; -export let viewMatrix = [], time = 0, isPressed = false, isDragged = false, isReleased = true; +export let viewMatrix = [], time = 0; +window.isPressed = false; +window.isDragged = false; +window.isReleased = true; export let controllerMatrix = { left: [], right: [] }; export let buttonState = { left: [], right: [] }; @@ -20,9 +23,11 @@ export let updateController = (avatar, buttonInfo) => { const b = buttonInfo.buttons; for (let i = 0; i < 7; i++) { - if (b[i].pressed && !buttonState[h][i]) onPress(h, i); - else if (b[i].pressed && buttonState[h][i]) onDrag(h, i); - else if (!b[i].pressed && buttonState[h][i]) onRelease(h, i); + // if (b[i].pressed && !buttonState[h][i]) onPress(h, i); + // else + // if (b[i].pressed && buttonState[h][i]) onDrag(h, i); + // else + // if (!b[i].pressed && buttonState[h][i]) onRelease(h, i); // Update buttonState[h][i] = b[i].pressed; @@ -31,26 +36,30 @@ export let updateController = (avatar, buttonInfo) => { }; export let onPress = (hand, button) => { - console.log("pressed", hand, "button", button); - isPressed = true; - isReleased = false; - isDragged = false; + + window.isPressed = true; + window.isReleased = false; + window.isDragged = false; + console.log("onPress", hand, "button", button, + window.isPressed, window.isReleased, window.isDragged); //ZH // console.log("handleSelect"); // corelink_event({ it: "lefttrigger", op: "press" }); }; export let onDrag = (hand, button) => { - isDragged = true; - isReleased = false; - isPressed = false; + // console.log("onDrag", hand, "button", button, isPressed, isReleased, isDragged); + window.isDragged = true; + window.isReleased = false; + window.isPressed = false; }; export let onRelease = (hand, button) => { - console.log("released", hand, "button", button); - isReleased = true; - isPressed = false; - isDragged = false; + window.isReleased = true; + window.isPressed = false; + window.isDragged = false; + console.log("onRelease", hand, "button", button, + window.isPressed, window.isReleased, window.isDragged); //ZH // console.log("handleSelect"); // corelink_event({ it: "lefttrigger", op: "release" }); diff --git a/js/render/scenes/demoDraw.js b/js/render/scenes/demoDraw.js index 2c0c737..08b2229 100644 --- a/js/render/scenes/demoDraw.js +++ b/js/render/scenes/demoDraw.js @@ -12,9 +12,6 @@ import { viewMatrix, controllerMatrix, buttonState, - isReleased, - isDragged, - isPressed, } from "../core/renderListScene.js"; const FEET_TO_METERS = 0.3048; @@ -69,19 +66,28 @@ let DemoDraw = function () { this.envInd = null; this.display = () => { - if (isPressed) { + if (window.isPressed) { + if (window.eventOwner == -1) + return; + console.log("display-isPressed", tMode, justReleased); justReleased = true; - if (buttonState.left[0] && tMode == 0) { + if (tMode == 0) { zScale = 1; cursorPath.push([]); } } else if (isDragged && tMode == 0) { - if (buttonState.left[0]) - if (controllerMatrix.left) { - let P = controllerMatrix.left.slice(12, 15); - cursorPath[cursorPath.length - 1].push(P); - } + if (window.eventOwner == -1) + return; + console.log("display-isDragged", tMode, justReleased); + // if (window.avatars[window.eventOwner].leftController.buttons[0].pressed) + if (window.avatars[window.eventOwner].leftController.matrix) { + let P = Object.values(window.avatars[window.eventOwner].leftController.matrix).slice(12, 15); + cursorPath[cursorPath.length - 1].push(P); + } } else if (isReleased) { + // if (window.eventOwner == -1) + // return; + console.log("display-isReleased", tMode, justReleased); if (justReleased) { justReleased = false; tMode = (tMode + 1) % 2; diff --git a/js/render/scenes/demoNoiseGrid.js b/js/render/scenes/demoNoiseGrid.js index 6f3db80..0e23377 100644 --- a/js/render/scenes/demoNoiseGrid.js +++ b/js/render/scenes/demoNoiseGrid.js @@ -13,9 +13,6 @@ import { viewMatrix, controllerMatrix, buttonState, - isReleased, - isDragged, - isPressed, } from "../core/renderListScene.js"; const FEET_TO_METERS = 0.3048; @@ -236,21 +233,21 @@ let DemoNoiseGrid = function () { this.envInd = null; this.display = () => { - if (isPressed) { + if (window.isPressed) { // console.log("pressed") justReleased = true; if (buttonState.left[0] && tMode == 0) { zScale = 1; cursorPath.push([]); } - } else if (isDragged && tMode == 0) { + } else if (window.isDragged && tMode == 0) { // console.log("dragged") if (buttonState.left[0]) if (controllerMatrix.left) { let P = controllerMatrix.left.slice(12, 15); cursorPath[cursorPath.length - 1].push(P); } - } else if (isReleased) { + } else if (window.isReleased) { // if (buttonState.left[1]) { if (justReleased) { justReleased = false; diff --git a/js/render/scenes/demoSyncTest.js b/js/render/scenes/demoSyncTest.js index a1a990f..5a518d8 100644 --- a/js/render/scenes/demoSyncTest.js +++ b/js/render/scenes/demoSyncTest.js @@ -11,9 +11,6 @@ import { viewMatrix, controllerMatrix, buttonState, - isReleased, - isDragged, - isPressed, } from "../core/renderListScene.js"; document.addEventListener("keydown", (event) => { if (keyboardInput.keyIsDown(keyboardInput.KEY_SPACE)) { @@ -33,7 +30,7 @@ let DemoSyncTest = function () { this.loadGLTF = false; this.envInd = null; this.display = () => { - if (isPressed && buttonState.left[0]) { + if (window.isPressed && buttonState.left[0]) { window.posY += 0.01; } m.save(); diff --git a/js/util/corelink_sender.js b/js/util/corelink_sender.js index 0966cbe..5295324 100644 --- a/js/util/corelink_sender.js +++ b/js/util/corelink_sender.js @@ -1,6 +1,6 @@ "use strict"; -import { metaroomEventSender } from "../corelink_handler.js" +import { metaroomEventSender, metaroomSyncSender } from "../corelink_handler.js" export function ab2str(buf) { var rawBuf = String.fromCharCode.apply(null, new Uint16Array(buf)); @@ -22,6 +22,7 @@ export function corelink_event(data) { if (window.initxr) { var msg = corelink_message("event", data); corelink.send(metaroomEventSender, msg); + } } @@ -103,7 +104,7 @@ export function corelink_message(type, data) { console.log("demo", message); break; case "event": - console.log(data); + // console.log(data); message = { type: "event", uid: window.playerid, @@ -115,7 +116,7 @@ export function corelink_message(type, data) { operation: data["op"], } }; - console.log("event", message); + // console.log("event", message); break; default: break; diff --git a/js/util/input_event_handler.js b/js/util/input_event_handler.js index 94a040e..d35972c 100644 --- a/js/util/input_event_handler.js +++ b/js/util/input_event_handler.js @@ -1,12 +1,12 @@ "use strict"; // import { posY } from "../render/scenes/demoSyncTest.js" -import { isPressed, isDragged, isReleased, onPress, onDrag, onRelease } from "../render/core/renderListScene.js"; +import { onPress, onDrag, onRelease } from "../render/core/renderListScene.js"; // ZH: process controller input, as an event, for local or remote source export function left_controller_trigger(operation) { - // console.log("left_controller_trigger", operation); + // console.log("in left_controller_trigger", operation); if (window["demoSyncTestState"] == 1) { console.log("demoSyncTestState"); if (operation == "press") From 3a0511cee12c788c9cba85f3b0220cd9a8345fa1 Mon Sep 17 00:00:00 2001 From: Zhenyi He Date: Fri, 18 Jun 2021 00:36:56 +0800 Subject: [PATCH 08/11] :construction: add buttons that missed from previous merge commit --- js/render/scenes/mainScene.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/js/render/scenes/mainScene.js b/js/render/scenes/mainScene.js index e18cca5..13e2dc3 100644 --- a/js/render/scenes/mainScene.js +++ b/js/render/scenes/mainScene.js @@ -157,6 +157,6 @@ function showNameTag() { } } -window.demoNames = "AirText,Bill,Chris,Hands,Ken,Mocap,NoiseGrid,Objects,Particles,Prajval,Rohail,Speak,Text"; +window.demoNames = "AirText,Bill,Chris,Hands,Ken,Mocap,NoiseGrid,Objects,Particles,Prajval,Rohail,Speak,Text,SyncTest,Draw"; addDemoButtons(window.demoNames); window.addNameField(); From 73614e76570bdd8a6a7ee8ad14d4cea5793e6dbf Mon Sep 17 00:00:00 2001 From: Zhenyi He Date: Fri, 18 Jun 2021 01:22:30 +0800 Subject: [PATCH 09/11] :bug: ensure that onDrag and onRelease are called after display in demoDraw --- js/render/core/renderListScene.js | 21 +++++++++++++-------- js/render/scenes/demoDraw.js | 12 ++++++------ 2 files changed, 19 insertions(+), 14 deletions(-) diff --git a/js/render/core/renderListScene.js b/js/render/core/renderListScene.js index 6030e25..add134d 100644 --- a/js/render/core/renderListScene.js +++ b/js/render/core/renderListScene.js @@ -49,17 +49,22 @@ export let onPress = (hand, button) => { export let onDrag = (hand, button) => { // console.log("onDrag", hand, "button", button, isPressed, isReleased, isDragged); - window.isDragged = true; - window.isReleased = false; - window.isPressed = false; + if (window.isPressed && window.justReleased) { + window.isDragged = true; + window.isReleased = false; + window.isPressed = false; + } }; export let onRelease = (hand, button) => { - window.isReleased = true; - window.isPressed = false; - window.isDragged = false; - console.log("onRelease", hand, "button", button, - window.isPressed, window.isReleased, window.isDragged); + if (window.isDragged) { + window.isReleased = true; + window.isPressed = false; + window.isDragged = false; + console.log("onRelease", hand, "button", button, + window.isPressed, window.isReleased, window.isDragged); + } + //ZH // console.log("handleSelect"); // corelink_event({ it: "lefttrigger", op: "release" }); diff --git a/js/render/scenes/demoDraw.js b/js/render/scenes/demoDraw.js index 08b2229..0c7532d 100644 --- a/js/render/scenes/demoDraw.js +++ b/js/render/scenes/demoDraw.js @@ -20,7 +20,7 @@ let flatten = 0, zScale = 1; let cursorPath = []; let tMode = 0; -let justReleased = true; +window.justReleased = true; let multiline = (path, rgb, width) => { @@ -69,7 +69,7 @@ let DemoDraw = function () { if (window.isPressed) { if (window.eventOwner == -1) return; - console.log("display-isPressed", tMode, justReleased); + console.log("display-isPressed", tMode, window.justReleased); justReleased = true; if (tMode == 0) { zScale = 1; @@ -78,7 +78,7 @@ let DemoDraw = function () { } else if (isDragged && tMode == 0) { if (window.eventOwner == -1) return; - console.log("display-isDragged", tMode, justReleased); + console.log("display-isDragged", tMode, window.justReleased); // if (window.avatars[window.eventOwner].leftController.buttons[0].pressed) if (window.avatars[window.eventOwner].leftController.matrix) { let P = Object.values(window.avatars[window.eventOwner].leftController.matrix).slice(12, 15); @@ -87,9 +87,9 @@ let DemoDraw = function () { } else if (isReleased) { // if (window.eventOwner == -1) // return; - console.log("display-isReleased", tMode, justReleased); - if (justReleased) { - justReleased = false; + console.log("display-isReleased", tMode, window.justReleased); + if (window.justReleased) { + window.justReleased = false; tMode = (tMode + 1) % 2; switch (tMode) { case 0: From 38d86ad717586f63ee4afdff0496f1f11c9e3775 Mon Sep 17 00:00:00 2001 From: Zhenyi He Date: Mon, 5 Jul 2021 01:12:53 +0800 Subject: [PATCH 10/11] :construction: handler the input event locally --- js/corelink_handler.js | 4 +++- js/render/core/renderListScene.js | 11 ++++++----- 2 files changed, 9 insertions(+), 6 deletions(-) diff --git a/js/corelink_handler.js b/js/corelink_handler.js index a8792eb..8ef4481 100644 --- a/js/corelink_handler.js +++ b/js/corelink_handler.js @@ -1,3 +1,5 @@ +"use strict"; + import { initXR } from "../js/immersive-pre.js" import { ab2str, corelink_message } from "../js/util/corelink_sender.js" import { initSelfAvatar } from "../js/primitive/event.js" @@ -98,7 +100,7 @@ const run = async () => { } if (metaroomEventSender = await corelink.createSender({ - workspace, protocol, type: 'event', echo: true, alert: true, + workspace, protocol, type: 'event', echo: false, alert: true, }).catch((err) => { console.log(err) })) { console.log("ZH: metaroomEventSender", metaroomEventSender); // start webrtc signalling diff --git a/js/render/core/renderListScene.js b/js/render/core/renderListScene.js index add134d..f0f3c13 100644 --- a/js/render/core/renderListScene.js +++ b/js/render/core/renderListScene.js @@ -23,11 +23,12 @@ export let updateController = (avatar, buttonInfo) => { const b = buttonInfo.buttons; for (let i = 0; i < 7; i++) { - // if (b[i].pressed && !buttonState[h][i]) onPress(h, i); - // else - // if (b[i].pressed && buttonState[h][i]) onDrag(h, i); - // else - // if (!b[i].pressed && buttonState[h][i]) onRelease(h, i); + // allow local owner to react to the buttons + if (b[i].pressed && !buttonState[h][i]) onPress(h, i); + else + if (b[i].pressed && buttonState[h][i]) onDrag(h, i); + else + if (!b[i].pressed && buttonState[h][i]) onRelease(h, i); // Update buttonState[h][i] = b[i].pressed; From 9469e4ea185898af055d071e09ac965af4f86280 Mon Sep 17 00:00:00 2001 From: Zhenyi He Date: Mon, 5 Jul 2021 01:20:19 +0800 Subject: [PATCH 11/11] :bug: Let's run the python code to get webpages working --- run.py | 13 +++++++++++++ 1 file changed, 13 insertions(+) create mode 100644 run.py diff --git a/run.py b/run.py new file mode 100644 index 0000000..6334d2b --- /dev/null +++ b/run.py @@ -0,0 +1,13 @@ +#Use to create local host +import http.server +import socketserver + +PORT = 8000 + +Handler = http.server.SimpleHTTPRequestHandler +Handler.extensions_map.update({ + ".js": "application/javascript", +}) + +httpd = socketserver.TCPServer(("", PORT), Handler) +httpd.serve_forever() \ No newline at end of file