From: Michael D. Lowis <mike.lowis@gentex.com>
Date: Thu, 30 Nov 2017 18:38:19 +0000 (-0500)
Subject: ridiculous minification-by-hand. Overhead per page is ~3.6k now
X-Git-Url: https://git.mdlowis.com/?a=commitdiff_plain;h=2dec381e5faac95243a2de3b291601b73389fc44;p=proto%2Fjournal.git

ridiculous minification-by-hand. Overhead per page is ~3.6k now
---

diff --git a/editor.js b/editor.js
index 4bf0145..b25ee0b 100644
--- a/editor.js
+++ b/editor.js
@@ -1,86 +1,64 @@
 "use strict";
 
 (() => {
-    const getSelNode = () => {
-        const node = document.getSelection().anchorNode;
-        return (node.nodeType === 3 ? node.parentNode : node);
-    };
+	const getSelNode = () => {
+		const node = document.getSelection().anchorNode;
+		return (node.nodeType === 3 ? node.parentNode : node);
+	};
 
-    const keyCmd = (evnt, cmd, arg) => {
-        if (evnt.ctrlKey || evnt.metaKey)
-            return !document.execCommand(cmd, false, arg);
-        return true;
-    }
+	const ymd_string = () => {
+		const dt = new Date(), month = (dt.getMonth() + 1), day = dt.getDate();
+		return [dt.getFullYear(), (month > 9 ? '' : '0') + month, (day > 9 ? '' : '0') + day].join('.')
+	};
 
-    const keys = {
-        "b": (evnt) => keyCmd(evnt, "bold"),
-        "i": (evnt) => keyCmd(evnt, "italic"),
-        "u": (evnt) => keyCmd(evnt, "underline"),
-        "0": (evnt) => keyCmd(evnt, "formatBlock", "<p>"),
-        "1": (evnt) => keyCmd(evnt, "formatBlock", "<h1>"),
-        "2": (evnt) => keyCmd(evnt, "formatBlock", "<h2>"),
-        "3": (evnt) => keyCmd(evnt, "formatBlock", "<h3>"),
-        "4": (evnt) => keyCmd(evnt, "formatBlock", "<h4>"),
-        "5": (evnt) => keyCmd(evnt, "formatBlock", "<h5>"),
-        "6": (evnt) => keyCmd(evnt, "formatBlock", "<h6>"),
-        "7": (evnt) => keyCmd(evnt, "insertOrderedList"),
-        "8": (evnt) => keyCmd(evnt, "insertUnorderedList"),
-        "9": (evnt) => {
-            if (evnt.ctrlKey || evnt.metaKey) {
-                const node = getSelNode();
-                const defurl = (node.nodeName === "A" ? node.href : "http://");
-                const url = prompt("Enter URL:", defurl);
-                return !document.execCommand(
-                    (url === "" ? "unlink" : "createLink"), false, url);
-            }
-            return true;
-        },
+	const exec = document.execCommand;
+	const ctrlHeld = (ev) => (ev.ctrlKey || ev.metaKey)
+	const inTag = (tag) => (getSelNode().nodeName === tag);
+	const keyCmd = (ev, cmd, arg) => (ctrlHeld() ? !exec(cmd, false, arg) : true);
 
-        "Enter": () => {
-            if (getSelNode().nodeName === "CODE")
-                return !document.execCommand("insertHTML",false,"\n");
-            else
-                return !document.execCommand("insertParagraph",false);
-        },
+	const keys = {
+		"b": (ev) => keyCmd(ev, "bold"),
+		"i": (ev) => keyCmd(ev, "italic"),
+		"u": (ev) => keyCmd(ev, "underline"),
+		"0": (ev) => keyCmd(ev, "formatBlock", "<p>"),
+		"1": (ev) => keyCmd(ev, "formatBlock", "<h1>"),
+		"2": (ev) => keyCmd(ev, "formatBlock", "<h2>"),
+		"3": (ev) => keyCmd(ev, "formatBlock", "<h3>"),
+		"4": (ev) => keyCmd(ev, "formatBlock", "<h4>"),
+		"5": (ev) => keyCmd(ev, "formatBlock", "<h5>"),
+		"6": (ev) => keyCmd(ev, "formatBlock", "<h6>"),
+		"7": (ev) => keyCmd(ev, "insertOrderedList"),
+		"8": (ev) => keyCmd(ev, "insertUnorderedList"),
+		"9": (ev) => {
+			if (ctrlHeld()) {
+				const defurl = (inTag("A") ? getSelNode().href : "http://");
+				const url = prompt("Enter URL:", defurl);
+				return !exec((url !== null && url !== "" ? "createLink" : "unlink"), false, url);
+			}
+			return true;
+		},
 
-        "Tab": (evnt) => {
-            if (getSelNode().nodeName === "CODE")
-                return !document.execCommand("insertHTML",false,"\t");
-            else
-                return !document.execCommand((evnt.shiftKey ? "out" : "in")+"dent",false);
-        },
+		"Enter": () => !exec(inTag("CODE") ? "insertHTML" : "insertParagraph", false, "\n"),
 
-        ";": (evnt) => keyCmd(evnt, "insertHTML", "<code>\r\n</code>"),
-        "'": (evnt) => {
-            if (evnt.ctrlKey || evnt.metaKey) {
-                const block = (getSelNode().nodeName === "BLOCKQUOTE" ? "<p>" : "<blockquote>");
-                return !document.execCommand("formatBlock", false, block);
-            }
-            return true;
-        },
-    };
+		"Tab": (ev) => {
+			if (inTag("CODE"))
+				return !exec("insertHTML",false,"\t");
+			else
+				return !exec((ev.shiftKey ? "out" : "in")+"dent",false);
+		},
 
-    const ymd_string = () => {
-        const date = new Date();
-        const month = date.getMonth() + 1;
-        const day = date.getDate();
-        return "" +
-            date.getFullYear() + "." +
-            (month > 9 ? '' : '0') + month + "." +
-            (day > 9 ? '' : '0') + day;
-    };
+		";": (ev) => keyCmd(ev, "insertHTML", "<code>\r\n</code>"),
+		"'": (ev) => {
+			if (ctrlHeld()) {
+				const block = (inTag("BLOCKQUOTE") ? "<p>" : "<blockquote>");
+				return !exec("formatBlock", false, block);
+			}
+			return true;
+		},
+	};
 
-    header.onkeyup = (evnt) => {
-        document.title = header.innerText;
-    }
-
-    content.onkeydown = (evnt) => {
-        const keyfn = keys[evnt.key];
-        return (keyfn ? keyfn(evnt) : true);
-    }
-
-    /* set the title to todays date */
-    header.innerHTML = '<h1 align="center" contenteditable="true">'
-                     + ymd_string() + '</h1><hr/>';
-    document.title = header.innerText;
+	header.onkeyup = (ev) => (document.title = header.innerText)
+	content.onkeydown = (ev) => (keys[ev.key] ? keyfn(keys[ev.key]) : true),
+	header.innerHTML = '<h1 align="center" contenteditable="true">' + ymd_string() + '</h1><hr/>';
+	document.title = header.innerText;
 })();
