From f9c2da77d1af1bc3ac93e94147edfee1f9fe185e Mon Sep 17 00:00:00 2001
From: Alex de Mulder <alexdemulder@gmail.com>
Date: Wed, 13 Jan 2016 10:35:50 +0100
Subject: [PATCH] reverted examples

---
 .../network/layout/hierarchicalLayout.html    |  60 +----
 .../layout/hierarchicalLayoutMethods.html     |  15 +-
 .../layout/hierarchicalLayoutUserdefined.html | 209 +++++++++---------
 3 files changed, 116 insertions(+), 168 deletions(-)

diff --git a/examples/network/layout/hierarchicalLayout.html b/examples/network/layout/hierarchicalLayout.html
index 9ddb5935..d827814c 100644
--- a/examples/network/layout/hierarchicalLayout.html
+++ b/examples/network/layout/hierarchicalLayout.html
@@ -9,8 +9,8 @@
         }
 
         #mynetwork {
-            width: 1700px;
-            height: 800px;
+            width: 600px;
+            height: 600px;
             border: 1px solid lightgray;
         }
     </style>
@@ -34,76 +34,28 @@
 
         function draw() {
             destroy();
-
-            nodes = [];
-            edges = [];
             // randomly create some nodes and edges
             var nodeCount = document.getElementById('nodeCount').value;
-            for (var i = 0; i < 19; i++) {
-                nodes.push({id: i, label: String(i)});
-            }
-            edges.push({from: 0, to: 1});
-            edges.push({from: 0, to: 6});
-            edges.push({from: 0, to: 13});
-            edges.push({from: 0, to: 11});
-            edges.push({from: 1, to: 2});
-            edges.push({from: 2, to: 3});
-            edges.push({from: 2, to: 4});
-            edges.push({from: 3, to: 5});
-            edges.push({from: 1, to: 10});
-            edges.push({from: 1, to: 7});
-            edges.push({from: 2, to: 8});
-            edges.push({from: 2, to: 9});
-            edges.push({from: 3, to: 14});
-            edges.push({from: 1, to: 12});
-            edges.push({from: 16, to: 15});
-            edges.push({from: 15, to: 17});
-            edges.push({from: 18, to: 17});
+            var data = getScaleFreeNetwork(nodeCount)
 
+            // create a network
             var container = document.getElementById('mynetwork');
-            var data = {
-                nodes: nodes,
-                edges: edges
-            };
             var directionInput = document.getElementById("direction").value;
             var options = {
                 layout: {
                     hierarchical: {
-                        sortMethod: 'hubsize',
                         direction: directionInput
                     }
-                },
-                physics:false
+                }
             };
             network = new vis.Network(container, data, options);
-            fireall()
+
             // add event listeners
             network.on('select', function (params) {
                 document.getElementById('selection').innerHTML = 'Selection: ' + params.nodes;
             });
         }
 
-        function fireall() {
-            if (callbackIndex < CALLBACKS.length -1) {
-                CALLBACKS[callbackIndex]();
-                callbackIndex++;
-                fireall()
-            }
-        }
-        function fireCallback() {
-            if (callbackIndex < CALLBACKS.length -1) {
-                CALLBACKS[callbackIndex]();
-                callbackIndex++;
-            }
-            else {
-                alert("no more callbacks");
-            }
-
-        }
-
-        var callbackIndex = 0;
-        var CALLBACKS = [];
-
     </script>
     <script src="../../googleAnalytics.js"></script>
 </head>
diff --git a/examples/network/layout/hierarchicalLayoutMethods.html b/examples/network/layout/hierarchicalLayoutMethods.html
index 0c4c2392..51f55267 100644
--- a/examples/network/layout/hierarchicalLayoutMethods.html
+++ b/examples/network/layout/hierarchicalLayoutMethods.html
@@ -19,7 +19,7 @@
 
   <script type="text/javascript">
     var network = null;
-    var layoutMethod = "hubsize";
+    var layoutMethod = "directed";
 
     function destroy() {
       if (network !== null) {
@@ -34,7 +34,7 @@
       var nodes = [];
       var edges = [];
       // randomly create some nodes and edges
-      for (var i = 0; i < 20; i++) {
+      for (var i = 0; i < 19; i++) {
         nodes.push({id: i, label: String(i)});
       }
       edges.push({from: 0, to: 1});
@@ -51,13 +51,6 @@
       edges.push({from: 2, to: 9});
       edges.push({from: 3, to: 14});
       edges.push({from: 1, to: 12});
-
-      edges.push({from: 0, to: 19});
-      edges.push({from: 19, to: 2});
-      edges.push({from: 19, to: 10});
-      edges.push({from: 19, to: 7});
-      edges.push({from: 19, to: 12});
-
       edges.push({from: 16, to: 15});
       edges.push({from: 15, to: 17});
       edges.push({from: 18, to: 17});
@@ -78,9 +71,7 @@
         edges: {
           smooth: true,
           arrows: {to : true }
-        },
-//        physics:false
-
+        }
       };
       network = new vis.Network(container, data, options);
     }
