Released version 4.12.0

dist/vis.css

@@ -584,6 +584,11 @@ input.vis-configuration.vis-config-range:focus::-ms-fill-upper {
   cursor: e-resize;
 }
 
+.vis-range.vis-item.vis-readonly .vis-drag-left,
+.vis-range.vis-item.vis-readonly .vis-drag-right {
+  cursor: auto;
+}
+
 .vis-time-axis {
   position: relative;
   overflow: hidden;
@@ -1121,14 +1126,17 @@ div.vis-network div.vis-navigation div.vis-button.vis-zoomExtends {
 
 div.vis-color-picker {
   position:absolute;
+  top: 0px;
+  left: 30px;
   margin-top:-140px;
   margin-left:30px;
-  width:293px;
-  height:425px;
+  width:310px;
+  height:444px;
+  z-index: 1;
   padding: 10px;
   border-radius:15px;
   background-color:#ffffff;
-  display:none;
+  display: none;
   box-shadow: rgba(0,0,0,0.5) 0px 0px 10px 0px;
 }
 
@@ -1138,8 +1146,8 @@ div.vis-color-picker div.vis-arrow {
   left:5px;
 }
 
-div.vis-color-picker div.vis-arrow:after,
-div.vis-color-picker div.vis-arrow:before {
+div.vis-color-picker div.vis-arrow::after,
+div.vis-color-picker div.vis-arrow::before {
   right: 100%;
   top: 50%;
   border: solid transparent;

docs/network/edges.html

@@ -166,6 +166,7 @@ var options = {
     selfReferenceSize:20,
     shadow:{
       enabled: false,
+      color: 'rgba(0,0,0,0.5)',
       size:10,
       x:5,
       y:5
@@ -581,6 +582,12 @@ var options: {
                 in this object are defined.
             </td>
         </tr>
+        <tr parent="shadow" class="hidden">
+            <td class="indent">shadow.color</td>
+            <td>String</td>
+            <td><code>'rgba(0,0,0,0.5)'</code></td>
+            <td>The color size of the shadow as a string. Supported formats are 'rgb(255,255,255)', 'rgba(255,255,255,1)' and '#FFFFFF'.</td>
+        </tr>
         <tr parent="shadow" class="hidden">
             <td class="indent">shadow.size</td>
             <td>Number</td>

docs/network/index.html

@@ -1319,19 +1319,19 @@ var options = {
             </tr>
             <tr><td id="event_hoverNode">hoverNode</td>
                 <td><code>{node: nodeId}</code></td>
-                <td>Fired interaction:{hover:true} and the mouse hovers over a node.</td>
+                <td>Fired if the option <code>interaction:{hover:true}</code> is enabled and the mouse hovers over a node.</td>
             </tr>
             <tr><td id="event_blurNode">blurNode</td>
                 <td><code>{node: nodeId}</code></td>
-                <td>Fired interaction:{hover:true} and the mouse moved away from a node it was hovering over before.</td>
+                <td>Fired if the option <code>interaction:{hover:true}</code> is enabled and the mouse moved away from a node it was hovering over before.</td>
             </tr>
             <tr><td id="event_hoverEdge">hoverEdge</td>
                 <td><code>{edge: edgeId}</code></td>
-                <td>Fired interaction:{hover:true} and the mouse hovers over an edge.</td>
+                <td>Fired if the option <code>interaction:{hover:true}</code> is enabled and the mouse hovers over an edge.</td>
             </tr>
             <tr><td id="event_blurEdge">blurEdge</td>
                 <td><code>{edge: edgeId}</code></td>
-                <td>Fired interaction:{hover:true} and the mouse moved away from an edge it was hovering over before.</td>
+                <td>Fired if the option <code>interaction:{hover:true}</code> is enabled and the mouse moved away from an edge it was hovering over before.</td>
             </tr>
             <tr><td id="event_zoom">zoom</td>
                 <td><code>{direction:'+'/'-', scale: Number}</code></td>

docs/network/nodes.html

@@ -171,6 +171,7 @@ var options = {
     },
     shadow:{
       enabled: false,
+      color: 'rgba(0,0,0,0.5)',
       size:10,
       x:5,
       y:5
@@ -585,6 +586,12 @@ mySize = minSize + diff * scale;
                 in this object are defined.
             </td>
         </tr>
+        <tr parent="shadow" class="hidden">
+            <td class="indent">shadow.color</td>
+            <td>String</td>
+            <td><code>'rgba(0,0,0,0.5)'</code></td>
+            <td>The color size of the shadow as a string. Supported formats are 'rgb(255,255,255)', 'rgba(255,255,255,1)' and '#FFFFFF'.</td>
+        </tr>
         <tr parent="shadow" class="hidden">
             <td class="indent">shadow.size</td>
             <td>Number</td>

examples/network/nodeStyles/shadows.html

@@ -87,7 +87,7 @@
         {from: 25, to: 24},
         {from: 26, to: 25},
         {from: 25, to: 7},
-        {from: 28, to: 27},
+        {from: 28, to: 27, shadow:{color:'rgb(0,255,0)'}},
         {from: 29, to: 28},
         {from: 28, to: 0}
     ]

examples/network/other/clustering.html

@@ -80,7 +80,7 @@ Click any of the buttons below to cluster the network. On every push the network
               network.openCluster(params.nodes[0]);
           }
       }
-  })
+  });
 
   function clusterByCid() {
       network.setData(data);
@@ -89,7 +89,7 @@ Click any of the buttons below to cluster the network. On every push the network
               return childOptions.cid == 1;
           },
           clusterNodeProperties: {id:'cidCluster', borderWidth:3, shape:'database'}
-      }
+      };
       network.cluster(clusterOptionsByData);
   }
   function clusterByColor() {
@@ -111,7 +111,7 @@ Click any of the buttons below to cluster the network. On every push the network
                   return clusterOptions;
               },
               clusterNodeProperties: {id: 'cluster:' + color, borderWidth: 3, shape: 'database', color:color, label:'color:' + color}
