Git Product home page Git Product logo

thirdroom's Introduction

Third Room

Matrix

Third Room is a platform for shared virtual worlds built on top of Matrix. Third Room aims to make it easy to discover, create, and share 3D worlds with others.

Getting Started

Visit thirdroom.io

Homeserver Requirements

Your homeserver should be on Synapse version 1.62 or higher. This is due to Third Room's requirement of the Cross-Origin-Resource-Policy: cross-origin header for the media repository's download route. Third Room uses SharedArrayBuffers which require us to run in a secure-context.

You also should have a TURN server set up with your homeserver. More info on how to do that here.

About Third Room

Third Room enables people to discover and create virtual worlds while protecting their privacy and giving them ownership over their data. We use open standards to ensure that both the 3d content and social networking data is portable and interoperable with other platforms. We empower creators to design and program rich and interactive virtual worlds and avatars using a wide variety of 3D content creation tools and harnessing the power of the glTF file format.

The Third Room client developed in this repository is only one implementation of a possible Third Room client and we welcome additional web or native clients to implement the protocols we design together. Third Room itself is designed around the Matrix protocol, but pieces of this project can be utilized in other 3D web applications including other virtual world platforms. We intend to build the client in a modular fashion, improving the overall landscape for the 3D web ecosystem and being a good participant in the open source community that we are benefitting from.

We will be a good participant in the immersive web. Third Room is just one piece of the overall immersive web. We believe platforms that intend to create their own "metaverse" are missing the point of that term. There is only one metaverse just as there is only one internet. We will embrace and encourage interoperability instead of accepting fragmentation.

Third Room at its core is focused on creating spaces for people and communities to feel safe. We will foster an open community that is kind, respectful, and accepting of others. We will utilize Matrix's existing moderation tools and extend them to best protect our community members against trolls and harassment. We will put users in control of their own privacy and always design with a privacy and safety first mindset.

Problems

  • Virtual worlds are disconnected which makes multiplayer gaming and switching activities or applications difficult and clunky.
  • Some virtual world platforms are monetized with an ad based model that uses sensitive user data to recommend ads.
  • Other virtual world platforms are monetized via NFTs which can be inaccessible due to cryptocurrency transaction fees, some are built on proof of work chains that require vast amounts of electricity, and all operate on the concept of artificial scarcity which has been co-opted by many groups in various speculative schemes.
  • There is high demand from audiences for free user-generated content games on platforms where creators make next to nothing. The audiences and creators for these platforms heavily skew younger and are being exploited by platform operators.
  • The quality of these user-generated games can be high but most are not due to the platform restrictions especially around monetization opportunities. Creators cannot afford to create indie/AAA content.

The Pitch

  • Third Room will be built on top of the Matrix protocol allowing for decentralized hosting of virtual worlds.
  • Worlds can be traversed quickly by changing rooms.
  • Your identity, network, and other shared data will be brought with you between these worlds.
  • Worlds will have spatial voice chat and game networking that can be made end-to-end encrypted so that you know you are only sending data to the people in the room.
  • Creators of all skill levels will be able to create worlds using either a beginner-friendly in-world collaborative tool or industry-standard 3D tools.
  • Creators will be able to use the programming language of their choice compiled to WebAssembly to add interactivity to their worlds.
  • Creators will also be able to monetize their worlds through marketplaces for 3D content including avatars, environments, and props as well as scripts. They also can monetize room or server membership.

Matrix

Third Room is built on top of the Matrix group VoIP spec (MSC3401) where WebRTC connections for voice and game networking are established over Matrix. Matrix is also used for hosting the 3D assets for these virtual worlds and your avatars as well as providing decentralized identity, end to end encryption, text chat, room permissions, and more. We've also started work on a Matrix spec for virtual worlds (MSC3815).

Open Source / License

Third Room is completely open source under the Apache 2.0 license. You can check out this repository, fork it, and modify it as you please. The project is governed by the Matrix.org Foundation and all our work is done in the open. We're still getting the foundation of the project set up and don't have a streamlined flow of taking on external contributors right now. If you are interested in helping out you can join us in the #thirdroom-dev:matrix.org Matrix room.