diff --git a/examples/network/layout/hierarchicalLayoutUserdefined.html b/examples/network/layout/hierarchicalLayoutUserdefined.html
index db2039b6..dd77bb6b 100644
--- a/examples/network/layout/hierarchicalLayoutUserdefined.html
+++ b/examples/network/layout/hierarchicalLayoutUserdefined.html
@@ -1,120 +1,125 @@
 <!doctype html>
 <html>
 <head>
-  <title>Network | Hierarchical Layout, userDefined</title>
-
-  <style type="text/css">
-    body {
-      font: 10pt sans;
-    }
-    #mynetwork {
-      width: 600px;
-      height: 600px;
-      border: 1px solid lightgray;
-    }
-  </style>
+    <title>Network | Hierarchical Layout, userDefined</title>
+
+    <style type="text/css">
+        body {
+            font: 10pt sans;
+        }
+
+        #mynetwork {
+            width: 600px;
+            height: 600px;
+            border: 1px solid lightgray;
+        }
+    </style>
     <script type="text/javascript" src="../../../dist/vis.js"></script>
-    <link href="../../../dist/vis.css" rel="stylesheet" type="text/css" />
+    <link href="../../../dist/vis.css" rel="stylesheet" type="text/css"/>
 
 
-  <script type="text/javascript">
-    var nodes = null;
-    var edges = null;
-    var network = null;
-    var directionInput = document.getElementById("direction");
+    <script type="text/javascript">
+        var nodes = null;
+        var edges = null;
+        var network = null;
+        var directionInput = document.getElementById("direction");
 
