From e3a101b31700f16628f82db02418b4a06d0faf56 Mon Sep 17 00:00:00 2001
From: "Alex J. Best" <alex.j.best@gmail.com>
Date: Thu, 16 Dec 2021 03:59:25 +0100
Subject: [PATCH 1/5] attempt to add search

---
 index.html | 53 +++++++++++++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 53 insertions(+)

diff --git a/index.html b/index.html
index a3cc64d..0a78047 100644
--- a/index.html
+++ b/index.html
@@ -96,6 +96,11 @@
     Node sizes indicate the number of declarations in the file.</p>
 
     <label><input type="checkbox" id="pause" checked/> Pause graph layout</label>
+    <div id="search">
+      <input type="search" id="search-input" list="suggestions" placeholder="Try searching for a node...">
+      <datalist id="suggestions"><option value="Myriel"></option>
+      </datalist>
+    </div>
   </div>
   <div class="key-wrapper">
     <ul id="key"></ul>
@@ -395,6 +400,54 @@
     },
   });
 
+    const state = {
+        searchQuery: ""
+    };
+    // Feed the datalist autocomplete values:
+
+    searchSuggestions.innerHTML = graph.nodes().map(node=>"<option value=\"".concat(graph.getNodeAttribute(node, "label"), "\"></option>")).join("\n");
+    // Actions:
+
+    function setSearchQuery(query) {
+        state.searchQuery = query;
+        if (searchInput.value !== query)
+            searchInput.value = query;
+
+        if (query) {
+            const lcQuery = query.toLowerCase();
+            const suggestions = graph.nodes().map(n=>({
+                id: n,
+                label: graph.getNodeAttribute(n, "label")
+            })).filter(({label})=>label.toLowerCase().includes(lcQuery));
+            // If we have a single perfect match, them we remove the suggestions, and
+            // we consider the user has selected a node through the datalist
+            // autocomplete:
+
+            if (suggestions.length === 1 && suggestions[0].label === query) {
+                state.selectedNode = suggestions[0].id;
+                state.suggestions = undefined;
+                // Move the camera to center it on the selected node:
+
+                const nodePosition = renderer.getNodeDisplayData(state.selectedNode);
+                renderer.getCamera().animate(nodePosition, {
+                    duration: 500
+                });
+            }// Else, we display the suggestions list:
+            else {
+                state.selectedNode = undefined;
+                state.suggestions = new Set(suggestions.map(({id})=>id));
+            }
+        }// If the query is empty, then we reset the selectedNode / suggestions state:
+        else {
+            state.selectedNode = undefined;
+            state.suggestions = undefined;
+        }
+        // Refresh rendering:
+
+        renderer.refresh();
+    }
+
+
   let statusElem = document.getElementById('statusWrapper');
   let statusMsgElem = document.getElementById('statusMessage');
   let setStatus = function(html) {

From af58feebd1681213b1e4b263a25629d22258159c Mon Sep 17 00:00:00 2001
From: "Alex J. Best" <alex.j.best@gmail.com>
Date: Thu, 16 Dec 2021 04:00:54 +0100
Subject: [PATCH 2/5] fix

---
 index.html | 4 +---
 1 file changed, 1 insertion(+), 3 deletions(-)

diff --git a/index.html b/index.html
index 0a78047..3507cf2 100644
--- a/index.html
+++ b/index.html
@@ -169,6 +169,7 @@
 
   // interaction state
   var state = {
+    searchQuery: "",
     hoveredNode: undefined,
     hoveredDescendants: undefined,
     hoveredPath: undefined,
@@ -400,9 +401,6 @@
     },
   });
 
-    const state = {
-        searchQuery: ""
-    };
     // Feed the datalist autocomplete values:
 
     searchSuggestions.innerHTML = graph.nodes().map(node=>"<option value=\"".concat(graph.getNodeAttribute(node, "label"), "\"></option>")).join("\n");

From c9692f1862a946448f45a0df1099322b0606e25d Mon Sep 17 00:00:00 2001
From: "Alex J. Best" <alex.j.best@gmail.com>
Date: Thu, 16 Dec 2021 04:04:30 +0100
Subject: [PATCH 3/5] fix

---
 index.html | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/index.html b/index.html
index 3507cf2..afed096 100644
--- a/index.html
+++ b/index.html
@@ -166,6 +166,8 @@
   let pause = document.getElementById('pause');
   let graph = graphologyLibrary.gexf.parse(graphology.Graph, gexf);
   let rev_graph = graphologyLibrary.operators.reverse(graph);
+  let searchInput = document.getElementById("search-input");
+  let searchSuggestions = document.getElementById("suggestions");
 
   // interaction state
   var state = {

From da5babfa03eb0efb3b405d2abe44f125246ffd97 Mon Sep 17 00:00:00 2001
From: "Alex J. Best" <alex.j.best@gmail.com>
Date: Thu, 16 Dec 2021 04:12:29 +0100
Subject: [PATCH 4/5] fix

---
 index.html | 9 +++++++++
 1 file changed, 9 insertions(+)

diff --git a/index.html b/index.html
index afed096..19d46a5 100644
--- a/index.html
+++ b/index.html
@@ -447,6 +447,15 @@
         renderer.refresh();
     }
 
+    searchInput.addEventListener("input", ()=>{
+        setSearchQuery(searchInput.value || "");
+    }
+    );
+    searchInput.addEventListener("blur", ()=>{
+        setSearchQuery("");
+    }
+    );
+
 
   let statusElem = document.getElementById('statusWrapper');
   let statusMsgElem = document.getElementById('statusMessage');

From 81e7a59311fa0f9763c878214bc9fe537875d658 Mon Sep 17 00:00:00 2001
From: "Alex J. Best" <alex.j.best@gmail.com>
Date: Sat, 25 Dec 2021 21:28:49 +0100
Subject: [PATCH 5/5] use infersettings

---
 index.html | 17 +++++++++--------
 1 file changed, 9 insertions(+), 8 deletions(-)

diff --git a/index.html b/index.html
index 19d46a5..963d43e 100644
--- a/index.html
+++ b/index.html
@@ -297,14 +297,15 @@
     node_data.y = 0.1*r * Math.sin(theta * 2 * Math.PI);
   }
 
-  var force_atlas_settings = {
-    barnesHutOptimize: false,
-    strongGravityMode: false,
-    gravity: 0.05,
-    scalingRatio: 10,
-    slowDown: 10,
-    edgeWeightInfluence: 1,
-  };
+  var force_atlas_settings =graphologyLibrary.layoutForceAtlas2.inferSettings(graph);
+
+//    barnesHutOptimize: false,
+//    strongGravityMode: false,
+//    gravity: 0.05,
+//    scalingRatio: 10,
+//    slowDown: 10,
+//    edgeWeightInfluence: 1,
+//  };
 
   // run the optimizer a little
   graphologyLibrary.layoutForceAtlas2.assign(graph, {