Giter Club home page Giter Club logo

mixed-reality-extension-sdk-samples's Introduction

page_type name description languages products
sample
Mixed Reality Extension SDK Samples
Samples showing how to build and run your first AltspaceVR extension using the Mixed Reality Extension SDK.
javascript
windows-mixed-reality
hololens

Mixed Reality Extension SDK Samples

The Mixed Reality Extension SDK Samples is the easiest way to build and run your first AltspaceVR extension using the Mixed Reality Extension SDK.

Prerequisites

  • Install Node.js 8.12 or newer, which includes NPM 6.4.1 or newer, from nodejs.org

How to Build and Run the Hello World sample

From command prompt:

  1. git clone http://github.com/microsoft/mixed-reality-extension-sdk-samples
  2. cd mixed-reality-extension-sdk-samples\samples\hello-world
  3. npm install This will install all dependent packages. (and will do very little if there are no changes)
  4. npm run build This should not report any errors.
  5. npm start This should print "INF: Multi-peer Adapter listening on..."

In AltspaceVR

  1. Go to your personal home
  2. Make sure you are signed in properly, not a guest
  3. Activate the Space Editor (only available if you indicate you want to participate in the Early Access Program in your AltspaceVR settings)
  4. Click Basics group
  5. Click on SDKApp
  6. For the URL field, enter ws://localhost:3901
  7. Enter a session ID (This step will eventually be optional. For now, put in any random value)
  8. Click Confirm
  9. If the app doesn't seem to load, click on the gear icon next the MRE object in to the present objects list, and make sure "Is Playing" is checked.
  10. After the app has been placed, you will see the MRE Anchor (the white box with red/green/blue spikes on it), rendering on top of the MRE. You can use the anchor to move the MRE around. To hide the anchor, uncheck "Edit Mode".

You should now see the words "Hello World" above a spinning cube. Congratulations, you have now deployed a Node.js server with the MRE SDK onto your local machine and connected to it from AltspaceVR.

Hosting in the Cloud

In order for other AltspaceVR users to see your SDK app running, it must be hosted in a way they can connect to it. To learn about cloud hosting and other solutions, checkout DEPLOYING.md in the SDK repo.

To learn more about the SDK, please read the MRE SDK readme.

Sample Descriptions

  • Hello World - Shows text and a cube that animates when highlighted or clicked. Demonstrates basic scene creation and interaction.
  • Solar System - Loads a 3d model for each planet and animates planetary motion. Demonstrates animation generation and more advanced scene creation.
  • Tic-Tac-Toe - The classic game also known as "Noughts & Crosses". Demonstrates gameplay with win/lose conditions.
  • Wear A Hat - Users can choose a hat from a menu and it will appear on their head. Demonstrates attachments.

Contributing

This project welcomes contributions and suggestions. Most contributions require you to agree to a Contributor License Agreement (CLA) declaring that you have the right to, and actually do, grant us the rights to use your contribution. For details, visit https://cla.microsoft.com.

When you submit a pull request, a CLA-bot will automatically determine whether you need to provide a CLA and decorate the PR appropriately (e.g., label, comment). Simply follow the instructions provided by the bot. You will only need to do this once across all repos using our CLA.

This project has adopted the Microsoft Open Source Code of Conduct. For more information see the Code of Conduct FAQ or contact [email protected] with any additional questions or comments.

mixed-reality-extension-sdk-samples's People

Contributors

eanders-ms avatar hferrone avatar microsoftopensource avatar msftgits avatar patole avatar paulmasson avatar sorenhan avatar stevenvergenz avatar tombums avatar yodon 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

Watchers

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

mixed-reality-extension-sdk-samples's Issues

Running the samlpes on WSL2 (Ubuntu)

When i clone and run the examples according to the readme on Windows, it shows the rotating Hello World! text and also the AltspaceVR box underneath.
When i do the same on WSL2 in Ubuntu, it just shows the rotating text, but no box. Also in the other examples it only shows the text.

The only thing that looks different in the console is during the npm run build where it shows:

/home/mhe/code/mixed-reality-extension-sdk-samples/samples/hello-world/src/app.ts
    1:4    warning  Expected linebreaks to be 'CRLF' but found 'LF'  linebreak-style
    2:61   warning  Expected linebreaks to be 'CRLF' but found 'LF'  linebreak-style
    3:35   warning  Expected linebreaks to be 'CRLF' but found 'LF'  linebreak-style
    ...

Steps in 'How to Build and Run the Hello World sample' section seems not up to date

Hello,

I was following instructions in 'How to Build and Run the Hello World sample' section and found out that few steps are a little bit vague and seems like they are not up to date.
Currently (10.05.2021) steps look like:

...
In AltspaceVR
- Go to your personal home
- Make sure you are signed in properly, not a guest
- Activate the Space Editor (only available if you indicate you want to participate in the Early Access Program in your AltspaceVR settings)
- Click Basics group
- Click on SDKApp
- For the URL field, enter ws://localhost:3901
- Enter a session ID (This step will eventually be optional. For now, put in any random value)
- Click Confirm
- If the app doesn't seem to load, click on the gear icon next the MRE object in to the present objects list, and make sure "Is Playing" is checked.
- After the app has been placed, you will see the MRE Anchor (the white box with red/green/blue spikes on it), rendering on top of the MRE. You can use the anchor to move the MRE around. To hide the anchor, uncheck "Edit Mode".

I was not able to find 'Basics group' and step before to 'Activate the Space Editor' wasn't clear too.

I was able to run Hello-world sample and I propose to update instruction with steps below

...
In AltspaceVR
- Go to your personal home
- Make sure you are signed in properly, not a guest
- Activate the Space Editor (only available if you indicate you want to participate in the Early Access Program in your AltspaceVR settings, general section)
- Enter any world (for example go to 'Worlds' in Main menu and in a 'My worlds' tab select your own world)
- Inside the world press right mouse button and choose 'World editor'
- Click on SDKApp
- For the URL field, enter ws://localhost:3901
- Enter a session ID (This step will eventually be optional. For now, put in any random value)
- Click Confirm
- If the app doesn't seem to load, click on the gear icon next the MRE object in to the present objects list, and make sure "Is Playing" is checked.
- After the app has been placed, you will see the MRE Anchor (the white box with red/green/blue spikes on it), rendering on top of the MRE. You can use the anchor to move the MRE around. To hide the anchor, uncheck "Edit Mode".

This is just a suggestion, as it wasn't obvious for me how to trigger it. Please feel free to rephrase what I wrote or just change it totally.
I was using AltspaceVR on desktop.

Support hot-reloading of code changes

I didn't spot any support in the samples for debuggable hot reloading so I'm submitting an additional sample as PR #49 in case its helpful to anyone else. Usage is detailed in the README.md for the new sample.

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.