diff --git a/README.md b/README.md index 9cb9755..74ad056 100644 --- a/README.md +++ b/README.md @@ -13,6 +13,7 @@ Note that when running in Altspace, the scene will not be synchronized between u | `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` | `verticalAlign` | Puts the scene origin at the bottom, middle, or top of the Altspace enclosure. If your scene seems to be floating in midair, try setting this to 'bottom'. | `middle` | `enclosuresOnly` | Turn off 3d rendering when loaded in flat displays (e.g. personal browsers) | `true` +| `fullspace` | Request that the app take up the entire space. See [requestFullspace()](http://altspacevr.github.io/AltspaceSDK/doc/module-altspace-Enclosure.html#requestFullspace) | `false` ### Usage @@ -50,3 +51,19 @@ Add the "altspace-tracked-controls" attribute to your tracked entity. For exampl ```html ``` + +## altspace-cursor-collider + +Cause the attached object to be clickable, or else ignored by the cursor. + +### Properties + +| Property | Description | Default Value | +| -------- | ----------- | ------------- | +| `enabled` | Sets the object visibility to the cursor. | `true` + +### Example + +```html + +``` \ No newline at end of file diff --git a/dist/aframe-altspace-component.js b/dist/aframe-altspace-component.js index d577e66..66033ed 100644 --- a/dist/aframe-altspace-component.js +++ b/dist/aframe-altspace-component.js @@ -62,7 +62,8 @@ schema: { usePixelScale: { type: 'boolean', default: 'false'}, verticalAlign: { type: 'string', default: 'middle'}, - enclosuresOnly:{ type: 'boolean', default: 'true'} + enclosuresOnly:{ type: 'boolean', default: 'true'}, + fullspace: { type: 'boolean', default: 'false'} }, /** @@ -124,6 +125,10 @@ var scene = this.el.object3D; altspace.getEnclosure().then(function(e) { + if(this.data.fullspace){ + e.requestFullspace(); + } + if (!this.data.usePixelScale){ scene.scale.multiplyScalar(e.pixelsPerMeter); } @@ -250,6 +255,33 @@ } }); + (function(){ + + function setColliderFlag(obj, state) { + obj.userData.altspace = {collider: {enabled: state}}; + obj.traverse(function (obj) { + if (obj instanceof THREE.Mesh) { + obj.userData.altspace = {collider: {enabled: state}}; + } + }) + } + + AFRAME.registerComponent('altspace-cursor-collider', { + schema: { enabled: { default: true } }, + init: function () { + setColliderFlag(this.el.object3D, this.data.enabled); + this.el.addEventListener('model-loaded', (function(){ + setColliderFlag(this.el.object3D, this.data.enabled); + }).bind(this)); + }, + update: function () { + setColliderFlag(this.el.object3D, this.data.enabled); + } + }); + + })(); + + /***/ } /******/ ]); \ No newline at end of file diff --git a/dist/aframe-altspace-component.min.js b/dist/aframe-altspace-component.min.js index bef3d03..b3949c7 100644 --- a/dist/aframe-altspace-component.min.js +++ b/dist/aframe-altspace-component.min.js @@ -1 +1 @@ -!function(e){function t(n){if(a[n])return a[n].exports;var r=a[n]={exports:{},id:n,loaded:!1};return e[n].call(r.exports,r,r.exports,t),r.loaded=!0,r.exports}var a={};return t.m=e,t.c=a,t.p="",t(0)}([function(e,t){if("undefined"==typeof AFRAME)throw new Error("Component attempted to register before AFRAME was available.");AFRAME.registerComponent("altspace",{schema:{usePixelScale:{type:"boolean","default":"false"},verticalAlign:{type:"string","default":"middle"},enclosuresOnly:{type:"boolean","default":"true"}},init:function(){return this.el.object3D instanceof THREE.Scene?void(window.altspace&&window.altspace.inClient&&(this.el.setAttribute("vr-mode-ui",{enabled:!1}),this.initRenderer(),this.initCursorEvents())):void console.warn("aframe-altspace-component can only be attached to a-scene")},update:function(e){},remove:function(){},pause:function(){},play:function(){},initRenderer:function(){var e=this.el.object3D;altspace.getEnclosure().then(function(a){switch(this.data.usePixelScale||e.scale.multiplyScalar(a.pixelsPerMeter),this.data.verticalAlign){case"bottom":e.position.y-=a.innerHeight/2;break;case"top":e.position.y+=a.innerHeight/2;break;case"middle":break;default:console.warn("Unexpected value for verticalAlign: ",this.data.verticalAlign)}this.data.enclosuresOnly&&1===a.innerDepth&&(this.el.renderer.render(new THREE.Scene),this.el.renderer=this.el.effect=t)}.bind(this));var t=this.el.renderer,a=this.el.renderer=this.el.effect=altspace.getThreeJSRenderer(),n=function(){};a.setSize=n,a.setPixelRatio=n,a.setClearColor=n,a.clear=n,a.enableScissorTest=n,a.setScissor=n,a.setViewport=n,a.getPixelRatio=n,a.getMaxAnisotropy=n,a.setFaceCulling=n,a.context={canvas:{}},a.shadowMap={}},initCursorEvents:function(){var e=this.el.object3D,t=document.querySelector("a-cursor")||document.querySelector("a-entity[cursor]");t&&(t.setAttribute("material","transparent",!0),t.setAttribute("material","opacity",0));var a=function(e,a){t&&t.emit(e,{target:a}),a&&a.emit(e,{target:a})},n=null;e.addEventListener("cursordown",function(e){n=e.target,a("mousedown",e.target.el)}),e.addEventListener("cursorup",function(e){a("mouseup",e.target.el),e.target.uuid===n.uuid&&a("click",e.target.el),n=null}),e.addEventListener("cursorenter",function(e){e.target.el&&(e.target.el.addState("hovered"),t&&t.addState("hovering"),a("mouseenter",e.target.el))}),e.addEventListener("cursorleave",function(e){e.target.el&&(e.target.el.removeState("hovered"),t&&t.removeState("hovering"),a("mouseleave",e.target.el))})}}),AFRAME.registerComponent("altspace-tracked-controls",{init:function(){this.gamepadIndex=null,this.trackedControlsSystem=document.querySelector("a-scene").systems["tracked-controls"],this.systemGamepads=0,altspace.getGamepads()},tick:function(){if(this.trackedControlsSystem&&this.systemGamepads!==this.trackedControlsSystem.controllers.length&&window.altspace&&altspace.getGamepads&&altspace.getGamepads().length){var e=this.el.components;e["paint-controls"]&&(this.gamepadIndex="left"===e["paint-controls"].data.hand?2:1),null===this.gamepadIndex&&e["hand-controls"]&&(this.gamepadIndex="left"===e["hand-controls"].data?2:1),null===this.gamepadIndex&&e["vive-controls"]&&(this.gamepadIndex="left"===e["vive-controls"].data.hand?2:1),null===this.gamepadIndex&&e["tracked-controls"]&&(this.gamepadIndex=e["tracked-controls"].data.controller),this.el.setAttribute("tracked-controls","id",altspace.getGamepads()[this.gamepadIndex].id),this.el.setAttribute("tracked-controls","controller",0),this.systemGamepads=this.trackedControlsSystem.controllers.length}}})}]); \ No newline at end of file +!function(e){function t(n){if(a[n])return a[n].exports;var r=a[n]={exports:{},id:n,loaded:!1};return e[n].call(r.exports,r,r.exports,t),r.loaded=!0,r.exports}var a={};return t.m=e,t.c=a,t.p="",t(0)}([function(e,t){if("undefined"==typeof AFRAME)throw new Error("Component attempted to register before AFRAME was available.");AFRAME.registerComponent("altspace",{schema:{usePixelScale:{type:"boolean","default":"false"},verticalAlign:{type:"string","default":"middle"},enclosuresOnly:{type:"boolean","default":"true"},fullspace:{type:"boolean","default":"false"}},init:function(){return this.el.object3D instanceof THREE.Scene?void(window.altspace&&window.altspace.inClient&&(this.el.setAttribute("vr-mode-ui",{enabled:!1}),this.initRenderer(),this.initCursorEvents())):void console.warn("aframe-altspace-component can only be attached to a-scene")},update:function(e){},remove:function(){},pause:function(){},play:function(){},initRenderer:function(){var e=this.el.object3D;altspace.getEnclosure().then(function(a){switch(this.data.fullspace&&a.requestFullspace(),this.data.usePixelScale||e.scale.multiplyScalar(a.pixelsPerMeter),this.data.verticalAlign){case"bottom":e.position.y-=a.innerHeight/2;break;case"top":e.position.y+=a.innerHeight/2;break;case"middle":break;default:console.warn("Unexpected value for verticalAlign: ",this.data.verticalAlign)}this.data.enclosuresOnly&&1===a.innerDepth&&(this.el.renderer.render(new THREE.Scene),this.el.renderer=this.el.effect=t)}.bind(this));var t=this.el.renderer,a=this.el.renderer=this.el.effect=altspace.getThreeJSRenderer(),n=function(){};a.setSize=n,a.setPixelRatio=n,a.setClearColor=n,a.clear=n,a.enableScissorTest=n,a.setScissor=n,a.setViewport=n,a.getPixelRatio=n,a.getMaxAnisotropy=n,a.setFaceCulling=n,a.context={canvas:{}},a.shadowMap={}},initCursorEvents:function(){var e=this.el.object3D,t=document.querySelector("a-cursor")||document.querySelector("a-entity[cursor]");t&&(t.setAttribute("material","transparent",!0),t.setAttribute("material","opacity",0));var a=function(e,a){t&&t.emit(e,{target:a}),a&&a.emit(e,{target:a})},n=null;e.addEventListener("cursordown",function(e){n=e.target,a("mousedown",e.target.el)}),e.addEventListener("cursorup",function(e){a("mouseup",e.target.el),e.target.uuid===n.uuid&&a("click",e.target.el),n=null}),e.addEventListener("cursorenter",function(e){e.target.el&&(e.target.el.addState("hovered"),t&&t.addState("hovering"),a("mouseenter",e.target.el))}),e.addEventListener("cursorleave",function(e){e.target.el&&(e.target.el.removeState("hovered"),t&&t.removeState("hovering"),a("mouseleave",e.target.el))})}}),AFRAME.registerComponent("altspace-tracked-controls",{init:function(){this.gamepadIndex=null,this.trackedControlsSystem=document.querySelector("a-scene").systems["tracked-controls"],this.systemGamepads=0,altspace.getGamepads()},tick:function(){if(this.trackedControlsSystem&&this.systemGamepads!==this.trackedControlsSystem.controllers.length&&window.altspace&&altspace.getGamepads&&altspace.getGamepads().length){var e=this.el.components;e["paint-controls"]&&(this.gamepadIndex="left"===e["paint-controls"].data.hand?2:1),null===this.gamepadIndex&&e["hand-controls"]&&(this.gamepadIndex="left"===e["hand-controls"].data?2:1),null===this.gamepadIndex&&e["vive-controls"]&&(this.gamepadIndex="left"===e["vive-controls"].data.hand?2:1),null===this.gamepadIndex&&e["tracked-controls"]&&(this.gamepadIndex=e["tracked-controls"].data.controller),this.el.setAttribute("tracked-controls","id",altspace.getGamepads()[this.gamepadIndex].id),this.el.setAttribute("tracked-controls","controller",0),this.systemGamepads=this.trackedControlsSystem.controllers.length}}}),function(){function e(e,t){e.userData.altspace={collider:{enabled:t}},e.traverse(function(e){e instanceof THREE.Mesh&&(e.userData.altspace={collider:{enabled:t}})})}AFRAME.registerComponent("altspace-cursor-collider",{schema:{enabled:{"default":!0}},init:function(){e(this.el.object3D,this.data.enabled),this.el.addEventListener("model-loaded",function(){e(this.el.object3D,this.data.enabled)}.bind(this))},update:function(){e(this.el.object3D,this.data.enabled)}})}()}]); \ No newline at end of file diff --git a/examples/test-fullspace/index.html b/examples/test-fullspace/index.html new file mode 100644 index 0000000..18bf1e9 --- /dev/null +++ b/examples/test-fullspace/index.html @@ -0,0 +1,12 @@ + + + A-Frame Altspace Component - Basic + + + + + + + + + diff --git a/index.js b/index.js index 78c4595..b6cd51d 100644 --- a/index.js +++ b/index.js @@ -16,7 +16,8 @@ AFRAME.registerComponent('altspace', { schema: { usePixelScale: { type: 'boolean', default: 'false'}, verticalAlign: { type: 'string', default: 'middle'}, - enclosuresOnly:{ type: 'boolean', default: 'true'} + enclosuresOnly:{ type: 'boolean', default: 'true'}, + fullspace: { type: 'boolean', default: 'false'} }, /** @@ -78,6 +79,10 @@ AFRAME.registerComponent('altspace', { var scene = this.el.object3D; altspace.getEnclosure().then(function(e) { + if(this.data.fullspace){ + e.requestFullspace(); + } + if (!this.data.usePixelScale){ scene.scale.multiplyScalar(e.pixelsPerMeter); } @@ -203,3 +208,30 @@ AFRAME.registerComponent('altspace-tracked-controls', { } } }); + +(function(){ + + function setColliderFlag(obj, state) { + obj.userData.altspace = {collider: {enabled: state}}; + obj.traverse(function (obj) { + if (obj instanceof THREE.Mesh) { + obj.userData.altspace = {collider: {enabled: state}}; + } + }) + } + + AFRAME.registerComponent('altspace-cursor-collider', { + schema: { enabled: { default: true } }, + init: function () { + setColliderFlag(this.el.object3D, this.data.enabled); + this.el.addEventListener('model-loaded', (function(){ + setColliderFlag(this.el.object3D, this.data.enabled); + }).bind(this)); + }, + update: function () { + setColliderFlag(this.el.object3D, this.data.enabled); + } + }); + +})(); +