-    function destroy() {
-        if (network !== null) {
-            network.destroy();
-            network = null;
-        }
-    }
-
-    function draw() {
-      destroy();
-      nodes = [];
-      edges = [];
-      var connectionCount = [];
-
-      // randomly create some nodes and edges
-      for (var i = 0; i < 15; i++) {
-          nodes.push({id: i,label: String(i)});
-      }
-      edges.push({from: 0, to: 1 });
-      edges.push({from: 0, to: 6 });
-      edges.push({from: 0, to: 13});
-      edges.push({from: 0, to: 11});
-      edges.push({from: 1, to: 2 });
-      edges.push({from: 2, to: 3 });
-      edges.push({from: 2, to: 4 });
-      edges.push({from: 3, to: 5 });
-      edges.push({from: 1, to: 10});
-      edges.push({from: 1, to: 7 });
-      edges.push({from: 2, to: 8 });
-      edges.push({from: 2, to: 9 });
-      edges.push({from: 3, to: 14});
-      edges.push({from: 1, to: 12});
-      nodes[0]["level"] = 0;
-      nodes[1]["level"] = 1;
-      nodes[2]["level"] = 3;
-      nodes[3]["level"] = 4;
-      nodes[4]["level"] = 4;
-      nodes[5]["level"] = 5;
-      nodes[6]["level"] = 1;
-      nodes[7]["level"] = 2;
-      nodes[8]["level"] = 4;
-      nodes[9]["level"] = 4;
-      nodes[10]["level"] = 2;
-      nodes[11]["level"] = 1;
-      nodes[12]["level"] = 2;
-      nodes[13]["level"] = 1;
-      nodes[14]["level"] = 5;
-
-      // create a network
-      var container = document.getElementById('mynetwork');
-      var data = {
-        nodes: nodes,
-        edges: edges
-      };
-
-    var options = {
-        edges: {
-            smooth: {
-                type:'cubicBezier',
-                forceDirection: (directionInput.value == "UD" || directionInput.value == "DU") ? 'vertical' : 'horizontal',
-                roundness: 0.4
-            }
-        },
-        layout: {
-            hierarchical:{
-                direction: directionInput.value
+        function destroy() {
+            if (network !== null) {
+                network.destroy();
+                network = null;
             }
         }
-    };
-      network = new vis.Network(container, data, options);
 
-      // add event listeners
-      network.on('select', function(params) {
-        document.getElementById('selection').innerHTML = 'Selection: ' + params.nodes;
-      });
-    }
+        function draw() {
+            destroy();
+            nodes = [];
+            edges = [];
+            var connectionCount = [];
 
-  </script>
-  <script src="../../googleAnalytics.js"></script>
+            // randomly create some nodes and edges
+            for (var i = 0; i < 15; i++) {
+                nodes.push({id: i, label: String(i)});
+            }
+            edges.push({from: 0, to: 1});
+            edges.push({from: 0, to: 6});
+            edges.push({from: 0, to: 13});
+            edges.push({from: 0, to: 11});
+            edges.push({from: 1, to: 2});
+            edges.push({from: 2, to: 3});
+            edges.push({from: 2, to: 4});
+            edges.push({from: 3, to: 5});
+            edges.push({from: 1, to: 10});
+            edges.push({from: 1, to: 7});
+            edges.push({from: 2, to: 8});
+            edges.push({from: 2, to: 9});
+            edges.push({from: 3, to: 14});
+            edges.push({from: 1, to: 12});
+            nodes[0]["level"] = 0;
+            nodes[1]["level"] = 1;
+            nodes[2]["level"] = 3;
+            nodes[3]["level"] = 4;
+            nodes[4]["level"] = 4;
+            nodes[5]["level"] = 5;
+            nodes[6]["level"] = 1;
+            nodes[7]["level"] = 2;
+            nodes[8]["level"] = 4;
+            nodes[9]["level"] = 4;
+            nodes[10]["level"] = 2;
+            nodes[11]["level"] = 1;
+            nodes[12]["level"] = 2;
+            nodes[13]["level"] = 1;
+            nodes[14]["level"] = 5;
+
+
+            // create a network
+            var container = document.getElementById('mynetwork');
+            var data = {
+                nodes: nodes,
+                edges: edges
+            };
+
+            var options = {
+                edges: {
+                    smooth: {
+                        type: 'cubicBezier',
+                        forceDirection: (directionInput.value == "UD" || directionInput.value == "DU") ? 'vertical' : 'horizontal',
+                        roundness: 0.4
+                    }
+                },
+                layout: {
+                    hierarchical: {
+                        direction: directionInput.value
+                    }
+                },
+                physics:false
+            };
+            network = new vis.Network(container, data, options);
+
+            // add event listeners
+            network.on('select', function (params) {
+                document.getElementById('selection').innerHTML = 'Selection: ' + params.nodes;
+            });
+        }
+
+    </script>
+    <script src="../../googleAnalytics.js"></script>
 </head>
 
 <body onload="draw();">
 <h2>Hierarchical Layout - User-defined</h2>
+
 <div style="width:700px; font-size:14px; text-align: justify;">
-    This example shows a user-defined hierarchical layout. If the user defines levels for nodes but does not do so for all nodes, an alert will show up and hierarchical layout will be disabled. Either all or none can be defined.
+    This example shows a user-defined hierarchical layout. If the user defines levels for nodes but does not do so for
+    all nodes, an alert will show up and hierarchical layout will be disabled. Either all or none can be defined.
     If the smooth curves appear to be inverted, the direction of the edge is not in the same direction as the network.
 </div>
 <p>
-  <input type="button" id="btn-UD" value="Up-Down">
-  <input type="button" id="btn-DU" value="Down-Up">
-  <input type="button" id="btn-LR" value="Left-Right">
-  <input type="button" id="btn-RL" value="Right-Left">
-  <input type="hidden" id='direction' value="UD">
+    <input type="button" id="btn-UD" value="Up-Down">
+    <input type="button" id="btn-DU" value="Down-Up">
+    <input type="button" id="btn-LR" value="Left-Right">
+    <input type="button" id="btn-RL" value="Right-Left">
+    <input type="hidden" id='direction' value="UD">
 </p>
 
 <div id="mynetwork"></div>
@@ -123,22 +128,22 @@
 <script language="JavaScript">
     var directionInput = document.getElementById("direction");
     var btnUD = document.getElementById("btn-UD");
-    btnUD.onclick = function() {
+    btnUD.onclick = function () {
         directionInput.value = "UD";
         draw();
     };
     var btnDU = document.getElementById("btn-DU");
-    btnDU.onclick = function() {
+    btnDU.onclick = function () {
         directionInput.value = "DU";
         draw();
     };
     var btnLR = document.getElementById("btn-LR");
-    btnLR.onclick = function() {
+    btnLR.onclick = function () {
         directionInput.value = "LR";
         draw();
     };
     var btnRL = document.getElementById("btn-RL");
-    btnRL.onclick = function() {
+    btnRL.onclick = function () {
         directionInput.value = "RL";
         draw();
     };