Skip to content

Commit 4f320ec

Browse files
3DataWill3DataWill
committed
network aframe integration in grabbable and stretchable
1 parent ad8cde1 commit 4f320ec

File tree

9 files changed

+168
-37
lines changed

9 files changed

+168
-37
lines changed

‎dist/super-hands.js‎

Lines changed: 34 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -504,7 +504,7 @@ AFRAME.registerComponent('super-hands', {
504504
}
505505
});
506506

507-
},{"./misc_components/locomotor-auto-config.js":2,"./misc_components/progressive-controls.js":3,"./primitives/a-locomotor.js":4,"./reaction_components/clickable.js":5,"./reaction_components/drag-droppable.js":6,"./reaction_components/draggable.js":7,"./reaction_components/droppable.js":8,"./reaction_components/grabbable.js":9,"./reaction_components/hoverable.js":10,"./reaction_components/stretchable.js":13,"./systems/super-hands-system.js":14}],2:[function(require,module,exports){
507+
},{"./misc_components/locomotor-auto-config.js":2,"./misc_components/progressive-controls.js":3,"./primitives/a-locomotor.js":4,"./reaction_components/clickable.js":5,"./reaction_components/drag-droppable.js":6,"./reaction_components/draggable.js":7,"./reaction_components/droppable.js":8,"./reaction_components/grabbable.js":9,"./reaction_components/hoverable.js":10,"./reaction_components/stretchable.js":14,"./systems/super-hands-system.js":15}],2:[function(require,module,exports){
508508
'use strict';
509509

510510
/* global AFRAME */
@@ -1100,7 +1100,10 @@ AFRAME.registerComponent('droppable', {
11001100
const inherit = AFRAME.utils.extendDeep;
11011101
const physicsCore = require('./prototypes/physics-grab-proto.js');
11021102
const buttonsCore = require('./prototypes/buttons-proto.js');
1103-
AFRAME.registerComponent('grabbable', inherit({}, physicsCore, buttonsCore, {
1103+
const networkedCore = require('./prototypes/networked-proto.js');
1104+
// new object with all core modules
1105+
const base = inherit({}, physicsCore, buttonsCore, networkedCore);
1106+
AFRAME.registerComponent('grabbable', inherit(base, {
11041107
schema: {
11051108
maxGrabbers: { type: 'int', default: NaN },
11061109
invert: { default: false },
@@ -1165,7 +1168,7 @@ AFRAME.registerComponent('grabbable', inherit({}, physicsCore, buttonsCore, {
11651168
// room for more grabbers?
11661169
const grabAvailable = !Number.isFinite(this.data.maxGrabbers) || this.grabbers.length < this.data.maxGrabbers;
11671170

1168-
if (this.grabbers.indexOf(evt.detail.hand) === -1 && grabAvailable) {
1171+
if (this.grabbers.indexOf(evt.detail.hand) === -1 && grabAvailable && this.networkedOk()) {
11691172
if (!evt.detail.hand.object3D) {
11701173
console.warn('grabbable entities must have an object3D');
11711174
return;
@@ -1225,7 +1228,7 @@ AFRAME.registerComponent('grabbable', inherit({}, physicsCore, buttonsCore, {
12251228
}
12261229
}));
12271230

1228-
},{"./prototypes/buttons-proto.js":11,"./prototypes/physics-grab-proto.js":12}],10:[function(require,module,exports){
1231+
},{"./prototypes/buttons-proto.js":11,"./prototypes/networked-proto.js":12,"./prototypes/physics-grab-proto.js":13}],10:[function(require,module,exports){
12291232
'use strict';
12301233

12311234
/* global AFRAME */
@@ -1296,6 +1299,25 @@ module.exports = function () {
12961299
}();
12971300

12981301
},{}],12:[function(require,module,exports){
1302+
"use strict";
1303+
1304+
// integration with networked-aframe
1305+
module.exports = {
1306+
schema: {
1307+
takeOwnership: { default: false }
1308+
},
1309+
networkedOk: function () {
1310+
if (!window.NAF || window.NAF.utils.isMine(this.el)) {
1311+
return true;
1312+
}
1313+
if (this.data.takeOwnership) {
1314+
return window.NAF.utils.takeOwnership(this.el);
1315+
}
1316+
return false;
1317+
}
1318+
};
1319+
1320+
},{}],13:[function(require,module,exports){
12991321
'use strict';
13001322

13011323
// base code used by grabbable for physics interactions
@@ -1353,13 +1375,16 @@ module.exports = {
13531375
}
13541376
};
13551377

1356-
},{}],13:[function(require,module,exports){
1378+
},{}],14:[function(require,module,exports){
13571379
'use strict';
13581380

13591381
/* global AFRAME, THREE */
13601382
const inherit = AFRAME.utils.extendDeep;
1361-
const buttonCore = require('./prototypes/buttons-proto.js');
1362-
AFRAME.registerComponent('stretchable', inherit({}, buttonCore, {
1383+
const buttonsCore = require('./prototypes/buttons-proto.js');
1384+
const networkedCore = require('./prototypes/networked-proto.js');
1385+
// new object with all core modules
1386+
const base = inherit({}, buttonsCore, networkedCore);
1387+
AFRAME.registerComponent('stretchable', inherit(base, {
13631388
schema: {
13641389
usePhysics: { default: 'ifavailable' },
13651390
invert: { default: false },
@@ -1412,7 +1437,7 @@ AFRAME.registerComponent('stretchable', inherit({}, buttonCore, {
14121437
this.el.removeEventListener(this.UNSTRETCH_EVENT, this.end);
14131438
},
14141439
start: function (evt) {
1415-
if (this.stretched || this.stretchers.includes(evt.detail.hand) || !this.startButtonOk(evt) || evt.defaultPrevented) {
1440+
if (this.stretched || this.stretchers.includes(evt.detail.hand) || !this.startButtonOk(evt) || evt.defaultPrevented || !this.networkedOk()) {
14161441
return;
14171442
} // already stretched or already captured this hand or wrong button
14181443
this.stretchers.push(evt.detail.hand);
@@ -1486,7 +1511,7 @@ AFRAME.registerComponent('stretchable', inherit({}, buttonCore, {
14861511
}
14871512
}));
14881513

1489-
},{"./prototypes/buttons-proto.js":11}],14:[function(require,module,exports){
1514+
},{"./prototypes/buttons-proto.js":11,"./prototypes/networked-proto.js":12}],15:[function(require,module,exports){
14901515
'use strict';
14911516

14921517
/* global AFRAME */

‎dist/super-hands.min.js‎

Lines changed: 9 additions & 6 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎examples/build.js‎

Lines changed: 41 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
(function e(t,n,r){function s(o,u){if(!n[o]){if(!t[o]){var a=typeof require=="function"&&require;if(!u&&a)return a(o,!0);if(i)return i(o,!0);var f=new Error("Cannot find module '"+o+"'");throw f.code="MODULE_NOT_FOUND",f}var l=n[o]={exports:{}};t[o][0].call(l.exports,function(e){var n=t[o][1][e];return s(n?n:e)},l,l.exports,e,t,n,r)}return n[o].exports}var i=typeof require=="function"&&require;for(var o=0;o<r.length;o++)s(r[o]);return s})({1:[function(require,module,exports){
1+
(function(){function e(t,n,r){function s(o,u){if(!n[o]){if(!t[o]){var a=typeof require=="function"&&require;if(!u&&a)return a(o,!0);if(i)return i(o,!0);var f=new Error("Cannot find module '"+o+"'");throw f.code="MODULE_NOT_FOUND",f}var l=n[o]={exports:{}};t[o][0].call(l.exports,function(e){var n=t[o][1][e];return s(n?n:e)},l,l.exports,e,t,n,r)}return n[o].exports}var i=typeof require=="function"&&require;for(var o=0;o<r.length;o++)s(r[o]);return s}return e})()({1:[function(require,module,exports){
22
'use strict';
33

44
require('../index.js');
@@ -213,9 +213,9 @@ AFRAME.registerComponent('super-hands', {
213213
},
214214
onStretchEndButton: function (evt) {
215215
const stretched = this.state.get(this.STRETCH_EVENT);
216-
const endEvt = { hand: this.el, buttonEvent: evt };
217-
// check if end event accepted
218-
if (stretched && !this.emitCancelable(stretched, this.UNSTRETCH_EVENT, endEvt)) {
216+
const endEvt = { hand: this.el, buttonEvent: evt
217+
// check if end event accepted
218+
};if (stretched && !this.emitCancelable(stretched, this.UNSTRETCH_EVENT, endEvt)) {
219219
this.promoteHoveredEl(stretched);
220220
this.state.delete(this.STRETCH_EVENT);
221221
this.hover();
@@ -531,7 +531,7 @@ AFRAME.registerComponent('super-hands', {
531531
}
532532
});
533533

534-
},{"./misc_components/locomotor-auto-config.js":3,"./misc_components/progressive-controls.js":4,"./primitives/a-locomotor.js":14,"./reaction_components/clickable.js":15,"./reaction_components/drag-droppable.js":16,"./reaction_components/draggable.js":17,"./reaction_components/droppable.js":18,"./reaction_components/grabbable.js":19,"./reaction_components/hoverable.js":20,"./reaction_components/stretchable.js":23,"./systems/super-hands-system.js":24}],3:[function(require,module,exports){
534+
},{"./misc_components/locomotor-auto-config.js":3,"./misc_components/progressive-controls.js":4,"./primitives/a-locomotor.js":14,"./reaction_components/clickable.js":15,"./reaction_components/drag-droppable.js":16,"./reaction_components/draggable.js":17,"./reaction_components/droppable.js":18,"./reaction_components/grabbable.js":19,"./reaction_components/hoverable.js":20,"./reaction_components/stretchable.js":24,"./systems/super-hands-system.js":25}],3:[function(require,module,exports){
535535
'use strict';
536536

537537
/* global AFRAME */
@@ -2551,7 +2551,10 @@ AFRAME.registerComponent('droppable', {
25512551
const inherit = AFRAME.utils.extendDeep;
25522552
const physicsCore = require('./prototypes/physics-grab-proto.js');
25532553
const buttonsCore = require('./prototypes/buttons-proto.js');
2554-
AFRAME.registerComponent('grabbable', inherit({}, physicsCore, buttonsCore, {
2554+
const networkedCore = require('./prototypes/networked-proto.js');
2555+
// new object with all core modules
2556+
const base = inherit({}, physicsCore, buttonsCore, networkedCore);
2557+
AFRAME.registerComponent('grabbable', inherit(base, {
25552558
schema: {
25562559
maxGrabbers: { type: 'int', default: NaN },
25572560
invert: { default: false },
@@ -2567,9 +2570,9 @@ AFRAME.registerComponent('grabbable', inherit({}, physicsCore, buttonsCore, {
25672570
this.deltaPositionIsValid = false;
25682571
this.grabDistance = undefined;
25692572
this.grabDirection = { x: 0, y: 0, z: -1 };
2570-
this.grabOffset = { x: 0, y: 0, z: 0 };
2571-
// persistent object speeds up repeat setAttribute calls
2572-
this.destPosition = { x: 0, y: 0, z: 0 };
2573+
this.grabOffset = { x: 0, y: 0, z: 0
2574+
// persistent object speeds up repeat setAttribute calls
2575+
};this.destPosition = { x: 0, y: 0, z: 0 };
25732576
this.deltaPosition = new THREE.Vector3();
25742577
this.targetPosition = new THREE.Vector3();
25752578
this.physicsInit();
@@ -2616,7 +2619,7 @@ AFRAME.registerComponent('grabbable', inherit({}, physicsCore, buttonsCore, {
26162619
// room for more grabbers?
26172620
const grabAvailable = !Number.isFinite(this.data.maxGrabbers) || this.grabbers.length < this.data.maxGrabbers;
26182621

2619-
if (this.grabbers.indexOf(evt.detail.hand) === -1 && grabAvailable) {
2622+
if (this.grabbers.indexOf(evt.detail.hand) === -1 && grabAvailable && this.networkedOk()) {
26202623
if (!evt.detail.hand.object3D) {
26212624
console.warn('grabbable entities must have an object3D');
26222625
return;
@@ -2676,7 +2679,7 @@ AFRAME.registerComponent('grabbable', inherit({}, physicsCore, buttonsCore, {
26762679
}
26772680
}));
26782681

2679-
},{"./prototypes/buttons-proto.js":21,"./prototypes/physics-grab-proto.js":22}],20:[function(require,module,exports){
2682+
},{"./prototypes/buttons-proto.js":21,"./prototypes/networked-proto.js":22,"./prototypes/physics-grab-proto.js":23}],20:[function(require,module,exports){
26802683
'use strict';
26812684

26822685
/* global AFRAME */
@@ -2747,6 +2750,25 @@ module.exports = function () {
27472750
}();
27482751

27492752
},{}],22:[function(require,module,exports){
2753+
"use strict";
2754+
2755+
// integration with networked-aframe
2756+
module.exports = {
2757+
schema: {
2758+
takeOwnership: { default: false }
2759+
},
2760+
networkedOk: function () {
2761+
if (!window.NAF || window.NAF.utils.isMine(this.el)) {
2762+
return true;
2763+
}
2764+
if (this.data.takeOwnership) {
2765+
return window.NAF.utils.takeOwnership(this.el);
2766+
}
2767+
return false;
2768+
}
2769+
};
2770+
2771+
},{}],23:[function(require,module,exports){
27502772
'use strict';
27512773

27522774
// base code used by grabbable for physics interactions
@@ -2804,13 +2826,16 @@ module.exports = {
28042826
}
28052827
};
28062828

2807-
},{}],23:[function(require,module,exports){
2829+
},{}],24:[function(require,module,exports){
28082830
'use strict';
28092831

28102832
/* global AFRAME, THREE */
28112833
const inherit = AFRAME.utils.extendDeep;
2812-
const buttonCore = require('./prototypes/buttons-proto.js');
2813-
AFRAME.registerComponent('stretchable', inherit({}, buttonCore, {
2834+
const buttonsCore = require('./prototypes/buttons-proto.js');
2835+
const networkedCore = require('./prototypes/networked-proto.js');
2836+
// new object with all core modules
2837+
const base = inherit({}, buttonsCore, networkedCore);
2838+
AFRAME.registerComponent('stretchable', inherit(base, {
28142839
schema: {
28152840
usePhysics: { default: 'ifavailable' },
28162841
invert: { default: false },
@@ -2863,7 +2888,7 @@ AFRAME.registerComponent('stretchable', inherit({}, buttonCore, {
28632888
this.el.removeEventListener(this.UNSTRETCH_EVENT, this.end);
28642889
},
28652890
start: function (evt) {
2866-
if (this.stretched || this.stretchers.includes(evt.detail.hand) || !this.startButtonOk(evt) || evt.defaultPrevented) {
2891+
if (this.stretched || this.stretchers.includes(evt.detail.hand) || !this.startButtonOk(evt) || evt.defaultPrevented || !this.networkedOk()) {
28672892
return;
28682893
} // already stretched or already captured this hand or wrong button
28692894
this.stretchers.push(evt.detail.hand);
@@ -2937,7 +2962,7 @@ AFRAME.registerComponent('stretchable', inherit({}, buttonCore, {
29372962
}
29382963
}));
29392964

2940-
},{"./prototypes/buttons-proto.js":21}],24:[function(require,module,exports){
2965+
},{"./prototypes/buttons-proto.js":21,"./prototypes/networked-proto.js":22}],25:[function(require,module,exports){
29412966
'use strict';
29422967

29432968
/* global AFRAME */

‎reaction_components/grabbable.js‎

Lines changed: 9 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,10 @@
22
const inherit = AFRAME.utils.extendDeep
33
const physicsCore = require('./prototypes/physics-grab-proto.js')
44
const buttonsCore = require('./prototypes/buttons-proto.js')
5-
AFRAME.registerComponent('grabbable', inherit({}, physicsCore, buttonsCore, {
5+
const networkedCore = require('./prototypes/networked-proto.js')
6+
// new object with all core modules
7+
const base = inherit({}, physicsCore, buttonsCore, networkedCore)
8+
AFRAME.registerComponent('grabbable', inherit(base, {
69
schema: {
710
maxGrabbers: {type: 'int', default: NaN},
811
invert: {default: false},
@@ -68,12 +71,15 @@ AFRAME.registerComponent('grabbable', inherit({}, physicsCore, buttonsCore, {
6871
this.physicsRemove()
6972
},
7073
start: function (evt) {
71-
if (evt.defaultPrevented || !this.startButtonOk(evt)) { return }
74+
if (evt.defaultPrevented || !this.startButtonOk(evt)) {
75+
return
76+
}
7277
// room for more grabbers?
7378
const grabAvailable = !Number.isFinite(this.data.maxGrabbers) ||
7479
this.grabbers.length < this.data.maxGrabbers
7580

76-
if (this.grabbers.indexOf(evt.detail.hand) === -1 && grabAvailable) {
81+
if (this.grabbers.indexOf(evt.detail.hand) === -1 && grabAvailable &&
82+
this.networkedOk()) {
7783
if (!evt.detail.hand.object3D) {
7884
console.warn('grabbable entities must have an object3D')
7985
return

‎reaction_components/prototypes/networked-proto.js‎

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
// integration with networked-aframe
2+
module.exports = {
3+
schema: {
4+
takeOwnership: {default: false}
5+
},
6+
networkedOk: function () {
7+
if (!window.NAF || window.NAF.utils.isMine(this.el)) {
8+
return true
9+
}
10+
if (this.data.takeOwnership) {
11+
return window.NAF.utils.takeOwnership(this.el)
12+
}
13+
return false
14+
}
15+
}

‎reaction_components/stretchable.js‎

Lines changed: 7 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,10 @@
11
/* global AFRAME, THREE */
22
const inherit = AFRAME.utils.extendDeep
3-
const buttonCore = require('./prototypes/buttons-proto.js')
4-
AFRAME.registerComponent('stretchable', inherit({}, buttonCore, {
3+
const buttonsCore = require('./prototypes/buttons-proto.js')
4+
const networkedCore = require('./prototypes/networked-proto.js')
5+
// new object with all core modules
6+
const base = inherit({}, buttonsCore, networkedCore)
7+
AFRAME.registerComponent('stretchable', inherit(base, {
58
schema: {
69
usePhysics: {default: 'ifavailable'},
710
invert: {default: false},
@@ -62,7 +65,8 @@ AFRAME.registerComponent('stretchable', inherit({}, buttonCore, {
6265
},
6366
start: function (evt) {
6467
if (this.stretched || this.stretchers.includes(evt.detail.hand) ||
65-
!this.startButtonOk(evt) || evt.defaultPrevented) {
68+
!this.startButtonOk(evt) || evt.defaultPrevented ||
69+
!this.networkedOk()) {
6670
return
6771
} // already stretched or already captured this hand or wrong button
6872
this.stretchers.push(evt.detail.hand)

‎tests/__init.test.js‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -33,4 +33,5 @@ teardown(function () {
3333
els[i].parentNode.removeChild(els[i])
3434
}
3535
this.sinon.restore()
36+
delete window.NAF
3637
})

‎tests/reaction-components/grabbable.test.js‎

Lines changed: 30 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -272,4 +272,34 @@ suite('grabbable', function () {
272272
assert.isNotOk(this.el.is(this.comp.GRABBED_STATE))
273273
})
274274
})
275+
suite('networked aframe awareness', function () {
276+
setup(function (done) {
277+
window.NAF = {
278+
utils: {
279+
isMine: this.sinon.stub().returns(false),
280+
takeOwnership: this.sinon.stub().returns(true)
281+
}
282+
}
283+
var el = this.el = entityFactory()
284+
el.setAttribute('grabbable', '')
285+
this.hand = helpers.controllerFactory()
286+
el.sceneEl.addEventListener('loaded', () => {
287+
this.comp = el.components.grabbable
288+
done()
289+
})
290+
})
291+
test('No grab if remote and ownership transfer not enabled', function () {
292+
this.el.setAttribute('grabbable', {takeOwnership: false})
293+
this.comp.start({detail: {hand: this.hand}})
294+
assert.isFalse(this.comp.grabbed)
295+
assert.isFalse(this.el.is(this.comp.GRABBED_STATE))
296+
assert.isFalse(window.NAF.utils.takeOwnership.called)
297+
})
298+
test('Ownership transfer requested when enabled', function () {
299+
this.el.setAttribute('grabbable', {takeOwnership: true})
300+
this.comp.start({detail: {hand: this.hand}})
301+
assert.isTrue(this.comp.grabbed)
302+
assert.isTrue(window.NAF.utils.takeOwnership.called)
303+
})
304+
})
275305
})

‎tests/reaction-components/stretchable.test.js‎

Lines changed: 22 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -96,6 +96,28 @@ suite('stretchable', function () {
9696
this.comp.tick()
9797
assert.strictEqual(uncoord(this.el.getAttribute('scale')), uncoord(lastScale))
9898
})
99+
suite('networked aframe awareness', function () {
100+
setup(function () {
101+
window.NAF = {
102+
utils: {
103+
isMine: this.sinon.stub().returns(false),
104+
takeOwnership: this.sinon.stub().returns(true)
105+
}
106+
}
107+
})
108+
test('No stretch if remote and ownership transfer not enabled', function () {
109+
this.el.setAttribute('stretchable', {takeOwnership: false})
110+
this.comp.start({detail: {hand: this.hand}})
111+
assert.strictEqual(this.comp.stretchers.length, 0)
112+
assert.isFalse(window.NAF.utils.takeOwnership.called)
113+
})
114+
test('Ownership transfer requested when enabled', function () {
115+
this.el.setAttribute('stretchable', {takeOwnership: true})
116+
this.comp.start({detail: {hand: this.hand}})
117+
assert.strictEqual(this.comp.stretchers.length, 1)
118+
assert.isTrue(window.NAF.utils.takeOwnership.called)
119+
})
120+
})
99121
})
100122

101123
suite('stretchable-physics', function () {

0 commit comments

Comments
 (0)