Manifold Engine

Manifold, Third Room's engine, lives under the /src/engine directory of this project. It is developed with the bitECS and Three.js libraries. It is eventually intended to be published as a standalone project for use with or without Matrix, but it is currently under active development and not ready for a public release yet.

Entity Component System (ECS)

Manifold is built with bitECS, a high performance ECS library written in JavaScript. bitECS is built around Data Oriented Design and JavaScript's TypedArrays to improve CPU cache performance.

In addition to performance, ECS design lets us have predictable execution of systems and more easily debug issues that arise in our game loop.

We've also adopted bitECS's function programming patterns throughout our engine for simpler abstractions, better tree shaking, and faster design iteration.

Multithreading

Manifold is designed around a multithreaded architecture which allows us to fully utilize your system's hardware. As a result, the core of the engine is split across these different threads. We have carefully built out lock-free scene graph data structures backed by JavaScript's SharedArrayBuffers and Atomics. This allows us to split the renderer from the game thread and run each at different rates. With high refresh rate monitors becoming the norm, this is becoming increasingly important. You can now get smooth 120hz+ rendering while your game logic runs at a stable 60hz. Allowing for the renderer thread to submit draw calls as soon as possible in the frame and keep the GPU saturated while your game logic gets a full 16ms to run complex physics simulations and more. The render thread then uses interpolation to smoothly animate the transforms of objects in your scene.

Another short term option we are considering for reducing input latency is with a locking double buffered approach. Where the game simulation is ran at the same rate as your monitor's refresh rate. This approach has the game thread computing the state of the next frame and the render thread rendering the last frame's state. It requires the game simulation to complete within the time frame of your monitor's refresh rate or you will drop frames which may not be preferable when you are bound by your game's simulation. However, if your simulation is simple, this can be a good option for reducing input latency. It's also possible that we may be able to switch between these two approaches depending on the average execution time of your game thread on your particular device.

Browser limitations and API adoption of things like OffscreenCanvas and Atomics.waitAsync create design constraints that are fairly unique to the Web. Our current architecture lets us stay flexible and adapt to advancements in browser technology.

Rendering

Manifold uses Three.js as its rendering library. However, the Three.js API is not intended to be used directly by Third Room developers. We've built a multi-threaded scene graph API with a similar shape to the glTF data model. Our intention is for glTF content to be loaded on the game thread, passed to the render thread via the MessageChannel postMessage API, and then modifications to transforms or materials can be made synchronously on the game thread with data structures backed by SharedArrayBuffers. These rendering changes will be applied on the next render frame.

The renderer itself currently exists on either a dedicated WebWorker when OffscreenCanvas is available, or it shares the main browser thread when it's not.

Three.js is built around the WebGL API and recently switched over to WebGL2 as the default. There is also early support for the WebGPU support. We're currently focusing on the WebGL2 target as browser support is very good now and we can get some performance improvements over WebGL1 with features like Uniform Buffer Objects and Vertex Array Objects.

Most of our rendering features will be tied to the glTF specification and extensions.

Currently supported:

To Do:

Instead of the Three.js GLTFLoader, we've implemented our own glTF loader that works with our multithreaded architecture. However, the renderer is still using Three.js. This means as Three.js improves support for glTF rendering features we hope to add support as well. We may also be able to push support for certain glTF material features faster than Three.js in our own loader.

Aside for glTF material features, we hope to add support for various postprocessing effects such as motion blur, depth of field, bloom, and more.

For rendering performance we hope to make full use of Three's instanced mesh rendering, light maps, and light probes. We'll also be looking into cascaded shadow maps, reflection probes, and more.

Physics

Manifold uses Rapier.js for physics which is a WebAssembly port of the Rapier Rust physics engine. It's a fast and relatively light library with well-documented APIs and active development. We run our physics system on the game thread for synchronous access to the physics world.

We're helping standardize embedding of physics data in glTF in the Open Metaverse Interoperability Group with the following extensions:

Audio

