last changes before BREAKING some shit|

dist/app.js

@@ -5069,7 +5069,7 @@ var app = (function (exports) {
           this.active_page = null;
           // this.nodes = {};
           this.simulation = forceSimulation()
-              .velocityDecay(0.1)
+              //.velocityDecay(0.1)
               .force("link", forceLink().id(d => d.title))
               .force("charge", forceManyBody())
               .force("radial", forceRadial(180, width/2, height/2));
@@ -5085,7 +5085,7 @@ var app = (function (exports) {
       init_svg (svg) {
           this.svg = select(svg || "svg");
           this.zoom = zoom()
-              .scaleExtent([1 / 16, 4])
+              .scaleExtent([1 / 16, 16])
               .on("zoom", () => {
                 this.content.attr("transform", event.transform);
                 // console.log("transform", event.transform, this.content.attr("transform"));
@@ -5296,7 +5296,7 @@ var app = (function (exports) {
           this.historylinks = {};
           this.links = null;
           this.highlight_category = null;
-          this.show_history = false;
+          this.show_history = true;
       }
 
       nodeclick (d, elt) {
@@ -5413,6 +5413,28 @@ var app = (function (exports) {
           cat.append("span").attr("class", "count").html(d => d.tcount);
       }
 
+      async load_legend (src, elt) {
+          var data = await json(src);
+          console.log("load_legend", data);
+          var cat = select(elt)
+              .selectAll("div.cat")
+              .data(data)
+              .enter()
+              .append("div")
+              .attr("class", "cat icon");
+          cat.append("span")
+              .attr("class", "icon")
+              .style("background-image", d => "url("+d.icon+")");
+          cat.append("a")
+              .attr("class", "label")
+              .html(d => d.key)
+              .attr("href", "#").on("click", d => {
+                  event.preventDefault();
+                  this.category_click(d);
+              });
+          cat.append("span").attr("class", "count").html(d => d.tcount);
+      }
+
       category_click (d) {
           console.log("category click", d);
           if (this.highlight_category) {

dist/index.js

@@ -4,6 +4,7 @@
 //     document.getElementById("debug"));
 
 var svg = document.querySelector("#svg"),
+    page = document.querySelector("#page"),
     iframe = document.querySelector("iframe#wikiframe"),
     cats = document.querySelector("#cats"),
     cats_contents = document.querySelector("#cats .body"),
@@ -24,9 +25,14 @@ function resize() {
     g = d.getElementsByTagName('body')[0],
     x = w.innerWidth || e.clientWidth || g.clientWidth,
     y = w.innerHeight|| e.clientHeight|| g.clientHeight;
-    svg.setAttribute("width", x);
-    svg.setAttribute("height", y);
+    // svg.setAttribute("width", x);
+    // svg.setAttribute("height", y);
     //console.log("resize", x, y);
+
+    // Match size of parent
+    svg.setAttribute("width", page.clientWidth);
+    svg.setAttribute("height", page.clientHeight);
+
 }
 resize();
 
@@ -48,7 +54,8 @@ async function doload () {
     console.log("loading map");
     await map.load_json("data/sitemap.json");
     // console.log("loading categories");
-    // await map.load_cats("cats.json", cats_contents);
+    // await map.load_cats("data/cats.json", cats_contents);
+    await map.load_legend("src/legend.json", cats_contents);
     console.log("LOADED!");
     loaded = true;
     if (current_title) {