vis-rails 1.0.1 → 1.0.2

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA1:
-  metadata.gz: 1ab2d5d6af664775072379c257129f02c0895707
-  data.tar.gz: 49b0ee9bc14b7cbd5ee8ace9790af0793fd20dfb
+  metadata.gz: d28f18ffa726cedf2df18f07ed3f34a5881b8693
+  data.tar.gz: 716adb84278baadcd222bbecf802759ddd0a9eb2
 SHA512:
-  metadata.gz: f24f212105db1437094cf354652456e0d4a20bbdfc25a0972a13b6d2148826ad4cec7510ea695f20fc313d05d54aa80eeb49c78542914b161e16ea886cdfa16d
-  data.tar.gz: ed541ec0771e8ea6e3245e2860a08e7a5753316a12d9e84d243b3c6f6f1442ec0aabd02310977586b1a41a431a15fff141e39e6f4515ffdc16e58d675c7ffc41
+  metadata.gz: 90d77f98a4d5d2379703b87f96341180716d49e0e124bcc4d2fed368518255b5861863bf5efdd890ee8df7c98ecb753ccb89c40492928695959612cc1c0b38be
+  data.tar.gz: 56d1c95072854f202bda9c12dcd197cba4c005009b05cce79f4250d096da5c346ce488d0f6bbd2b01508591074fcdc45e4fa457be32490106400d1b0b68fcd09

data/lib/vis/rails/version.rb

@@ -1,5 +1,5 @@
 module Vis
   module Rails
-    VERSION = "1.0.1"
+    VERSION = "1.0.2"
   end
 end

data/vendor/assets/vis/graph/Graph.js

@@ -179,7 +179,9 @@ function Graph (container, data, options) {
         border: '#666',
         background: '#FFFFC6'
       }
-    }
+    },
+    moveable: true,
+    zoomable: true
   };
   this.editMode = this.constants.dataManipulation.initiallyVisible;
 