-          }
+          };
           network.cluster(clusterOptionsByData);
       }
   }
@@ -131,7 +131,7 @@ Click any of the buttons below to cluster the network. On every push the network
             return clusterOptions;
           },
           clusterNodeProperties: {borderWidth:3, shape:'box', font:{size:30}}
-      }
+      };
       network.clusterByHubsize(undefined, clusterOptionsByData);
   }
 

index.html

@@ -28,7 +28,7 @@
 
     <script src="./js/smooth-scroll.min.js"></script>
 
-    <script src="https://cdnjs.cloudflare.com/ajax/libs/vis/4.11.0/vis.min.js"></script>
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/vis/4.12.0/vis.min.js"></script>
 
     <script language="JavaScript">
         smoothScroll.init();
@@ -36,7 +36,7 @@
         function evalLinks() {
             if (typeof vis === 'undefined') {
                 console.log(document.getElementById("linkStatus"));
-                document.getElementById("linkStatus").innerHTML = "Note: The latest version (4.11.0) is not yet available on cdnjs, <a href='https://cdnjs.com/libraries/vis'>click here</a> to to pick the latest available version.<br />";
+                document.getElementById("linkStatus").innerHTML = "Note: The latest version (4.12.0) is not yet available on cdnjs, <a href='https://cdnjs.com/libraries/vis'>click here</a> to to pick the latest available version.<br />";
                 document.getElementById("cdn_vis").style.color = "rgb(150,150,150)";
                 document.getElementById("cdn_vis_css").style.color = "rgb(150,150,150)";
             }
@@ -210,13 +210,13 @@
                     <pre class="prettyprint">bower install vis</pre>
                     <h3>link from cdnjs.com</h3>
                     <p>
-                        <a id="cdn_vis" href="https://cdnjs.cloudflare.com/ajax/libs/vis/4.11.0/vis.min.js" target="_blank">vis.min.js</a> <br>
-                        <a id="cdn_vis_css" href="https://cdnjs.cloudflare.com/ajax/libs/vis/4.11.0/vis.min.css" target="_blank">vis.min.css</a> <br>
+                        <a id="cdn_vis" href="https://cdnjs.cloudflare.com/ajax/libs/vis/4.12.0/vis.min.js" target="_blank">vis.min.js</a> <br>
+                        <a id="cdn_vis_css" href="https://cdnjs.cloudflare.com/ajax/libs/vis/4.12.0/vis.min.css" target="_blank">vis.min.css</a> <br>
                         <span id="linkStatus"></span>
                     </p>
                     <h3>download</h3>
                     <p>
-                        <a href="download/vis.zip">vis.zip (version <span class="version">4.11.0</span>)</a>
+                        <a href="download/vis.zip">vis.zip (version <span class="version">4.12.0</span>)</a>
                     </p>
                 </div>
             </div>
@@ -304,7 +304,7 @@
                 <div class="valign_child">
                     <h2 class="featurette-heading">Licenses</h2>
                     <p class="lead">
-                        Copyright (C) 2010-2015 Almende B.V. <br /><br />
+                        Copyright (C) 2010-2016 Almende B.V. <br /><br />
                         Vis.js is dual licensed under both Apache 2.0 and MIT.<br /><br />
                         Vis.js may be distributed under either license.
                         <ul>
@@ -326,7 +326,7 @@
     <!-- FOOTER -->
     <footer>
         <p class="pull-right"><a href="#">Back to top</a></p>
-        <p>© 2015 Almende B.V.</p>
+        <p>© 2015-2016 Almende B.V.</p>
     </footer>
 
 </div><!-- /.container -->