share functionality WIP

libraries/normalize.min.css

@@ -0,0 +1,2 @@
+/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%}body{margin:0}main{display:block}h1{font-size:2em;margin:.67em 0}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace,monospace;font-size:1em}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:.35em .75em .625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}
+/*# sourceMappingURL=normalize.min.css.map */

package-lock.json

@@ -2903,9 +2903,9 @@
       }
     },
     "electron": {
-      "version": "16.0.3",
-      "resolved": "https://registry.npmjs.org/electron/-/electron-16.0.3.tgz",
-      "integrity": "sha512-MzCYuEqrvyEtPSUWQwr88xWBrsbhmyOKp4wqP9WfAJTEDeUfBcrQYswHuYe17Gi00gRirQb9htoC/anYfaw20w==",
+      "version": "16.0.4",
+      "resolved": "https://registry.npmjs.org/electron/-/electron-16.0.4.tgz",
+      "integrity": "sha512-IptwmowvMP1SFOmZLh6rrURwfnOxbDBXBRBcaOdfBM5I+B9mgtdNwzNC3ymFFNzEkZUwdOyg9fu3iyjAAQIQgw==",
       "dev": true,
       "requires": {
         "@electron/get": "^1.13.0",
@@ -2931,9 +2931,9 @@
           }
         },
         "@types/node": {
-          "version": "14.17.34",
-          "resolved": "https://registry.npmjs.org/@types/node/-/node-14.17.34.tgz",
-          "integrity": "sha512-USUftMYpmuMzeWobskoPfzDi+vkpe0dvcOBRNOscFrGxVp4jomnRxWuVohgqBow2xyIPC0S3gjxV/5079jhmDg==",
+          "version": "14.18.0",
+          "resolved": "https://registry.npmjs.org/@types/node/-/node-14.18.0.tgz",
+          "integrity": "sha512-0GeIl2kmVMXEnx8tg1SlG6Gg8vkqirrW752KqolYo1PHevhhZN3bhJ67qHj+bQaINhX0Ra3TlWwRvMCd9iEfNQ==",
           "dev": true
         },
         "boolean": {
@@ -5223,9 +5223,9 @@
       }
     },
     "jsdom": {
-      "version": "18.1.1",
-      "resolved": "https://registry.npmjs.org/jsdom/-/jsdom-18.1.1.tgz",
-      "integrity": "sha512-NmJQbjQ/gpS/1at/ce3nCx89HbXL/f5OcenBe8wU1Eik0ROhyUc3LtmG3567dEHAGXkN8rmILW/qtCOPxPHQJw==",
+      "version": "19.0.0",
+      "resolved": "https://registry.npmjs.org/jsdom/-/jsdom-19.0.0.tgz",
+      "integrity": "sha512-RYAyjCbxy/vri/CfnjUWJQQtZ3LKlLnDqj+9XLNnJPgEGeirZs3hllKR20re8LUZ6o1b1X4Jat+Qd26zmP41+A==",
       "requires": {
         "abab": "^2.0.5",
         "acorn": "^8.5.0",

src/public/stylesheets/share.css

@@ -1,20 +1,6 @@
-html {
-    box-sizing: border-box;
-    font-size: 16px;
-}
-
-*, *:before, *:after {
-    box-sizing: inherit;
-}
-
-body, h1, h2, h3, h4, h5, h6, p, ol, ul {
+#title {
     margin: 0;
-    padding: 0;
-    font-weight: normal;
-}
-
-ul {
-    padding-left: 20px;
+    padding-bottom: 0;
 }
 
 #layout {
@@ -32,6 +18,14 @@ ul {
     overflow: auto;
 }
 
+#menu p {
+    margin: 0;
+}
+
+#menu ul {
+    padding-left: 20px;
+}
+
 #main {
     flex-basis: 0;
     flex-grow: 3;

src/share/routes.js

@@ -1,6 +1,8 @@
 const shaca = require("./shaca/shaca");
 const shacaLoader = require("./shaca/shaca_loader");
 const shareRoot = require("./share_root");
+const utils = require("../services/utils");
+const {JSDOM} = require("jsdom");
 
 function getSubRoot(note) {
     if (note.noteId === shareRoot.SHARE_ROOT_NOTE_ID) {
@@ -16,6 +18,69 @@ function getSubRoot(note) {
     return getSubRoot(parentNote);
 }
 
+const NO_CONTENT = '<p>This note has no content.</p>';
+
+function getChildrenList(note) {
+    if (note.hasChildren()) {
+        const document = new JSDOM().window.document;
+
+        const ulEl = document.createElement("ul");
+
+        for (const childNote of note.getChildNotes()) {
+            const li = document.createElement("li");
+            const link = document.createElement("a");
+            link.appendChild(document.createTextNode(childNote.title));
+            link.setAttribute("href", childNote.noteId);
+
+            li.appendChild(link);
+            ulEl.appendChild(li);
+        }
+
+        return '<p>Child notes:</p>' + ulEl.outerHTML;
+    }
+    else {
+        return '';
+    }
+}
+
+function getContent(note) {
+    let content = note.getContent();
+
+    if (note.type === 'text') {
+        const isEmpty = !content?.trim() || (function() {
+            const document = new JSDOM(content).window.document;
+
+            return document.body.textContent.trim().length === 0
+                && document.querySelectorAll("img").length === 0;
+        })();
+
+        if (isEmpty) {
+            content = NO_CONTENT + getChildrenList(note);
+        }
+    }
+    else if (note.type === 'code') {
+        if (!content?.trim()) {
+            content = NO_CONTENT + getChildrenList(note);
+        }
+        else {
+            const document = new JSDOM().window.document;
+
+            const preEl = document.createElement('pre');
+            preEl.innerText = content;
+
+            content = preEl.outerHTML;
+        }
+    }
+    else if (note.type === 'book') {
+        content = getChildrenList(note);
+    }
+    else {
+        content = '<p>This note type cannot be displayed.</p>' + getChildrenList(note);
+    }
+
+    return content;
+}
+
 function register(router) {
     router.get('/share/:noteId', (req, res, next) => {
         const {noteId} = req.params;
@@ -25,10 +90,13 @@ function register(router) {
         if (noteId in shaca.notes) {
             const note = shaca.notes[noteId];
 
+            const content = getContent(note);
+
             const subRoot = getSubRoot(note);
 
             res.render("share", {
                 note,
+                content,
                 subRoot
             });
         }

src/views/share.ejs

@@ -3,6 +3,7 @@
 <head>
     <meta charset="utf-8">
     <link rel="shortcut icon" href="../favicon.ico">
+    <link href="../libraries/normalize.min.css" rel="stylesheet">
     <link href="../stylesheets/share.css" rel="stylesheet">
     <% if (note.type === 'text' || note.type === 'book') { %>
     <link href="../libraries/ckeditor/ckeditor-content.css" rel="stylesheet">
@@ -14,18 +15,14 @@
         <button id="menuLink"></button>
 
         <div id="menu">
-            <div class="pure-menu">
-                <%- include('share-tree-item', {note: subRoot, activeNote: note}) %>
-            </div>
+            <%- include('share-tree-item', {note: subRoot, activeNote: note}) %>
         </div>
 
         <div id="main">
             <h1 id="title"><%= note.title %></h1>
 
             <div id="content">
-                <% if (note.type === 'text') { %>
-                <div class="ck-content"><%- note.getContent() %></div>
-                <% } %>
+                <div class="ck-content"><%- content %></div>
             </div>
         </div>
     </div>