~dricottone/noticable: Refactor JS - dominic-ricottone.com git

4 files changed, 79 insertions(+), 46 deletions(-)

M index.html
M main.js
M preload.js
M renderer.js

M index.html => index.html +1 -1

@@ 6,7 6,7 @@
     <title>A noticable note editor</title>
     <meta name="description" content="" />
     <link rel="stylesheet" href="node_modules/github-markdown-css/github-markdown.css" />
-    <link rel="stylesheet" href="noticable.css" />
+    <link rel="stylesheet" href="style.css" />
   </head>
   <body>
     <div class="sidebar">

M main.js => main.js +12 -7

@@ 1,3 1,8 @@
+// to disable logging, comment out the console.log line
+function debug(message) {
+  console.log("[main] " + message);
+}
+
 // constants
 const { app, BrowserWindow, ipcMain, dialog } = require("electron");
 const shortcut = require("electron-localshortcut");


@@ 19,8 24,9 @@ function postFileName(window, event) {
   })
   .then(r => {
     if (!r.canceled) {
-      console.log("[main] posting new filename...");
-      event.sender.send("post-new-filename", r.filePath);
+      filename = r.filePath
+      debug("posting new filename '" + filename + "'...");
+      event.sender.send("post-new-filename", filename);
     }
   });
 }


@@ 45,8 51,7 @@ function initializeWindow() {
   registerShortCuts(win);
 
   ipcMain.on("request-local-filename", (event) => {
-    console.log("[main] caught request for local filename");
-    console.log("[main] sending 'request-focus-editor'...");
+    debug("caught request for local filename");
     postFileName(win, event);
   });
 


@@ 56,15 61,15 @@ function initializeWindow() {
 };
 function registerShortCuts(window) {
   shortcut.register(window, "CmdOrCtrl+E", () => {
-    console.log("[main] focus editor");
+    debug("keypress focus editor");
     window.webContents.send("key-focus-editor", "");
   });
   shortcut.register(window, "CmdOrCtrl+S", () => {
-    console.log("[main] save text and render markdown");
+    debug("keypress save text and render markdown");
     window.webContents.send("key-render-markdown", "");
   });
   shortcut.register(window, "CmdOrCtrl+Shift+S", () => {
-    console.log("[main] save text");
+    debug("keypress save text");
     window.webContents.send("key-save-text", "");
   });
 }

M preload.js => preload.js +37 -24

@@ 1,3 1,8 @@
+// to disable logging, comment out the console.log line
+function debug(message) {
+  console.log("[preload] " + message);
+}
+
 // constants
 const { ipcRenderer } = require("electron");
 const fs = require("fs")


@@ 12,39 17,43 @@ const notesDir = "notes";
 
 // messaging
 function requestLocalFilename() {
-  console.log("[preload -> main] requesting local filename...");
+  debug("requesting local filename...");
   ipcRenderer.send("request-local-filename", "");
 }
 function postFileText(text) {
-  console.log("[preload -> renderer] posting file text...");
+  debug("posting file text...");
   window.postMessage({ type: "post-file-text", text: text }, "*");
 }
 function postDisplayFilename(filename) {
-  console.log("[preload -> renderer] posting display file name...");
+  debug("posting display file name '" + filename + "'...");
   window.postMessage({ type: "post-display-filename", text: filename }, "*");
 }
 function postHTML(html) {
-  console.log("[preload -> renderer] posting HTML...");
+  debug("posting HTML...");
   window.postMessage({ type: "post-html", text: html }, "*");
 }
 function requestEditorText() {
-  console.log("[preload -> renderer] requesting editor text...");
+  debug("requesting editor text...");
   window.postMessage({ type: "request-editor-text" }, "*");
 }
 function requestFocusEditor() {
-  console.log("[preload -> renderer] requesting focus editor...");
+  debug("requesting focus editor...");
   window.postMessage({ type: "request-focus-editor" }, "*");
 }
 function requestUnfocusEditor() {
-  console.log("[preload -> renderer] requesting unfocus editor...");
+  debug("requesting unfocus editor...");
   window.postMessage({ type: "request-unfocus-editor" }, "*");
 }
 function requestToggleEditor() {
-  console.log("[preload -> renderer] requesting toggle editor focus...");
+  debug("requesting toggle editor focus...");
   window.postMessage({ type: "request-toggle-editor" }, "*");
 }
+function requestHighlightFilename(filename) {
+  debug("requesting highlight filename...");
+  window.postMessage({ type: "request-highlight-filename", text: filename }, "*");
+}
 function requestAlertInvalidFilename() {
-  console.log("[preload -> renderer] requesting alert about invalid filename...");
+  debug("requesting alert about invalid filename...");
   window.postMessage({ type: "request-alert-invalid-filename" }, "*");
 }
 


@@ 76,6 85,7 @@ function readFile(filename) {
     fs.readFile(actualFilename, "utf8", (err, content) => {
       if (err) requestAlertInvalidFilename();
       updateState(actualFilename,content);
+      requestHighlightFilename(filename);
     });
   }
 }


