aframe-supercraft-loader
v3.0.0
Published
Supercraft loader for A-Frame.
Maintainers
ngokevinReadme
aframe-supercraft-loader
Loader for scenes and objects created with Supercraft, an in-VR creation tool built with WebVR and A-Frame.
API
supercraft-loader
Load a Supercraft object into an A-Frame scene.
Use either src or name to point to a Supercraft asset.
| Property | Description | Default Value |
|--------------------|---------------------------------------------------------------------------------------------------------------------------------------------------------------------------|---------------|
| includeEnvironment | Whether to include environment (sky, ground, lights). | true |
| includeShadows | Whether the mesh should receive and cast shadows. Alternatively, just set the shadow component. | true |
| name | Name of Supercraft asset hosted on server. For example, if the site was at https://supermedium.com/craft/hello-world, then set supercraft-loader="name: hello-world". | '' |
| src | Selector to <a-asset-item> or URL to Supercraft JSON. | '' |
supercraft-visualizer
Similar to supercraft-loader, but loads shapes in over time, visualizing the creation process over a set duration. Really cool!
| Property | Description | Default Value |
|--------------------|---------------------------------------------------------------------------------------------------------------------------------------------------------------------------|---------------|
| autoplay | Whether to start visualizing immediately. | false |
| dur | Duration of visualization in millseconds. | 2000 |
| deprioritizeThings | Comma-separated list of IDs of Supercraft Things to load last at the end to control the visualization process. (e.g., thing45). | '' |
| prioritizeThings | Comma-separated list of IDs of Supercraft Things to load first at the beginning to control the visualization process. (e.g., thing25). | '' |
| name | Name of Supercraft asset hosted on server. For example, if the site was at https://supermedium.com/craft/hello-world, then set supercraft-loader="name: hello-world". | '' |
| src | Selector to <a-asset-item> or URL to Supercraft JSON. | '' |
To trigger the visualization, emit supercraftvisualizerstart.
Getting the JSON
Supercraft sites are stored in Amazon S3. Download from the URL:
https://supercraftsite.s3-us-west-2.amazonaws.com/<SITE_NAME>
Installation
Browser
Install and use by directly including the browser files:
<head>
<title>My A-Frame Scene</title>
<script src="https://aframe.io/releases/0.8.2/aframe.min.js"></script>
<script src="https://unpkg.com/aframe-supercraft-loader/dist/aframe-supercraft-loader.min.js"></script>
</head>
<body>
<a-scene>
<a-entity supercraft-loader="name: wealthy-dock"></a-entity>
<a-entity supercraft-visualizer="name: icky-snake"></a-entity>
<!-- OR. -->
<a-assets>
<a-asset-item id="supercraft" src="supercraft.json"></a-asset-item>
</a-assets>
<a-entity supercraft-loader="src: #supercraft"></a-entity>
</a-scene>
</body>npm
Install via npm:
npm install aframe-supercraft-loaderThen register and use.
require('aframe');
require('aframe-supercraft-loader');