npm install to fix package-lock.json

.eslintignore

@@ -1,5 +1,3 @@
 desktop/app/**/*.js
 desktop/node_modules/
-src/client/vendor/three/GLTFExporter.js
-src/client/vendor/three/GLTFLoader.js
-src/client/vendor/recast/recast.js
+src/client/editor/recast/recast.js

README.md

@@ -1,5 +1,7 @@
 # Spoke (beta)
 
+[https://hubs.mozilla.com/spoke](https://hubs.mozilla.com/spoke)
+
 Easily create custom 3D environments for [Mozilla Hubs](https://hubs.mozilla.com).
 
 ## Development
@@ -11,6 +13,8 @@ Easily create custom 3D environments for [Mozilla Hubs](https://hubs.mozilla.com
 
 Then open http://localhost:9090.
 
+When running against a local self-signed cert reticulum server, you'll need to `export NODE_TLS_REJECT_UNAUTHORIZED=0` for publishing to work.
+
 ## Credits
 
 Parts of this project are derived from the [three.js editor](https://threejs.org/editor/)

package.js

@@ -31,7 +31,12 @@ buildRelease(targets, outputDir, process.argv.slice(2)).then(() => {
 
     const zip = new ZipFile();
     zip.outputStream.pipe(archiveStream);
-    zip.addFile(executablePath, path.join("Spoke", appendExtension("spoke", platform)), { mode: 0o100775 });
+    if (platform === "macos") {
+      zip.addFile(executablePath, path.join("Spoke", "runtime.bin"), { mode: 0o100775 });
+      zip.addFile("src/server/launcher.sh", path.join("Spoke", "spoke"), { mode: 0o100775 });
+    } else {
+      zip.addFile(executablePath, path.join("Spoke", appendExtension("spoke", platform)), { mode: 0o100775 });
+    }
     zip.end();
   }
 });

package.json

@@ -3,7 +3,7 @@
   "private": true,
   "productName": "Spoke",
   "license": "MPL-2.0",
-  "version": "0.5.3",
+  "version": "0.5.11",
   "engines": {
     "node": ">=10",
     "npm": ">=6.4"
@@ -85,11 +85,12 @@
     "react-select": "^2.0.0",
     "react-toggle": "^4.0.2",
     "react-tooltip": "^3.6.1",
+    "request": "^2.88.0",
     "selfsigned": "^1.10.3",
     "semver": "^5.5.1",
     "sha.js": "^2.4.11",
     "signals": "^1.0.0",
-    "three": "github:mozillareality/three.js#hubs/dev-v2",
+    "three": "github:mozillareality/three.js#220c52eb20b5d8afce8aecc295283d7a7a1e0c62",
     "throttle-debounce": "^2.0.1",
     "uuid": "^3.3.2",
     "ws": "^5.2.0",

src/client/editor/Project.js → src/client/api/Project.js

@@ -1,5 +1,7 @@
 import EventEmitter from "eventemitter3";
 import AuthenticationError from "./AuthenticationError";
+import { Socket } from "phoenix";
+import uuid from "uuid/v4";
 
 export default class Project extends EventEmitter {
   constructor() {
@@ -19,6 +21,8 @@ export default class Project extends EventEmitter {
 
     this.ws = null;
 
+    this.updateInfo = null;
+
     this.hierarchy = {
       name: "New Project",
       files: [],
@@ -153,6 +157,10 @@ export default class Project extends EventEmitter {
       }
 
       this.updateHierarchy(json.hierarchy);
+    } else if (json.type === "uploadProgress") {
+      this.emit(json.type, json.uploadProgress);
+    } else if (json.type === "uploadComplete") {
+      this.emit(json.type, json.uploadInfo);
     } else if (json.type !== undefined && json.path !== undefined) {
       this.emit(json.type, json.path);
     }
@@ -176,7 +184,10 @@ export default class Project extends EventEmitter {
       this.watchPromise = { resolve, reject };
       this.ws = new WebSocket(this.wsServerURL);
       this.ws.addEventListener("message", this._onWebsocketMessage);
-      this.ws.addEventListener("error", this._onWebsocketMessage);
+      this.ws.addEventListener("error", this._onWebsocketError);
+      this.ws.addEventListener("close", e => {
+        console.log("WebSocket closed", e);
+      });
     });
   }
 
@@ -214,14 +225,36 @@ export default class Project extends EventEmitter {
         .split("/")
         .slice(0, -1)
         .join("/");
-      const { name, author } = await this.readJSON(`${baseUri}/meta.json`);
-      return `${name} by ${author}`;
+      const { name, author, attribution } = await this.readJSON(`${baseUri}/meta.json`);
+      if (attribution) {
+        return attribution;
+      } else {
+        // Legacy
+        return { name, author };
+      }
     } catch (e) {
       return null;
     }
   }
 
-  async uploadAndDelete(uri) {
+  async uploadAndDelete(uri, onUploadProgress) {
+    if (onUploadProgress) {
+      this.on("uploadProgress", onUploadProgress);
+    }
+
+    const uploadComplete = new Promise((resolve, reject) => {
+      this.once("uploadComplete", uploadInfo => {
+        if (onUploadProgress) {
+          this.off("uploadProgress", onUploadProgress);
+        }
+        if (uploadInfo.err) {
+          reject(new Error(`Upload failed for "${uri}". ${uploadInfo.err}`));
+        } else {
+          resolve(uploadInfo);
+        }
+      });
+    });
+
     const resp = await fetch("/api/upload", {
       method: "POST",
       headers: { "content-type": "application/json" },
@@ -232,7 +265,7 @@ export default class Project extends EventEmitter {
       throw new Error(`Upload failed for "${uri}". ${await resp.text()}`);
     }
 
-    return resp.json();
+    return uploadComplete;
   }
 
   async createOrUpdateScene(params) {
@@ -257,6 +290,133 @@ export default class Project extends EventEmitter {
     return resp.json();
   }
 
+  async _debugVerifyAuth(url) {
+    const params = new URLSearchParams(url);
+    const topic = params.get("auth_topic");
+    const token = params.get("auth_token");
+    const reticulumServer = process.env.RETICULUM_SERVER;
+    const socketUrl = `wss://${reticulumServer}/socket`;
+    const socket = new Socket(socketUrl, { params: { session_id: uuid() } });
+    socket.connect();
+    const channel = socket.channel(topic);
+    await new Promise((resolve, reject) =>
+      channel
+        .join()
+        .receive("ok", resolve)
+        .receive("error", reject)
+    );
+    channel.push("auth_verified", { token });
+  }
+
+  async startAuthentication(email) {
+    const reticulumServer = process.env.RETICULUM_SERVER;
+    const socketUrl = `wss://${reticulumServer}/socket`;
+    const socket = new Socket(socketUrl, { params: { session_id: uuid() } });
+    socket.connect();
+    const channel = socket.channel(`auth:${uuid()}`);
+    await new Promise((resolve, reject) =>
+      channel
+        .join()
+        .receive("ok", resolve)
+        .receive("error", reject)
+    );
+
+    const authComplete = new Promise(resolve =>
+      channel.on("auth_credentials", async ({ credentials }) => {
+        await fetch("/api/credentials", {
+          method: "POST",
+          headers: { "content-type": "application/json" },
+          body: JSON.stringify({ credentials })
+        });
+        resolve();
+      })
+    );
+
+    channel.push("auth_request", { email, origin: "spoke" });
+
+    return { authComplete };
+  }
+
+  async authenticated() {
+    return await fetch("/api/authenticated").then(r => r.ok);
+  }
+
+  /*
+   * Stores user info on disk.
+   * userInfo can be a partial object.
+   */
+  async setUserInfo(userInfo) {
+    return await fetch("/api/user_info", {
+      method: "POST",
+      headers: { "content-type": "application/json" },
+      body: JSON.stringify(userInfo)
+    });
+  }
+
+  async getUserInfo() {
+    return fetch("/api/user_info").then(r => r.json());
+  }
+
+  async retrieveUpdateInfo() {
+    this.updateInfo = await fetch("/api/update_info").then(r => r.json());
+  }
+
+  getUrlDirname(url) {
+    const { pathname } = new URL(url, window.location);
+
+    let lastSlashIndex = pathname.lastIndexOf("/");
+
+    if (lastSlashIndex === -1) {
+      lastSlashIndex = 0;
+    }
+
+    if (pathname.indexOf(".", lastSlashIndex) === -1 && lastSlashIndex !== pathname.length - 1) {
+      return pathname;
+    }
+
+    return pathname.substring(0, lastSlashIndex);
+  }
+
+  getUrlBasename(url) {
+    let pathname = new URL(url, window.location).pathname;
+
+    if (pathname.endsWith("/")) {
+      pathname = pathname.slice(0, -1);
+    }
+
+    let lastSlashIndex = pathname.lastIndexOf("/");
+
+    if (lastSlashIndex === -1) {
+      lastSlashIndex = 0;
+    }
+
+    return pathname.substring(lastSlashIndex + 1);
+  }
+
+  getUrlFilename(url) {
+    const basename = this.getUrlBasename(url);
+
+    const lastPeriodIndex = basename.lastIndexOf(".");
+
+    if (lastPeriodIndex === -1) {
+      return basename;
+    }
+
+    return basename.substring(0, lastPeriodIndex);
+  }
+
+  getUrlExtname(url) {
+    const basename = this.getUrlBasename(url);
+
+    const lastPeriodIndex = basename.lastIndexOf(".");
+
+    if (lastPeriodIndex === -1) {
+      return null;
+    }
+
+    return basename.substring(lastPeriodIndex);
+  }
+
   close() {
     this.ws.close();
     return Promise.resolve(this);