zincjs 1.0.17 → 1.2.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "zincjs",
-  "version": "1.0.17",
+  "version": "1.2.0",
   "description": "ZincJS (Web-based-Zinc-Visualisation)",
   "main": "build/zinc.js",
   "directories": {

package/src/controls.js

@@ -237,9 +237,9 @@ const CameraControls = function ( object, domElement, renderer, scene ) {
   this.getNDCFromDocumentCoords = (x, y, positionIn) => {
     updateRect(false);
     const position = positionIn ? positionIn : new THREE.Vector2();
-    position.x = ((x - rect.left) / rect.width) * 2 - 1;
-    position.y = -((y - rect.top) / rect.height) * 2 + 1;
-    return position;
+    const out_x = ((x - rect.left) / rect.width) * 2 - 1;
+    const out_y = -((y - rect.top) / rect.height) * 2 + 1;
+    return position.set(out_x, out_y);
   }
 
   /**

package/src/primitives/glyphset.js

@@ -581,7 +581,8 @@ const Glyphset = function () {
         }
         if (_boundingBox3) {
           this.cachedBoundingBox.copy(_boundingBox3);
-          this.cachedBoundingBox.applyMatrix4(this.morph.matrix);
+          this.morph.updateWorldMatrix();
+          this.cachedBoundingBox.applyMatrix4(this.morph.matrixWorld);
           this.boundingBoxUpdateRequired = false;
         } else
           return undefined;

package/src/primitives/marker.js

@@ -86,6 +86,21 @@ const Marker = function(zincObject) {
     sprite.scale.multiplyScalar(size);
   }
 
+  /**
+   * Clean up this object,
+   */ 
+  this.dispose = () => {
+    if (this.morph) {
+      this.morph.dispose();
+    }
+    if (spriteMaterial) {
+      spriteMaterial.dispose();
+    }
+    if (sprite) {
+      sprite.dispose();
+    }
+  }
+
   this.isEnabled = () => {
     return enabled;
   }

package/src/primitives/textureSlides.js

@@ -126,7 +126,8 @@ const TextureSlides = function (textureIn) {
         const value = slide.material.uniforms.slide.value;
         this.cachedBoundingBox.expandByPoint(value);
       });
-      this.cachedBoundingBox.applyMatrix4(this.morph.matrix);
+      this.morph.updateWorldMatrix();
+      this.cachedBoundingBox.applyMatrix4(this.morph.matrixWorld);
       this.boundingBoxUpdateRequired = false;
     }
     return this.cachedBoundingBox;

package/src/primitives/zincObject.js

@@ -1,6 +1,12 @@
 const THREE = require('three');
 const THREEGeometry = require('../three/Geometry').Geometry;
 
+let uniqueiId = 0;
+
+const getUniqueId = function () {
+  return "pr" + uniqueiId++;
+}
+
 /**
  * Provides the base object for other primitive types.
  * This class contains multiple base methods.
@@ -44,6 +50,8 @@ const ZincObject = function() {
   this.anatomicalId = undefined;
   this.region = undefined;
   this.animationClip = undefined;
+  this.markerMode = "inherited";
+  this.uuid = getUniqueId();
 }
 
 /**
@@ -467,7 +475,7 @@ ZincObject.prototype.getClosestVertexIndex = function() {
  * 
  * @return {THREE.Vector3}
  */
-ZincObject.prototype.getClosestVertex = function() {
+ZincObject.prototype.getClosestVertex = function(applyMatrixWorld) {
   let position = new THREE.Vector3();
   if (this.closestVertexIndex == -1) {
     this.closestVertexIndex = this.getClosestVertexIndex();
@@ -485,16 +493,17 @@ ZincObject.prototype.getClosestVertex = function() {
           position.add(this._vertex.multiplyScalar(influences[i]));
         }
       }
-      if (found)
-        return position;
+      if (found) {
+        return applyMatrixWorld ? position.applyMatrix4(this.morph.matrixWorld) : position;
+      }
     } else {
       position.fromArray(this.morph.geometry.attributes.position.array,
         this.closestVertexIndex * 3);
-      return position;
+      return applyMatrixWorld ? position.applyMatrix4(this.morph.matrixWorld) : position;
     }
   }
   this.getBoundingBox().getCenter(position);