diff --git a/index.html b/index.html
index 0e6f56b..62bfc6b 100644
--- a/index.html
+++ b/index.html
@@ -1,61 +1,17 @@
 <!DOCTYPE html>
 <html>
-    <head>
-        <title>Journal</title>
-        <meta charset="utf-8">
-        <meta name="description" content="Journal">
-        <link rel="stylesheet" type="text/css" href="style.css">
-    </head>
-    <body>
-        <section>
-            <header id="header">
-                <h1 align="center" contenteditable="true">
-                    2017.12.01
-                </h1>
-                <hr>
-            </header>
-            <article id="content" contenteditable="true">
-                <h1>Heading 1</h1>
-                <h2>Heading 2</h2>
-                <h3>Heading 3</h3>
-                <a href="http://google.com">This is a link</a><br/>
-                <p>blockqoute:</p>
-                <blockquote>
-                this is a block quote<br/>
-                and it's multi-line
-                </blockquote>
-                <p>unordered list:</p>
-                <ul>
-                    <li>foo</li>
-                </ul>
-                <p>ordered list:</p>
-                <ol>
-                    <li>foo</li>
-                </ol>
-                <p>table:</p>
-                <table>
-                    <thead>
-                        <tr>
-                            <th>Header 1</th>
-                            <th>Header 2</th>
-                        </tr>
-                    </thead>
-                    <tbody>
-                        <tr>
-                            <td>Cell 1</td>
-                            <td>Cell 2</td>
-                        </tr>
-                    </tbody>
-                </table>
-
-                <p>code block:</p>
-                <code>void main(int argc, char** argv) {
-    return 0;
-}</code>
-                <p>Paragraph text:<br/> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc nisl tellus, lacinia lobortis feugiat eu, fermentum sit amet nulla. Donec tincidunt feugiat tortor, sit amet varius nisi posuere ultrices. Suspendisse feugiat, massa in dictum ultricies, mauris neque tincidunt ex, sit amet pharetra risus urna vel velit. Phasellus mattis magna vitae mollis venenatis. Vestibulum pulvinar sem quis efficitur tincidunt. Morbi tempor neque id erat placerat, ac iaculis ex venenatis. Duis porttitor euismod augue, et ullamcorper quam sodales nec. Vestibulum ultricies pellentesque mattis. Nulla sit amet felis auctor, pellentesque nunc a, suscipit ligula. Praesent in justo dolor. Nullam eleifend tempus mi ac malesuada. Mauris et libero lacus.</p>
-                <br/>
-            </article>
-        </section>
-        <script src="editor.js"></script>
-    </body>
+<head>
+	<title></title>
+	<meta charset="utf-8">
+	<link rel="stylesheet" type="text/css" href="style.css">
+</head>
+<body>
+	<section>
+		<header id="header"></header>
+		<article id="content" contenteditable="true">
+			<p>Edit here...</p>
+		</article>
+	</section>
+	<script src="editor.js"></script>
+</body>
 </html>