Manifold uses the WebAudio API for spatialized audio from other users and environmental audio. We're still investigating how we might best use features such as AudioWorklet and third party libraries such as Oddio.

Networking

Manifold uses WebRTC DataChannels for game networking. Third Room establishes these DataChannels via Matrix (MSC3401), however Manifold has an interface to connect your own network interface. Currently we are working with ordered and reliable DataChannels, but we intend to utilize unreliable DataChannels for fast changing data like transforms.

We also intend to document our network protocol and hopefully standardize it as part of our virtual world Matrix spec (MSC3815). We've documented some of our progress so far in our network protocol document.

Currently our networking is peer-to-peer, however work is underway on a selective forwarding unit (SFU) and sfu-to-sfu protocol that will increase world capacity by lowering outbound bandwidth and interest management algorithms. Our start on this project can be seen in the sfu-to-sfu repository.

WebRTC is a fantastic technology, however it's also a very complex and fragile one. The new WebTransport API looks like it may be a possible alternative when communicating through a SFU. We're interested in exploring this area further in the future.

WebXR

Manifold currently doesn't have WebXR support. However, we plan to start work on it as soon as we have a feature complete product running on desktops. Our multithreading support will work a little differently when WebXR is involved due to the need for the lowest possible input latency to avoid motion sickness. We're still investigating this area and we'll have more to share as we get closer to starting this work.

Editor

The Manifold Editor will be built into the game engine and will be able to be launched at any time while in a scene. It is being designed from the start for collaborative world building. The editor will make use of glTF as both its authoring and runtime format. glTF was designed as a transmission format for real-time graphics, not an authoring format for DCC tools like Blender or Maya. However, we believe there is a middle ground where glTF can be the foundation for a format that enables composition of assets similar to how HTML allows you to embed images, video, iframes, and more.

User Generated Content and Sandboxed Scripting

Third Room worlds and avatars are owned by their creators. Worlds and avatars are published as glTF files hosted on the Matrix network or elsewhere. Creators will also be able to embed WebAssembly scripts inside their glTF content, enabling custom behaviors. Manifold's APIs are built around the ability to safely provide performant manipulation of a glTF scene graph from a WebAssembly module. This enables us to run partially untrusted scripts safely in your Third Room client as you navigate from world to world.

We hope to standardize this WebAssembly Scene Graph API as a member of the Open Metaverse Interoperability Group's Scripting Working Group.

UPDATE: There is a very early version of the Web Scene Graph API supported today. You can find more info about it in the WebSG Docs.

Creating Your Own Scenes

Third Room is built on top of the glTF standard 3D file format, you can technically use any tool that exports glTF to create Third Room scenes. However, not all of the glTF extensions Third Room uses are supported by every tool. We've created the Third Room Unity Exporter for easily creating Third Room scenes from Unity.

Learn more here.

Local Development

The Third Room client can be ran locally against any Matrix homeserver in development.

After you've installed node.js locally, run the following commands.

npm install -g yarn
yarn
yarn dev

NOTE: Vite does not transpile import statements in web workers and Chromium based browsers are the only browsers to support imports in Web Workers. In order to develop in non-chromium browsers, run the following command which will build the project after every change.

yarn preview

Open http://localhost:3000

Deployment

The Third Room client can be deployed to any static web host with the ability for wildcard routing for single page web apps and adding HTTP headers.

We currently deploy Third Room to Netlify via a custom GitHub actions deploy script. If you fork our repository and set the NETLIFY_AUTH_TOKEN and NETLIFY_SITE_ID secrets in your GitHub configuration, this setup should work for you as well. Every PR will be built and deployed as a preview deploy and every commit / merge to main will be deployed to your Netlify site.

When deploying to thirdroom.io, the testing procedure should be completed before deploying.

To setup OIDC login client configs needs to be added in config.json. Client configs includes client_id and uris issued by OIDC Provider.

thirdroom's People

Contributors

ajbura avatar antpb avatar ara4n avatar arkaniad avatar dependabot[bot] avatar hughns avatar robertlong avatar turt2live avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