@@ 90,54 100,56 @@ function updateState(filename, content) {
 function saveFile(content) {
   if (currentFilename != "") {
     currentFileContent = content;
-    console.log("[preload] writing file '" + currentFilename + "'");
+    debug("writing file '" + currentFilename + "'");
     fs.writeFile(currentFilename, currentFileContent, (err) => {
       if (err) throw err;
     });
   } else {
-    console.log("[preload] no filename; cannot write file");
+    debug("no filename; halting write file");
   }
 }
 function saveFileConditional(content) {
   if (currentFilename != "") {
-    if (content != currentFileContent) {
+    if (content != currentFileContent || currentFileContent == "") {
       currentFileContent = content;
-      console.log("[preload] writing updated file '" + currentFilename + "'");
+      debug("writing updated file '" + currentFilename + "'");
       fs.writeFile(currentFilename, currentFileContent, (err) => {
         if (err) throw err;
       });
       return true;
     } else {
-      console.log("[preload] no updates; not writing file");
+      debug("no updates to file; halting write file");
       return false;
     }
   } else {
-    console.log("[preload] no filename; cannot write file");
+    debug("no filename; halting write file");
     return false;
   }
 }
 
 // listen to main process
 ipcRenderer.on("post-new-filename", (event, filename) => {
-  console.log("[preload] caught file name");
+  debug("caught file name '" + filename + "'");
   currentFilename = getActualFilename(filename);
-  postDisplayFilename(getPrettyFilename(filename));
+  prettyFilename = getPrettyFilename(filename);
+  postDisplayFilename(prettyFilename);
+  requestHighlightFilename(prettyFilename);
 });
 ipcRenderer.on("key-save-text", () => {
-  console.log("[preload] caught keybind for save text");
+  debug("caught keybind for save text");
   requestEditorText();
 });
 ipcRenderer.on("key-render-markdown", () => {
-  console.log("[preload] caught keybind for render markdown");
+  debug("caught keybind for render markdown");
   requestEditorText();
   requestUnfocusEditor();
 });
 ipcRenderer.on("key-focus-editor", () => {
-  console.log("[preload] caught keybind for focus editor");
+  debug("caught keybind for focus editor");
   requestFocusEditor();
 });
 ipcRenderer.on("key-unfocus-editor", () => {
-  console.log("[preload] caught keybind for unfocus editor");
+  debug("caught keybind for unfocus editor");
   requestUnfocusEditor();
 });
 


@@ 147,13 159,14 @@ window.addEventListener("message", (event) => {
   if (event.data.type) {
     switch(event.data.type) {
       case "post-editor-text":
-        console.log("[preload] caught editor text");
+        debug("caught editor text");
         saveFileConditional(event.data.text);
         renderMarkdown(event.data.text);
         break;
       case "request-file-text":
-        console.log("[preload] caught request for file text");
-        readFile(event.data.text);
+        filename = event.data.text
+        debug("caught request for text of file '" + filename + "'");
+        readFile(filename);
         break;
     }
   }

M renderer.js => renderer.js +29 -14

@@ 1,3 1,8 @@
+// to disable logging, comment out the console.log line
+function debug(message) {
+  console.log("[renderer] " + message);
+}
+
 // initialize monaco editor
 require.config({ paths: { vs: 'node_modules/monaco-editor/min/vs' } });
 require(['vs/editor/editor.main'], function () {


@@ 12,11 17,12 @@ require(['vs/editor/editor.main'], function () {
 
 // messaging
 function postEditorText() {
-  console.log("[renderer -> preload] posting editor text...");
+  debug("posting editor text...");
   window.postMessage({ type: "post-editor-text", text: window.editor.getValue() }, "*");
 }
 function requestFileText(filename) {
-  console.log("[renderer -> preload] requesting file text...");
+  debug("posting editor text and requesting text of file '" + filename + "'...");
+  window.postMessage({ type: "post-editor-text", text: window.editor.getValue() }, "*");
   window.postMessage({ type: "request-file-text", text: filename }, "*");
 }
 


@@ 41,7 47,7 @@ function unfocusEditor() {
     $("#container-rendered").addClass("focused");
     $("#ui-focus-editor").prop("checked", false);
   } else {
-    console.log("[renderer] rendering disabled");
+    debug("rendering disabled; halting unfocus editor");
     focusEditor();
   }
 }


@@ 56,10 62,10 @@ function toggleEditor() {
 function uiToggleEditor() {
   //NOTE: Remember that the status accessed here is the 'new' status, i.e. after it had been toggled
   if ($("#ui-focus-editor").prop("checked")) {
-    console.log("[renderer] UI focus editor");
+    debug("UI focus editor");
     focusEditor();
   } else {
-    console.log("[renderer] UI unfocus editor");
+    debug("UI unfocus editor");
     unfocusEditor();
     postEditorText();
   }


@@ 71,37 77,46 @@ window.addEventListener("message", (event) => {
   if (event.data.type) {
     switch(event.data.type) {
       case "post-file-text":
-        console.log("[renderer] caught file text");
+        debug("caught file text");
         window.editor.setValue(event.data.text);
         focusEditor();
         break;
       case "post-display-filename":
-        console.log("[renderer] caught display filename");
-        $("#list-filenames").append(buildFilename(event.data.text));
+        filename = event.data.text
+        debug("caught display filename '" + filename + "'");
+        $("#list-filenames").append(buildFilename(filename));
         $("#list-filenames li").sort(sortFilenames).appendTo("#list-filenames");
         break;
       case "post-html":
-        console.log("[renderer] caught HTML");
+        debug("caught HTML");
         $("#container-rendered").html(event.data.text);
         break;
       case "request-editor-text":
-        console.log("[renderer] caught request for editor text");
+        debug("caught request for editor text");
         postEditorText();
         break;
       case "request-focus-editor":
-        console.log("[renderer] caught request to focus editor");
+        debug("caught request to focus editor");
         focusEditor();
         break;
       case "request-unfocus-editor":
-        console.log("[renderer] caught request to unfocus editor");
+        debug("caught request to unfocus editor");
         unfocusEditor();
         break;
       case "request-toggle-editor":
-        console.log("[renderer] caught request to toggle editor");
+        debug("caught request to toggle editor");
         toggleEditor();
         break;
+      case "request-highlight-filename":
+        filename = event.data.text;
+        debug("caught request to highlight filename '" + filename + "'");
+        $("#list-filenames li").removeClass("highlight");
+        $("#list-filenames li").each( function(i, li) {
+          if ( $(li).text()==filename) $(li).addClass("highlight");
+        });
+        break;
       case "request-alert-invalid-filename":
-        console.log("[renderer] caught request to alert about invalid filename");
+        debug("caught request to alert about invalid filename");
         alert("Error: File could not be read");
         break;
     }