diff --git a/style.css b/style.css
index 52721ed..80a885c 100644
--- a/style.css
+++ b/style.css
@@ -1,17 +1,14 @@
-/* Get rid of border box on editable content */
 * { -moz-box-sizing: border-box; box-sizing: border-box; }
 *:focus { outline: none; }
 
-/* set the font and the artical content width */
 body {
-    font-family: sans-serif;
-    font-size: 16px;
-    max-width: 75%;
-    margin-left: auto;
-    margin-right: auto;
+	font-family: sans-serif;
+	font-size: 16px;
+	max-width: 75%;
+	margin-left: auto;
+	margin-right: auto;
 }
 
-/* override default heading sizes */
 h1 { font-size: 2.0rem; }
 h2 { font-size: 1.5rem; }
 h3 { font-size: 1.17rem; }
@@ -20,53 +17,49 @@ h5 { font-size: 0.83rem; }
 h6 { font-size: 0.67rem; }
 a { color: deepskyblue; }
 
-/* table styling: Github or skeleton table style */
 table {
-    display: block;
-    width: 100%;
-    overflow: auto;
-    border-spacing: 0;
-    border-collapse: collapse;
+	display: block;
+	width: 100%;
+	overflow: auto;
+	border-spacing: 0;
+	border-collapse: collapse;
 }
 
-/* code blocks */
 code {
-    display: block;
-    padding: 1rem 1.5rem;
-    white-space: pre;
-    margin: 0.2rem;
-    background: #F1F1F1;
-    border: 1px solid #E1E1E1;
-    border-radius: 4px;
-    -moz-tab-size: 4;
-    -o-tab-size:   4;
-    tab-size:      4;
+	display: block;
+	padding: 1rem 1.5rem;
+	white-space: pre;
+	margin: 0.2rem;
+	background: #F1F1F1;
+	border: 1px solid #E1E1E1;
+	border-radius: 4px;
+	-moz-tab-size: 4;
+	-o-tab-size:   4;
+	tab-size:      4;
 }
 
-/* code blocks */
 blockquote {
-    display: block;
-    border-left: 4px solid deepskyblue;
-    margin-left: -19px;
-    padding-left: 15px;
-    margin-right: 0px;
+	display: block;
+	border-left: 4px solid deepskyblue;
+	margin-left: -19px;
+	padding-left: 15px;
+	margin-right: 0px;
 }
 
-/* table formatting */
 table {
-    width: 100%;
-    display: table;
-    border-collapse: separate;
-    border-color: grey;
-    text-align: left;
-    vertical-align: middle;
+	width: 100%;
+	display: table;
+	border-collapse: separate;
+	border-color: grey;
+	text-align: left;
+	vertical-align: middle;
 }
 
 th, td {
-    padding: 0.80rem 0.80rem;
-    border-bottom: 1px solid #E1E1E1;
+	padding: 0.80rem 0.80rem;
+	border-bottom: 1px solid #E1E1E1;
 }
 
 th:first-child, td:first-child {
-    padding-left: 0;
+	padding-left: 0;
 }