diff --git a/src/hub.js b/src/hub.js index c68af15955ea500268bac9075750e40bb7ab22ca..92fc1fdf833bb20e480cf5a947054df04ff8df0b 100644 --- a/src/hub.js +++ b/src/hub.js @@ -310,26 +310,28 @@ const onReady = async () => { addMedia(e.detail); }); - document.addEventListener("paste", e => { - if (e.target.nodeName === "INPUT") return; + if (qsTruthy("mediaTools")) { + document.addEventListener("paste", e => { + if (e.target.nodeName === "INPUT") return; - const imgUrl = e.clipboardData.getData("text"); - console.log("Pasted: ", imgUrl, e); - addMedia(imgUrl); - }); + const imgUrl = e.clipboardData.getData("text"); + console.log("Pasted: ", imgUrl, e); + addMedia(imgUrl); + }); - document.addEventListener("dragover", e => { - e.preventDefault(); - }); + document.addEventListener("dragover", e => { + e.preventDefault(); + }); - document.addEventListener("drop", e => { - e.preventDefault(); - const imgUrl = e.dataTransfer.getData("url"); - if (imgUrl) { - console.log("Droped: ", imgUrl); - addMedia(imgUrl); - } - }); + document.addEventListener("drop", e => { + e.preventDefault(); + const imgUrl = e.dataTransfer.getData("url"); + if (imgUrl) { + console.log("Droped: ", imgUrl); + addMedia(imgUrl); + } + }); + } if (!qsTruthy("offline")) { document.body.addEventListener("connected", () => { diff --git a/src/react-components/2d-hud.js b/src/react-components/2d-hud.js index 952de6cf8b8b18a57c0cb0515364fc68ffa2372e..e32a02d3eca931e112eb976b3c1cdcafc55f6dff 100644 --- a/src/react-components/2d-hud.js +++ b/src/react-components/2d-hud.js @@ -1,12 +1,21 @@ import React from "react"; import PropTypes from "prop-types"; import cx from "classnames"; +import queryString from "query-string"; import styles from "../assets/stylesheets/2d-hud.scss"; import FontAwesomeIcon from "@fortawesome/react-fontawesome"; import faPlus from "@fortawesome/fontawesome-free-solid/faPlus"; +const qs = queryString.parse(location.search); +function qsTruthy(param) { + const val = qs[param]; + // if the param exists but is not set (e.g. "?foo&bar"), its value is null. + return val === null || /1|on|true/i.test(val); +} +const enableMediaTools = qsTruthy("mediaTools"); + const TwoDHUD = ({ muted, frozen, @@ -36,13 +45,15 @@ const TwoDHUD = ({ onClick={onToggleSpaceBubble} /> </div> - <div - className={cx("ui-interactive", styles.iconButton, styles.small, styles.addMediaButton)} - title="Add Media" - onClick={onClickAddMedia} - > - <FontAwesomeIcon icon={faPlus} /> - </div> + {enableMediaTools ? ( + <div + className={cx("ui-interactive", styles.iconButton, styles.small, styles.addMediaButton)} + title="Add Media" + onClick={onClickAddMedia} + > + <FontAwesomeIcon icon={faPlus} /> + </div> + ) : null} </div> );