Skip to content
This repository has been archived by the owner on May 11, 2021. It is now read-only.

brakmic/Angular-VR-Starter

master
Switch branches/tags

Name already in use

A tag already exists with the provided branch name. Many Git commands accept both tag and branch names, so creating this branch may cause unexpected behavior. Are you sure you want to create this branch?
Code

Latest commit

 

Git stats

Files

Permalink
Failed to load latest commit information.
Type
Name
Latest commit message
Commit time
 
 
src
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

image

This is an Angular 4-based environment for building WebVR apps with Mozilla's A-frame.

Live Demo

Read my article describing the internals.

Notice: this demo contains graphics, SVGs and markups taken from the A-Frame homepage.

All copyrights regarding these materials belong to Mozilla and/or other companies and groups (MozVR team etc.).

Installation

yarn 

or

npm install

Building

npm start build:prod 

Running with Hot-Reloading

Type

npm run start:hmr 

then open localhost:3000 in your browser.

Structure

The main component loads available vr modules at boot. By using a simple routing mechanism the Wrapper configures the VrElement Directive to activate a selected VR-module.

State Management

The application state management is done via @ngrx.

The currently available VR modules are located in app.loader.ts. Every module implements the IVrModule interface and must contain a single markup structure and several (optional) scripts. All of them will be injected as separate HTML script tags below the markup. The helper function for dynamic creation of components is located in ComponentFactory.

During the application start the VrModuleService registers all of the available modules by sending dispatch messages to @ngrx AppStore.

FAQ

Q: I'm getting Uncaught TypeError: Cannot assign to read only property 'detachedCallback' of object '#'!

A: A-Frame must be imported before Angular's Zone.js. This project's import 'aframe' is located in polyfills.browser.ts.

License

MIT