update aframe

public/vwf/model/aframe/extras/aframe-extras.controls.js

@@ -1641,12 +1641,19 @@ module.exports = AFRAME.registerComponent('touch-controls', {
 
 module.exports = AFRAME.registerComponent('trackpad-controls', {
   schema: {
-    enabled: { default: true }
+    enabled: { default: true },
+    enableNegX: { default: true },
+    enablePosX: { default: true },
+    enableNegZ: { default: true },
+    enablePosZ: { default: true },
+    mode: { default: 'touch', oneOf: ['swipe', 'touch', 'press'] }
+
   },
 
   init: function init() {
     this.dVelocity = new THREE.Vector3();
     this.zVel = 0;
+    this.xVel = 0;
     this.bindMethods();
   },
 
@@ -1664,11 +1671,23 @@ module.exports = AFRAME.registerComponent('trackpad-controls', {
   },
 
   addEventListeners: function addEventListeners() {
+    var data = this.data;
     var sceneEl = this.el.sceneEl;
 
     sceneEl.addEventListener('axismove', this.onAxisMove);
-    sceneEl.addEventListener('trackpadtouchstart', this.onTouchStart);
-    sceneEl.addEventListener('trackpadtouchend', this.onTouchEnd);
+
+    switch (data.mode) {
+      case 'swipe':
+      case 'touch':
+        sceneEl.addEventListener('trackpadtouchstart', this.onTouchStart);
+        sceneEl.addEventListener('trackpadtouchend', this.onTouchEnd);
+        break;
+
+      case 'press':
+        sceneEl.addEventListener('trackpaddown', this.onTouchStart);
+        sceneEl.addEventListener('trackpadup', this.onTouchEnd);
+        break;
+    }
   },
 
   removeEventListeners: function removeEventListeners() {
@@ -1677,6 +1696,8 @@ module.exports = AFRAME.registerComponent('trackpad-controls', {
     sceneEl.removeEventListener('axismove', this.onAxisMove);
     sceneEl.removeEventListener('trackpadtouchstart', this.onTouchStart);
     sceneEl.removeEventListener('trackpadtouchend', this.onTouchEnd);
+    sceneEl.removeEventListener('trackpaddown', this.onTouchStart);
+    sceneEl.removeEventListener('trackpadup', this.onTouchEnd);
   },
 
   isVelocityActive: function isVelocityActive() {
@@ -1685,6 +1706,7 @@ module.exports = AFRAME.registerComponent('trackpad-controls', {
 
   getVelocityDelta: function getVelocityDelta() {
     this.dVelocity.z = this.isMoving ? -this.zVel : 1;
+    this.dVelocity.x = this.isMoving ? this.xVel : 1;
     return this.dVelocity.clone();
   },
 
@@ -1695,24 +1717,115 @@ module.exports = AFRAME.registerComponent('trackpad-controls', {
   },
 
   onTouchStart: function onTouchStart(e) {
-    this.isMoving = true;
+    switch (this.data.mode) {
+      case 'swipe':
+        this.canRecordAxis = true;
+        this.startingAxisData = [];
+        break;
+      case 'touch':
+        this.isMoving = true;
+        break;
+      case 'press':
+        this.isMoving = true;
+        break;
+    }
+
     e.preventDefault();
   },
 
   onTouchEnd: function onTouchEnd(e) {
+    if (this.data.mode == 'swipe') {
+      this.startingAxisData = [];
+    }
+
     this.isMoving = false;
     e.preventDefault();
   },
 
   onAxisMove: function onAxisMove(e) {
-    var axis_data = e.detail.axis;
+    switch (this.data.mode) {
+      case 'swipe':
+        return this.handleSwipeAxis(e);
+      case 'touch':
+      case 'press':
+        return this.handleTouchAxis(e);
+    }
+  },
+
+  handleSwipeAxis: function handleSwipeAxis(e) {
+    var data = this.data;
+    var axisData = e.detail.axis;
+
+    if (this.startingAxisData.length === 0 && this.canRecordAxis) {
+      this.canRecordAxis = false;
+      this.startingAxisData[0] = axisData[0];
+      this.startingAxisData[1] = axisData[1];
+    }
+
+    if (this.startingAxisData.length > 0) {
+      var velX = 0;
+      var velZ = 0;
+
+      if (data.enableNegX && axisData[0] < this.startingAxisData[0]) {
+        velX = -1;
+      }
+
+      if (data.enablePosX && axisData[0] > this.startingAxisData[0]) {
+        velX = 1;
+      }
 
-    if (axis_data[1] < 0) {
-      this.zVel = 1;
+      if (data.enablePosZ && axisData[1] > this.startingAxisData[1]) {
+        velZ = -1;
+      }
+
+      if (data.enableNegZ && axisData[1] < this.startingAxisData[1]) {
+        velZ = 1;
+      }
+
+      var absChangeZ = Math.abs(this.startingAxisData[1] - axisData[1]);
+      var absChangeX = Math.abs(this.startingAxisData[0] - axisData[0]);
+
+      if (absChangeX > absChangeZ) {
+        this.zVel = 0;
+        this.xVel = velX;
+        this.isMoving = true;
+      } else {
+        this.xVel = 0;
+        this.zVel = velZ;
+        this.isMoving = true;
+      }
+    }
+  },
+
+  handleTouchAxis: function handleTouchAxis(e) {
+    var data = this.data;
+    var axisData = e.detail.axis;
+
+    var velX = 0;
+    var velZ = 0;
+
+    if (data.enableNegX && axisData[0] < 0) {
+      velX = -1;
+    }
+
+    if (data.enablePosX && axisData[0] > 0) {
+      velX = 1;
     }
 
-    if (axis_data[1] > 0) {
-      this.zVel = -1;
+    if (data.enablePosZ && axisData[1] > 0) {
+      velZ = -1;
+    }
+
+    if (data.enableNegZ && axisData[1] < 0) {
+      velZ = 1;
+    }
+
+    if (Math.abs(axisData[0]) > Math.abs(axisData[1])) {
+      this.zVel = 0;
+      this.xVel = velX;
+    } else {
+      this.xVel = 0;
+      this.zVel = velZ;
     }
   }
 

public/vwf/model/aframe/extras/aframe-extras.loaders.js

@@ -3,7 +3,7 @@
 
 require('./src/loaders');
 
-},{"./src/loaders":8}],2:[function(require,module,exports){
+},{"./src/loaders":7}],2:[function(require,module,exports){
 'use strict';
 
 var _typeof2 = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; };
@@ -3610,435 +3610,6 @@ module.exports = THREE.FBXLoader = function () {
 },{}],3:[function(require,module,exports){
 'use strict';
 
-/**
- * @author Wei Meng / http://about.me/menway
- *
- * Description: A THREE loader for PLY ASCII files (known as the Polygon File Format or the Stanford Triangle Format).
- *
- *
- * Limitations: ASCII decoding assumes file is UTF-8.
- *
- * Usage:
- *  var loader = new THREE.PLYLoader();
- *  loader.load('./models/ply/ascii/dolphins.ply', function (geometry) {
- *
- *    scene.add( new THREE.Mesh( geometry ) );
- *
- *  } );
- *
- * If the PLY file uses non standard property names, they can be mapped while
- * loading. For example, the following maps the properties
- * “diffuse_(red|green|blue)” in the file to standard color names.
- *
- * loader.setPropertyNameMapping( {
- *  diffuse_red: 'red',
- *  diffuse_green: 'green',
- *  diffuse_blue: 'blue'
- * } );
- *
- */
-
-module.exports = THREE.PLYLoader = function (manager) {
-
-  this.manager = manager !== undefined ? manager : THREE.DefaultLoadingManager;
-
-  this.propertyNameMapping = {};
-};
-
-THREE.PLYLoader.prototype = {
-
-  constructor: THREE.PLYLoader,
-
-  load: function load(url, onLoad, onProgress, onError) {
-
-    var scope = this;
-
-    var loader = new THREE.XHRLoader(this.manager);
-    loader.setResponseType('arraybuffer');
-    loader.load(url, function (text) {
-
-      onLoad(scope.parse(text));
-    }, onProgress, onError);
-  },
-
-  setPropertyNameMapping: function setPropertyNameMapping(mapping) {
-
-    this.propertyNameMapping = mapping;
-  },
-
-  bin2str: function bin2str(buf) {
-
-    var array_buffer = new Uint8Array(buf);
-    var str = '';
-    for (var i = 0; i < buf.byteLength; i++) {
-
-      str += String.fromCharCode(array_buffer[i]); // implicitly assumes little-endian
-    }
-
-    return str;
-  },
-
-  isASCII: function isASCII(data) {
-
-    var header = this.parseHeader(this.bin2str(data));
-
-    return header.format === "ascii";
-  },
-
-  parse: function parse(data) {
-
-    if (data instanceof ArrayBuffer) {
-
-      return this.isASCII(data) ? this.parseASCII(this.bin2str(data)) : this.parseBinary(data);
-    } else {
-
-      return this.parseASCII(data);
-    }
-  },
-
-  parseHeader: function parseHeader(data) {
-
-    var patternHeader = /ply([\s\S]*)end_header\s/;
-    var headerText = "";
-    var headerLength = 0;
-    var result = patternHeader.exec(data);
-    if (result !== null) {
-
-      headerText = result[1];
-      headerLength = result[0].length;
-    }
-
-    var header = {
-      comments: [],
-      elements: [],
-      headerLength: headerLength
-    };
-
-    var lines = headerText.split('\n');
-    var currentElement = undefined;
-    var lineType, lineValues;
-
-    function make_ply_element_property(propertValues, propertyNameMapping) {
-
-      var property = {
-        type: propertValues[0]
-      };
-
-      if (property.type === 'list') {
-
-        property.name = propertValues[3];
-        property.countType = propertValues[1];
-        property.itemType = propertValues[2];
-      } else {
-
-        property.name = propertValues[1];
-      }
-
-      if (property.name in propertyNameMapping) {
-
-        property.name = propertyNameMapping[property.name];
-      }
-
-      return property;
-    }
-
-    for (var i = 0; i < lines.length; i++) {
-
-      var line = lines[i];
-      line = line.trim();
-      if (line === "") {
-
-        continue;
-      }
-      lineValues = line.split(/\s+/);
-      lineType = lineValues.shift();
-      line = lineValues.join(" ");
-
-      switch (lineType) {
-
-        case "format":
-
-          header.format = lineValues[0];
-          header.version = lineValues[1];
-
-          break;
-
-        case "comment":
-
-          header.comments.push(line);
-
-          break;
-
-        case "element":
-
-          if (!(currentElement === undefined)) {
-
-            header.elements.push(currentElement);
-          }
-
-          currentElement = Object();
-          currentElement.name = lineValues[0];
-          currentElement.count = parseInt(lineValues[1]);
-          currentElement.properties = [];
-
-          break;
-
-        case "property":
-
-          currentElement.properties.push(make_ply_element_property(lineValues, this.propertyNameMapping));
-
-          break;
-
-        default:
-
-          console.log("unhandled", lineType, lineValues);
-
-      }
-    }
-
-    if (!(currentElement === undefined)) {
-
-      header.elements.push(currentElement);
-    }
-
-    return header;
-  },
-
-  parseASCIINumber: function parseASCIINumber(n, type) {
-
-    switch (type) {
-
-      case 'char':case 'uchar':case 'short':case 'ushort':case 'int':case 'uint':
-      case 'int8':case 'uint8':case 'int16':case 'uint16':case 'int32':case 'uint32':
-
-        return parseInt(n);
-
-      case 'float':case 'double':case 'float32':case 'float64':
-
-        return parseFloat(n);
-
-    }
-  },
-
-  parseASCIIElement: function parseASCIIElement(properties, line) {
-
-    var values = line.split(/\s+/);
-
-    var element = Object();
-
-    for (var i = 0; i < properties.length; i++) {
-
-      if (properties[i].type === "list") {
-
-        var list = [];
-        var n = this.parseASCIINumber(values.shift(), properties[i].countType);
-
-        for (var j = 0; j < n; j++) {
-
-          list.push(this.parseASCIINumber(values.shift(), properties[i].itemType));
-        }
-
-        element[properties[i].name] = list;
-      } else {
-
-        element[properties[i].name] = this.parseASCIINumber(values.shift(), properties[i].type);
-      }
-    }
-
-    return element;
-  },
-
-  parseASCII: function parseASCII(data) {
-
-    // PLY ascii format specification, as per http://en.wikipedia.org/wiki/PLY_(file_format)
-
-    var geometry = new THREE.Geometry();
-
-    var result;
-
-    var header = this.parseHeader(data);
-
-    var patternBody = /end_header\s([\s\S]*)$/;
-    var body = "";
-    if ((result = patternBody.exec(data)) !== null) {
-
-      body = result[1];
-    }
-
-    var lines = body.split('\n');
-    var currentElement = 0;
-    var currentElementCount = 0;
-    geometry.useColor = false;
-
-    for (var i = 0; i < lines.length; i++) {
-
-      var line = lines[i];
-      line = line.trim();
-      if (line === "") {
-
-        continue;
-      }
-
-      if (currentElementCount >= header.elements[currentElement].count) {
-
-        currentElement++;
-        currentElementCount = 0;
-      }
-
-      var element = this.parseASCIIElement(header.elements[currentElement].properties, line);
-
-      this.handleElement(geometry, header.elements[currentElement].name, element);
-
-      currentElementCount++;
-    }
-
-    return this.postProcess(geometry);
-  },
-
-  postProcess: function postProcess(geometry) {
-
-    if (geometry.useColor) {
-
-      for (var i = 0; i < geometry.faces.length; i++) {
-
-        geometry.faces[i].vertexColors = [geometry.colors[geometry.faces[i].a], geometry.colors[geometry.faces[i].b], geometry.colors[geometry.faces[i].c]];
-      }
-
-      geometry.elementsNeedUpdate = true;
-    }
-
-    geometry.computeBoundingSphere();
-
-    return geometry;
-  },
-
-  handleElement: function handleElement(geometry, elementName, element) {
-
-    if (elementName === "vertex") {
-
-      geometry.vertices.push(new THREE.Vector3(element.x, element.y, element.z));
-
-      if ('red' in element && 'green' in element && 'blue' in element) {
-
-        geometry.useColor = true;
-
-        var color = new THREE.Color();
-        color.setRGB(element.red / 255.0, element.green / 255.0, element.blue / 255.0);
-        geometry.colors.push(color);
-      }
-    } else if (elementName === "face") {
-
-      // BEGIN: Edits by donmccurdy.
-      var vertex_indices = element.vertex_indices || element.vertex_index;
-      // END: Edits by donmccurdy.
-
-      if (vertex_indices.length === 3) {
-
-        geometry.faces.push(new THREE.Face3(vertex_indices[0], vertex_indices[1], vertex_indices[2]));
-      } else if (vertex_indices.length === 4) {
-
-        geometry.faces.push(new THREE.Face3(vertex_indices[0], vertex_indices[1], vertex_indices[3]), new THREE.Face3(vertex_indices[1], vertex_indices[2], vertex_indices[3]));
-      }
-    }
-  },
-
-  binaryRead: function binaryRead(dataview, at, type, little_endian) {
-
-    switch (type) {
-
-      // corespondences for non-specific length types here match rply:
-      case 'int8':case 'char':
-        return [dataview.getInt8(at), 1];
-
-      case 'uint8':case 'uchar':
-        return [dataview.getUint8(at), 1];
-
-      case 'int16':case 'short':
-        return [dataview.getInt16(at, little_endian), 2];
-
-      case 'uint16':case 'ushort':
-        return [dataview.getUint16(at, little_endian), 2];
-
-      case 'int32':case 'int':
-        return [dataview.getInt32(at, little_endian), 4];
-
-      case 'uint32':case 'uint':
-        return [dataview.getUint32(at, little_endian), 4];
-
-      case 'float32':case 'float':
-        return [dataview.getFloat32(at, little_endian), 4];
-
-      case 'float64':case 'double':
-        return [dataview.getFloat64(at, little_endian), 8];
-
-    }
-  },
-
-  binaryReadElement: function binaryReadElement(dataview, at, properties, little_endian) {
-
-    var element = Object();
-    var result,
-        read = 0;
-
-    for (var i = 0; i < properties.length; i++) {
-
-      if (properties[i].type === "list") {
-
-        var list = [];
-
-        result = this.binaryRead(dataview, at + read, properties[i].countType, little_endian);
-        var n = result[0];
-        read += result[1];
-
-        for (var j = 0; j < n; j++) {
-
-          result = this.binaryRead(dataview, at + read, properties[i].itemType, little_endian);
-          list.push(result[0]);
-          read += result[1];
-        }
-
-        element[properties[i].name] = list;
-      } else {
-
-        result = this.binaryRead(dataview, at + read, properties[i].type, little_endian);
-        element[properties[i].name] = result[0];
-        read += result[1];
-      }
-    }
-
-    return [element, read];
-  },
-
-  parseBinary: function parseBinary(data) {
-
-    var geometry = new THREE.Geometry();
-
-    var header = this.parseHeader(this.bin2str(data));
-    var little_endian = header.format === "binary_little_endian";
-    var body = new DataView(data, header.headerLength);
-    var result,
-        loc = 0;
-
-    for (var currentElement = 0; currentElement < header.elements.length; currentElement++) {
-
-      for (var currentElementCount = 0; currentElementCount < header.elements[currentElement].count; currentElementCount++) {
-
-        result = this.binaryReadElement(body, loc, header.elements[currentElement].properties, little_endian);
-        loc += result[1];
-        var element = result[0];
-
-        this.handleElement(geometry, header.elements[currentElement].name, element);
-      }
-    }
-
-    return this.postProcess(geometry);
-  }
-
-};
-
-},{}],4:[function(require,module,exports){
-'use strict';
-
 /**
  * Source: https://github.com/Adobe-Marketing-Cloud/fetch-script
  */
@@ -4117,7 +3688,7 @@ function fetchScript(settings) {
 
 module.exports = fetchScript;
 
-},{}],5:[function(require,module,exports){
+},{}],4:[function(require,module,exports){
 'use strict';
 
 var LoopMode = {
@@ -4237,7 +3808,8 @@ module.exports = AFRAME.registerComponent('animation-mixer', {
         action.enabled = true;
         action.clampWhenFinished = data.clampWhenFinished;
         if (data.duration) action.setDuration(data.duration);
-        action.setLoop(LoopMode[data.loop], data.repetitions).setEffectiveTimeScale(data.timeScale).fadeIn(data.crossFadeDuration).play();
+        if (data.timeScale !== 1) action.setEffectiveTimeScale(data.timeScale);
+        action.setLoop(LoopMode[data.loop], data.repetitions).fadeIn(data.crossFadeDuration).play();
         this.activeActions.push(action);
       }
     }
@@ -4263,7 +3835,7 @@ function regExpEscape(s) {
   return s.replace(/[|\\{}()[\]^$+*?.]/g, '\\$&');
 }
 
-},{}],6:[function(require,module,exports){
+},{}],5:[function(require,module,exports){
 'use strict';
 
 THREE.FBXLoader = require('../../lib/FBXLoader');
@@ -4304,7 +3876,7 @@ module.exports = AFRAME.registerComponent('fbx-model', {
   }
 });
 
-},{"../../lib/FBXLoader":2}],7:[function(require,module,exports){
+},{"../../lib/FBXLoader":2}],6:[function(require,module,exports){
 'use strict';
 
 var fetchScript = require('../../lib/fetch-script')();
@@ -4368,80 +3940,15 @@ module.exports = AFRAME.registerComponent('gltf-model-legacy', {
   }
 });
 
-},{"../../lib/fetch-script":4}],8:[function(require,module,exports){
+},{"../../lib/fetch-script":3}],7:[function(require,module,exports){
 'use strict';
 
 require('./animation-mixer');
 require('./fbx-model');
 require('./gltf-model-legacy');
-require('./json-model');
 require('./object-model');
-require('./ply-model');
-
-},{"./animation-mixer":5,"./fbx-model":6,"./gltf-model-legacy":7,"./json-model":9,"./object-model":10,"./ply-model":11}],9:[function(require,module,exports){
-'use strict';
-
-/**
- * json-model
- *
- * Loader for THREE.js JSON format. Somewhat confusingly, there are two different THREE.js formats,
- * both having the .json extension. This loader supports only THREE.JsonLoader, which typically
- * includes only a single mesh.
- *
- * Check the console for errors, if in doubt. You may need to use `object-model` or
- * `blend-character-model` for some .js and .json files.
- *
- * See: https://clara.io/learn/user-guide/data_exchange/threejs_export
- */
-
-module.exports = AFRAME.registerComponent('json-model', {
-  schema: {
-    src: { type: 'asset' },
-    crossorigin: { default: '' }
-  },
 
-  init: function init() {
-    this.model = null;
-  },
-
-  update: function update() {
-    var _this = this;
-
-    var loader = void 0;
-    var data = this.data;
-    if (!data.src) return;
-
-    this.remove();
-    loader = new THREE.JSONLoader();
-    if (data.crossorigin) loader.crossOrigin = data.crossorigin;
-    loader.load(data.src, function (geometry, materials) {
-
-      // Attempt to automatically detect common material options.
-      materials.forEach(function (mat) {
-        mat.vertexColors = (geometry.faces[0] || {}).color ? THREE.FaceColors : THREE.NoColors;
-        mat.skinning = !!(geometry.bones || []).length;
-        mat.morphTargets = !!(geometry.morphTargets || []).length;
-        mat.morphNormals = !!(geometry.morphNormals || []).length;
-      });
-
-      var model = (geometry.bones || []).length ? new THREE.SkinnedMesh(geometry, new THREE.MultiMaterial(materials)) : new THREE.Mesh(geometry, new THREE.MultiMaterial(materials));
-
-      _this.load(model);
-    });
-  },
-
-  load: function load(model) {
-    this.model = model;
-    this.el.setObject3D('mesh', model);
-    this.el.emit('model-loaded', { format: 'json', model: model });
-  },
-
-  remove: function remove() {
-    if (this.model) this.el.removeObject3D('mesh');
-  }
-});
-
-},{}],10:[function(require,module,exports){
+},{"./animation-mixer":4,"./fbx-model":5,"./gltf-model-legacy":6,"./object-model":8}],8:[function(require,module,exports){
 'use strict';
 
 /**
@@ -4501,89 +4008,4 @@ module.exports = AFRAME.registerComponent('object-model', {
   }
 });
 
-},{}],11:[function(require,module,exports){
-'use strict';
-
-/**
- * ply-model
- *
- * Wraps THREE.PLYLoader.
- */
-
-THREE.PLYLoader = require('../../lib/PLYLoader');
-
-/**
- * Loads, caches, resolves geometries.
- *
- * @member cache - Promises that resolve geometries keyed by `src`.
- */
-module.exports.System = AFRAME.registerSystem('ply-model', {
-  init: function init() {
-    this.cache = {};
-  },
-
-  /**
-   * @returns {Promise}
-   */
-  getOrLoadGeometry: function getOrLoadGeometry(src, skipCache) {
-    var cache = this.cache;
-    var cacheItem = cache[src];
-
-    if (!skipCache && cacheItem) {
-      return cacheItem;
-    }
-
-    cache[src] = new Promise(function (resolve) {
-      var loader = new THREE.PLYLoader();
-      loader.load(src, function (geometry) {
-        resolve(geometry);
-      });
-    });
-    return cache[src];
-  }
-});
-
-module.exports.Component = AFRAME.registerComponent('ply-model', {
-  schema: {
-    skipCache: { type: 'boolean', default: false },
-    src: { type: 'asset' }
-  },
-
-  init: function init() {
-    this.model = null;
-  },
-
-  update: function update() {
-    var data = this.data;
-    var el = this.el;
-
-    if (!data.src) {
-      console.warn('[%s] `src` property is required.', this.name);
-      return;
-    }
-
-    // Get geometry from system, create and set mesh.
-    this.system.getOrLoadGeometry(data.src, data.skipCache).then(function (geometry) {
-      var model = createModel(geometry);
-      el.setObject3D('mesh', model);
-      el.emit('model-loaded', { format: 'ply', model: model });
-    });
-  },
-
-  remove: function remove() {
-    if (this.model) {
-      this.el.removeObject3D('mesh');
-    }
-  }
-});
-
-function createModel(geometry) {
-  return new THREE.Mesh(geometry, new THREE.MeshPhongMaterial({
-    color: 0xFFFFFF,
-    shading: THREE.FlatShading,
-    vertexColors: THREE.VertexColors,
-    shininess: 0
-  }));
-}
-
-},{"../../lib/PLYLoader":3}]},{},[1]);
+},{}]},{},[1]);

public/vwf/model/aframe/extras/aframe-extras.misc.js

@@ -379,9 +379,9 @@ module.exports = AFRAME.registerComponent('kinematic-body', {
   schema: {
     mass: { default: 5 },
     radius: { default: 1.3 },
-    userHeight: { default: 1.6 },
     linearDamping: { default: 0.05 },
-    enableSlopes: { default: true }
+    enableSlopes: { default: true },
+    enableJumps: { default: false }
   },
 
   /*******************************************************************
@@ -394,7 +394,7 @@ module.exports = AFRAME.registerComponent('kinematic-body', {
 
     var el = this.el,
         data = this.data,
-        position = new CANNON.Vec3().copy(el.getAttribute('position'));
+        position = new CANNON.Vec3().copy(el.object3D.getWorldPosition(new THREE.Vector3()));
 
     this.body = new CANNON.Body({
       material: this.system.getMaterial('staticMaterial'),
@@ -403,7 +403,7 @@ module.exports = AFRAME.registerComponent('kinematic-body', {
       linearDamping: data.linearDamping,
       fixedRotation: true
     });
-    this.body.addShape(new CANNON.Sphere(data.radius), new CANNON.Vec3(0, data.radius - data.height, 0));
+    this.body.addShape(new CANNON.Sphere(data.radius), new CANNON.Vec3(0, data.radius, 0));
 
     this.body.el = this.el;
     this.el.body = this.body;
@@ -438,11 +438,11 @@ module.exports = AFRAME.registerComponent('kinematic-body', {
     if (!dt) return;
 
     var el = this.el;
+    var data = this.data;
     var body = this.body;
 
-    body.velocity.copy(el.getAttribute('velocity'));
+    if (!data.enableJumps) body.velocity.set(0, 0, 0);
     body.position.copy(el.getAttribute('position'));
-    body.position.y += this.data.userHeight;
   },
 
   step: function () {
@@ -488,7 +488,7 @@ module.exports = AFRAME.registerComponent('kinematic-body', {
           // 2. If current trajectory attempts to move _through_ another
           // object, project the velocity against the collision plane to
           // prevent passing through.
-          velocity = velocity.projectOnPlane(currentSurfaceNormal);
+          velocity.projectOnPlane(currentSurfaceNormal);
         } else if (currentSurfaceNormal.y > 0.5) {
           // 3. If in contact with something roughly horizontal (+/- 45º) then
           // consider that the current ground. Only the highest qualifying
@@ -503,7 +503,7 @@ module.exports = AFRAME.registerComponent('kinematic-body', {
       }
 
       normalizedVelocity.copy(velocity).normalize();
-      if (groundBody && normalizedVelocity.y < 0.5) {
+      if (groundBody && (!data.enableJumps || normalizedVelocity.y < 0.5)) {
         if (!data.enableSlopes) {
           groundNormal.set(0, 1, 0);
         } else if (groundNormal.y < 1 - EPS) {
@@ -512,7 +512,7 @@ module.exports = AFRAME.registerComponent('kinematic-body', {
 
         // 4. Project trajectory onto the top-most ground object, unless
         // trajectory is > 45º.
-        velocity = velocity.projectOnPlane(groundNormal);
+        velocity.projectOnPlane(groundNormal);
       } else if (this.system.driver.world) {
         // 5. If not in contact with anything horizontal, apply world gravity.
         // TODO - Why is the 4x scalar necessary.
@@ -520,20 +520,7 @@ module.exports = AFRAME.registerComponent('kinematic-body', {
         velocity.add(this.system.driver.world.gravity.scale(dt * 4.0 / 1000));
       }
 
-      // 6. If the ground surface has a velocity, apply it directly to current
-      // position, not velocity, to preserve relative velocity.
-      if (groundBody && groundBody.el && groundBody.el.components.velocity) {
-        var groundVelocity = groundBody.el.getAttribute('velocity');
-        body.position.copy({
-          x: body.position.x + groundVelocity.x * dt / 1000,
-          y: body.position.y + groundVelocity.y * dt / 1000,
-          z: body.position.z + groundVelocity.z * dt / 1000
-        });
-      }
-
       body.velocity.copy(velocity);
-
-      body.position.y -= data.userHeight;
       this.el.setAttribute('velocity', body.velocity);
       this.el.setAttribute('position', body.position);
     };
@@ -554,7 +541,6 @@ module.exports = AFRAME.registerComponent('kinematic-body', {
         vFrom = this.body.position,
         vTo = this.body.position.clone();
 
-    vTo.y -= this.data.height;
     ray = new CANNON.Ray(vFrom, vTo);
     ray._updateDirection(); // TODO - Report bug.
     ray.intersectBody(groundBody);

public/vwf/view/aframe.js

@@ -682,17 +682,14 @@ define(["module", "vwf/view"], function (module, view) {
         if (!node) return;
         if (!node.aframeObj) return;
 
-        let el = document.querySelector('#avatarControl');
+       let el = document.querySelector('#avatarControl');
         if (el) {
             //let position = el.object3D.getWorldPosition(); //el.getAttribute('position');
 
             let position = new THREE.Vector3();
             el.object3D.getWorldPosition(position);
 
-            let rotation = getWorldRotation(el, 'YXZ');
-
-            // console.log(rotation);
-            //let rotation = el.getAttribute('rotation');
+            let rotation = el.getAttribute('rotation'); //getWorldRotation(el, 'YXZ');
 
             let lastRotation = self.nodes[avatarName].selfTickRotation;
             let lastPosition = self.nodes[avatarName].selfTickPosition;