Rename back to DAO

README.md

@@ -1,9 +1,84 @@
 # Forum Logic
 
-This project is a javascript prototype for the DGF system. 
+This project is a Javascript prototype for the DGF system. 
 
 It implements the core algorithm described in [Craig Calcaterra (May 24, 2018) On-Chain Governance of Decentralized Autonomous Organizations](http://dx.doi.org/10.2139/ssrn.3188374).
 
+
+This project is implemented as a static site, and so may be downloaded and browsed offline, or served via HTTP.
+
+The `main` branch is [served](https://dao-governance-framework.gitlab.io/forum-logic) via GitLab Pages.
+
+# Development
+
+For a more convenient local URL,
+
+Add `forum.dev` as an alias for `127.0.0.1` in your `/etc/hosts` file
+
+Install [mkcert](https://github.com/FiloSottile/mkcert/#installation) 
+
+Install [nginx](https://nginx.org/en/docs/install.html)
+
+Add the root CA for self-signed certificates
+
+```bash
+mkcert -install
+```
+
+Generate a certificate for `forum.dev`
+
+```bash
+mkcert forum.dev
+```
+
+Move the certificate to nginx config directory
+
+```bash
+sudo mkdir -p /etc/nginx/certs
+sudo cp forum.dev{,-key}.pem /etc/nginx/certs/
+```
+
+Make your home directory readable to the webserver. One way to do this is to add the webserver daemon's user to your user group. The following command would work if your user's group has the same name as your user, and the webserver user is `www-data`:
+
+```bash
+sudo groupmems --group $USER --add www-data
+```
+
+Configure `nginx` by adding a file `/etc/nginx/sites-available/forum_dev`, with content similar to the following:
+
+```nginx
+server {
+        listen 443 ssl;
+
+        server_name forum.dev;
+        ssl_certificate     /etc/nginx/certs/forum.dev.pem;
+        ssl_certificate_key /etc/nginx/certs/forum.dev-key.pem;
+
+        root /home/ladd/dgf/forum-logic/src/;
+        index index.html;
+
+        location / {
+                try_files $uri $uri/ =404;
+        }
+}
+```
+
+Replace `/home/ladd/dgf/forum-logic` with the path to this repository on your filesystem
+
+Enable the site
+
+```bash
+sudo ln -s /etc/nginx/sites-available/forum_dev /etc/nginx/sites-enabled/
+```
+
+Now restart `nginx` and the site should be available at https://forum.dev.
+
+```bash
+sudo systemctl restart nginx
+```
+
+Note that browsers may cache assets, so after modifying source code, you may need to refresh your browser while holding `Shift` to bypass the browser cache.
+
 # TODO
 
 - Move `actor.js` and `action.js` out of `display/`. To `supporting`?

src/classes/display/box.js

@@ -22,8 +22,11 @@ export class Box {
     }
   }
 
-  flex() {
+  flex({ center = false } = {}) {
     this.addClass('flex');
+    if (center) {
+      this.addClass('flex-center');
+    }
     return this;
   }
 

src/classes/display/form.js

@@ -42,10 +42,11 @@ export class Button extends FormElement {
 export class TextField extends FormElement {
   constructor(name, form, opts) {
     super(name, form, opts);
+    this.flex({ center: true });
     this.label = document.createElement('label');
     this.labelDiv = document.createElement('div');
     this.label.appendChild(this.labelDiv);
-    this.labelDiv.innerHTML = name;
+    this.labelDiv.innerHTML = opts.label || name;
     this.input = document.createElement('input');
     this.input.disabled = !!opts.disabled;
     this.input.defaultValue = opts.defaultValue || '';
@@ -99,9 +100,10 @@ export class FileInput extends FormElement {
     this.input = document.createElement('input');
     this.input.type = 'file';
     this.input.accept = 'application/json';
-    // this.input.classList.add('visually-hidden')
+    this.input.classList.add('visually-hidden');
     this.label = document.createElement('label');
-    this.label.innerHTML = name;
+    this.button = form.button({ name, cb: () => this.input.click() }).lastItem;
+    this.label.appendChild(this.button.el);
     this.label.appendChild(this.input);
     this.el.appendChild(this.label);
   }
@@ -148,7 +150,7 @@ export class Form extends Box {
   }
 
   fileInput(opts) {
-    this.items.push(new FileInput(opts.label || opts.name, this, opts));
+    this.items.push(new FileInput(opts.name, this, opts));
     return this;
   }
 

src/classes/supporting/vertex.js

@@ -144,14 +144,14 @@ export class Vertex {
       });
 
       doc.remark('<h3>New Edge</h3>', { parentEl: form.el });
-      const { subForm } = form.subForm({ name: 'newEdge' }).lastItem;
+      const newEdgeForm = doc.form({ name: 'newEdge' }).lastElement;
-      subForm.textField({ name: 'to' });
+      newEdgeForm.textField({ name: 'to' });
-      subForm.textField({ name: 'type' });
+      newEdgeForm.textField({ name: 'type' });
-      subForm.textField({ name: 'weight' });
+      newEdgeForm.textField({ name: 'weight' });
-      subForm.button({
+      newEdgeForm.submit({
         name: 'Save',
         cb: ({ form: { value: { to, type, weight } } }) => {
-          graph.addEdge(type, vertex, to, weight, null);
+          graph.setEdgeWeight(type, vertex, to, weight, null);
           doc.clear();
           Edge.prepareEditorDocument(graph, doc, vertex.id, to);
         },
@@ -162,6 +162,7 @@ export class Vertex {
       id: 'cancel',
       name: 'Cancel',
       cb: () => graph.resetEditor(),
+      parentEl: doc.el,
     });
 
     return doc;

src/classes/supporting/wdg.js

@@ -119,43 +119,59 @@ export class WeightedDirectedGraph {
     this.scene?.withSectionFlowchart();
     this.flowchart = this.scene?.lastFlowchart;
     if (this.editable) {
+      this.controlDoc = new Document('WDGControl', this.flowchart.box.el, { prepend: true });
       this.editorDoc = new Document('WDGEditor', this.flowchart.box.el);
       this.errorDoc = new Document('WDGErrors', this.flowchart.box.el);
-      this.controlDoc = new Document('WDGControl', this.flowchart.box.el, { prepend: true });
       this.resetEditor();
     }
     return this;
   }
 
+  prepareControlDoc() {
+    const form = this.controlDoc.form({ name: 'controlForm' }).lastElement;
+    const { subForm: graphPropertiesForm } = form.subForm({ name: 'graphPropsForm' }).lastItem;
+    graphPropertiesForm.flex()
+      .textField({ name: 'name', label: 'Graph name', defaultValue: this.name })
+      .submit({
+        name: 'Save',
+        cb: (({ form: { value: { name } } }) => {
+          this.name = name;
+        }),
+      });
+    const { subForm: exportImportForm } = form.subForm({ name: 'exportImportForm' }).lastItem;
+    exportImportForm.flex()
+      .button({
+        name: 'Export',
+        cb: () => {
+          const a = window.document.createElement('a');
+          const json = JSON.stringify(this.toJSON(), null, 2);
+          const currentTime = Math.floor(new Date().getTime() / 1000);
+          a.href = `data:attachment/text,${encodeURI(json)}`;
+          a.target = '_blank';
+          a.download = `wdg_${this.name}_${currentTime}.json`;
+          a.click();
+        },
+      })
+      .fileInput({
+        name: 'Import',
+        cb: ({ input: { files: [file] } }) => {
+          const reader = new FileReader();
+          reader.onload = ({ target: { result: text } }) => {
+            console.log('imported file', { file });
+            // this.flowchart?.log(`%% Imported file ${file}`)
+            const data = JSON.parse(text);
+            this.fromJSON(data);
+          };
+          reader.readAsText(file);
+        },
+      });
+  }
+
   resetEditor() {
     this.editorDoc.clear();
     this.controlDoc.clear();
+    this.prepareControlDoc();
     Vertex.prepareEditorDocument(this, this.editorDoc);
-    const form = this.controlDoc.form({ name: 'controlForm' }).lastElement;
-    form.button({
-      name: 'Download',
-      label: 'Export',
-      cb: () => {
-        const a = window.document.createElement('a');
-        const json = JSON.stringify(this.toJSON(), null, 2);
-        const currentTime = Math.floor(new Date().getTime() / 1000);
-        a.href = `data:attachment/text,${encodeURI(json)}`;
-        a.target = '_blank';
-        a.download = `wdg_${this.name}_${currentTime}.json`;
-        a.click();
-      },
-    });
-    form.fileInput({
-      label: 'Import',
-      cb: ({ input: { files: [file] } }) => {
-        const reader = new FileReader();
-        reader.onload = ({ target: { result: text } }) => {
-          const data = JSON.parse(text);
-          this.fromJSON(data);
-        };
-        reader.readAsText(file);
-      },
-    });
   }
 
   addVertex(type, id, data, label, options) {
@@ -220,10 +236,10 @@ export class WeightedDirectedGraph {
   addEdge(type, from, to, weight, data, options) {
     from = from instanceof Vertex ? from : this.getVertex(from);
     to = to instanceof Vertex ? to : this.getVertex(to);
-    const existingEdges = this.getEdges(type, from, to);
     if (this.getEdge(type, from, to)) {
       throw new Error(`Edge ${type} from ${from.id} to ${to.id} already exists`);
     }
+    const existingEdges = this.getEdges(null, from, to);
     const edge = this.setEdgeWeight(type, from, to, weight, data, options);
     from.edges.from.push(edge);
     to.edges.to.push(edge);

src/index.css

@@ -26,6 +26,9 @@ a:visited {
 .flex {
   display: flex;
 }
+.flex-center {
+  align-items: center;
+}
 .monospace {
   font-family: monospace;
 }
@@ -44,7 +47,8 @@ a:visited {
 }
 .scene-controls {
   position: relative;
-  left: 150px;
+  left: 12em;
+  top: -0.5em;
 }
 svg {
   width: 800px;
@@ -60,19 +64,20 @@ td {
   fill: #216262 !important;
 }
 button {
-  margin: 5px;
-  margin-top: 1em;
   background-color: #c6f4ff;
   border-color: #b6b6b6;
-  border-radius: 5px;
+}
+input {
+  margin: 1pt;
+}
+button, input[type=file] {
+  border-radius: 4pt;
+  margin: 4pt;
 }
 button:disabled {
   background-color: #2a535e;
   color: #919191;
 }
-label > input {
-  margin-left: 1em;
-}
 label {
   font-family: monospace;
   font-weight: bold;
@@ -81,7 +86,8 @@ label {
 }
 label > div {
   display: inline-block;
-  min-width: 50px;
+  min-width: 5em;
+  margin-right: 4pt;
 }
 table {
   width: 100%;
@@ -92,3 +98,12 @@ form {
 span.small {
   font-size: smaller;
 }
+.visually-hidden:not(:focus):not(:active) {
+  clip: rect(0 0 0 0);
+  clip-path: inset(50%);
+  height: 1px;
+  overflow: hidden;
+  position: absolute;
+  white-space: nowrap;
+  width: 1px;
+}

src/index.html

@@ -1,8 +1,9 @@
 <!DOCTYPE html>
 
 <head>
-  <title>DGF Tests</title>
+  <title>DGF Prototype</title>
   <link type="text/css" rel="stylesheet" href="./index.css" />
+  <script defer data-domain="dgov.io" src="https://plausible.io/js/script.js"></script>
 </head>
 
 <body>
@@ -14,7 +15,11 @@
     For more information please see the <a href="https://daogovernanceframework.com/wiki/DAO_Governance_Framework">DGF
       Wiki</a>.
   </p>
-  <h2>Javascript Prototype: Example Scenarios</h2>
+  <h2>Tools</h2>
+  <ul>
+    <li><a href="./wdg-editor">Weighted Directed Graph Editor</a></li>
+  </ul>
+  <h2>Example Scenarios</h2>
   <p>
     Below are example scenarios with various assertions covering features of our reputation system.
   </p>

src/tests/all.test.html

@@ -5,10 +5,11 @@
   <meta name="viewport" content="width=device-width, initial-scale=1.0" />
   <link rel="stylesheet" href="https://unpkg.com/mocha/mocha.css" />
   <link type="text/css" rel="stylesheet" href="../index.css" />
+  <script defer data-domain="dgov.io" src="https://plausible.io/js/script.js"></script>
 </head>
 
 <body>
-  <h2><a href="../">DGF Tests</a></h2>
+  <h2><a href="../">DGF Prototype</a></h2>
   <div id="mocha"></div>
   <div id="scene"></div>
 </body>

src/tests/availability.test.html

@@ -5,10 +5,11 @@
   <meta name="viewport" content="width=device-width, initial-scale=1.0" />
   <link rel="stylesheet" href="https://unpkg.com/mocha/mocha.css" />
   <link type="text/css" rel="stylesheet" href="../index.css" />
+  <script defer data-domain="dgov.io" src="https://plausible.io/js/script.js"></script>
 </head>
 
 <body>
-  <h2><a href="../">DGF Tests</a></h2>
+  <h2><a href="../">DGF Prototype</a></h2>
   <div id="mocha"></div>
   <div id="scene"></div>
 </body>

src/tests/basic.test.html

@@ -3,10 +3,11 @@
 <head>
   <title>Forum Network</title>
   <link type="text/css" rel="stylesheet" href="../index.css" />
+  <script defer data-domain="dgov.io" src="https://plausible.io/js/script.js"></script>
 </head>
 
 <body>
-  <h2><a href="../">DGF Tests</a></h2>
+  <h2><a href="../">DGF Prototype</a></h2>
   <div id="basic"></div>
 </body>
 <script type="module" src="./scripts/basic.test.js">

src/tests/basic2.test.html

@@ -3,10 +3,11 @@
 <head>
   <title>Forum Network</title>
   <link type="text/css" rel="stylesheet" href="../index.css" />
+  <script defer data-domain="dgov.io" src="https://plausible.io/js/script.js"></script>
 </head>
 
 <body>
-  <h2><a href="../">DGF Tests</a></h2>
+  <h2><a href="../">DGF Prototype</a></h2>
   <div id="basic"></div>
 </body>
 <script type="module" src="./scripts/basic2.test.js">

src/tests/business.test.html

@@ -5,10 +5,11 @@
   <meta name="viewport" content="width=device-width, initial-scale=1.0" />
   <link rel="stylesheet" href="https://unpkg.com/mocha/mocha.css" />
   <link type="text/css" rel="stylesheet" href="../index.css" />
+  <script defer data-domain="dgov.io" src="https://plausible.io/js/script.js"></script>
 </head>
 
 <body>
-  <h2><a href="../">DGF Tests</a></h2>
+  <h2><a href="../">DGF Prototype</a></h2>
   <div id="mocha"></div>
   <div id="scene"></div>
 </body>

src/tests/client1.test.html

@@ -5,10 +5,11 @@
   <meta name="viewport" content="width=device-width, initial-scale=1.0" />
   <link rel="stylesheet" href="https://unpkg.com/mocha/mocha.css" />
   <link type="text/css" rel="stylesheet" href="../index.css" />
+  <script defer data-domain="dgov.io" src="https://plausible.io/js/script.js"></script>
 </head>
 
 <body>
-  <h2><a href="../">DGF Tests</a></h2>
+  <h2><a href="../">DGF Prototype</a></h2>
   <div id="mocha"></div>
   <div id="scene"></div>
 </body>

src/tests/debounce.test.html

@@ -5,10 +5,11 @@
   <meta name="viewport" content="width=device-width, initial-scale=1.0" />
   <link rel="stylesheet" href="https://unpkg.com/mocha/mocha.css" />
   <link type="text/css" rel="stylesheet" href="../index.css" />
+  <script defer data-domain="dgov.io" src="https://plausible.io/js/script.js"></script>
 </head>
 
 <body>
-  <h2><a href="../">DGF Tests</a></h2>
+  <h2><a href="../">DGF Prototype</a></h2>
   <div id="mocha"></div>
   <div id="scene"></div>
 </body>

src/tests/document.test.html

@@ -5,10 +5,11 @@
   <meta name="viewport" content="width=device-width, initial-scale=1.0" />
   <link rel="stylesheet" href="https://unpkg.com/mocha/mocha.css" />
   <link type="text/css" rel="stylesheet" href="../index.css" />
+  <script defer data-domain="dgov.io" src="https://plausible.io/js/script.js"></script>
 </head>
 
 <body>
-  <h2><a href="../">DGF Tests</a></h2>
+  <h2><a href="../">DGF Prototype</a></h2>
   <div id="mocha"></div>
   <div id="scene"></div>
 </body>

src/tests/flowchart.test.html

@@ -3,10 +3,11 @@
 <head>
   <title>Flowchart test</title>
   <link type="text/css" rel="stylesheet" href="../index.css" />
+  <script defer data-domain="dgov.io" src="https://plausible.io/js/script.js"></script>
 </head>
 
 <body>
-  <h2><a href="../">DGF Tests</a></h2>
+  <h2><a href="../">DGF Prototype</a></h2>
   <div id="flowchart-test"></div>
 </body>
 <script type="module">

src/tests/forum1.test.html

@@ -5,10 +5,11 @@
   <meta name="viewport" content="width=device-width, initial-scale=1.0" />
   <link rel="stylesheet" href="https://unpkg.com/mocha/mocha.css" />
   <link type="text/css" rel="stylesheet" href="../index.css" />
+  <script defer data-domain="dgov.io" src="https://plausible.io/js/script.js"></script>
 </head>
 
 <body>
-  <h2><a href="../">DGF Tests</a></h2>
+  <h2><a href="../">DGF Prototype</a></h2>
   <div id="mocha"></div>
   <div id="scene"></div>
 </body>

src/tests/forum10.test.html

@@ -5,10 +5,11 @@
   <meta name="viewport" content="width=device-width, initial-scale=1.0" />
   <link rel="stylesheet" href="https://unpkg.com/mocha/mocha.css" />
   <link type="text/css" rel="stylesheet" href="../index.css" />
+  <script defer data-domain="dgov.io" src="https://plausible.io/js/script.js"></script>
 </head>
 
 <body>
-  <h2><a href="../">DGF Tests</a></h2>
+  <h2><a href="../">DGF Prototype</a></h2>
   <div id="mocha"></div>
   <div id="scene"></div>
 </body>

src/tests/forum11.test.html

@@ -5,10 +5,11 @@
   <meta name="viewport" content="width=device-width, initial-scale=1.0" />
   <link rel="stylesheet" href="https://unpkg.com/mocha/mocha.css" />
   <link type="text/css" rel="stylesheet" href="../index.css" />
+  <script defer data-domain="dgov.io" src="https://plausible.io/js/script.js"></script>
 </head>
 
 <body>
-  <h2><a href="../">DGF Tests</a></h2>
+  <h2><a href="../">DGF Prototype</a></h2>
   <div id="mocha"></div>
   <div id="scene"></div>
 </body>

src/tests/forum2.test.html

@@ -5,10 +5,11 @@
   <meta name="viewport" content="width=device-width, initial-scale=1.0" />
   <link rel="stylesheet" href="https://unpkg.com/mocha/mocha.css" />
   <link type="text/css" rel="stylesheet" href="../index.css" />
+  <script defer data-domain="dgov.io" src="https://plausible.io/js/script.js"></script>
 </head>
 
 <body>
-  <h2><a href="../">DGF Tests</a></h2>
+  <h2><a href="../">DGF Prototype</a></h2>
   <div id="mocha"></div>
   <div id="scene"></div>
 </body>

src/tests/forum3.test.html

@@ -5,10 +5,11 @@
   <meta name="viewport" content="width=device-width, initial-scale=1.0" />
   <link rel="stylesheet" href="https://unpkg.com/mocha/mocha.css" />
   <link type="text/css" rel="stylesheet" href="../index.css" />
+  <script defer data-domain="dgov.io" src="https://plausible.io/js/script.js"></script>
 </head>
 
 <body>
-  <h2><a href="../">DGF Tests</a></h2>
+  <h2><a href="../">DGF Prototype</a></h2>
   <div id="mocha"></div>
   <div id="scene"></div>
 </body>

src/tests/forum4.test.html

@@ -5,10 +5,11 @@
   <meta name="viewport" content="width=device-width, initial-scale=1.0" />
   <link rel="stylesheet" href="https://unpkg.com/mocha/mocha.css" />
   <link type="text/css" rel="stylesheet" href="../index.css" />
+  <script defer data-domain="dgov.io" src="https://plausible.io/js/script.js"></script>
 </head>
 
 <body>
-  <h2><a href="../">DGF Tests</a></h2>
+  <h2><a href="../">DGF Prototype</a></h2>
   <div id="mocha"></div>
   <div id="scene"></div>
 </body>

src/tests/forum5.test.html

@@ -5,10 +5,11 @@
   <meta name="viewport" content="width=device-width, initial-scale=1.0" />
   <link rel="stylesheet" href="https://unpkg.com/mocha/mocha.css" />
   <link type="text/css" rel="stylesheet" href="../index.css" />
+  <script defer data-domain="dgov.io" src="https://plausible.io/js/script.js"></script>
 </head>
 
 <body>
-  <h2><a href="../">DGF Tests</a></h2>
+  <h2><a href="../">DGF Prototype</a></h2>
   <div id="mocha"></div>
   <div id="scene"></div>
 </body>

src/tests/forum6.test.html

@@ -5,10 +5,11 @@
   <meta name="viewport" content="width=device-width, initial-scale=1.0" />
   <link rel="stylesheet" href="https://unpkg.com/mocha/mocha.css" />
   <link type="text/css" rel="stylesheet" href="../index.css" />
+  <script defer data-domain="dgov.io" src="https://plausible.io/js/script.js"></script>
 </head>
 
 <body>
-  <h2><a href="../">DGF Tests</a></h2>
+  <h2><a href="../">DGF Prototype</a></h2>
   <div id="mocha"></div>
   <div id="scene"></div>
 </body>

src/tests/forum7.test.html

@@ -5,10 +5,11 @@
   <meta name="viewport" content="width=device-width, initial-scale=1.0" />
   <link rel="stylesheet" href="https://unpkg.com/mocha/mocha.css" />
   <link type="text/css" rel="stylesheet" href="../index.css" />
+  <script defer data-domain="dgov.io" src="https://plausible.io/js/script.js"></script>
 </head>
 
 <body>
-  <h2><a href="../">DGF Tests</a></h2>
+  <h2><a href="../">DGF Prototype</a></h2>
   <div id="mocha"></div>
   <div id="scene"></div>
 </body>

src/tests/forum8.test.html

@@ -5,10 +5,11 @@
   <meta name="viewport" content="width=device-width, initial-scale=1.0" />
   <link rel="stylesheet" href="https://unpkg.com/mocha/mocha.css" />
   <link type="text/css" rel="stylesheet" href="../index.css" />
+  <script defer data-domain="dgov.io" src="https://plausible.io/js/script.js"></script>
 </head>
 
 <body>
-  <h2><a href="../">DGF Tests</a></h2>
+  <h2><a href="../">DGF Prototype</a></h2>
   <div id="mocha"></div>
   <div id="scene"></div>
 </body>

src/tests/forum9.test.html

@@ -5,10 +5,11 @@
   <meta name="viewport" content="width=device-width, initial-scale=1.0" />
   <link rel="stylesheet" href="https://unpkg.com/mocha/mocha.css" />
   <link type="text/css" rel="stylesheet" href="../index.css" />
+  <script defer data-domain="dgov.io" src="https://plausible.io/js/script.js"></script>
 </head>
 
 <body>
-  <h2><a href="../">DGF Tests</a></h2>
+  <h2><a href="../">DGF Prototype</a></h2>
   <div id="mocha"></div>
   <div id="scene"></div>
 </body>

src/tests/input.test.html

@@ -5,10 +5,11 @@
   <meta name="viewport" content="width=device-width, initial-scale=1.0" />
   <link rel="stylesheet" href="https://unpkg.com/mocha/mocha.css" />
   <link type="text/css" rel="stylesheet" href="../index.css" />
+  <script defer data-domain="dgov.io" src="https://plausible.io/js/script.js"></script>
 </head>
 
 <body>
-  <h2><a href="../">DGF Tests</a></h2>
+  <h2><a href="../">DGF Prototype</a></h2>
   <div id="mocha"></div>
   <div id="scene"></div>
 </body>

src/tests/mocha.test.html

@@ -6,10 +6,11 @@
   <title>Mocha Tests</title>
   <meta name="viewport" content="width=device-width, initial-scale=1.0" />
   <link rel="stylesheet" href="https://unpkg.com/mocha/mocha.css" />
+  <script defer data-domain="dgov.io" src="https://plausible.io/js/script.js"></script>
 </head>
 
 <body>
-  <h2><a href="../">DGF Tests</a></h2>
+  <h2><a href="../">DGF Prototype</a></h2>
   <div id="mocha"></div>
   <div id="scene"></div>
 

src/tests/reputation.test.html

@@ -3,10 +3,11 @@
 <head>
   <title>Reputation test</title>
   <link type="text/css" rel="stylesheet" href="../index.css" />
+  <script defer data-domain="dgov.io" src="https://plausible.io/js/script.js"></script>
 </head>
 
 <body>
-  <h2><a href="../">DGF Tests</a></h2>
+  <h2><a href="../">DGF Prototype</a></h2>
   <div id="scene"></div>
 </body>
 <script type="module">

src/tests/scripts/availability.test.js

@@ -31,7 +31,7 @@ const setup = async () => {
   scene.withFlowchart();
   scene.withTable();
 
-  dao = new DAO('DGF', scene);
+  dao = new DAO('DAO', scene);
   await dao.setDisplayValue('total rep', () => dao.reputation.getTotal());
 
   experts = [];

src/tests/scripts/validation-pool.test.js

@@ -29,7 +29,7 @@ async function setup() {
   scene.withSequenceDiagram();
   scene.withTable();
 
-  dao = new DAO('DGF', scene);
+  dao = new DAO('DAO', scene);
 
   experts = [];
   await newExpert();

src/tests/validation-pool.test.html

@@ -5,10 +5,11 @@
   <link rel="stylesheet" href="https://unpkg.com/mocha/mocha.css" />
   <meta name="viewport" content="width=device-width, initial-scale=1.0" />
   <link type="text/css" rel="stylesheet" href="../index.css" />
+  <script defer data-domain="dgov.io" src="https://plausible.io/js/script.js"></script>
 </head>
 
 <body>
-  <h2><a href="../">DGF Tests</a></h2>
+  <h2><a href="../">DGF Prototype</a></h2>
   <div id="mocha"></div>
   <div id="scene"></div>
 </body>

src/tests/vm.test.html

@@ -5,10 +5,11 @@
   <meta name="viewport" content="width=device-width, initial-scale=1.0" />
   <link rel="stylesheet" href="https://unpkg.com/mocha/mocha.css" />
   <link type="text/css" rel="stylesheet" href="../index.css" />
+  <script defer data-domain="dgov.io" src="https://plausible.io/js/script.js"></script>
 </head>
 
 <body>
-  <h2><a href="../">DGF Tests</a></h2>
+  <h2><a href="../">DGF Prototype</a></h2>
   <div id="mocha"></div>
   <div id="scene"></div>
 </body>

src/tests/wdg.test.html

@@ -5,10 +5,11 @@
   <meta name="viewport" content="width=device-width, initial-scale=1.0" />
   <link rel="stylesheet" href="https://unpkg.com/mocha/mocha.css" />
   <link type="text/css" rel="stylesheet" href="../index.css" />
+  <script defer data-domain="dgov.io" src="https://plausible.io/js/script.js"></script>
 </head>
 
 <body>
-  <h2><a href="../">DGF Tests</a></h2>
+  <h2><a href="../">DGF Prototype</a></h2>
   <div id="mocha"></div>
   <div id="scene"></div>
 </body>

src/wdg-editor/index.html

@@ -0,0 +1,14 @@
+<!DOCTYPE html>
+
+<head>
+  <title>WDG Editor</title>
+  <link type="text/css" rel="stylesheet" href="../index.css" />
+  <script type="module" src="./index.js"></script>
+  <script defer data-domain="dgov.io" src="https://plausible.io/js/script.js"></script>
+</head>
+
+<body>
+  <h2><a href="../">DGF Prototype</a></h2>
+  <h1>Weighted Directed Graph Editor</h1>
+  <div id="scene"></div>
+</body>

src/wdg-editor/index.js

@@ -0,0 +1,9 @@
+import { Box } from '../classes/display/box.js';
+import { Scene } from '../classes/display/scene.js';
+import { WeightedDirectedGraph } from '../classes/supporting/wdg.js';
+
+const rootElement = document.getElementById('scene');
+const rootBox = new Box('rootBox', rootElement).flex();
+window.disableSceneControls = true;
+window.scene = new Scene('WDG Editor', rootBox);
+window.graph = new WeightedDirectedGraph('new', window.scene, { editable: true }).withFlowchart();