@@ -211,8 +213,11 @@ function Graph (container, data, options) {
   this._loadHierarchySystem();
 
   // apply options
+  this._setTranslation(this.frame.clientWidth / 2, this.frame.clientHeight / 2);
+  this._setScale(1);
   this.setOptions(options);
 
+
   // other vars
   this.freezeSimulation = false;// freeze the simulation
   this.cachedFunctions = {};
@@ -490,15 +495,19 @@ Graph.prototype.setData = function(data, disableStart) {
   if (!disableStart) {
     // find a stable position or start animating to a stable position
     if (this.stabilize) {
-      this._stabilize();
+      var me = this;
+      setTimeout(function() {me._stabilize(); me.start();},0)
+    }
+    else {
+      this.start();
     }
-    this.start();
   }
 };
 
 /**
  * Set options
  * @param {Object} options
+ * @param {Boolean} [initializeView] | set zoom and translation to default.
  */
 Graph.prototype.setOptions = function (options) {
   if (options) {
@@ -512,7 +521,8 @@ Graph.prototype.setOptions = function (options) {
     if (options.freezeForStabilization !== undefined)    {this.constants.freezeForStabilization = options.freezeForStabilization;}
     if (options.configurePhysics !== undefined){this.constants.configurePhysics = options.configurePhysics;}
     if (options.stabilizationIterations !== undefined)   {this.constants.stabilizationIterations = options.stabilizationIterations;}
-
+    if (options.moveable !== undefined)           {this.constants.moveable = options.moveable;}
+    if (options.zoomable !== undefined)          {this.constants.zoomable = options.zoomable;}
 
 
     if (options.labels !== undefined)  {
@@ -557,6 +567,17 @@ Graph.prototype.setOptions = function (options) {
           }
         }
       }
+
+      if (options.physics.hierarchicalRepulsion) {
+        this.constants.hierarchicalLayout.enabled = true;
+        this.constants.physics.hierarchicalRepulsion.enabled = true;
+        this.constants.physics.barnesHut.enabled = false;
+        for (prop in options.physics.hierarchicalRepulsion) {
+          if (options.physics.hierarchicalRepulsion.hasOwnProperty(prop)) {
+            this.constants.physics.hierarchicalRepulsion[prop] = options.physics.hierarchicalRepulsion[prop];
+          }
+        }
+      }
     }
 
     if (options.hierarchicalLayout) {
@@ -716,11 +737,10 @@ Graph.prototype.setOptions = function (options) {
 
   // bind keys. If disabled, this will not do anything;
   this._createKeyBinds();
-
   this.setSize(this.width, this.height);
-  this._setTranslation(this.frame.clientWidth / 2, this.frame.clientHeight / 2);
-  this._setScale(1);
-  this._redraw();
+  this.moving = true;
+  this.start();
+
 };
 
 /**
@@ -936,11 +956,11 @@ Graph.prototype._handleOnDrag = function(event) {
       var node = s.node;
 
       if (!s.xFixed) {
-        node.x = me._canvasToX(me._xToCanvas(s.x) + deltaX);
+        node.x = me._XconvertDOMtoCanvas(me._XconvertCanvasToDOM(s.x) + deltaX);
       }
 
       if (!s.yFixed) {
-        node.y = me._canvasToY(me._yToCanvas(s.y) + deltaY);
+        node.y = me._YconvertDOMtoCanvas(me._YconvertCanvasToDOM(s.y) + deltaY);
       }
     });
 
@@ -951,15 +971,18 @@ Graph.prototype._handleOnDrag = function(event) {
     }
   }
   else {
-    // move the graph
-    var diffX = pointer.x - this.drag.pointer.x;
-    var diffY = pointer.y - this.drag.pointer.y;
-
-    this._setTranslation(
-      this.drag.translation.x + diffX,
-      this.drag.translation.y + diffY);
-    this._redraw();
-    this.moving = true;
+    if (this.constants.moveable == true) {
+      // move the graph
+      var diffX = pointer.x - this.drag.pointer.x;
+      var diffY = pointer.y - this.drag.pointer.y;
+
+      this._setTranslation(
+        this.drag.translation.x + diffX,
+        this.drag.translation.y + diffY);
+      this._redraw();
+      this.moving = true;
+      this.start();
+    }
   }
 };
 
@@ -1047,30 +1070,38 @@ Graph.prototype._onPinch = function (event) {
  * @private
  */
 Graph.prototype._zoom = function(scale, pointer) {
-  var scaleOld = this._getScale();
-  if (scale < 0.00001) {
-    scale = 0.00001;
-  }
-  if (scale > 10) {
-    scale = 10;
-  }
-// + this.frame.canvas.clientHeight / 2
-  var translation = this._getTranslation();
+  if (this.constants.zoomable == true) {
+    var scaleOld = this._getScale();
+    if (scale < 0.00001) {
+      scale = 0.00001;
+    }
+    if (scale > 10) {
+      scale = 10;
+    }
+  // + this.frame.canvas.clientHeight / 2
+    var translation = this._getTranslation();
 
-  var scaleFrac = scale / scaleOld;
-  var tx = (1 - scaleFrac) * pointer.x + translation.x * scaleFrac;
-  var ty = (1 - scaleFrac) * pointer.y + translation.y * scaleFrac;
+    var scaleFrac = scale / scaleOld;
+    var tx = (1 - scaleFrac) * pointer.x + translation.x * scaleFrac;
+    var ty = (1 - scaleFrac) * pointer.y + translation.y * scaleFrac;
 
-  this.areaCenter = {"x" : this._canvasToX(pointer.x),
-                     "y" : this._canvasToY(pointer.y)};
+    this.areaCenter = {"x" : this._XconvertDOMtoCanvas(pointer.x),
+                       "y" : this._YconvertDOMtoCanvas(pointer.y)};
 
-  this._setScale(scale);
-  this._setTranslation(tx, ty);
-  this.updateClustersDefault();
-  this._redraw();
+    this._setScale(scale);
+    this._setTranslation(tx, ty);
+    this.updateClustersDefault();
+    this._redraw();
 
+    if (scaleOld < scale) {
+      this.emit("zoom", {direction:"+"});
+    }
+    else {
+      this.emit("zoom", {direction:"-"});
+    }
 
-  return scale;
+    return scale;
+  }
 };
 
 
@@ -1156,10 +1187,10 @@ Graph.prototype._onMouseMoveTitle = function (event) {
  */
 Graph.prototype._checkShowPopup = function (pointer) {
   var obj = {
-    left:   this._canvasToX(pointer.x),
-    top:    this._canvasToY(pointer.y),
-    right:  this._canvasToX(pointer.x),
-    bottom: this._canvasToY(pointer.y)
+    left:   this._XconvertDOMtoCanvas(pointer.x),
+    top:    this._YconvertDOMtoCanvas(pointer.y),
+    right:  this._XconvertDOMtoCanvas(pointer.x),
+    bottom: this._YconvertDOMtoCanvas(pointer.y)
   };
 
   var id;
@@ -1623,12 +1654,12 @@ Graph.prototype._redraw = function() {
   ctx.scale(this.scale, this.scale);
 
   this.canvasTopLeft = {
-    "x": this._canvasToX(0),
-    "y": this._canvasToY(0)
+    "x": this._XconvertDOMtoCanvas(0),
+    "y": this._YconvertDOMtoCanvas(0)
   };
   this.canvasBottomRight = {
-    "x": this._canvasToX(this.frame.canvas.clientWidth),
-    "y": this._canvasToY(this.frame.canvas.clientHeight)
+    "x": this._XconvertDOMtoCanvas(this.frame.canvas.clientWidth),
+    "y": this._YconvertDOMtoCanvas(this.frame.canvas.clientHeight)
   };
 
   this._doInAllSectors("_drawAllSectorNodes",ctx);
@@ -1662,6 +1693,8 @@ Graph.prototype._setTranslation = function(offsetX, offsetY) {
   if (offsetY !== undefined) {
     this.translation.y = offsetY;
   }
+
+  this.emit('viewChanged');
 };
 
 /**
@@ -1695,45 +1728,70 @@ Graph.prototype._getScale = function() {
 };
 
 /**
- * Convert a horizontal point on the HTML canvas to the x-value of the model
+ * Convert the X coordinate in DOM-space (coordinate point in browser relative to the container div) to
+ * the X coordinate in canvas-space (the simulation sandbox, which the camera looks upon)
  * @param {number} x
  * @returns {number}
  * @private
  */
-Graph.prototype._canvasToX = function(x) {
+Graph.prototype._XconvertDOMtoCanvas = function(x) {
   return (x - this.translation.x) / this.scale;
 };
 
 /**
- * Convert an x-value in the model to a horizontal point on the HTML canvas
+ * Convert the X coordinate in canvas-space (the simulation sandbox, which the camera looks upon) to
+ * the X coordinate in DOM-space (coordinate point in browser relative to the container div)
  * @param {number} x
  * @returns {number}
  * @private
  */
-Graph.prototype._xToCanvas = function(x) {
+Graph.prototype._XconvertCanvasToDOM = function(x) {
   return x * this.scale + this.translation.x;
 };
 
 /**
- * Convert a vertical point on the HTML canvas to the y-value of the model
+ * Convert the Y coordinate in DOM-space (coordinate point in browser relative to the container div) to
+ * the Y coordinate in canvas-space (the simulation sandbox, which the camera looks upon)
  * @param {number} y
  * @returns {number}
  * @private
  */
-Graph.prototype._canvasToY = function(y) {
+Graph.prototype._YconvertDOMtoCanvas = function(y) {
   return (y - this.translation.y) / this.scale;
 };
 
 /**
- * Convert an y-value in the model to a vertical point on the HTML canvas
+ * Convert the Y coordinate in canvas-space (the simulation sandbox, which the camera looks upon) to
+ * the Y coordinate in DOM-space (coordinate point in browser relative to the container div)
  * @param {number} y
  * @returns {number}
  * @private
  */
-Graph.prototype._yToCanvas = function(y) {
+Graph.prototype._YconvertCanvasToDOM = function(y) {
   return y * this.scale + this.translation.y ;
 };
 
+
+/**
+ *
+ * @param {object} pos   = {x: number, y: number}
+ * @returns {{x: number, y: number}}
+ * @constructor
+ */
+Graph.prototype.canvasToDOM = function(pos) {
+  return {x:this._XconvertCanvasToDOM(pos.x),y:this._YconvertCanvasToDOM(pos.y)};
+}
+
+/**
+ *
+ * @param {object} pos   = {x: number, y: number}
+ * @returns {{x: number, y: number}}
+ * @constructor
+ */
+Graph.prototype.DOMtoCanvas = function(pos) {
+  return {x:this._XconvertDOMtoCanvas(pos.x),y:this._YconvertDOMtoCanvas(pos.y)};
+}
+
 /**
  * Redraw all nodes
  * The 2d context of a HTML canvas can be retrieved by canvas.getContext('2d');

data/vendor/assets/vis/graph/Groups.js

@@ -2,10 +2,10 @@
  * @class Groups
  * This class can store groups and properties specific for groups.
  */
-Groups = function () {
+function Groups() {
   this.clear();
   this.defaultIndex = 0;
-};
+}
 
 
 /**

data/vendor/assets/vis/graph/Images.js

@@ -2,11 +2,11 @@
  * @class Images
  * This class loads images and keeps them stored.
  */
-Images = function () {
+function Images() {
   this.images = {};
 
   this.callback = undefined;
-};
+}
 
 /**
  * Set an onload callback function. This will be called each time an image

data/vendor/assets/vis/graph/graphMixins/ManipulationMixin.js

@@ -243,10 +243,10 @@ var manipulationMixin = {
           this.cachedFunctions["_handleOnDrag"] = this._handleOnDrag;
           this._handleOnDrag = function(event) {
             var pointer = this._getPointer(event.gesture.center);
-            this.sectors['support']['nodes']['targetNode'].x = this._canvasToX(pointer.x);
-            this.sectors['support']['nodes']['targetNode'].y = this._canvasToY(pointer.y);
-            this.sectors['support']['nodes']['targetViaNode'].x = 0.5 * (this._canvasToX(pointer.x) + this.edges['connectionEdge'].from.x);
-            this.sectors['support']['nodes']['targetViaNode'].y = this._canvasToY(pointer.y);
+            this.sectors['support']['nodes']['targetNode'].x = this._XconvertDOMtoCanvas(pointer.x);
+            this.sectors['support']['nodes']['targetNode'].y = this._YconvertDOMtoCanvas(pointer.y);
+            this.sectors['support']['nodes']['targetViaNode'].x = 0.5 * (this._XconvertDOMtoCanvas(pointer.x) + this.edges['connectionEdge'].from.x);
+            this.sectors['support']['nodes']['targetViaNode'].y = this._YconvertDOMtoCanvas(pointer.y);
           };
 
           this.moving = true;

data/vendor/assets/vis/graph/graphMixins/SelectionMixin.js

@@ -40,8 +40,8 @@ var SelectionMixin = {
    * @private
    */
   _pointerToPositionObject : function(pointer) {
-    var x = this._canvasToX(pointer.x);
-    var y = this._canvasToY(pointer.y);
+    var x = this._XconvertDOMtoCanvas(pointer.x);
+    var y = this._YconvertDOMtoCanvas(pointer.y);
 
     return {left:   x,
             top:    y,
@@ -433,8 +433,8 @@ var SelectionMixin = {
     var node = this._getNodeAt(pointer);
     if (node != null && node !== undefined) {
       // we reset the areaCenter here so the opening of the node will occur
-      this.areaCenter =  {"x" : this._canvasToX(pointer.x),
-                          "y" : this._canvasToY(pointer.y)};
+      this.areaCenter =  {"x" : this._XconvertDOMtoCanvas(pointer.x),
+                          "y" : this._YconvertDOMtoCanvas(pointer.y)};
       this.openCluster(node);
     }
     this.emit("doubleClick", this.getSelection());

data/vendor/assets/vis/graph/graphMixins/physics/PhysicsMixin.js

@@ -188,7 +188,7 @@ var physicsMixin = {
    */
   _calculateSpringForces: function () {
     var edgeLength, edge, edgeId;
-    var dx, dy, fx, fy, springForce, length;
+    var dx, dy, fx, fy, springForce, distance;
     var edges = this.edges;
 
     // forces caused by the edges, modelled as springs
@@ -204,13 +204,14 @@ var physicsMixin = {
 
             dx = (edge.from.x - edge.to.x);
             dy = (edge.from.y - edge.to.y);
-            length = Math.sqrt(dx * dx + dy * dy);
+            distance = Math.sqrt(dx * dx + dy * dy);
 
-            if (length == 0) {
-              length = 0.01;
+            if (distance == 0) {
+              distance = 0.01;
             }
 
-            springForce = this.constants.physics.springConstant * (edgeLength - length) / length;
+            // the 1/distance is so the fx and fy can be calculated without sine or cosine.
+            springForce = this.constants.physics.springConstant * (edgeLength - distance) / distance;
 
             fx = dx * springForce;
             fy = dy * springForce;
@@ -272,17 +273,18 @@ var physicsMixin = {
    * @private
    */
   _calculateSpringForce: function (node1, node2, edgeLength) {
-    var dx, dy, fx, fy, springForce, length;
+    var dx, dy, fx, fy, springForce, distance;
 
     dx = (node1.x - node2.x);
     dy = (node1.y - node2.y);
-    length = Math.sqrt(dx * dx + dy * dy);
+    distance = Math.sqrt(dx * dx + dy * dy);
 
-    if (length == 0) {
-      length = 0.01;
+    if (distance == 0) {
+      distance = 0.01;
     }
 
-    springForce = this.constants.physics.springConstant * (edgeLength - length) / length;
+    // the 1/distance is so the fx and fy can be calculated without sine or cosine.
+    springForce = this.constants.physics.springConstant * (edgeLength - distance) / distance;
 
     fx = dx * springForce;
     fy = dy * springForce;
@@ -317,7 +319,7 @@ var physicsMixin = {
         '<table id="graph_BH_table" style="display:none">' +
         '<tr><td><b>Barnes Hut</b></td></tr>' +
         '<tr>' +
-        '<td width="150px">gravitationalConstant</td><td>0</td><td><input type="range" min="500" max="20000" value="' + (-1 * this.constants.physics.barnesHut.gravitationalConstant) + '" step="25" style="width:300px" id="graph_BH_gc"></td><td  width="50px">-20000</td><td><input value="' + (-1 * this.constants.physics.barnesHut.gravitationalConstant) + '" id="graph_BH_gc_value" style="width:60px"></td>' +
+        '<td width="150px">gravitationalConstant</td><td>0</td><td><input type="range" min="0" max="20000" value="' + (-1 * this.constants.physics.barnesHut.gravitationalConstant) + '" step="25" style="width:300px" id="graph_BH_gc"></td><td  width="50px">-20000</td><td><input value="' + (-1 * this.constants.physics.barnesHut.gravitationalConstant) + '" id="graph_BH_gc_value" style="width:60px"></td>' +
         '</tr>' +
         '<tr>' +
         '<td width="150px">centralGravity</td><td>0</td><td><input type="range" min="0" max="3"  value="' + this.constants.physics.barnesHut.centralGravity + '" step="0.05"  style="width:300px" id="graph_BH_cg"></td><td>3</td><td><input value="' + this.constants.physics.barnesHut.centralGravity + '" id="graph_BH_cg_value" style="width:60px"></td>' +
@@ -641,10 +643,12 @@ function switchConfigurations () {
     this.constants.physics.barnesHut.enabled = false;
   }
   else if (radioButton == "H") {
-    this.constants.hierarchicalLayout.enabled = true;
-    this.constants.physics.hierarchicalRepulsion.enabled = true;
-    this.constants.physics.barnesHut.enabled = false;
-    this._setupHierarchicalLayout();
+    if (this.constants.hierarchicalLayout.enabled == false) {
+      this.constants.hierarchicalLayout.enabled = true;
+      this.constants.physics.hierarchicalRepulsion.enabled = true;
+      this.constants.physics.barnesHut.enabled = false;
+      this._setupHierarchicalLayout();
+    }
   }
   else {
     this.constants.hierarchicalLayout.enabled = false;

data/vendor/assets/vis/module/exports.js

@@ -3,6 +3,7 @@
  */
 var vis = {
   util: util,
+  moment: moment,
 
   DataSet: DataSet,
   DataView: DataView,

data/vendor/assets/vis/timeline/TimeStep.js

@@ -24,7 +24,7 @@
  * @param {Date} [end]           The end date
  * @param {Number} [minimumStep] Optional. Minimum step size in milliseconds
  */
-TimeStep = function(start, end, minimumStep) {
+function TimeStep(start, end, minimumStep) {
   // variables
   this.current = new Date();
   this._start = new Date();
@@ -36,7 +36,7 @@ TimeStep = function(start, end, minimumStep) {
 
   // initialize the range
   this.setRange(start, end, minimumStep);
-};
+}
 
 /// enum scale
 TimeStep.SCALE = {
@@ -314,8 +314,7 @@ TimeStep.prototype.snap = function(date) {
     clone.setSeconds(0);
     clone.setMilliseconds(0);
   }
-  else if (this.scale == TimeStep.SCALE.DAY ||
-      this.scale == TimeStep.SCALE.WEEKDAY) {
+  else if (this.scale == TimeStep.SCALE.DAY) {
     //noinspection FallthroughInSwitchStatementJS
     switch (this.step) {
       case 5:
@@ -328,6 +327,19 @@ TimeStep.prototype.snap = function(date) {
     clone.setSeconds(0);
     clone.setMilliseconds(0);
   }
+  else if (this.scale == TimeStep.SCALE.WEEKDAY) {
+    //noinspection FallthroughInSwitchStatementJS
+    switch (this.step) {
+      case 5:
+      case 2:
+        clone.setHours(Math.round(clone.getHours() / 12) * 12); break;
+      default:
+        clone.setHours(Math.round(clone.getHours() / 6) * 6); break;
+    }
+    clone.setMinutes(0);
+    clone.setSeconds(0);
+    clone.setMilliseconds(0);
+  }
   else if (this.scale == TimeStep.SCALE.HOUR) {
     switch (this.step) {
       case 4:

data/vendor/assets/vis/timeline/Timeline.js

@@ -11,7 +11,7 @@ function Timeline (container, items, options) {
 
   var me = this;
   var now = moment().hours(0).minutes(0).seconds(0).milliseconds(0);
-  this.options = {
+  this.defaultOptions = {
     orientation: 'bottom',
     direction: 'horizontal', // 'horizontal' or 'vertical'
     autoResize: true,
@@ -25,7 +25,6 @@ function Timeline (container, items, options) {
     },
 
     selectable: true,
-    snap: null, // will be specified after timeaxis is created
 
     min: null,
     max: null,
@@ -39,6 +38,13 @@ function Timeline (container, items, options) {
     showCurrentTime: false,
     showCustomTime: false,
 
+    groupOrder: null,
+
+    width: null,
+    height: null,
+    maxHeight: null,
+    minHeight: null,
+
     type: 'box',
     align: 'center',
     margin: {
@@ -58,11 +64,17 @@ function Timeline (container, items, options) {
     },
     onRemove: function (item, callback) {
       callback(item);
-    },
+    }
+  };
+
+  this.options = {};
+  util.deepExtend(this.options, this.defaultOptions);
+  util.deepExtend(this.options, {
+    snap: null, // will be specified after timeaxis is created
 
     toScreen: me._toScreen.bind(me),
     toTime: me._toTime.bind(me)
-  };
+  });
 
   // root panel
   var rootOptions = util.extend(Object.create(this.options), {
@@ -280,7 +292,7 @@ Emitter(Timeline.prototype);
  * @param {Object} options  TODO: describe the available options
  */
 Timeline.prototype.setOptions = function (options) {
-  util.extend(this.options, options);
+  util.deepExtend(this.options, options);
 
   if ('editable' in options) {
     var isBoolean = typeof options.editable === 'boolean';
@@ -439,6 +451,33 @@ Timeline.prototype.setGroups = function setGroups(groups) {
   this.itemSet.setGroups(newDataSet);
 };
 
+/**
+ * Clear the Timeline. By Default, items, groups and options are cleared.
+ * Example usage:
+ *
+ *     timeline.clear();                // clear items, groups, and options
+ *     timeline.clear({options: true}); // clear options only
+ *
+ * @param {Object} [what]      Optionally specify what to clear. By default:
+ *                             {items: true, groups: true, options: true}
+ */
+Timeline.prototype.clear = function clear(what) {
+  // clear items
+  if (!what || what.items) {
+    this.setItems(null);
+  }
+
+  // clear groups
+  if (!what || what.groups) {
+    this.setGroups(null);
+  }
+
+  // clear options
+  if (!what || what.options) {
+    this.setOptions(this.defaultOptions);
+  }
+};
+
 /**
  * Set Timeline window such that it fits all items
  */
@@ -535,7 +574,7 @@ Timeline.prototype.getSelection = function getSelection() {
  * Where start and end can be a Date, number, or string, and range is an
  * object with properties start and end.
  *
- * @param {Date | Number | String} [start] Start date of visible window
+ * @param {Date | Number | String | Object} [start] Start date of visible window
  * @param {Date | Number | String} [end]   End date of visible window
  */
 Timeline.prototype.setWindow = function setWindow(start, end) {
@@ -560,6 +599,14 @@ Timeline.prototype.getWindow = function setWindow() {
   };
 };
 
+/**
+ * Force a repaint of the Timeline. Can be useful to manually repaint when
+ * option autoResize=false
+ */
+Timeline.prototype.repaint = function repaint() {
+    this.rootPanel.repaint();
+};
+
 /**
  * Handle selecting/deselecting an item when tapping it
  * @param {Event} event
@@ -626,6 +673,11 @@ Timeline.prototype._onAddItem = function (event) {
       content: 'new item'
     };
 
+    // when default type is a range, add a default end date to the new item
+    if (this.options.type === 'range' || this.options.type == 'rangeoverflow') {
+      newItem.end = this.timeAxis.snap(this._toTime(x + this.rootPanel.width / 5));
+    }
+
     var id = util.randomUUID();
     newItem[this.itemsData.fieldId] = id;
 

data/vendor/assets/vis/timeline/component/Group.js

@@ -51,6 +51,14 @@ Group.prototype._create = function() {
   this.dom.background = document.createElement('div');
 
   this.dom.axis = document.createElement('div');
+
+  // create a hidden marker to detect when the Timelines container is attached
+  // to the DOM, or the style of a parent of the Timeline is changed from
+  // display:none is changed to visible.
+  this.dom.marker = document.createElement('div');
+  this.dom.marker.style.visibility = 'hidden';
+  this.dom.marker.innerHTML = '?';
+  this.dom.background.appendChild(this.dom.marker);
 };
 
 /**
@@ -122,6 +130,20 @@ Group.prototype.repaint = function repaint(range, margin, restack) {
 
   this.visibleItems = this._updateVisibleItems(this.orderedItems, this.visibleItems, range);
 
+  // force recalculation of the height of the items when the marker height changed
+  // (due to the Timeline being attached to the DOM or changed from display:none to visible)
+  var markerHeight = this.dom.marker.clientHeight;
+  if (markerHeight != this.lastMarkerHeight) {
+    this.lastMarkerHeight = markerHeight;
+
+    util.forEach(this.items, function (item) {
+      item.dirty = true;
+      if (item.displayed) item.repaint();
+    });
+
+    restack = true;
+  }
+
   // reposition visible items vertically
   if (this.itemSet.options.stack) { // TODO: ugly way to access options...
     stack.stack(this.visibleItems, margin, restack);
@@ -129,7 +151,6 @@ Group.prototype.repaint = function repaint(range, margin, restack) {
   else { // no stacking
     stack.nostack(this.visibleItems, margin);
   }
-  this.stackDirty = false;
   for (var i = 0, ii = this.visibleItems.length; i < ii; i++) {
     var item = this.visibleItems[i];
     item.repositionY();

data/vendor/assets/vis/timeline/component/ItemSet.js

@@ -519,7 +519,8 @@ ItemSet.prototype.setGroups = function setGroups(groups) {
 
     // remove all drawn groups
     ids = this.groupsData.getIds();
-    this._onRemoveGroups(ids);
+    this.groupsData = null;
+    this._onRemoveGroups(ids); // note: this will cause a repaint
   }
 
   // replace the dataset
@@ -770,8 +771,7 @@ ItemSet.prototype._orderGroups = function () {
       // hide all groups, removes them from the DOM
       var groups = this.groups;
       groupIds.forEach(function (groupId) {
-        var group = groups[groupId];
-        group.hide();
+        groups[groupId].hide();
       });
 
       // show the groups again, attach them to the DOM in correct order
@@ -813,7 +813,9 @@ ItemSet.prototype._updateItem = function _updateItem(item, itemData) {
   var oldGroupId = item.data.group;
 
   item.data = itemData;
-  item.repaint();
+  if (item.displayed) {
+    item.repaint();
+  }
 
   // update group
   if (oldGroupId != item.data.group) {

data/vendor/assets/vis/timeline/component/RootPanel.js

@@ -101,6 +101,7 @@ RootPanel.prototype.repaint = function repaint() {
 
   // update frame size
   this.frame.style.maxHeight = util.option.asSize(this.options.maxHeight, '');
+  this.frame.style.minHeight = util.option.asSize(this.options.minHeight, '');
   this._updateSize();
 
   // if the root panel or any of its childs is resized, repaint again,

data/vendor/assets/vis/timeline/component/TimeAxis.js

@@ -407,32 +407,32 @@ TimeAxis.prototype._repaintLine = function() {
  * @private
  */
 TimeAxis.prototype._calculateCharSize = function () {
-  // determine the char width and height on the minor axis
-  if (!('minorCharHeight' in this.props)) {
-    var textMinor = document.createTextNode('0');
-    var measureCharMinor = document.createElement('DIV');
-    measureCharMinor.className = 'text minor measure';
-    measureCharMinor.appendChild(textMinor);
-    this.frame.appendChild(measureCharMinor);
+  // Note: We calculate char size with every repaint. Size may change, for
+  // example when any of the timelines parents had display:none for example.
 
-    this.props.minorCharHeight = measureCharMinor.clientHeight;
-    this.props.minorCharWidth = measureCharMinor.clientWidth;
+  // determine the char width and height on the minor axis
+  if (!this.dom.measureCharMinor) {
+    this.dom.measureCharMinor = document.createElement('DIV');
+    this.dom.measureCharMinor.className = 'text minor measure';
+    this.dom.measureCharMinor.style.position = 'absolute';
 
-    this.frame.removeChild(measureCharMinor);
+    this.dom.measureCharMinor.appendChild(document.createTextNode('0'));
+    this.frame.appendChild(this.dom.measureCharMinor);
   }
+  this.props.minorCharHeight = this.dom.measureCharMinor.clientHeight;
+  this.props.minorCharWidth = this.dom.measureCharMinor.clientWidth;
 
-  if (!('majorCharHeight' in this.props)) {
-    var textMajor = document.createTextNode('0');
-    var measureCharMajor = document.createElement('DIV');
-    measureCharMajor.className = 'text major measure';
-    measureCharMajor.appendChild(textMajor);
-    this.frame.appendChild(measureCharMajor);
-
-    this.props.majorCharHeight = measureCharMajor.clientHeight;
-    this.props.majorCharWidth = measureCharMajor.clientWidth;
+  // determine the char width and height on the major axis
+  if (!this.dom.measureCharMajor) {
+    this.dom.measureCharMajor = document.createElement('DIV');
+    this.dom.measureCharMajor.className = 'text minor measure';
+    this.dom.measureCharMajor.style.position = 'absolute';
 
-    this.frame.removeChild(measureCharMajor);
+    this.dom.measureCharMajor.appendChild(document.createTextNode('0'));
+    this.frame.appendChild(this.dom.measureCharMajor);
   }
+  this.props.majorCharHeight = this.dom.measureCharMajor.clientHeight;
+  this.props.majorCharWidth = this.dom.measureCharMajor.clientWidth;
 };
 
 /**

data/vendor/assets/vis/timeline/component/item/ItemRangeOverflow.js

@@ -46,9 +46,10 @@ ItemRangeOverflow.prototype.repositionX = function repositionX() {
 
   this.left = start;
   var boxWidth = Math.max(end - start, 1);
-  this.width = (this.props.content.width < boxWidth) ?
-      boxWidth :
-      start + contentLeft + this.props.content.width;
+  this.width = boxWidth + this.props.content.width;
+  // Note: The calculation of width is an optimistic calculation, giving
+  //       a width which will not change when moving the Timeline
+  //       So no restacking needed, which is nicer for the eye
 
   this.dom.box.style.left = this.left + 'px';
   this.dom.box.style.width = boxWidth + 'px';

data/vendor/assets/vis/util.js

@@ -97,6 +97,40 @@ util.extend = function (a, b) {
   return a;
 };
 
+/**
+ * Deep extend an object a with the properties of object b
+ * @param {Object} a
+ * @param {Object} b
+ * @returns {Object}
+ */
+util.deepExtend = function deepExtend (a, b) {
+  // TODO: add support for Arrays to deepExtend
+  if (Array.isArray(b)) {
+    throw new TypeError('Arrays are not supported by deepExtend');
+  }
+
+  for (var prop in b) {
+    if (b.hasOwnProperty(prop)) {
+      if (b[prop] && b[prop].constructor === Object) {
+        if (a[prop] === undefined) {
+          a[prop] = {};
+        }
+        if (a[prop].constructor === Object) {
+          deepExtend(a[prop], b[prop]);
+        }
+        else {
+          a[prop] = b[prop];
+        }
+      } else if (Array.isArray(b[prop])) {
+        throw new TypeError('Arrays are not supported by deepExtend');
+      } else {
+        a[prop] = b[prop];
+      }
+    }
+  }
+  return a;
+};
+
 /**
  * Test whether all elements in two arrays are equal.
  * @param {Array} a

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: vis-rails
 version: !ruby/object:Gem::Version
-  version: 1.0.1
+  version: 1.0.2
 platform: ruby
 authors:
 - AlexVangelov
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2014-05-03 00:00:00.000000000 Z
+date: 2014-06-04 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: momentjs-rails