From c33d634d0d4ed6e1fe5782c86d0fff6f54ba6ea0 Mon Sep 17 00:00:00 2001
From: Greg Fodor <gfodor@gmail.com>
Date: Sat, 10 Nov 2018 23:38:32 +0000
Subject: [PATCH] Add commands
---
src/assets/translations.data.json | 1 +
src/components/character-controller.js | 2 +-
src/hub.js | 47 ++++++++-------
src/message-dispatch.js | 83 ++++++++++++++++++++++++++
src/react-components/presence-log.js | 9 ++-
src/react-components/ui-root.js | 8 +--
6 files changed, 121 insertions(+), 29 deletions(-)
create mode 100644 src/message-dispatch.js
diff --git a/src/assets/translations.data.json b/src/assets/translations.data.json
index 819a5a046..ac6e0dbec 100644
--- a/src/assets/translations.data.json
+++ b/src/assets/translations.data.json
@@ -51,6 +51,7 @@
"audio.granted-next": "Next",
"exit.subtitle.exited": "Your session has ended. Refresh your browser to start a new one.",
"exit.subtitle.closed": "This room is no longer available.",
+ "exit.subtitle.left": "You have left the room.",
"exit.subtitle.full": "This room is full, please try again later.",
"exit.subtitle.connect_error": "Unable to connect to this room, please try again later.",
"exit.subtitle.version_mismatch": "The version you deployed is not available yet. Your browser will refresh in 5 seconds.",
diff --git a/src/components/character-controller.js b/src/components/character-controller.js
index e2a1aadbc..6eb743ec7 100644
--- a/src/components/character-controller.js
+++ b/src/components/character-controller.js
@@ -18,7 +18,7 @@ AFRAME.registerComponent("character-controller", {
pivot: { type: "selector" },
snapRotationDegrees: { default: THREE.Math.DEG2RAD * 45 },
rotationSpeed: { default: -3 },
- fly: { default: true }
+ fly: { default: false }
},
init: function() {
diff --git a/src/hub.js b/src/hub.js
index 553f2a3a1..b647cb9d3 100644
--- a/src/hub.js
+++ b/src/hub.js
@@ -76,6 +76,7 @@ import LinkChannel from "./utils/link-channel";
import { connectToReticulum } from "./utils/phoenix-utils";
import { disableiOSZoom } from "./utils/disable-ios-zoom";
import { proxiedUrlFor } from "./utils/media-utils";
+import MessageDispatch from "./message-dispatch";
import SceneEntryManager from "./scene-entry-manager";
import Subscriptions from "./subscriptions";
@@ -213,7 +214,7 @@ function remountUI(props) {
mountUI(uiProps);
}
-async function handleHubChannelJoined(entryManager, hubChannel, data) {
+async function handleHubChannelJoined(entryManager, hubChannel, messageDispatch, data) {
const scene = document.querySelector("a-scene");
if (NAF.connection.isConnected()) {
@@ -251,7 +252,7 @@ async function handleHubChannelJoined(entryManager, hubChannel, data) {
hubId: hub.hub_id,
hubName: hub.name,
hubEntryCode: hub.entry_code,
- onSendMessage: hubChannel.sendMessage
+ onSendMessage: messageDispatch.dispatch
});
document
@@ -430,27 +431,7 @@ document.addEventListener("DOMContentLoaded", async () => {
const joinPayload = { profile: store.state.profile, push_subscription_endpoint: pushSubscriptionEndpoint, context };
const hubPhxChannel = socket.channel(`hub:${hubId}`, joinPayload);
- hubPhxChannel
- .join()
- .receive("ok", async data => {
- hubChannel.setPhoenixChannel(hubPhxChannel);
- subscriptions.setHubChannel(hubChannel);
- subscriptions.setSubscribed(data.subscriptions.web_push);
- remountUI({ initialIsSubscribed: subscriptions.isSubscribed() });
- await handleHubChannelJoined(entryManager, hubChannel, data);
- })
- .receive("error", res => {
- if (res.reason === "closed") {
- entryManager.exitScene();
- remountUI({ roomUnavailableReason: "closed" });
- }
-
- console.error(res);
- });
-
- const hubPhxPresence = new Presence(hubPhxChannel);
const presenceLogEntries = [];
-
const addToPresenceLog = entry => {
entry.key = Date.now().toString();
@@ -469,6 +450,28 @@ document.addEventListener("DOMContentLoaded", async () => {
}, 20000);
};
+ const messageDispatch = new MessageDispatch(scene, entryManager, hubChannel, addToPresenceLog, remountUI);
+
+ hubPhxChannel
+ .join()
+ .receive("ok", async data => {
+ hubChannel.setPhoenixChannel(hubPhxChannel);
+ subscriptions.setHubChannel(hubChannel);
+ subscriptions.setSubscribed(data.subscriptions.web_push);
+ remountUI({ initialIsSubscribed: subscriptions.isSubscribed() });
+ await handleHubChannelJoined(entryManager, hubChannel, messageDispatch, data);
+ })
+ .receive("error", res => {
+ if (res.reason === "closed") {
+ entryManager.exitScene();
+ remountUI({ roomUnavailableReason: "closed" });
+ }
+
+ console.error(res);
+ });
+
+ const hubPhxPresence = new Presence(hubPhxChannel);
+
let isInitialSync = true;
hubPhxPresence.onSync(() => {
diff --git a/src/message-dispatch.js b/src/message-dispatch.js
new file mode 100644
index 000000000..c165bb30d
--- /dev/null
+++ b/src/message-dispatch.js
@@ -0,0 +1,83 @@
+import { spawnChatMessage } from "./react-components/chat-message";
+const DUCK_URL = "https://asset-bundles-prod.reticulum.io/interactables/Ducky/DuckyMesh-438ff8e022.gltf";
+
+// Handles user-entered messages
+export default class MessageDispatch {
+ constructor(scene, entryManager, hubChannel, addToPresenceLog, remountUI) {
+ this.scene = scene;
+ this.entryManager = entryManager;
+ this.hubChannel = hubChannel;
+ this.addToPresenceLog = addToPresenceLog;
+ this.remountUI = remountUI;
+ }
+
+ dispatch = message => {
+ if (message.startsWith("/")) {
+ this.dispatchCommand(message.substring(1));
+ document.activeElement.blur(); // Commands should blur
+ } else {
+ this.hubChannel.sendMessage(message);
+ }
+ };
+
+ dispatchCommand = command => {
+ const entered = this.scene.is("entered");
+
+ switch (command) {
+ case "help":
+ // HACK for now, non-trivial to properly send this into React
+ document.querySelector(".help-button").click();
+ return;
+ }
+
+ if (!entered) {
+ this.addToPresenceLog({ type: "log", body: "You must enter the room to use this command." });
+ return;
+ }
+
+ const playerRig = document.querySelector("#player-rig");
+ const scales = [0.0625, 0.125, 0.25, 0.5, 1.0, 1.5, 3, 5, 7.5, 12.5];
+ const curScale = playerRig.object3D.scale;
+
+ switch (command) {
+ case "fly":
+ if (playerRig.getAttribute("character-controller").fly !== true) {
+ playerRig.setAttribute("character-controller", "fly", true);
+ this.addToPresenceLog({ type: "log", body: "Fly mode enabled." });
+ } else {
+ playerRig.setAttribute("character-controller", "fly", false);
+ this.addToPresenceLog({ type: "log", body: "Fly mode disabled." });
+ }
+ break;
+ case "bigger":
+ for (let i = 0; i < scales.length; i++) {
+ if (scales[i] > curScale.x) {
+ playerRig.object3D.scale.set(scales[i], scales[i], scales[i]);
+ break;
+ }
+ }
+
+ break;
+ case "smaller":
+ for (let i = scales.length - 1; i >= 0; i--) {
+ if (curScale.x > scales[i]) {
+ playerRig.object3D.scale.set(scales[i], scales[i], scales[i]);
+ break;
+ }
+ }
+
+ break;
+ case "leave":
+ this.entryManager.exitScene();
+ this.remountUI({ roomUnavailableReason: "left" });
+ break;
+ case "help":
+ // HACK for now, non-trivial to properly send this into React
+ document.querySelector(".help-button").click();
+ break;
+ case "duck":
+ spawnChatMessage(DUCK_URL);
+ break;
+ }
+ };
+}
diff --git a/src/react-components/presence-log.js b/src/react-components/presence-log.js
index 4426ac46e..7eabb323a 100644
--- a/src/react-components/presence-log.js
+++ b/src/react-components/presence-log.js
@@ -56,7 +56,7 @@ export default class PresenceLog extends Component {
maySpawn={e.maySpawn}
/>
);
- case "spawn": {
+ case "spawn":
return (
<PhotoMessage
key={e.key}
@@ -67,7 +67,12 @@ export default class PresenceLog extends Component {
hubId={this.props.hubId}
/>
);
- }
+ case "log":
+ return (
+ <div key={e.key} className={classNames(entryClasses)}>
+ {e.body}
+ </div>
+ );
}
};
diff --git a/src/react-components/ui-root.js b/src/react-components/ui-root.js
index 77b0dfba4..0511b8edf 100644
--- a/src/react-components/ui-root.js
+++ b/src/react-components/ui-root.js
@@ -679,12 +679,12 @@ class UIRoot extends Component {
<div>
<FormattedMessage id={exitSubtitleId} />
<p />
- {this.props.roomUnavailableReason && (
+ {this.props.roomUnavailableReason !== "left" && (
<div>
You can also{" "}
<WithHoverSound>
- <a href="/">create a new room</a>.
- </WithHoverSound>
+ <a href="/">create a new room</a>
+ </WithHoverSound>.
</div>
)}
</div>
@@ -1209,7 +1209,7 @@ class UIRoot extends Component {
)}
<WithHoverSound>
- <button onClick={() => this.showHelpDialog()} className={styles.helpIcon}>
+ <button onClick={() => this.showHelpDialog()} className={classNames([styles.helpIcon, "help-button"])}>
<i>
<FontAwesomeIcon icon={faQuestion} />
</i>
--
GitLab