thirdroom's Issues

Design Document: Toggling the Overlay

Screen Shot 2022-04-08 at 5 31 10 PM

Third Room should have two main UI states:

  1. I'm in the overlay and my cursor can move freely, I can click on things, scroll, etc.
  2. The overlay is hidden, I'm in a world and my cursor is locked. Moving my mouse looks around the 3D world.

The app needs to toggle between these two states using the Pointer Lock API.

We can use the pointerlockchange event to trigger changing the UI states. When entering a room, or when you hit escape to close the overlay, we should call requestPointerLock. The UI is driven entirely by the pointerlockchange event and the pointer lock state. I believe this event should also be fired if the window blur event is fired, but we should check that.

This pattern gets a little bit more complicated when dealing with some of the in-world actions

Chat

Chat should be displayed when you press enter in a room. It should exit pointer lock and focus the text input. You should have full control of your mouse in this state. Meaning you can copy and paste things into the text box or click and drag to select text. Pressing enter while the text box is selected should send the message. Pressing escape should return focus to the canvas and request pointer lock again. If you click on the canvas or any of the other floating UI elements while in this state, you should also request pointer lock and return focus to the canvas.

Screen Shot 2022-04-08 at 5 42 50 PM

Screen Shot 2022-04-08 at 5 46 44 PM

In World Actions

Muting your audio or microphone do not affect the pointer lock state. They should call a method to toggle the mute state on the Hydrogen media manager / group call. Inventory and leaving the room are covered below.

Screen Shot 2022-04-08 at 5 48 03 PM

Quick Inventory

Pressing I should open the quick inventory modal. Pressing escape, clicking the close button, or clicking outside the modal should return your focus to the canvas and request pointer lock again. Note that while the overlay background is visible, the sidebar is not visible. This is a separate state from the overlay state.

Frame 4050

Leave World

Leaving a world should exit cursor lock and open the overlay, back to the world loaded state as shown below:

Frame 4044

ProfileTile Component

Tasks:

  • Use #2 to show user's avatar preview
  • Display #3 in modal when clicking change avatar button
  • Use #4 to show/edit user name
  • Use #6 to manage state

Manifold Editor

The Manifold Editor is our game engine environment / asset editor built around the glTF standard. Both the interchange and authoring format will utilize glTF and should be capable of producing content for Third Room as well as exporting glTF content for use elsewhere.

