Merge branch 'develop' of https://github.com/almende/vis into develop

8 years ago · aee0fb3a03
--- a/.babelrc
+++ b/.babelrc
@ -0,0 +1,3 @@
 {
  "presets": ["es2015"]
 }
--- a/.gitignore
+++ b/.gitignore
@ -1,5 +1,4 @@
 # vis.js files
 dist/
 test/

 # npm files
--- a/README.md
+++ b/README.md
@ -1,6 +1,8 @@
 vis.js
 ==================

 [![Join the chat at https://gitter.im/vis-js/Lobby](https://badges.gitter.im/vis-js/Lobby.svg)](https://gitter.im/vis-js/Lobby?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge&utm_content=badge)

 <a href="https://github.com/almende/vis/issues/1781" target="_blank">
  <img align="right" src="https://raw.githubusercontent.com/almende/vis/master/misc/we_need_help.png">
 </a>
@ -19,8 +21,22 @@ The library consists of the following components:
 - Network. Display a network (force directed graph) with nodes and edges.
 - Timeline. Display different types of data on a timeline.

 The vis.js library is developed by [Almende B.V](http://almende.com).
 The vis.js library was initialy developed by [Almende B.V](http://almende.com).

 ## Badges

 [![NPM](https://nodei.co/npm/vis.png?downloads=true&downloadRank=true)](https://nodei.co/npm/vis/)

 [![Dependency Status](https://david-dm.org/almende/vis/status.svg)](https://david-dm.org/almende/vis) 
 [![devDependency Status](https://david-dm.org/almende/vis/dev-status.svg)](https://david-dm.org/almende/vis?type=dev)
 [![last version on CDNJS](https://img.shields.io/cdnjs/v/vis.svg)](https://cdnjs.com/libraries/vis)

 [![GitHub contributors](https://img.shields.io/github/contributors/almende/vis.svg)](https://github.com/almende/vis/graphs/contributors)
 [![GitHub stars](https://img.shields.io/github/stars/almende/vis.svg)](https://github.com/almende/vis/stargazers)
 [![GitHub issues](https://img.shields.io/github/issues/almende/vis.svg)](https://github.com/almende/vis/issues)
 [![Pending Pull-Requests](http://githubbadges.herokuapp.com/almende/vis/pulls.svg)](https://github.com/almende/vis/pulls)

 [![Code Climate](https://codeclimate.com/github/almende/vis/badges/gpa.svg)](https://codeclimate.com/github/almende/vis)

 ## Install

--- a/dist/img/network/acceptDeleteIcon.png
+++ b/dist/img/network/acceptDeleteIcon.png
--- a/dist/img/network/addNodeIcon.png
+++ b/dist/img/network/addNodeIcon.png
--- a/dist/img/network/backIcon.png
+++ b/dist/img/network/backIcon.png
--- a/dist/img/network/connectIcon.png
+++ b/dist/img/network/connectIcon.png
--- a/dist/img/network/cross.png
+++ b/dist/img/network/cross.png
--- a/dist/img/network/cross2.png
+++ b/dist/img/network/cross2.png
--- a/dist/img/network/deleteIcon.png
+++ b/dist/img/network/deleteIcon.png
--- a/dist/img/network/downArrow.png
+++ b/dist/img/network/downArrow.png
--- a/dist/img/network/editIcon.png
+++ b/dist/img/network/editIcon.png
--- a/dist/img/network/leftArrow.png
+++ b/dist/img/network/leftArrow.png
--- a/dist/img/network/minus.png
+++ b/dist/img/network/minus.png
--- a/dist/img/network/plus.png
+++ b/dist/img/network/plus.png
--- a/dist/img/network/rightArrow.png
+++ b/dist/img/network/rightArrow.png
--- a/dist/img/network/upArrow.png
+++ b/dist/img/network/upArrow.png
--- a/dist/img/network/zoomExtends.png
+++ b/dist/img/network/zoomExtends.png
--- a/dist/vis-graph3d.min.js
+++ b/dist/vis-graph3d.min.js
--- a/dist/vis-network.min.css
+++ b/dist/vis-network.min.css
--- a/dist/vis-network.min.js
+++ b/dist/vis-network.min.js
--- a/dist/vis-timeline-graph2d.min.css
+++ b/dist/vis-timeline-graph2d.min.css
--- a/dist/vis-timeline-graph2d.min.js
+++ b/dist/vis-timeline-graph2d.min.js
--- a/dist/vis.css
+++ b/dist/vis.css
--- a/dist/vis.js
+++ b/dist/vis.js
--- a/dist/vis.min.css
+++ b/dist/vis.min.css
--- a/dist/vis.min.js
+++ b/dist/vis.min.js
--- a/examples/network/other/cursorChange.html
+++ b/examples/network/other/cursorChange.html
@ -0,0 +1,140 @@
 <!doctype html>
 <html>
 <head>
  <title>Network | Cursor Change</title>

  <script type="text/javascript" src="../../../dist/vis.js"></script>
  <link href="../../../dist/vis-network.min.css" rel="stylesheet" type="text/css" />

  <style type="text/css">
    #mynetwork {
      width: 600px;
      height: 400px;
      border: 1px solid lightgray;
    }
  </style>
 </head>
 <body>

 <p>Here is a simple network with nodes and edges that demonstrates how to change the cursor on hover for nodes and edges.</p>
 <p>Use the dropdowns and button below to change the cursor type bound to an event.</p>
 <div>
 Event Type -
 <select id="eventType">
 	<option value="hoverNode">hoverNode</option>
 	<option value="blurNode">blurNode</option>
 	<option value="hoverEdge">hoverEdge</option>
 	<option value="blurEdge">blurEdge</option>
 	<option value="dragStart">dragStart</option>
 	<option value="dragging">dragging</option>
 	<option value="dragEnd">dragEnd</option>
 </select>
 &nbsp;
 Cursor Type -
 <select id="cursorType">
 	<option value="auto">auto</option>
 	<option value="default">default</option>
 	<option value="context-menu">context-menu</option>
 	<option value="help">help</option>
 	<option value="pointer">pointer</option>
 	<option value="progress">progress</option>
 	<option value="wait">wait</option>
 	<option value="cell">cell</option>
 	<option value="crosshair">crosshair</option>
 	<option value="text">text</option>
 	<option value="vertical-text">vertical-text</option>
 	<option value="alias">alias</option>
 	<option value="copy">copy</option>
 	<option value="move">move</option>
 	<option value="no-drop">no-drop</option>
 	<option value="not-allowed">not-allowed</option>
 	<option value="all-scroll">all-scroll</option>
 	<option value="col-resize">col-resize</option>
 	<option value="row-resize">row-resize</option>
 	<option value="n-resize">n-resize</option>
 	<option value="e-resize">e-resize</option>
 	<option value="w-resize">w-resize</option>
 	<option value="s-resize">s-resize</option>
 	<option value="ne-resize">ne-resize</option>
 	<option value="nw-resize">nw-resize</option>
 	<option value="se-resize">se-resize</option>
 	<option value="sw-resize">sw-resize</option>
 	<option value="ew-resize">ew-resize</option>
 	<option value="ns-resize">ns-resize</option>
 	<option value="nesw-resize">nesw-resize</option>
 	<option value="nwse-resize">nwse-resize</option>
 	<option value="zoom-in">zoom-in</option>
 	<option value="zoom-out">zoom-out</option>
 	<option value="grab">grab</option>
 	<option value="grabbing">grabbing</option>
 </select>
 &nbsp;

 <button onClick="changeEventCursor(document.getElementById('eventType').value,document.getElementById('cursorType').value);">Change Cursor for Event</button>
 </div>
 <div id="mynetwork"></div>

 <script type="text/javascript">
  // create an array with nodes
  var nodes = new vis.DataSet([
    {id: 1, label: 'Node 1'},
    {id: 2, label: 'Node 2'},
    {id: 3, label: 'Node 3'},
    {id: 4, label: 'Node 4'},
    {id: 5, label: 'Node 5'}
  ]);

  // create an array with edges
  var edges = new vis.DataSet([
    {from: 1, to: 3},
    {from: 1, to: 2},
    {from: 2, to: 4},
    {from: 2, to: 5}
  ]);

  // create a network
  var container = document.getElementById('mynetwork');
  var data = {
    nodes: nodes,
    edges: edges
  };
  var options = {interaction:{hover:true}};
  var network = new vis.Network(container, data, options);

  //Get the canvas HTML element
  var networkCanvas = document.getElementById("mynetwork").getElementsByTagName("canvas")[0]
  function changeCursor(newCursorStyle){
 	networkCanvas.style.cursor = newCursorStyle;
  }
  function changeEventCursor(eventName,cursorType){ 
    network.on(eventName, function() {
      changeCursor(cursorType);
    });
  }
  network.on('hoverNode', function () {
 	changeCursor('grab');
  });
  network.on('blurNode', function () {
 	changeCursor('default');
  });
  network.on('hoverEdge', function () {
 	changeCursor('grab');
  });
  network.on('blurEdge', function () {
 	changeCursor('default');
  });
  network.on('dragStart', function () {
 	changeCursor('grabbing');
  });
  network.on('dragging', function () {
 	changeCursor('grabbing');
  });
  network.on('dragEnd', function () {
 	changeCursor('grab');
  });

 </script>

 </body>
 </html>

--- a/examples/network/other/onLoadAnimation.html
+++ b/examples/network/other/onLoadAnimation.html
@ -0,0 +1,85 @@
 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 <html xmlns="http://www.w3.org/1999/xhtml">
 <head>
  <title>Network | On Load Animation</title>
  <script type="text/javascript" src="../../../dist/vis.js"></script>
  <link href="../../../dist/vis-network.min.css" rel="stylesheet" type="text/css" />
  <style type="text/css">
    #mynetwork {
      width: 600px;
      height: 400px;
      border: 1px solid lightgray;
    }
  </style>
 </head>
 <body>
  <h2>Vis.js network onLoad animation</h2>
  <p>easeIn functions accelerate from zero velocity.</p> 
  <p>easeOut functions decelerate to zero velocity.</p>
  <p>easeInOut functions accelerate from zero till halfway then after the halfway point they decrease until zero.</p>
  <div>
  Onload Animation Easing Function - 
    <select id="easingFunction">
 	  <option value="linear">linear</option>
 	  <option value="easeInQuad">easeInQuad</option>
 	  <option value="easeOutQuad">easeOutQuad</option>
 	  <option value="easeInOutQuad">easeInOutQuad</option>
 	  <option value="easeInCubic">easeInCubic</option>
 	  <option value="easeOutCubic">easeOutCubic</option>
 	  <option value="easeInOutCubic">easeInOutCubic</option>
 	  <option value="easeInQuart">easeInQuart</option>
 	  <option value="easeOutQuart">easeOutQuart</option>
 	  <option value="easeInOutQuart">easeInOutQuart</option>
 	  <option value="easeInQuint">easeInQuint</option>
 	  <option value="easeOutQuint">easeOutQuint</option>
 	  <option value="easeInOutQuint">easeInOutQuint</option>
    </select>
    <button onClick="createNetwork(document.getElementById('easingFunction').value);">Demo Easing Function</button>
  </div>
  <p>For more information on easing functions check out <a href="http://easings.net/">easings.net</a></p>
  <div id="mynetwork"></div>
  <script type="text/javascript">
  document.getElementById("easingFunction").selectedIndex = 0;
  function createNetwork(easingType) {
    var nodes = new vis.DataSet([
      {id: 1, label: 'Node 1'},
      {id: 2, label: 'Node 2'},
      {id: 3, label: 'Node 3'},
      {id: 4, label: 'Node 4'},
      {id: 5, label: 'Node 5'}
    ]);

    var edges = new vis.DataSet([
      {from: 1, to: 3},
      {from: 1, to: 2},
      {from: 2, to: 4},
      {from: 2, to: 5}
    ]);

    var container = document.getElementById('mynetwork');
    var data = {
      nodes: nodes,
      edges: edges
    };
    var options = {};
    var network = new vis.Network(container, data, options); 
    network.once("beforeDrawing", function() {
      network.focus(2, {
        scale: 12
      });
    });
    network.once("afterDrawing", function() {
      network.fit({
        animation: {
          duration: 3000,
          easingFunction: easingType
        }
      });
    });
  }
  createNetwork("linear");
  </script>
 </body>
 </html>

--- a/gulpfile.js
+++ b/gulpfile.js
@ -51,7 +51,8 @@ var webpackModule = {
      loader: 'babel',
      query: {
        cacheDirectory: true,
        presets: ['es2015']
        presets: ['es2015'],
        plugins: ['transform-es3-property-literals', 'transform-es3-member-expression-literals']
      }
    }
  ],
@ -74,7 +75,7 @@ var webpackConfig = {
  cache: true,

  // generate details sourcempas of webpack modules
  devtool: 'source-map'
  //devtool: 'source-map'

  //debug: true,
  //bail: true
--- a/lib/network/modules/components/shared/Label.js
+++ b/lib/network/modules/components/shared/Label.js
@ -519,63 +519,63 @@ class Label {
      }
    }
    while (s.position < text.length) {
      let char = text.charAt(s.position);
      if (/[ \t]/.test(char)) {
      let ch = text.charAt(s.position);
      if (/[ \t]/.test(ch)) {
        if (!s.mono) {
          s.spacing = true;
        } else {
          s.add(char);
          s.add(ch);
        }
        s.beginable = true
      } else if (/\\/.test(char)) {
      } else if (/\\/.test(ch)) {
        if (s.position < text.length+1) {
          s.position++;
          char = text.charAt(s.position);
          if (/ \t/.test(char)) {
          ch = text.charAt(s.position);
          if (/ \t/.test(ch)) {
            s.spacing = true;
          } else {
            s.add(char);
            s.add(ch);
            s.beginable = false;
          }
        }
      } else if (!s.mono && !s.bold && (s.beginable || s.spacing) && /\*/.test(char)) {
      } else if (!s.mono && !s.bold && (s.beginable || s.spacing) && /\*/.test(ch)) {
        s.emitBlock();
        s.bold = true;
        s.modStack.unshift("bold");
      } else if (!s.mono && !s.ital && (s.beginable || s.spacing) && /\_/.test(char)) {
      } else if (!s.mono && !s.ital && (s.beginable || s.spacing) && /\_/.test(ch)) {
        s.emitBlock();
        s.ital = true;
        s.modStack.unshift("ital");
      } else if (!s.mono && (s.beginable || s.spacing) && /`/.test(char)) {
      } else if (!s.mono && (s.beginable || s.spacing) && /`/.test(ch)) {
        s.emitBlock();
        s.mono = true;
        s.modStack.unshift("mono");
      } else if (!s.mono && (s.mod() === "bold") && /\*/.test(char)) {
      } else if (!s.mono && (s.mod() === "bold") && /\*/.test(ch)) {
        if ((s.position === text.length-1) || /[.,_` \t\n]/.test(text.charAt(s.position+1))) {
          s.emitBlock();
          s.bold = false;
          s.modStack.shift();
        } else {
          s.add(char);
          s.add(ch);
        }
      } else if (!s.mono && (s.mod() === "ital") && /\_/.test(char)) {
      } else if (!s.mono && (s.mod() === "ital") && /\_/.test(ch)) {
        if ((s.position === text.length-1) || /[.,*` \t\n]/.test(text.charAt(s.position+1))) {
          s.emitBlock();
          s.ital = false;
          s.modStack.shift();
        } else {
          s.add(char);
          s.add(ch);
        }
      } else if (s.mono && (s.mod() === "mono") && /`/.test(char)) {
      } else if (s.mono && (s.mod() === "mono") && /`/.test(ch)) {
        if ((s.position === text.length-1) || (/[.,*_ \t\n]/.test(text.charAt(s.position+1)))) {
          s.emitBlock();
          s.mono = false;
          s.modStack.shift();
        } else {
          s.add(char);
          s.add(ch);
        }
      } else {
        s.add(char);
        s.add(ch);
        s.beginable = false;
      }
      s.position++
@ -636,14 +636,14 @@ class Label {
      }
    }
    while (s.position < text.length) {
      let char = text.charAt(s.position);
      if (/[ \t]/.test(char)) {
      let ch = text.charAt(s.position);
      if (/[ \t]/.test(ch)) {
        if (!s.mono) {
          s.spacing = true;
        } else {
          s.add(char);
          s.add(ch);
        }
      } else if (/</.test(char)) {
      } else if (/</.test(ch)) {
        if (!s.mono && !s.bold && /<b>/.test(text.substr(s.position,3))) {
          s.emitBlock();
          s.bold = true;
@ -675,9 +675,9 @@ class Label {
          s.modStack.shift();
          s.position += 6;
        } else {
          s.add(char);
          s.add(ch);
        }
      } else if (/&/.test(char)) {
      } else if (/&/.test(ch)) {
        if (/&lt;/.test(text.substr(s.position,4))) {
          s.add("<");
          s.position += 3;
@ -688,7 +688,7 @@ class Label {
          s.add("&");
        }
      } else {
        s.add(char);
        s.add(ch);
      }
      s.position++
    }
--- a/lib/network/options.js
+++ b/lib/network/options.js
@ -6,7 +6,7 @@
 * __type__ is a required field for all objects and contains the allowed types of all objects
 */
 let string = 'string';
 let boolean = 'boolean';
 let bool = 'boolean';
 let number = 'number';
 let array = 'array';
 let object = 'object'; // should only be in a __type__ property
@ -16,29 +16,29 @@ let any = 'any';

 let allOptions = {
  configure: {
    enabled: { boolean },
    filter: { boolean, string, array, 'function': 'function' },
    enabled: { bool },
    filter: { bool, string, array, 'function': 'function' },
    container: { dom },
    showButton: { boolean },
    __type__: { object, boolean, string, array, 'function': 'function' }
    showButton: { bool },
    __type__: { object, bool, string, array, 'function': 'function' }
  },
  edges: {
    arrows: {
      to: { enabled: { boolean }, scaleFactor: { number }, type: { string: ['arrow', 'circle'] }, __type__: { object, boolean } },
      middle: { enabled: { boolean }, scaleFactor: { number }, type: { string: ['arrow', 'circle'] }, __type__: { object, boolean } },
      from: { enabled: { boolean }, scaleFactor: { number }, type: { string: ['arrow', 'circle'] }, __type__: { object, boolean } },
      to: { enabled: { bool }, scaleFactor: { number }, type: { string: ['arrow', 'circle'] }, __type__: { object, bool } },
      middle: { enabled: { bool }, scaleFactor: { number }, type: { string: ['arrow', 'circle'] }, __type__: { object, bool } },
      from: { enabled: { bool }, scaleFactor: { number }, type: { string: ['arrow', 'circle'] }, __type__: { object, bool } },
      __type__: { string: ['from', 'to', 'middle'], object }
    },
    arrowStrikethrough: { boolean },
    arrowStrikethrough: { bool },
    color: {
      color: { string },
      highlight: { string },
      hover: { string },
      inherit: { string: ['from', 'to', 'both'], boolean },
      inherit: { string: ['from', 'to', 'both'], bool },
      opacity: { number },
      __type__: { object, string }
    },
    dashes: { boolean, array },
    dashes: { bool, array },
    font: {
      color: { string },
      size: { number }, // px
@ -48,7 +48,7 @@ let allOptions = {
      strokeColor: { string },
      align: { string: ['horizontal', 'top', 'middle', 'bottom'] },
      vadjust: { number },
      multi: { boolean, string },
      multi: { bool, string },
      bold: {
        color: { string },
        size: { number }, // px
@ -83,22 +83,22 @@ let allOptions = {
      },
      __type__: { object, string }
    },
    hidden: { boolean },
    hidden: { bool },
    hoverWidth: { 'function': 'function', number },
    label: { string, 'undefined': 'undefined' },
    labelHighlightBold: { boolean },
    labelHighlightBold: { bool },
    length: { number, 'undefined': 'undefined' },
    physics: { boolean },
    physics: { bool },
    scaling: {
      min: { number },
      max: { number },
      label: {
        enabled: { boolean },
        enabled: { bool },
        min: { number },
        max: { number },
        maxVisible: { number },
        drawThreshold: { number },
        __type__: { object, boolean }
        __type__: { object, bool }
      },
      customScalingFunction: { 'function': 'function' },
      __type__: { object }
@ -106,86 +106,86 @@ let allOptions = {
    selectionWidth: { 'function': 'function', number },
    selfReferenceSize: { number },
    shadow: {
      enabled: { boolean },
      enabled: { bool },
      color: { string },
      size: { number },
      x: { number },
      y: { number },
      __type__: { object, boolean }
      __type__: { object, bool }
    },
    smooth: {
      enabled: { boolean },
      enabled: { bool },
      type: { string: ['dynamic', 'continuous', 'discrete', 'diagonalCross', 'straightCross', 'horizontal', 'vertical', 'curvedCW', 'curvedCCW', 'cubicBezier'] },
      roundness: { number },
      forceDirection: { string: ['horizontal', 'vertical', 'none'], boolean },
      __type__: { object, boolean }
      forceDirection: { string: ['horizontal', 'vertical', 'none'], bool },
      __type__: { object, bool }
    },
    title: { string, 'undefined': 'undefined' },
    width: { number },
    widthConstraint: {
      maximum: { number },
      __type__: { object, boolean, number }
      __type__: { object, bool, number }
    },
    value: { number, 'undefined': 'undefined' },
    __type__: { object }
  },
  groups: {
    useDefaultGroups: { boolean },
    useDefaultGroups: { bool },
    __any__: 'get from nodes, will be overwritten below',
    __type__: { object }
  },
  interaction: {
    dragNodes: { boolean },
    dragView: { boolean },
    hideEdgesOnDrag: { boolean },
    hideNodesOnDrag: { boolean },
    hover: { boolean },
    dragNodes: { bool },
    dragView: { bool },
    hideEdgesOnDrag: { bool },
    hideNodesOnDrag: { bool },
    hover: { bool },
    keyboard: {
      enabled: { boolean },
      enabled: { bool },
      speed: { x: { number }, y: { number }, zoom: { number }, __type__: { object } },
      bindToWindow: { boolean },
      __type__: { object, boolean }
    },
    multiselect: { boolean },
    navigationButtons: { boolean },
    selectable: { boolean },
    selectConnectedEdges: { boolean },
    hoverConnectedEdges: { boolean },
      bindToWindow: { bool },
      __type__: { object, bool }
    },
    multiselect: { bool },
    navigationButtons: { bool },
    selectable: { bool },
    selectConnectedEdges: { bool },
    hoverConnectedEdges: { bool },
    tooltipDelay: { number },
    zoomView: { boolean },
    zoomView: { bool },
    __type__: { object }
  },
  layout: {
    randomSeed: { 'undefined': 'undefined', number },
    improvedLayout: { boolean },
    improvedLayout: { bool },
    hierarchical: {
      enabled: { boolean },
      enabled: { bool },
      levelSeparation: { number },
      nodeSpacing: { number },
      treeSpacing: { number },
      blockShifting: { boolean },
      edgeMinimization: { boolean },
      parentCentralization: { boolean },
      blockShifting: { bool },
      edgeMinimization: { bool },
      parentCentralization: { bool },
      direction: { string: ['UD', 'DU', 'LR', 'RL'] },   // UD, DU, LR, RL
      sortMethod: { string: ['hubsize', 'directed'] }, // hubsize, directed
      __type__: { object, boolean }
      __type__: { object, bool }
    },
    __type__: { object }
  },
  manipulation: {
    enabled: { boolean },
    initiallyActive: { boolean },
    addNode: { boolean, 'function': 'function' },
    addEdge: { boolean, 'function': 'function' },
    enabled: { bool },
    initiallyActive: { bool },
    addNode: { bool, 'function': 'function' },
    addEdge: { bool, 'function': 'function' },
    editNode: { 'function': 'function' },
    editEdge: {
      editWithoutDrag: { 'function' : 'function' },
      __type__: {object, boolean, 'function': 'function' }
      __type__: {object, bool, 'function': 'function' }
    },
    deleteNode: { boolean, 'function': 'function' },
    deleteEdge: { boolean, 'function': 'function' },
    deleteNode: { bool, 'function': 'function' },
    deleteEdge: { bool, 'function': 'function' },
    controlNodeStyle: 'get from nodes, will be overwritten below',
    __type__: { object, boolean }
    __type__: { object, bool }
  },
  nodes: {
    borderWidth: { number },
@ -207,9 +207,9 @@ let allOptions = {
      __type__: { object, string }
    },
    fixed: {
      x: { boolean },
      y: { boolean },
      __type__: { object, boolean }
      x: { bool },
      y: { bool },
      __type__: { object, bool }
    },
    font: {
      align: { string },
@ -220,7 +220,7 @@ let allOptions = {
      strokeWidth: { number }, // px
      strokeColor: { string },
      vadjust: { number },
      multi: { boolean, string },
      multi: { bool, string },
      bold: {
        color: { string },
        size: { number }, // px
@ -259,9 +259,9 @@ let allOptions = {
    heightConstraint: {
      minimum: { number },
      valign: { string },
      __type__: { object, boolean, number }
      __type__: { object, bool, number }
    },
    hidden: { boolean },
    hidden: { bool },
    icon: {
      face: { string },
      code: { string },  //'\uf007',
@ -272,7 +272,7 @@ let allOptions = {
    id: { string, number },
    image: { string, 'undefined': 'undefined' }, // --> URL
    label: { string, 'undefined': 'undefined' },
    labelHighlightBold: { boolean },
    labelHighlightBold: { bool },
    level: { number, 'undefined': 'undefined' },
    margin: {
      top: { number },
@ -282,36 +282,36 @@ let allOptions = {
      __type__: { object, number }
    },
    mass: { number },
    physics: { boolean },
    physics: { bool },
    scaling: {
      min: { number },
      max: { number },
      label: {
        enabled: { boolean },
        enabled: { bool },
        min: { number },
        max: { number },
        maxVisible: { number },
        drawThreshold: { number },
        __type__: { object, boolean }
        __type__: { object, bool }
      },
      customScalingFunction: { 'function': 'function' },
      __type__: { object }
    },
    shadow: {
      enabled: { boolean },
      enabled: { bool },
      color: { string },
      size: { number },
      x: { number },
      y: { number },
      __type__: { object, boolean }
      __type__: { object, bool }
    },
    shape: { string: ['ellipse', 'circle', 'database', 'box', 'text', 'image', 'circularImage', 'diamond', 'dot', 'star', 'triangle', 'triangleDown', 'square', 'icon'] },
    shapeProperties: {
      borderDashes: { boolean, array },
      borderDashes: { bool, array },
      borderRadius: { number },
      interpolation: { boolean },
      useImageSize: { boolean },
      useBorderWithImage: { boolean },
      interpolation: { bool },
      useImageSize: { bool },
      useBorderWithImage: { bool },
      __type__: { object }
    },
    size: { number },
@ -320,14 +320,14 @@ let allOptions = {
    widthConstraint: {
      minimum: { number },
      maximum: { number },
      __type__: { object, boolean, number }
      __type__: { object, bool, number }
    },
    x: { number },
    y: { number },
    __type__: { object }
  },
  physics: {
    enabled: { boolean },
    enabled: { bool },
    barnesHut: {
      gravitationalConstant: { number },
      centralGravity: { number },
@ -366,21 +366,21 @@ let allOptions = {
    minVelocity: { number },    // px/s
    solver: { string: ['barnesHut', 'repulsion', 'hierarchicalRepulsion', 'forceAtlas2Based'] },
    stabilization: {
      enabled: { boolean },
      enabled: { bool },
      iterations: { number },   // maximum number of iteration to stabilize
      updateInterval: { number },
      onlyDynamicEdges: { boolean },
      fit: { boolean },
      __type__: { object, boolean }
      onlyDynamicEdges: { bool },
      fit: { bool },
      __type__: { object, bool }
    },
    timestep: { number },
    adaptiveTimestep: { boolean },
    __type__: { object, boolean }
    adaptiveTimestep: { bool },
    __type__: { object, bool }
  },

  //globals :
  autoResize: { boolean },
  clickToUse: { boolean },
  autoResize: { bool },
  clickToUse: { bool },
  locale: { string },
  locales: {
    __any__: { any },
--- a/lib/timeline/component/ItemSet.js
+++ b/lib/timeline/component/ItemSet.js
@ -1235,6 +1235,7 @@ ItemSet.prototype._onDragStart = function (event) {
    var dragLeftItem = this.touchParams.dragLeftItem;
    var dragRightItem = this.touchParams.dragRightItem;
    this.touchParams.itemIsDragging = true;
    this.touchParams.selectedItem = item;

    if (dragLeftItem) {
      props = {
@ -1257,8 +1258,6 @@ ItemSet.prototype._onDragStart = function (event) {
      this.touchParams.itemProps = [props];
    }
    else {
      this.touchParams.selectedItem = item;

      var baseGroupIndex = this._getGroupIndex(item.data.group);

      var itemsToDrag = (this.options.itemsAlwaysDraggable && !item.selected) ? [item.id] : this.getSelection();
@ -1323,7 +1322,8 @@ ItemSet.prototype._onDragStartAddItem = function (event) {
  newItem.id = id; // TODO: not so nice setting id afterwards
  newItem.data = this._cloneItemData(itemData);
  this._addItem(newItem);

  this.touchParams.selectedItem = newItem;
  
  var props = {
    item: newItem,
    initialX: event.center.x,
--- a/lib/timeline/optionsGraph2d.js
+++ b/lib/timeline/optionsGraph2d.js
@ -6,7 +6,7 @@
 * __type__ is a required field for all objects and contains the allowed types of all objects
 */
 let string = 'string';
 let boolean = 'boolean';
 let bool = 'boolean';
 let number = 'number';
 let array = 'array';
 let date = 'date';
@ -18,53 +18,53 @@ let any = 'any';

 let allOptions = {
  configure: {
    enabled: {boolean},
    filter: {boolean,'function': 'function'},
    enabled: {bool},
    filter: {bool,'function': 'function'},
    container: {dom},
    __type__: {object,boolean,'function': 'function'}
    __type__: {object,bool,'function': 'function'}
  },

  //globals :
  yAxisOrientation: {string:['left','right']},
  defaultGroup: {string},
  sort: {boolean},
  sampling: {boolean},
  stack:{boolean},
  sort: {bool},
  sampling: {bool},
  stack:{bool},
  graphHeight: {string, number},
  shaded: {
    enabled: {boolean},
    enabled: {bool},
    orientation: {string:['bottom','top','zero','group']}, // top, bottom, zero, group
    groupId: {object},
    __type__: {boolean,object}
    __type__: {bool,object}
  },
  style: {string:['line','bar','points']}, // line, bar
  barChart: {
    width: {number},
    minWidth: {number},
    sideBySide: {boolean},
    sideBySide: {bool},
    align: {string:['left','center','right']},
    __type__: {object}
  },
  interpolation: {
    enabled: {boolean},
    enabled: {bool},
    parametrization: {string:['centripetal', 'chordal','uniform']}, // uniform (alpha = 0.0), chordal (alpha = 1.0), centripetal (alpha = 0.5)
    alpha: {number},
    __type__: {object,boolean}
    __type__: {object,bool}
  },
  drawPoints: {
    enabled: {boolean},
    enabled: {bool},
    onRender: { 'function': 'function' },
    size: {number},
    style: {string:['square','circle']}, // square, circle
    __type__: {object,boolean,'function': 'function'}
    __type__: {object,bool,'function': 'function'}
  },
  dataAxis: {
    showMinorLabels: {boolean},
    showMajorLabels: {boolean},
    icons: {boolean},
    showMinorLabels: {bool},
    showMajorLabels: {bool},
    icons: {bool},
    width: {string, number},
    visible: {boolean},
    alignZeros: {boolean},
    visible: {bool},
    alignZeros: {bool},
    left:{
      range: {min:{number},max:{number},__type__: {object}},
      format: {'function': 'function'},
@ -80,27 +80,27 @@ let allOptions = {
    __type__: {object}
  },
  legend: {
    enabled: {boolean},
    icons: {boolean},
    enabled: {bool},
    icons: {bool},
    left: {
      visible: {boolean},
      visible: {bool},
      position: {string:['top-right','bottom-right','top-left','bottom-left']},
      __type__: {object}
    },
    right: {
      visible: {boolean},
      visible: {bool},
      position: {string:['top-right','bottom-right','top-left','bottom-left']},
      __type__: {object}
    },
    __type__: {object,boolean}
    __type__: {object,bool}
  },
  groups: {
    visibility: {any},
    __type__: {object}
  },

  autoResize: {boolean},
  clickToUse: {boolean},
  autoResize: {bool},
  clickToUse: {bool},
  end: {number, date, string, moment},
  format: {
    minorLabels: {
@ -145,12 +145,12 @@ let allOptions = {
  maxMinorChars: {number},
  min: {date, number, string, moment},
  minHeight: {number, string},
  moveable: {boolean},
  multiselect: {boolean},
  moveable: {bool},
  multiselect: {bool},
  orientation: {string},
  showCurrentTime: {boolean},
  showMajorLabels: {boolean},
  showMinorLabels: {boolean},
  showCurrentTime: {bool},
  showMajorLabels: {bool},
  showMinorLabels: {bool},
  start: {date, number, string, moment},
  timeAxis: {
    scale: {string,'undefined': 'undefined'},
@ -158,7 +158,7 @@ let allOptions = {
    __type__: {object}
  },
  width: {string, number},
  zoomable: {boolean},
  zoomable: {bool},
  zoomKey: {string: ['ctrlKey', 'altKey', 'metaKey', '']},
  zoomMax: {number},
  zoomMin: {number},
--- a/lib/timeline/optionsTimeline.js
+++ b/lib/timeline/optionsTimeline.js
@ -6,7 +6,7 @@
 * __type__ is a required field for all objects and contains the allowed types of all objects
 */
 let string = 'string';
 let boolean = 'boolean';
 let bool = 'boolean';
 let number = 'number';
 let array = 'array';
 let date = 'date';
@ -17,28 +17,28 @@ let any = 'any';

 let allOptions = {
  configure: {
    enabled: {boolean},
    filter: {boolean,'function': 'function'},
    enabled: {bool},
    filter: {bool,'function': 'function'},
    container: {dom},
    __type__: {object,boolean,'function': 'function'}
    __type__: {object,bool,'function': 'function'}
  },

  //globals :
  align: {string},
  rtl: {boolean, 'undefined': 'undefined'},
  rollingMode: {boolean, 'undefined': 'undefined'},
  verticalScroll: {boolean, 'undefined': 'undefined'},
  horizontalScroll: {boolean, 'undefined': 'undefined'},
  autoResize: {boolean},
  clickToUse: {boolean},
  rtl: {bool, 'undefined': 'undefined'},
  rollingMode: {bool, 'undefined': 'undefined'},
  verticalScroll: {bool, 'undefined': 'undefined'},
  horizontalScroll: {bool, 'undefined': 'undefined'},
  autoResize: {bool},
  clickToUse: {bool},
  dataAttributes: {string, array},
  editable: {
    add: {boolean, 'undefined': 'undefined'},
    remove: {boolean, 'undefined': 'undefined'},
    updateGroup: {boolean, 'undefined': 'undefined'},
    updateTime: {boolean, 'undefined': 'undefined'},
    overrideItems: {boolean, 'undefined': 'undefined'},
    __type__: {boolean, object}
    add: {bool, 'undefined': 'undefined'},
    remove: {bool, 'undefined': 'undefined'},
    updateGroup: {bool, 'undefined': 'undefined'},
    updateTime: {bool, 'undefined': 'undefined'},
    overrideItems: {bool, 'undefined': 'undefined'},
    __type__: {bool, object}
  },
  end: {number, date, string, moment},
  format: {
@ -69,10 +69,10 @@ let allOptions = {
  moment: {'function': 'function'},
  groupOrder: {string, 'function': 'function'},
  groupEditable: {
 	 add: {boolean, 'undefined': 'undefined'},
 	 remove: {boolean, 'undefined': 'undefined'},
 	 order: {boolean, 'undefined': 'undefined'},
 	 __type__: {boolean, object}
 	 add: {bool, 'undefined': 'undefined'},
 	 remove: {bool, 'undefined': 'undefined'},
 	 order: {bool, 'undefined': 'undefined'},
 	 __type__: {bool, object}
  },
  groupOrderSwap: {'function': 'function'},
  height: {string, number},
@ -82,7 +82,7 @@ let allOptions = {
    repeat: {string},
    __type__: {object, array}
  },
  itemsAlwaysDraggable: { boolean: boolean },
  itemsAlwaysDraggable: {bool},
  locale:{string},
  locales:{
    __any__: {any},
@ -102,9 +102,9 @@ let allOptions = {
  maxMinorChars: {number},
  min: {date, number, string, moment},
  minHeight: {number, string},
  moveable: {boolean},
  multiselect: {boolean},
  multiselectPerGroup: {boolean},
  moveable: {bool},
  multiselect: {bool},
  multiselectPerGroup: {bool},
  onAdd: {'function': 'function'},
  onUpdate: {'function': 'function'},
  onMove: {'function': 'function'},
@ -119,19 +119,19 @@ let allOptions = {
    item: {string,'undefined': 'undefined'},
    __type__: {string, object}
  },
  selectable: {boolean},
  showCurrentTime: {boolean},
  showMajorLabels: {boolean},
  showMinorLabels: {boolean},
  stack: {boolean},
  selectable: {bool},
  showCurrentTime: {bool},
  showMajorLabels: {bool},
  showMinorLabels: {bool},
  stack: {bool},
  snap: {'function': 'function', 'null': 'null'},
  start: {date, number, string, moment},
  template: {'function': 'function'},
  groupTemplate: {'function': 'function'},
  visibleFrameTemplate: {string, 'function': 'function'},
  tooltipOnItemUpdateTime: {
    template: {'function': 'function'}, 
    __type__: {boolean, object}
    template: {'function': 'function'},
    __type__: {bool, object}
  },
  timeAxis: {
    scale: {string,'undefined': 'undefined'},
@ -140,7 +140,7 @@ let allOptions = {
  },
  type: {string},
  width: {string, number},
  zoomable: {boolean},
  zoomable: {bool},
  zoomKey: {string: ['ctrlKey', 'altKey', 'metaKey', '']},
  zoomMax: {number},
  zoomMin: {number},
--- a/lib/util.js
+++ b/lib/util.js
@ -409,7 +409,7 @@ exports.convert = function (object, type) {

    case 'number':
    case 'Number':
      if (!isNaN(Date.parse(object))) {
      if (exports.isString(object) && !isNaN(Date.parse(object))) {
        return moment(object).valueOf();
      } else {
        return Number(object.valueOf());
--- a/misc/we_need_help.md
+++ b/misc/we_need_help.md
@ -13,3 +13,4 @@ If you have shown some commitment to the project you can ask [@ludost](//github.
 * [@ludost](//github.com/ludost) (almende maintainer)
 * [@mojoaxel](//github.com/mojoaxel)
 * [@yotamberk](//github.com/yotamberk)
 * [@Tooa](//github.com/Tooa)
--- a/package.json
+++ b/package.json
@ -40,6 +40,8 @@
    "babel-core": "^6.6.5",
    "babel-loader": "^6.2.4",
    "babel-preset-es2015": "^6.6.0",
    "babel-plugin-transform-es3-property-literals": "^6.8.0",
    "babel-plugin-transform-es3-member-expression-literals": "^6.8.0",
    "babelify": "^7.2.0",
    "clean-css": "^3.4.10",
    "gulp": "^3.9.1",