Implement notebook loading. Add ARP example notebook

frontend/index.html

@@ -53,12 +53,13 @@
 			<option value='localhost'>
 		</datalist>
 
-		Notebook <input type='text' id='notebook-name' list='notebook-names' placeholder='Name of a notebook' value='default'/>
-		<datalist id='notebook-names'>
+		Notebook
+		<select id='notebook-name'>
 			<!-- FIXME load list automatically -->
-			<option value='default'>
-			<option value='systemd'>
-		</datalist>
+			<option default>default</option>
+			<option>systemd</option>
+			<option>arp</option>
+		</select>
 	</div>
 
 	<div class='main' id='settings'>
@@ -101,12 +102,6 @@ <h2>Backend Endpoint</h2>
 		(async function() {
 			'use strict';
 
-			let response = await fetch("/notebooks/default.md");
-			window.initialNotebookContent = await response.text();			
-
-			/* Async module load to ensure above webpack workaround is done 
-			   and we have loaded the initial notebook markdown */
-			await import('./node_modules/starboard-notebook/dist/starboard-notebook.js');
 			setupApp();
 		})();
 	</script>

frontend/inter.var.woff2

@@ -0,0 +1 @@
+node_modules/starboard-notebook/dist/inter.var.woff2

frontend/js/app.js

@@ -1,15 +1,15 @@
 // vim: set ts=4 sw=4:
 /* jshint esversion: 6 */
 
-import { registerStarboardShellCellType } from './notebook.js';
+import { setupNotebook } from './notebook.js';
 import { settingsDialog, settingsLoad } from './settings.js';
 import { ProbeAPI } from './probeapi.js';
 
 import { perfRenderer } from './renderer/perf-flamegraph.js';
 import { netmapRenderer } from './renderer/netmap.js';
 
-var hosts = {};
-var renderers = {
+const params = new URLSearchParams(window.location.search);
+const renderers = {
         'netmap': netmapRenderer,
         'perfFlameGraph': perfRenderer
 };
@@ -316,8 +316,12 @@ function setupApp() {
                 $('#menu a').on('click', function() {
                         view($(this).attr('data-view'));
                 });
-                view('main');
-                registerStarboardShellCellType();
+
+                view(params.get('view')?params.get('view'):'main');
+                setupNotebook(
+                        params.get('host'),
+                        params.get('notebook')
+                );
 
                 $('#renderer').on('change', function() {
                         visualizeHost($('#visualizedHost').text(), $(this).val());

frontend/js/notebook.js

@@ -91,4 +91,32 @@ function registerStarboardShellCellType() {
         runtime.definitions.cellTypes.register("shell", SHELL_CELL_TYPE_DEFINITION);
 }
 
-export { registerStarboardShellCellType };
+function reloadNotebook() {
+        var n = $('#notebook-name').find("option:selected").val();
+        var h = $('#notebook-host').val();
+
+        window.location.href = `/?view=notebook&notebook=${n}&host=${h}`;
+}
+
+async function setupNotebook(host, name) {
+        if (!host)
+                host = 'localhost';
+        if (!name)
+                name = 'default';
+
+        $('#notebook-name').val(name);
+        $('#notebook-host').val(host);
+
+        let response = await fetch(`/notebooks/${name}.md`);
+        window.initialNotebookContent = await response.text();			
+
+        /* Async module load to ensure we have loaded the initial notebook markdown above */
+        import('../node_modules/starboard-notebook/dist/starboard-notebook.js').then(() => {
+                registerStarboardShellCellType();
+
+                $('#notebook-name').on('change', reloadNotebook);
+                $('#notebook-host').on('change', reloadNotebook);
+        });
+}
+
+export { setupNotebook };

frontend/notebooks/arp.md

@@ -0,0 +1,52 @@
+# %% [markdown]
+## ARP Debugging
+
+### Kernel Settings
+
+Check wether ARP ignoring is active. If you want ARP resolving the `arp_ignore` value should be 1
+# %% [shell]
+sysctl net.ipv4.conf.all.arp_ignore
+# %% [markdown]
+Check ARP garbage collection settings:
+# %% [shell]
+sysctl -a 2>/dev/null | grep net.ipv4.neigh.default.gc
+# %% [markdown]
+A typical problem on routers or large k8s cluster node is that the nodes ARP cache runs full because `gc_thres3` is to small. Note also that when `gc_thres1` is larger than the set of entries you usually cache no eviction will ever happen. 
+
+\
+Check ARP cache timeout settings:
+# %% [shell]
+sysctl -a 2>/dev/null | grep net.ipv4.neigh.default.base_reachable
+# %% [markdown]
+While you can query settings per network interface via `sysctl` too it’s easier to use `ip ntable show` to get an overview of effective settings per network interface:
+# %% [shell]
+ip ntable show 
+# %% [markdown]
+### Clear Cache
+
+To clear the complete cache run
+# %% [shell]
+ip -s -s neigh flush all
+# %% [markdown]
+You can also run `arp -d `. To delete individual items run:
+# %% [shell]
+arp -d <ip>
+# %% [markdown]
+
+### Show Cache
+
+Print ARP cache with `ip neigh`
+# %% [shell]
+ip neigh
+# %% [markdown]
+Note how valid entries are marked as `REACHABLE` outdated entries are marked as `STALE`
+
+\
+Or if ARP tools are installed print ARP cache with `arp -a` or `arp -n` for table format.
+# %% [shell]
+arp -a
+# %% [markdown]
+### Further Reading
+
+* <https://www.baeldung.com/linux/arp-settings>
+* <https://manpages.debian.org/bullseye/manpages/arp.7.en.html>