The todo list below represents the tasks needed for a feature-complete 1.0 release. We plan on tackling this list in chunks, focusing on iteratively improving our demo environments.

  • Scene Hierarchy Panel
    • UI
      • Hierarchy Panel
      • Tree View
      • Context Menu
        • Rename Entity
        • Delete Selection
        • Duplicate selection
        • Copy Selection
        • Paste Selection
        • Group selection
      • Create Entity Button / Dropdown / Combobox
        • Pick from list of prefabs
    • State (Game Thread -> Main Thread)
      • Scene hierarchy
      • Selected / active entities
      • Entity names
      • Prefabs
    • Commands (Main Thread -> Game Thread)
      • Set Selection
      • Add Selection
      • Toggle Selection
      • Focus Entity
      • Rename Entity
      • Reparent Entities
      • Remove Entities
      • Add Entity
      • Duplicate entities
    • Misc
      • Figure out cross-thread Tree View canDrop implementation
  • Properties Panel
    • UI
      • Properties Panel
      • Input Field / Row
      • Input Section / Group / Component
      • String Input (string)
      • Checkbox Input (boolean)
      • Select Input (enum)
      • Number Input (number)
      • Vector2 Input (vec2
      • Vector3 Input (vec3)
      • Euler Input (euler/quat)
      • Slider Input (number)
      • Color Picker Input (color)
      • File Input w/ DnD support (file)
      • Property Panel Button (command)
      • Add Component Button / Dropdown / Combobox
      • Remove Component
    • State (Game Thread -> Main Thread)
      • Selected / active entities
      • Active entity components and initial values
      • Component schemas
    • Commands (Main Thread -> Game Thread)
      • Add Component
      • Remove Component
      • Set component property
      • Set Transform properties (relative to active entity)
    • Components
      • Transform
      • Renderable? (More likely components for each renderable type which update renderable when edited)
        • Lights
        • Cameras
        • Meshes
      • Rigid Body
      • Audio Emitter
      • Spawn Point
  • Assets Panel
    • UI
    • Prefabs
      • Entity
      • Cameras
        • Perspective Camera
        • Orthographic Camera
      • Lights
        • Directional Light
        • Point Light
        • Spot Light
      • Audio
        • Audio Emitter
      • Meshes
        • Box
        • Cylinder
        • Cone
        • Capsule
        • Plane
        • Circle
        • Dodecahedron
        • Icosahedron
        • Octahedron
        • Ring
        • Sphere
        • Tetrahedron
        • Torus
        • TorusKnot
      • Misc
        • Spawn Point
    • Assets
      • Add to room state on upload?
      • gltf
      • images
      • audio
  • Viewport
    • Fly controls
    • Mouse selection
    • Transform controls
    • Grab controls
    • Helpers
    • Command Keybindings
      • Copy / Paste
      • Delete
      • Grab
      • Translate, rotate, scale
      • Transform space
      • Transform origin
      • Duplicate selection
      • Focus selection
      • Add/remove from selection
  • Toolbar
    • Transform controls mode
    • Transform space
    • Transform origin
    • Snap settings
    • Grid settings
    • Save
    • Publish
    • Export
  • Scene Editor (Compose a scene using referenced glTFs, save root gltf with references to assets)
    • Set opened glTF as scene
    • Render glTF hierarchy but disable transform / reparenting of referenced glTFs
      • Use glTF MX_ref/id extension for adding components to nodes
    • Save root gltf
    • Export entire scene as glb
  • Asset Editor (Edit glTFs and export modified glTF)
    • Set opened glTF as active scene
    • Render entire glTF hierarchy
    • Allow for glTF modifications
      • Use glTF MX_ref/id extension for adding components to nodes
      • Use glTF MX_ref/id extension to reference individual nodes when reparenting / deleting etc.
    • Save root gltf with modifications / references
    • Export entire scene as glb
  • Serialization
    • ECS -> glTF
    • Reference external glTF files
  • Deserialization
    • glTF -> ECS
    • Load referenced glTF files
  • Import
    • Load gltf
    • Generate thumbnail
    • Save to room state
  • Export
    • Export entire scene as single glb

Create text chat rooms from the rooms tab

Clicking the + icon in the rooms tab should show a dropdown like the worlds tab that allows you to join a room by alias or create a room. This new window would be similar to the create world window except it would not prompt you for a scene or scene preview image.

Screen Shot 2022-07-05 at 10 04 40 AM

Screen Shot 2022-07-05 at 9 49 08 AM

FriendsListTile Component

Tasks:

  • Use useRoomList hook to get DM rooms with friend state event set
  • Use #7 components to render RoomList and RoomItems
  • RoomItem context menu action should say "Unfriend" instead of "Leave Room"
  • Unfriend action should call leave room and update friend list
  • RoomList header button should say "Add Friend"
  • RoomList header button should open #12
  • FindUserModal should display "Send Friend Request" as action button text
  • Show presence state if possible
  • Use member state in DM room to set current room.
  • Display joinable state
  • Join current room on click
  • Show friend invites using InviteItem component
  • Make accept/ignore invite buttons work

Change Avatar Form

Tasks:

  • Show current avatar using #2
  • Avatar file picker
    • Update avatar preview when changed
    • Display errors when avatar cannot be loaded
  • Save button
  • Saving state

World list scrolls on top of tabs in sidebar

Describe the bug
When using a short window (or when you have your devtools open), the world list scrolls on top of the tabs in the sidebar

To Reproduce
Steps to reproduce the behavior:

  1. Have a couple worlds in your sidebar
  2. Shrink the browser window vertically
  3. Scroll to the bottom of your room list and to the friends list at the bottom of the sidebar
  4. Observe the world avatar on top of the tabs

Expected behavior
It should always scroll behind the tabs

Screenshots
Screen Shot 2022-07-05 at 3 52 20 PM

Desktop (please complete the following information):

  • OS: macOS
  • Browser: Chrome
  • Version: 103

Top bar notifcation counter and notfication display should update

When you receive a message or invite you receive a notification in the notifications tab. You should not need to enter the overlay in order to see incoming notifications. The notification area in the top right should show a summary of the latest incoming notification. This should fade out after 5 seconds and return to the notification counter with the total number of notifications. Clicking on this area should bring up the overlay with the notifications panel open.

EditableText Component

Task:

  • Display passed in text
  • Inline edit button
  • Editing state
    • Content wrapped in <form> element
    • Inline input element
    • Auto focus inline input element
    • Save button (submit form)
    • Cancel button
    • Esc key cancels editing
    • Saving state

Audio

  • Spatial Audio
    • Samples
    • Voice
  • Audio/Video Playback Synchronization
  • Reverb Spaces

Fail to join room without a microphone connected

Describe the bug
A user reported an issue where they tried to join the room without a microphone connection. They received the following error:

Uncaught (in promise) DOMException: Requested device not found

With a microphone connected the user stated that they were able to enter the room.

To Reproduce
TODO

Expected behavior
The user should enter the room or an error should be displayed if it still fails

Screenshots
N/A

Desktop (please complete the following information):
Chrome via flatpak on Linux

Additional context
None

Third Room UI

Third Room is a custom Matrix client built around 3D worlds. The UI is built with React and it uses the Hydrogen Matrix SDK for interacting with Matrix and rendering the chat timelines efficiently.

Here are the high level client UI features and todo items:

  • Landing Page
  • Login Page
  • Status Bar
  • Sidebar
    • Fix showing avatars by adding proper COEP header
    • Show unread indicator
    • Differentiate between world, room, DM, and group message icons?
    • Context Menu
      • World
      • Room
      • User (DM)
    • World participant list (see who is in a world currently)
    • User presence (see if they are online or not)
    • Send room / world / DM invite
    • Home Tab
      • Basic implementation showing all rooms
      • Finalize design with details on which worlds / rooms / dms to show
    • Worlds Tab
      • Filter worlds only
    • Rooms Tab
      • Filter rooms only
    • Chat Tab
      • Filter dms only
    • Settings Tab
      • Figure out if this is the best place for this menu item or if it should be swapped with something else
    • VoIP controls
      • Mute mic
      • Mute incoming audio
      • Leave world
      • Settings
        • Pick microphone
        • Pick output
    • Active world info
      • World avatar
      • World name
      • World info (needs design)
        • Members list
        • Participants list (who is online)
        • Topic
        • Scene info
  • Spaces bar
    • Disable for now
  • In Room Controls
    • Mute microphone
    • Mute incoming audio
    • Leave room
  • In World Chat
  • Overlay Chat
    • Fix loading message on scroll
    • Invite to room
    • Room info
  • Create world screen
    • Allow for picking scene file
    • Generate thumbnails for scene
  • Create room screen
    • Standard UI for creating a Matrix room
  • User profile screen
    • Set display name
    • Set avatar
    • Set 3D avatar

Invite users from chat window

Once you're in a chat there's no way to invite that person to the room. I think we should add a method of sending an invite from the chat dialog. We also should allow you to click on links in messages as another way of sharing a room.

Screen Shot 2022-07-05 at 10 07 42 AM

RoomList Component

Tasks:

  • RoomList header
    • List name
    • Create Room Button
    • Add Friend Button
  • RoomItem
    • Room avatar
    • Room name
    • Context Menu #8
      • Leave Room
  • MemberItem
    • Member Avatar
    • Member Name
    • Ignored state
    • Online state (Used for GroupCallParticipant)
    • Context Menu #8
      • Ignore
      • Kick
      • Ban
      • Send room invite
      • Send friend invite (open dm with state event)
  • InviteItem
    • Room avatar
    • Room name
    • Accept button
    • Ignore button
  • List should be scrollable with fixed header

Update profile screen for tech preview

You should have a few avatars to pick from in the profile screen. These should be populated from a list stored in a JSON file. The JSON file should also store urls to thumbnails for each avatar. Each url should be an mxc url to an asset stored on the matrix homeserver to avoid uploading/downloading duplicate assets.

Add toggleable fly mode

You should be able to press a key to toggle flying in a world. This will allow easier exploration of certain scenes with complex or troublesome collision or disconnected areas.

Modal Component

Tasks:

  • Should use portals to render from deep within the app
  • Should only allow one modal open at a time

RoomsListTileComponent

Tasks:

  • Use useRoomsList hook to get rooms list
  • Use #7 to display rooms list
  • Use leaveRoom function in "Leave Room" RoomItem context menu
  • RoomsListHeader button should display a context menu with
    • Create Room which opens the create room page
    • Browse Public Rooms which opens the explore page
  • Clicking on a room will open that room page
  • Show room invites in list using InviteItem component
  • Add join/Ignore rooms in invites

Update world creation / settings page for default environments

We should show a list of default environments for you to pick from. This should be hard coded into a JSON file and use existing mxc urls to avoid reuploading duplicate assets over and over to the Matrix.org homeserver. The JSON file should also contain mxc urls for the default room avatar and scene preview thumbnail.

When creating worlds with one of the default environments we shouldn't allow you to change the scene thumbnail. They should use their associated scene thumbnail and default avatar. You should however be able to change the avatar to a custom room avatar.

We can skip auto generating scene thumbnails for now if we make this change. We'll add it in when we finish the world editor.

Determine maximum world capacity without SFU

We need to figure out how many users we can have in a world with our current networking limitations and avatar rendering techniques. Ideally this is somewhere around ~20 participants should we prevent sending audio at all times, default users to muted, force PTT, etc. Avatar rendering is likely going to be fine if we can minimize the number of unique avatars and their polygon count / material cost.

MOZ_lightmaps support

We should support the MOZ_lightmaps glTF extension in our glTF loader to improve our lighting and reduce performance costs.

To Do:

  • Implement MOZ_lightmaps in our glTF loader
  • Use Hubs Blender Exporter, UnityGLTF, or pack lightmap data in gltf-transform pipeline
  • Generate test asset and see if it works

FindUserModal Component

Tasks:

  • Use #11 to display modal
  • Should display a text field that accepts a user id
  • Should display a button for submitting the request with a customizable label
  • Should have a configurable title and message
  • Validate user id
  • Show invalid user id message
  • Show user not found message
  • Should submit on enter
  • Should submit on button click

Login / Registration via OpenID Connect

Work has been underway for some time on OpenID Connect for auth in Matrix. We should utilize OpenID Connect in Third Room instead of building out yet another Matrix.org managed auth/user registration project.

Postprocessing Effects

We should support the following postprocessing effects:

  • Depth of Field
  • Bloom
  • Tonemapping

And it should work with MSAA via WebGL2's multisampled framebuffers.

First Party Environments

Thirdroom should have a collection of sample environments to choose from when creating a new world. These environments should be polished and include some basic interactable objects.

Landing Page

Tasks:

  • General Thirdroom Info
  • Use AuthForm component to display login/register form
  • Toggle between login/register form without changing page

Animated Avatars

As a user avatars should have walk/jump/crouch/turn/etc animations when moving around. The animations should automatically blend from one to the next as your velocity and input changes.

Visual Artifacts with EffectComposer in Chrome

Describe the bug
Some surfaces display a flickering artifact when you're a little ways away from them in Chrome. This only started appearing when we added the EffectComposer.

To Reproduce
Steps to reproduce the behavior:

  1. Go to the City or UK City scene in Chrome
  2. Look at the top of the arch in the UK City scene at a distance, or the top of the buildings in the City scene.
  3. Notice the flickering / vertical/horizontal banding when moving.

Expected behavior
It shouldn't have any visual artifacts in Chrome

Screenshots
Chrome:
https://user-images.githubusercontent.com/1753624/180495521-88f0523c-0060-4ae4-8884-3d22acf82658.mp4

Firefox:
https://user-images.githubusercontent.com/1753624/180495626-b728c14a-2387-4ae8-b7b0-d255300e0395.mp4

Desktop (please complete the following information):

  • OS: macOS (M1)
  • Browser: Chrome
  • Version: 103

KHR_audio Support

We should support the draft KHR_audio extension in Third Room for environmental audio. We already have most of the work done, we just need to make a few changes to the glTF Loader and test some sample assets.

To Do:

  • Update glTF loader to latest KHR_audio spec
  • Update omi-gltf-transform to latest KHR_audio spec
  • Create test asset and ensure that it loads properly

Invite multiple users at a time

You should be able to pick multiple usernames when inviting users to a room. Clicking the "+" button in the friends tab should not allow you to pick more than one username to send an invite to.

Screen Shot 2022-07-05 at 10 02 19 AM

Manifold Engine

Manifold is Third Room's game engine. It's currently loosely embedded in this Third Room repository under the /editor folder. The plan is to eventually publish it as a standalone game engine after it has had time to mature within Third Room.

The following is a high level list of features and todo items for the engine:

  • Entity Component System (ECS)
    • Complete Transform Component API
    • Implement editor / UGC ECS API
  • Resource Loading
    • Refactor resource loading API
  • Rendering
    • Add postprocessing effects
    • Add instanced mesh support
    • Add LOD support
    • Add light probes
    • Add reflection probes
  • Input
  • #66
    • Finalize network identifiers
    • Add Spatialized VoIP
    • Finish network templates
    • Networked avatars w/ animation
  • #65
  • Physics
    • Fix character controller
    • Specify / implement glTF physics extensions
  • Animation
    • ECS Animation Mixer API
  • Avatars
    • VRM Support
    • Hubs Avatar Support

If you jump too high you fly out of the world and can never return

To Reproduce

  1. Hit jump many times to go flying.
  2. Hit it too many, and suddenly you accelerate through the roof, and the world disappears, and you can never go back. It's possible you are even accelerating (or at least travelling) out into space.
  3. It's like Charlie and the Great Glass Elevator, with the Vernicious Knids, but worse.

Expected behavior

You can't fly out of the world. Presumably this is a combination of clip plane for the world, but also a bug where jumping suddenly gets stuck on somehow.

Chrome 102 on macOS 12

Instanced rendering of physics objects

We're currently rendering a unique mesh per physics object and could be rendering all balls and all cubes in a single draw call per unique physics object.

In-world chat messages should display above chat box and fade out over time

The in-world chat UI works ok but you have no indicator if someone is talking and you have to press enter to see all the messages. You should see messages as they come in above the chat box, there should be a maximum height allowed for the visible messages. The message received should fade out after 5 seconds or if it exceeds the maximum height allowed for visible messages.

CopyableTextField Component

Tasks:

  • Field label
  • Display text that is copyable but not editable
  • Add inline copy button
  • Add copy to clipboard callback to button

useProfile Hook

Tasks:

  • Get display name
  • Get avatar url
  • Set user display name
  • Upload and set user avatar

User Profile

To Do:

  • Add user profile icon to sidebar tabs
    Frame 3962
    • Clicking on icon should open profile window
      Frame 4106(1)
  • Create profile window
    • Allow for editing display name
    • Allow for uploading/changing 2D Matrix Avatar
    • Allow for uploading/changing 3D Third Room Avatar (.glb)
    • Allow for uploading/changing 2D Thumbnail image for 3D Third Room Avatar
    • Save 3D avatar / thumbnail image in new profile room
      • Profile room is a private room where user is the owner and only member
      • 3D avatar / thumbnail should be saved in m.world.profile room state event (add to matrix-org/matrix-spec-proposals#3815)
  • When joining a world, the client should set the m.world.member avatarUrl field with the current avatarUrl from the m.world.profile

Landing / Marketing Page

thirdroom.io needs a landing page so people can learn more about it before signing up.

Note that this might be best suited in a separate repo.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.