-  return position;
+  return applyMatrixWorld ? position.applyMatrix4(this.morph.matrixWorld) : position;
 }
 
 /**
@@ -525,10 +534,12 @@ ZincObject.prototype.getBoundingBox = function() {
         if (found)
           this.cachedBoundingBox.set(min, max);
       }
-      if (!found)
+      if (!found) {
         this.cachedBoundingBox.setFromBufferAttribute(
           this.morph.geometry.attributes.position);
-      this.cachedBoundingBox.applyMatrix4(this.morph.matrix);
+      }
+      this.morph.updateWorldMatrix();
+      this.cachedBoundingBox.applyMatrix4(this.morph.matrixWorld);
       this.boundingBoxUpdateRequired = false;
     }
     return this.cachedBoundingBox;
@@ -555,12 +566,27 @@ ZincObject.prototype.dispose = function() {
   this.groupName = undefined;
 }
 
+/**
+ * Check if marker is enabled based on the objects settings with 
+ * the provided scene options.
+ * 
+ * @return {Boolean} 
+ */
+ZincObject.prototype.markerIsEnabled = function(options) {
+  if (this.markerMode === "on" || (options && options.displayMarkers &&
+    (this.markerMode === "inherited"))) {
+      
+      return true;
+  }
+  return false;
+}
+
 /**
  * Update the marker's position and size based on current viewport. 
  */
 ZincObject.prototype.updateMarker = function(playAnimation, options) {
   if ((playAnimation == false) &&
-    (options && options.displayMarkers))
+    (this.markerIsEnabled(options)))
   {
     if (this.groupName) {
       if (!this.marker) {
@@ -568,7 +594,7 @@ ZincObject.prototype.updateMarker = function(playAnimation, options) {
         this.markerUpdateRequired = true;
       }
       if (this.markerUpdateRequired) {
-        let position = this.getClosestVertex();
+        let position = this.getClosestVertex(false);
         if (position) {
           this.marker.setPosition(position.x, position.y, position.z);
           this.markerUpdateRequired = false;
@@ -622,7 +648,7 @@ ZincObject.prototype.setRenderOrder = function(renderOrder) {
 ZincObject.prototype.getClosestVertexDOMElementCoords = function(scene) {
   if (scene && scene.camera) {
     let inView = true;
-    const position = this.getClosestVertex();
+    const position = this.getClosestVertex(true);
     position.project(scene.camera);
     position.z = Math.min(Math.max(position.z, 0), 1);
     if (position.x > 1 || position.x < -1 || position.y > 1 || position.y < -1) {
@@ -635,6 +661,29 @@ ZincObject.prototype.getClosestVertexDOMElementCoords = function(scene) {
   }
 }
 
+/**
+ * Set marker mode for this zinc object which determine rather the
+ * markers should be displayed or not.
+ *
+ * @param {string} mode - There are three options:
+ * "on" - marker is enabled regardless of settings of scene
+ * "off" - marker is disabled regardless of settings of scene
+ * "inherited" - Marker settings on scene will determine the visibility
+ *  of the marker.
+ * 
+ * @return {Boolean} 
+ */
+ ZincObject.prototype.setMarkerMode = function(mode) {
+  if (mode !== this.markerMode) {
+    if (mode === "on" || mode === "off") {
+      this.markerMode = mode;
+    } else {
+      this.markerMode = "inherited";
+    }
+    if (this.region) this.region.pickableUpdateRequired = true;
+  }
+}
+
 //Update the geometry and colours depending on the morph.
 ZincObject.prototype.render = function(delta, playAnimation, options) {
   if (playAnimation == true)

package/src/region.js

@@ -1,5 +1,11 @@
 const { Group, Matrix4 } = require('three');
 
+let uniqueiId = 0;
+
+const getUniqueId = function () {
+  return "re" + uniqueiId++;
+}
+
 /**
  * Provides a hierachical structure to objects, Each region
  * may contain multiple child regions and {@link ZincObject}.
@@ -20,6 +26,9 @@ let Region = function (parentIn) {
   let duration = 3000;
   tMatrix.set(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
   this.pickableUpdateRequired = true;
+  this.isRegion = true;
+  this.uuid = getUniqueId();
+  
 
   /**
    * Hide all primitives belong to this region.
@@ -329,23 +338,19 @@ let Region = function (parentIn) {
   /**
    * Get all pickable objects.
    */
-  this.getPickableThreeJSObjects = (objectsList, pickMarkers, transverse) => {
+  this.getPickableThreeJSObjects = (objectsList,  transverse) => {
     zincObjects.forEach(zincObject => {
       if (zincObject.morph && zincObject.morph.visible) {
-        if (pickMarkers) {
-          let marker = zincObject.marker;
-          if (marker && marker.isEnabled()) {
-            objectsList.push(marker.morph);
-          }
-        } else {
-          objectsList.push(zincObject.morph);
+        let marker = zincObject.marker;
+        if (marker && marker.isEnabled()) {
+          objectsList.push(marker.morph);
         }
+        objectsList.push(zincObject.morph);
       }
     });
     if (transverse) {
       children.forEach(childRegion => {
-        childRegion.getPickableThreeJSObjects(objectsList, pickMarkers,
-          transverse);
+        childRegion.getPickableThreeJSObjects(objectsList, transverse);
       });
     }
     this.pickableUpdateRequired = false;
@@ -374,6 +379,8 @@ let Region = function (parentIn) {
 
   /**
    * Get the bounding box of all the object in this and child regions only.
+   * Do not include the matrix transformation here, it is done at the primitives
+   * level.
    * 
    * @returns {THREE.Box3} 
    */
@@ -389,8 +396,6 @@ let Region = function (parentIn) {
         }
       }
     });
-    if (boundingBox1)
-      boundingBox1.applyMatrix4(group.matrixWorld);
     if (transverse) {
       children.forEach(childRegion => {
         boundingBox2 = childRegion.getBoundingBox(transverse);
@@ -634,10 +639,30 @@ let Region = function (parentIn) {
    */
   this.getAllObjects = transverse => {
     const objectsArray = [...zincObjects];
-    children.forEach(childRegion => {
-      let childObjects = childRegion.getAllObjects(transverse);
-      objectsArray.push(...childObjects);
-    });
+    if (transverse) {
+      children.forEach(childRegion => {
+        let childObjects = childRegion.getAllObjects(transverse);
+        objectsArray.push(...childObjects);
+      });
+    }
+    return objectsArray;
+  }
+
+  /** 
+   * Get all child regions.
+   * 
+   * @param {Boolean} transverse - Include all regions which are descendants of 
+   * this reigon when this is set to true.
+   * @returns {Array}
+   */
+   this.getChildRegions = transverse => {
+    const objectsArray = [...children];
+    if (transverse) {
+      children.forEach(childRegion => {
+        const childObjects = childRegion.getChildRegions(transverse);
+        objectsArray.push(...childObjects);
+      });
+    }
     return objectsArray;
   }
 

package/src/scene.js

@@ -3,6 +3,12 @@ const SceneLoader = require('./sceneLoader').SceneLoader;
 const SceneExporter = require('./sceneExporter').SceneExporter;
 const Viewport = require('./controls').Viewport;
 
+let uniqueiId = 0;
+
+const getUniqueId = function () {
+  return "sc" + uniqueiId++;
+}
+
 const defaultMetadata = function() {
   return { 
     Duration: "6 secs",
@@ -62,6 +68,7 @@ exports.Scene = function (containerIn, rendererIn) {
   let _markerTarget = new THREE.Vector2();
   let pickableObjectsList = [];
   this.forcePickableObjectsUpdate = false;
+  this.uuid = getUniqueId();
 
   const getDrawingWidth = () => {
     if (container)
@@ -860,8 +867,7 @@ exports.Scene = function (containerIn, rendererIn) {
    */
   this.updatePickableThreeJSObjects = () => {
     pickableObjectsList.splice(0, pickableObjectsList.length);
-    rootRegion.getPickableThreeJSObjects(pickableObjectsList,
-      this.displayMarkers, true);
+    rootRegion.getPickableThreeJSObjects(pickableObjectsList, true);
     this.forcePickableObjectsUpdate = false;
   }