Skip to content

A code base that modifies a Mozilla Hubs room via code injection in order to provide experimental tools for VR meetings.

Notifications You must be signed in to change notification settings

georgebutler/socialvr

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

SocialVR

This repo is currently not maintained

Social VR is a code base that modifies a Mozilla Hubs room via code injection in order to provide experimental tools for VR meetings. To learn more about the tools, go to the Social Superpowers website.

Injection methodology

Iteration cycles for custom Mozilla Hubs functionality can involve tedious modification of back-end code and redeployment. With code injection, a developer works on self contained scripts hosted on an external server that are loaded when a user joins a room. This method has several advantages:

  • Faster iteration speed - external servers can redeploy faster than a Mozilla Hubs instance
  • Interfaces agnostic to room environment - these external scripts can be injected into any room
  • Improves collaboration - developers can contribute to the development without Mozilla Hubs expertise

Code Overview

rollup.config.js - The project is a Rollup project. Configuration for development is contained here.

netlify.toml - Netlify was used for a development and production build pipeline

src

main.js - Root entry point of the app. Determines whether it should be a time barge or toolbox and instantiates appropriate components

util.js - Collection of functions that are referenced across files such as logging or NAF schema modification

config.js - Configurations for avatar colors in conversation balance and time barge

src/components

Barge components

barge-button.js - Base component for interactable button on barge

barge-clock.js - Displays users current time on barge (location defined on main.js)

barge-data.js - Generates and handles user behavioral data related to time management study

barge-slot.js -Geometry that contains a single point in order to determine block ranking by distance

world-mover.js - Generic component that loads a model and moves it through waypoints

Toolbox components

emoji-target.js - Permits entity to receive emojis

speech.js - Conversation Visualization tool

toolbox-button.js - (deprecated)

toolbox-dashboard-button.js - Base class for all toolbox buttons for toggling them ON/OFF

toolbox-dashboard.js - Instantiates toolbox features such as conversation visualization and emoji sending

src/systems is deprecated

Instructions

This code base requires a custom Mozilla Hubs instance. In order to use this script, it must be compiled and hosted on an external server that is cleared for cross scripting via the admin panel. When you create a room, put the link to the external script in More > Room Info & Settings > Edit > Custom Script URL

In order to determine whether the scene should as barge or toolbox, an item in the world must have selectors denoted in config.js. This is done in Spoke

Build

npm run build builds the application to build/production.js, along with a sourcemap file for debugging.

npm run dev builds the application to build/development.js, along with a sourcemap file for debugging.

Local Development

npm run dev starts server at localhost:3000

ngrok http 3000 starts ngrok server at url in terminal output

injection url: ngrok_terminal_output_url/development.js

About

A code base that modifies a Mozilla Hubs room via code injection in order to provide experimental tools for VR meetings.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Contributors 4

  •  
  •  
  •  
  •