Skip to content
This repository was archived by the owner on Jan 6, 2025. It is now read-only.

Commit 8072af7

Browse files
GavanWilhiteGavanWilhite
committed
Merge pull request #3 from AltspaceVR/feature/use-pixel-units
Replace autoscale parameter with usePixelScale
2 parents 1d119be + b17d2ab commit 8072af7

File tree

9 files changed

+52
-26
lines changed

9 files changed

+52
-26
lines changed

‎README.md

+8-14
Original file line numberDiff line numberDiff line change
@@ -1,22 +1,19 @@
11
## aframe-altspace-component
22

3-
Component to make an [A-Frame](https://aframe.io) scene compatible with [AltspaceVR](http://altvr.com).
4-
When loading your scene in Altspace, the Altspace Render is used instead of the WebGLRender.
5-
Behavior outside of Altspace is not affected.
3+
Component to make an [A-Frame](https://aframe.io) scene compatible with [AltspaceVR](http://altvr.com). When loading your scene in Altspace, the Altspace Render is used instead of the WebGLRender. Behavior outside of Altspace is not affected.
64

7-
Note that when running in Altspace, the scene will not respond to cursor events nor be synchronized between users.
8-
In addition, some A-Frame features are currently not supported in Altspace, such as lighting and videos.
9-
For details, see the [Three.js Feature Support](http://github.com/AltspaceVR/AltspaceSDK#threejs-feature-support)
10-
section in the [AltspaceSDK](http://github.com/AltspaceVR/AltspaceSDK) repo.
5+
Live examples: http://altspacevr.github.io/aframe/examples/ (forked from [aframevr/aframe](https://github.com/aframevr/aframe))
6+
7+
Note that when running in Altspace, the scene will not respond to cursor events nor be synchronized between users. In addition, the following A-Frame features are currently not supported in Altspace: lights, transparency, and video. For details, see the [Three.js Feature Support](http://github.com/AltspaceVR/AltspaceSDK#threejs-feature-support) section in the [AltspaceSDK](http://github.com/AltspaceVR/AltspaceSDK) repo.
118

129
### Properties
1310

1411
| Property | Description | Default Value |
1512
| -------- | ----------- | ------------- |
16-
| autoscale | Scale scene when running in Altspace, so 1 unit is 1 meter in-game. | true |
13+
| `usePixelScale` | Treat a unit as a CSS Pixel, and have your scene scale with the scale of the AltspaceVR web browser. This is the default behavior in AltspaceVR for three.js apps. In A-Frame, however, the default value is `false`, as units are in meters by default. | `false`
1714

1815
### Usage
19-
Add the "altspace" parameter on your `<a-scene>` like so: `<a-scene altspace="autoscale:true">`
16+
Add the "altspace" parameter on your `<a-scene>` like so: `<a-scene altspace>`
2017

2118

2219
#### Example
@@ -27,15 +24,12 @@ Install and use by directly including the [browser files](dist):
2724
<head>
2825
<title>My A-Frame Scene</title>
2926
<script src="https://aframe.io/releases/0.2.0/aframe.min.js"></script>
30-
<script src="https://cdn.rawgit.com/AltspaceVR/aframe-altspace-component/v0.1.0/dist/aframe-altspace-component.min.js"></script>
27+
<script src="https://cdn.rawgit.com/AltspaceVR/aframe-altspace-component/v0.2.0/dist/aframe-altspace-component.min.js"></script>
3128
</head>
3229

3330
<body>
34-
<a-scene altspace="autoscale:true">
31+
<a-scene altspace>
3532
<a-entity geometry="primitive: box" material="color: #C03546"></a-entity>
3633
</a-scene>
3734
</body>
3835
```
39-
40-
- Live examples: http://altspacevr.github.io/aframe/examples/ (view on [Github](https://github.com/AltspaceVR/aframe/tree/altspace-examples))
41-
- Tips for [Loading A-Frame Examples in AltspaceVR](https://github.com/AltspaceVR/aframe/wiki/Loading-A-Frame-examples-in-AltspaceVR)

‎dist/aframe-altspace-component.js

+7-4
Original file line numberDiff line numberDiff line change
@@ -52,8 +52,12 @@
5252
* aframe-altspace-component component for A-Frame.
5353
*/
5454
AFRAME.registerComponent('altspace', {
55+
56+
/**
57+
* usePixelScale will allow you to use A-Frame units as CSS pixels. This is the default behavior for three.js apps, but not for A-Frame apps.
58+
*/
5559
schema: {
56-
autoscale: { type: 'boolean', default: 'true' }
60+
usePixelScale: { type: 'boolean', default: 'false'}
5761
},
5862

5963
/**
@@ -72,13 +76,12 @@
7276
}
7377
if (window.altspace && window.altspace.inClient) {
7478
var scene = this.el.object3D;
75-
if (this.data.autoscale) {
79+
if (!this.data.usePixelScale) {
7680
altspace.getEnclosure().then(function(e) {
77-
console.log('aframe-altspace-component autoscaling scene by', e.pixelsPerMeter);
7881
scene.scale.multiplyScalar(e.pixelsPerMeter);
7982
});
8083
}
81-
var renderer = this.el.renderer = altspace.getThreeJSRenderer({version: '0.2.0'});
84+
var renderer = this.el.renderer = altspace.getThreeJSRenderer();
8285
var noop = function() {};
8386
renderer.setSize = noop;
8487
renderer.setPixelRatio = noop;

‎dist/aframe-altspace-component.min.js

+1-1
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎examples/basic/index.html

+2-2
Original file line numberDiff line numberDiff line change
@@ -4,8 +4,8 @@
44
<script src="../build.js"></script>
55
</head>
66
<body>
7-
<a-scene altspace="autoscale: true">
8-
<a-assets></a-assets>
7+
<a-scene altspace>
8+
<!-- cube size will be 1 meter in AltspaceVR -->
99
<a-entity geometry="primitive: box" material="color: #C03546"></a-entity>
1010
</a-scene>
1111
</body>

‎examples/index.html

+2
Original file line numberDiff line numberDiff line change
@@ -23,6 +23,8 @@
2323
<body>
2424
<h1>A-Frame aframe-altspace-component Component</h1>
2525
<a href="basic/index.html">Basic</a>
26+
<a href="test-meter-scale/index.html">Meter Scale</a>
27+
<a href="test-pixel-scale/index.html">Pixel Scale</a>
2628

2729
<div class="github-fork-ribbon-wrapper right">
2830
<div class="github-fork-ribbon" style="background: #3482AA">

‎examples/test-meter-scale/index.html

+12
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
<html>
2+
<head>
3+
<title>A-Frame Altspace Component - Test Meter Scale</title>
4+
<script src="../build.js"></script>
5+
</head>
6+
<body>
7+
<a-scene altspace="usePixelScale: false" scale="2 2 2">
8+
<!-- cube size will be 2 meters in AltspaceVR -->
9+
<a-entity geometry="primitive: box" material="color: #C03546"></a-entity>
10+
</a-scene>
11+
</body>
12+
</html>

‎examples/test-pixel-scale/index.html

+12
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
<html>
2+
<head>
3+
<title>A-Frame Altspace Component - Test Pixel Scale</title>
4+
<script src="../build.js"></script>
5+
</head>
6+
<body>
7+
<a-scene altspace="usePixelScale: true" scale="50 50 50">
8+
<!-- cube size will be 50 pixels in AltspaceVR -->
9+
<a-entity geometry="primitive: box" material="color: #C03546"></a-entity>
10+
</a-scene>
11+
</body>
12+
</html>

‎index.js

+7-4
Original file line numberDiff line numberDiff line change
@@ -6,8 +6,12 @@ if (typeof AFRAME === 'undefined') {
66
* aframe-altspace-component component for A-Frame.
77
*/
88
AFRAME.registerComponent('altspace', {
9+
10+
/**
11+
* usePixelScale will allow you to use A-Frame units as CSS pixels. This is the default behavior for three.js apps, but not for A-Frame apps.
12+
*/
913
schema: {
10-
autoscale: { type: 'boolean', default: 'true' }
14+
usePixelScale: { type: 'boolean', default: 'false'}
1115
},
1216

1317
/**
@@ -26,13 +30,12 @@ AFRAME.registerComponent('altspace', {
2630
}
2731
if (window.altspace && window.altspace.inClient) {
2832
var scene = this.el.object3D;
29-
if (this.data.autoscale) {
33+
if (!this.data.usePixelScale) {
3034
altspace.getEnclosure().then(function(e) {
31-
console.log('aframe-altspace-component autoscaling scene by', e.pixelsPerMeter);
3235
scene.scale.multiplyScalar(e.pixelsPerMeter);
3336
});
3437
}
35-
var renderer = this.el.renderer = altspace.getThreeJSRenderer({version: '0.2.0'});
38+
var renderer = this.el.renderer = altspace.getThreeJSRenderer();
3639
var noop = function() {};
3740
renderer.setSize = noop;
3841
renderer.setPixelRatio = noop;

‎package.json

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "aframe-altspace-component",
3-
"version": "0.1.0",
3+
"version": "0.2.0",
44
"description": "aframe-altspace-component component for A-Frame.",
55
"main": "index.js",
66
"scripts": {

0 commit comments

Comments
 (0)