Merge branch 'develop' into simplified

Conflicts:
	src/util.js

HISTORY.md

@@ -1,6 +1,16 @@
 vis.js history
 http://visjs.org
 
+
+## 2014-04-18, version 0.7.4
+
+### Graph
+
+- fixed IE9 bug.
+- style fixes.
+- minor bug fixes.
+
+
 ## 2014-04-16, version 0.7.3
 
 ### Graph

bower.json

@@ -1,6 +1,6 @@
 {
   "name": "vis",
-  "version": "0.7.4-SNAPSHOT",
+  "version": "0.7.5-SNAPSHOT",
   "description": "A dynamic, browser-based visualization library.",
   "homepage": "http://visjs.org/",
   "repository": {

docs/graph.html

@@ -1857,7 +1857,7 @@ var options: {
       add:"Add Node",
       edit:"Edit",
       link:"Add Link",
-      delete:"Delete selected",
+      del:"Delete selected",
       editNode:"Edit Node",
       back:"Back",
       addDescription:"Click in an empty space to place a new node.",

docs/index.html

@@ -23,7 +23,9 @@
 
   <p>
     The library is developed by
-    <a href="http://almende.com" target="_blank">Almende B.V.</a>
+    <a href="http://almende.com" target="_blank">Almende B.V.</a>.
+    Vis.js runs fine on Chrome, Firefox, Opera, Safari, IE9+, and most mobile
+    browsers (with full touch support).
   </p>
 
   <h2 id="Components">Components</h2>

docs/timeline.html

@@ -195,8 +195,8 @@ var items = [
     <td>type</td>
     <td>String</td>
     <td>'box'</td>
-    <td>The type of the item. Can be 'box' (default), 'range', or 'point'.
-      <!-- TODO: describe rangeoverflow -->
+    <td>The type of the item. Can be 'box' (default), 'point', 'range', or 'rangeoverflow'.
+      Types 'box' and 'point' need a start date, and types 'range' and 'rangeoverflow' need both a start and end date. Types 'range' and rangeoverflow are equal, except that overflowing text in 'range' is hidden, while visible in 'rangeoverflow'.
     </td>
   </tr>
   <tr>
@@ -545,8 +545,7 @@ var options = {
   <td>type</td>
   <td>String</td>
   <td>'box'</td>
-  <td>Specifies the type for the timeline items. Choose from 'dot' or 'point'.
-    Note that individual items can override this global type.
+  <td>Specifies the type for the timeline items. Choose from 'box', 'point', 'range', and 'rangeoverflow'. Note that individual items can override this global type.
   </td>
 </tr>
 

package.json

@@ -1,6 +1,6 @@
 {
   "name": "vis",
-  "version": "0.7.4-SNAPSHOT",
+  "version": "0.7.5-SNAPSHOT",
   "description": "A dynamic, browser-based visualization library.",
   "homepage": "http://visjs.org/",
   "repository": {

src/graph/Graph.js

@@ -30,7 +30,7 @@ function Graph (container, data, options) {
   this.initializing = true;
 
   // these functions are triggered when the dataset is edited
-  this.triggerFunctions = {add:null,edit:null,connect:null,delete:null};
+  this.triggerFunctions = {add:null,edit:null,connect:null,del:null};
 
   // set constant values
   this.constants = {
@@ -157,7 +157,7 @@ function Graph (container, data, options) {
       add:"Add Node",
       edit:"Edit",
       link:"Add Link",
-      delete:"Delete selected",
+      del:"Delete selected",
       editNode:"Edit Node",
       back:"Back",
       addDescription:"Click in an empty space to place a new node.",
@@ -534,7 +534,7 @@ Graph.prototype.setOptions = function (options) {
     }
 
     if (options.onDelete) {
-      this.triggerFunctions.delete = options.onDelete;
+      this.triggerFunctions.del = options.onDelete;
     }
 
     if (options.physics) {
@@ -737,7 +737,6 @@ Graph.prototype._create = function () {
   this.frame.className = 'graph-frame';
   this.frame.style.position = 'relative';
   this.frame.style.overflow = 'hidden';
-  this.frame.style.zIndex = "1";
 
   // create the graph canvas (HTML canvas element)
   this.frame.canvas = document.createElement( 'canvas' );
@@ -1955,15 +1954,20 @@ Graph.prototype.start = function() {
   if (this.moving || this.xIncrement != 0 || this.yIncrement != 0 || this.zoomIncrement != 0) {
     if (!this.timer) {
       var ua = navigator.userAgent.toLowerCase();
-      if (ua.indexOf('safari') != -1) {
+
+      var requiresTimeout = false;
+      if (ua.indexOf('msie 9.0') != -1) { // IE 9
+        requiresTimeout = true;
+      }
+      else if (ua.indexOf('safari') != -1) {  // safari
         if (ua.indexOf('chrome') <= -1) {
-          // safari
-          this.timer = window.setTimeout(this._animationStep.bind(this), this.renderTimestep); // wait this.renderTimeStep milliseconds and perform the animation step function
-        }
-        else {
-          this.timer = window.requestAnimationFrame(this._animationStep.bind(this), this.renderTimestep); // wait this.renderTimeStep milliseconds and perform the animation step function
+          requiresTimeout = true;
         }
       }
+
+      if (requiresTimeout == true) {
+        this.timer = window.setTimeout(this._animationStep.bind(this), this.renderTimestep); // wait this.renderTimeStep milliseconds and perform the animation step function
+      }
       else{
         this.timer = window.requestAnimationFrame(this._animationStep.bind(this), this.renderTimestep); // wait this.renderTimeStep milliseconds and perform the animation step function
       }

src/graph/graphMixins/HierarchicalLayoutMixin.js

@@ -50,7 +50,7 @@ var HierarchicalLayoutMixin = {
 
       // if the user defined some levels but not all, alert and run without hierarchical layout
       if (undefinedLevel == true && definedLevel == true) {
-        alert("To use the hierarchical layout, nodes require either no predefined levels or levels have to be defined for all nodes.")
+        alert("To use the hierarchical layout, nodes require either no predefined levels or levels have to be defined for all nodes.");
         this.zoomExtent(true,this.constants.clustering.enabled);
         if (!this.constants.clustering.enabled) {
           this.start();

src/graph/graphMixins/ManipulationMixin.js

@@ -74,7 +74,7 @@ var manipulationMixin = {
 
     // reset global variables
     this.blockConnectingEdgeSelection = false;
-    this.forceAppendSelection = false
+    this.forceAppendSelection = false;
 
     if (this.editMode == true) {
       while (this.manipulationDiv.hasChildNodes()) {
@@ -97,7 +97,7 @@ var manipulationMixin = {
         this.manipulationDiv.innerHTML += "" +
           "<div class='graph-seperatorLine'></div>" +
           "<span class='graph-manipulationUI delete' id='graph-manipulate-delete'>" +
-            "<span class='graph-manipulationLabel'>"+this.constants.labels['delete'] +"</span></span>";
+            "<span class='graph-manipulationLabel'>"+this.constants.labels['del'] +"</span></span>";
       }
 
 
@@ -123,7 +123,7 @@ var manipulationMixin = {
     else {
       this.editModeDiv.innerHTML = "" +
         "<span class='graph-manipulationUI edit editmode' id='graph-manipulate-editModeButton'>" +
-        "<span class='graph-manipulationLabel'>"+this.constants.labels['edit'] +"</span></span>"
+        "<span class='graph-manipulationLabel'>" + this.constants.labels['edit'] + "</span></span>";
       var editModeButton = document.getElementById("graph-manipulate-editModeButton");
       editModeButton.onclick = this._toggleEditMode.bind(this);
     }
@@ -267,7 +267,7 @@ var manipulationMixin = {
       var connectFromId = this.edges['connectionEdge'].fromId;
 
       // remove the temporary nodes and edge
-      delete this.edges['connectionEdge']
+      delete this.edges['connectionEdge'];
       delete this.sectors['support']['nodes']['targetNode'];
       delete this.sectors['support']['nodes']['targetViaNode'];
 
@@ -334,7 +334,7 @@ var manipulationMixin = {
         if (this.triggerFunctions.connect.length == 2) {
           var me = this;
           this.triggerFunctions.connect(defaultData, function(finalizedData) {
-            me.edgesData.add(finalizedData)
+            me.edgesData.add(finalizedData);
             me.moving = true;
             me.start();
           });
@@ -346,7 +346,7 @@ var manipulationMixin = {
         }
       }
       else {
-        this.edgesData.add(defaultData)
+        this.edgesData.add(defaultData);
         this.moving = true;
         this.start();
       }
@@ -403,14 +403,14 @@ var manipulationMixin = {
       if (!this._clusterInSelection()) {
         var selectedNodes = this.getSelectedNodes();
         var selectedEdges = this.getSelectedEdges();
-        if (this.triggerFunctions.delete) {
+        if (this.triggerFunctions.del) {
           var me = this;
           var data = {nodes: selectedNodes, edges: selectedEdges};
-          if (this.triggerFunctions.delete.length = 2) {
-            this.triggerFunctions.delete(data, function (finalizedData) {
+          if (this.triggerFunctions.del.length = 2) {
+            this.triggerFunctions.del(data, function (finalizedData) {
               me.edgesData.remove(finalizedData.edges);
               me.nodesData.remove(finalizedData.nodes);
-              this._unselectAll();
+              me._unselectAll();
               me.moving = true;
               me.start();
             });

src/graph/graphMixins/MixinLoader.js

@@ -11,7 +11,7 @@ var graphMixinLoaders = {
    * @param {Object} sourceVariable | this object has to contain functions.
    * @private
    */
-  _loadMixin : function(sourceVariable) {
+  _loadMixin: function (sourceVariable) {
     for (var mixinFunction in sourceVariable) {
       if (sourceVariable.hasOwnProperty(mixinFunction)) {
         Graph.prototype[mixinFunction] = sourceVariable[mixinFunction];
@@ -26,7 +26,7 @@ var graphMixinLoaders = {
    * @param {Object} sourceVariable | this object has to contain functions.
    * @private
    */
-  _clearMixin : function(sourceVariable) {
+  _clearMixin: function (sourceVariable) {
     for (var mixinFunction in sourceVariable) {
       if (sourceVariable.hasOwnProperty(mixinFunction)) {
         Graph.prototype[mixinFunction] = undefined;
@@ -40,15 +40,13 @@ var graphMixinLoaders = {
    *
    * @private
    */
-  _loadPhysicsSystem : function() {
+  _loadPhysicsSystem: function () {
     this._loadMixin(physicsMixin);
     this._loadSelectedForceSolver();
     if (this.constants.configurePhysics == true) {
       this._loadPhysicsConfiguration();
     }
-   },
-
-
+  },
 
 
   /**
@@ -56,7 +54,7 @@ var graphMixinLoaders = {
    *
    * @private
    */
-  _loadClusterSystem : function() {
+  _loadClusterSystem: function () {
     this.clusterSession = 0;
     this.hubThreshold = 5;
     this._loadMixin(ClusterMixin);
@@ -68,26 +66,26 @@ var graphMixinLoaders = {
    *
    * @private
    */
-  _loadSectorSystem : function() {
+  _loadSectorSystem: function () {
     this.sectors = { },
-    this.activeSector = ["default"];
+      this.activeSector = ["default"];
     this.sectors["active"] = { },
-    this.sectors["active"]["default"] = {"nodes":{},
-      "edges":{},
-      "nodeIndices":[],
-      "formationScale": 1.0,
-      "drawingNode": undefined };
+      this.sectors["active"]["default"] = {"nodes": {},
+        "edges": {},
+        "nodeIndices": [],
+        "formationScale": 1.0,
+        "drawingNode": undefined };
     this.sectors["frozen"] = {},
-    this.sectors["support"] = {"nodes":{},
-      "edges":{},
-      "nodeIndices":[],
-      "formationScale": 1.0,
-      "drawingNode": undefined };
+      this.sectors["support"] = {"nodes": {},
+        "edges": {},
+        "nodeIndices": [],
+        "formationScale": 1.0,
+        "drawingNode": undefined };
 
     this.nodeIndices = this.sectors["active"]["default"]["nodeIndices"];  // the node indices list is used to speed up the computation of the repulsion fields
 
     this._loadMixin(SectorMixin);
-   },
+  },
 
 
   /**
@@ -95,11 +93,11 @@ var graphMixinLoaders = {
    *
    * @private
    */
-  _loadSelectionSystem : function() {
-    this.selectionObj = {nodes:{},edges:{}};
+  _loadSelectionSystem: function () {
+    this.selectionObj = {nodes: {}, edges: {}};
 
     this._loadMixin(SelectionMixin);
-   },
+  },
 
 
   /**
@@ -107,7 +105,7 @@ var graphMixinLoaders = {
    *
    * @private
    */
-  _loadManipulationSystem : function() {
+  _loadManipulationSystem: function () {
     // reset global variables -- these are used by the selection of nodes and edges.
     this.blockConnectingEdgeSelection = false;
     this.forceAppendSelection = false
@@ -170,7 +168,7 @@ var graphMixinLoaders = {
         this._clearMixin(manipulationMixin);
       }
     }
-   },
+  },
 
 
   /**
@@ -178,7 +176,7 @@ var graphMixinLoaders = {
    *
    * @private
    */
-  _loadNavigationControls : function() {
+  _loadNavigationControls: function () {
     this._loadMixin(NavigationMixin);
 
     // the clean function removes the button divs, this is done to remove the bindings.
@@ -186,7 +184,7 @@ var graphMixinLoaders = {
     if (this.constants.navigation.enabled == true) {
       this._loadNavigationElements();
     }
-   },
+  },
 
 
   /**
@@ -194,8 +192,8 @@ var graphMixinLoaders = {
    *
    * @private
    */
-  _loadHierarchySystem : function() {
+  _loadHierarchySystem: function () {
     this._loadMixin(HierarchicalLayoutMixin);
   }
 
-}
+};

src/graph/graphMixins/physics/BarnesHut.js

@@ -11,23 +11,25 @@ var barnesHutMixin = {
    * @private
    */
   _calculateNodeForces : function() {
-    var node;
-    var nodes = this.calculationNodes;
-    var nodeIndices = this.calculationNodeIndices;
-    var nodeCount = nodeIndices.length;
-
-    this._formBarnesHutTree(nodes,nodeIndices);
-
-    var barnesHutTree = this.barnesHutTree;
-
-    // place the nodes one by one recursively