use aframe-physics-system constraint api for physics grabs (fix #112). Honor usephysics:only in grab (fix #106)

wmurphyrd · wmurphyrd · commit 6ab723ef04ce · 2017-11-19T14:38:42.000-06:00
diff --git a/dist/super-hands.js b/dist/super-hands.js
@@ -1284,17 +1284,23 @@ module.exports = {
   physicsStart: function (evt) {
     // initiate physics constraint if available and not already existing
     if (this.data.usePhysics !== 'never' && this.el.body && evt.detail.hand.body && !this.constraints.has(evt.detail.hand)) {
-      let newCon = new window.CANNON.LockConstraint(this.el.body, evt.detail.hand.body);
-      this.el.body.world.addConstraint(newCon);
-      this.constraints.set(evt.detail.hand, newCon);
+      const newConId = Math.random().toString(36).substr(2, 9);
+      this.el.setAttribute('constraint__' + newConId, {
+        target: evt.detail.hand
+      });
+      this.constraints.set(evt.detail.hand, newConId);
+      return true;
+    }
+    // Prevent manual grab by returning true
+    if (this.data.usePhysics === 'only') {
       return true;
     }
     return false;
   },
   physicsEnd: function (evt) {
-    let constraint = this.constraints.get(evt.detail.hand);
-    if (constraint) {
-      this.el.body.world.removeConstraint(constraint);
+    let constraintId = this.constraints.get(evt.detail.hand);
+    if (constraintId) {
+      this.el.removeAttribute('constraint__' + constraintId);
       this.constraints.delete(evt.detail.hand);
     }
   },
diff --git a/dist/super-hands.min.js b/dist/super-hands.min.js
diff --git a/examples/build.js b/examples/build.js
@@ -2735,17 +2735,23 @@ module.exports = {
   physicsStart: function (evt) {
     // initiate physics constraint if available and not already existing
     if (this.data.usePhysics !== 'never' && this.el.body && evt.detail.hand.body && !this.constraints.has(evt.detail.hand)) {
-      let newCon = new window.CANNON.LockConstraint(this.el.body, evt.detail.hand.body);
-      this.el.body.world.addConstraint(newCon);
-      this.constraints.set(evt.detail.hand, newCon);
+      const newConId = Math.random().toString(36).substr(2, 9);
+      this.el.setAttribute('constraint__' + newConId, {
+        target: evt.detail.hand
+      });
+      this.constraints.set(evt.detail.hand, newConId);
+      return true;
+    }
+    // Prevent manual grab by returning true
+    if (this.data.usePhysics === 'only') {
       return true;
     }
     return false;
   },
   physicsEnd: function (evt) {
-    let constraint = this.constraints.get(evt.detail.hand);
-    if (constraint) {
-      this.el.body.world.removeConstraint(constraint);
+    let constraintId = this.constraints.get(evt.detail.hand);
+    if (constraintId) {
+      this.el.removeAttribute('constraint__' + constraintId);
       this.constraints.delete(evt.detail.hand);
     }
   },
diff --git a/machinima_tests/scenes/physics-worker.html b/machinima_tests/scenes/physics-worker.html
@@ -0,0 +1,34 @@
+<html>
+  <head>
+    <script src="build.js"></script>
+  </head>
+  <body>
+    <a-scene avatar-recorder="spectatorPlay: true; spectatorPosition: 0 1.6 2"
+             physics="driver: worker; gravity: 0">
+      <a-assets>
+        <!-- <img id="grid" src="grid.png"/> -->
+
+        <a-mixin id="controller" super-hands
+                 static-body="shape: sphere; sphereRadius: 0.02;"
+                 sphere-collider="objects: .cube"></a-mixin>
+        <a-mixin id="cube" geometry="primitive: box; width: 0.5; height: 0.5; depth: 0.5"
+                 hoverable grabbable="usePhysics: only" stretchable draggable droppable
+                 dynamic-body
+                 event-set="_event: drag-drop; geometry.primitive: sphere; geometry.radius: 0.25"></a-mixin>
+        <a-mixin id="cube-hovered" material="opacity: 0.7; transparent: true">
+        </a-mixin>
+        <a-mixin id="cube-dragover" material="wireframe: true;"></a-mixin>
+      </a-assets>
+      <a-entity id="lhand" hand-controls="left" mixin="controller"></a-entity>
+      <a-entity id="rhand" hand-controls="right" mixin="controller"></a-entity>
+      <a-entity id="redLow" class="cube" mixin="cube" position="0 1 -1" material="color: red"></a-entity>
+      <a-entity id="redHigh" class="cube" mixin="cube" position="0 1.6 -1" material="color: red"></a-entity>
+      <a-entity id="blueLow" class="cube" mixin="cube" position="-1 1 -1" material="color: blue"></a-entity>
+      <a-entity id="blueHigh" class="cube" mixin="cube" position="-1 1.6 -1" material="color: blue"></a-entity>
+      <a-entity id="greenLow" class="cube" mixin="cube" position="1 1 -1" material="color: green"></a-entity>
+      <a-entity id="greenHigh" class="cube" mixin="cube" position="1 1.6 -1" material="color: green"></a-entity>
+      <a-plane rotation="-90 0 0" color="#888"
+                 width="50" height="50"></a-plane>
+    </a-scene>
+  </body>
+</html>
diff --git a/machinima_tests/super_hands/super-hands-machinima.test.js b/machinima_tests/super_hands/super-hands-machinima.test.js
@@ -1,4 +1,4 @@
-/* global assert, process, setup, suite, test, sinon */
+/* global assert, process, setup, suite, test, sinon, CANNON */
 
 const machinima = require('aframe-machinima-testing')
 
@@ -175,6 +175,31 @@ suite('Physics grab', function () {
   )
 })
 
+suite('Physics worker driver', function () {
+  setup(function (done) {
+    /* inject the scene html into the testing docoument */
+    machinima.setupScene('physics-worker.html')
+    this.scene = document.querySelector('a-scene')
+    this.hand1 = document.getElementById('rhand')
+    this.hand2 = document.getElementById('lhand')
+    this.target = document.getElementById('greenHigh')
+    this.scene.addEventListener('loaded', e => {
+      done()
+    })
+  })
+  machinima.test(
+    'entity affected by grab',
+    'base/recordings/handsRecording.json',
+    function () {
+      const post = new CANNON.Vec3().copy(this.target.getAttribute('position'))
+      assert.isFalse(post.almostEquals(this.pre, 0.01))
+    },
+    function () {
+      this.pre = new CANNON.Vec3().copy(this.target.getAttribute('position'))
+    }
+  )
+})
+
 suite('Locomotion', function () {
   setup(function (done) {
     /* inject the scene html into the testing docoument */
diff --git a/reaction_components/prototypes/physics-grab-proto.js b/reaction_components/prototypes/physics-grab-proto.js
@@ -18,19 +18,21 @@ module.exports = {
     // initiate physics constraint if available and not already existing
     if (this.data.usePhysics !== 'never' && this.el.body &&
         evt.detail.hand.body && !this.constraints.has(evt.detail.hand)) {
-      let newCon = new window.CANNON.LockConstraint(
-        this.el.body, evt.detail.hand.body
-      )
-      this.el.body.world.addConstraint(newCon)
-      this.constraints.set(evt.detail.hand, newCon)
+      const newConId = Math.random().toString(36).substr(2, 9)
+      this.el.setAttribute('constraint__' + newConId, {
+        target: evt.detail.hand
+      })
+      this.constraints.set(evt.detail.hand, newConId)
       return true
     }
+    // Prevent manual grab by returning true
+    if (this.data.usePhysics === 'only') { return true }
     return false
   },
   physicsEnd: function (evt) {
-    let constraint = this.constraints.get(evt.detail.hand)
-    if (constraint) {
-      this.el.body.world.removeConstraint(constraint)
+    let constraintId = this.constraints.get(evt.detail.hand)
+    if (constraintId) {
+      this.el.removeAttribute('constraint__' + constraintId)
       this.constraints.delete(evt.detail.hand)
     }
   },
diff --git a/tests/reaction-components/grabbable.test.js b/tests/reaction-components/grabbable.test.js
@@ -126,10 +126,10 @@ suite('grabbable', function () {
     })
     test('constraint registered on grab', function () {
       this.comp.start({ detail: { hand: this.hand } })
-      let c = this.comp.constraints.get(this.hand)
+      const cId = this.comp.constraints.get(this.hand)
+      let c = this.el.components['constraint__' + cId]
       assert.isOk(c)
-      assert.instanceOf(c, window.CANNON.LockConstraint)
-      assert.notEqual(this.el.body.world.constraints.indexOf(c), -1)
+      assert.strictEqual(c.data.target, this.hand)
     })
     test('constraint not registered when usePhysics = never', function () {
       this.el.setAttribute('grabbable', 'usePhysics', 'never')
diff --git a/tests/super-hands-component/integration.test.js b/tests/super-hands-component/integration.test.js
@@ -434,4 +434,27 @@ suite('super-hands & physics integration', function () {
     assert.isTrue(this.target1.body.shapes[1].halfExtents.almostEquals(check, 0.001), 'scale')
     assert.isTrue(this.target1.body.shapeOffsets[1].almostEquals(check, 0.001), 'offset')
   })
+  test('net physics stretch correct when throttled', function () {
+    const stretch = this.target1.components.stretchable
+    const size2 = new window.CANNON.Vec3(1, 1, 1)
+    const offset2 = new window.CANNON.Vec3(1, 1, 1)
+    const shape2 = new window.CANNON.Box(size2)
+    this.target1.body.addShape(shape2, offset2)
+    this.hand2.setAttribute('position', '1 1 1')
+    stretch.start({detail: {hand: this.hand1}})
+    stretch.start({detail: {hand: this.hand2}})
+    stretch.tick(1, 1)
+    this.hand2.setAttribute('position', '1.5 1 1')
+    stretch.tick(6, 5)
+    const check = new window.CANNON.Vec3(0.5, 0.5, 0.5)
+    assert.isTrue(this.target1.body.shapes[0].halfExtents.almostEquals(check, 0.001), 'throttled')
+    this.hand2.setAttribute('position', '2 1 1')
+    stretch.tick(2006, 2000)
+    check.set(0.707, 0.707, 0.707)
+    assert.isTrue(this.target1.body.shapes[0].halfExtents.almostEquals(check, 0.001))
+    assert.isTrue(this.target2.body.shapes[0].halfExtents.almostEquals(check, 0.001), 'child')
+    check.set(1.414, 1.414, 1.414)
+    assert.isTrue(this.target1.body.shapes[1].halfExtents.almostEquals(check, 0.001), 'scale')
+    assert.isTrue(this.target1.body.shapeOffsets[1].almostEquals(check, 0.001), 'offset')
+  })
 })
