From b1c2d86d9aa2649dced75b81da746ad7688ab2c6 Mon Sep 17 00:00:00 2001 From: Skylar Ittner Date: Tue, 3 Dec 2019 13:35:04 -0700 Subject: [PATCH] Rewrite editor (close #12), fix #11, close #13, close #14, close #15 --- config.xml | 3 +- package.json | 4 +- www/css/app.css | 21 ++++ www/index.html | 5 +- www/js/Note.class.js | 6 +- www/js/editnote.js | 92 -------------- www/js/{markdowneditor.js => editor.js} | 135 +++++++++++++++++++- www/js/home.js | 2 +- www/js/main.js | 4 + www/js/platform.js | 8 +- www/js/settings.js | 14 ++- www/package.json | 14 +-- www/pages/credits.html | 1 + www/pages/{editnote.html => editor.html} | 20 +-- www/pages/editor_full.html | 84 ------------- www/pages/editor_lite.html | 152 ----------------------- www/pages/home.html | 3 +- www/pages/settings.html | 44 ++++++- www/pages/setup0.html | 1 + www/pages/setup1.html | 1 + www/routes.js | 33 +++-- 21 files changed, 270 insertions(+), 377 deletions(-) create mode 100644 www/css/app.css delete mode 100644 www/js/editnote.js rename www/js/{markdowneditor.js => editor.js} (56%) rename www/pages/{editnote.html => editor.html} (62%) delete mode 100644 www/pages/editor_full.html delete mode 100644 www/pages/editor_lite.html diff --git a/config.xml b/config.xml index 92d55fb..e5c17a0 100644 --- a/config.xml +++ b/config.xml @@ -1,5 +1,5 @@ - + NotePost A cross-platform client app for NotePost. @@ -51,5 +51,4 @@ - diff --git a/package.json b/package.json index 9f1f255..b2dcbe1 100644 --- a/package.json +++ b/package.json @@ -1,7 +1,7 @@ { "name": "com.netsyms.NotePostApp", "displayName": "NotePost", - "version": "1.2.0", + "version": "1.3.0", "description": "A cross-platform client app for NotePost.", "main": "index.js", "scripts": { @@ -10,7 +10,7 @@ "author": "Netsyms Technologies", "license": "MPL-2.0", "dependencies": { - "cordova-android": "^7.1.4", + "cordova-android": "^8.0.0", "cordova-browser": "^5.0.4", "cordova-plugin-app-version": "^0.1.9", "cordova-plugin-headercolor": "^1.0.0", diff --git a/www/css/app.css b/www/css/app.css new file mode 100644 index 0000000..6900d40 --- /dev/null +++ b/www/css/app.css @@ -0,0 +1,21 @@ +/* +This Source Code Form is subject to the terms of the Mozilla Public +License, v. 2.0. If a copy of the MPL was not distributed with this +file, You can obtain one at http://mozilla.org/MPL/2.0/. +*/ + +.popup { + background-color: var(--f7-page-bg-color); +} + +.page[data-name="editor"] .page-content textarea#note { + width: 100%; + height: 100%; + resize: none; + border: none; + overflow: auto; + outline: none; + box-shadow: none; + font-size: 1rem; + padding: 0.75rem; +} \ No newline at end of file diff --git a/www/index.html b/www/index.html index 1b7fdbb..145ad44 100644 --- a/www/index.html +++ b/www/index.html @@ -8,8 +8,9 @@ - + + NotePost @@ -25,7 +26,7 @@ - + diff --git a/www/js/Note.class.js b/www/js/Note.class.js index 555ce6b..786eb01 100644 --- a/www/js/Note.class.js +++ b/www/js/Note.class.js @@ -10,7 +10,7 @@ class Note { if (typeof content != 'string') { content = ""; } - if (typeof color != 'string') { + if (!/^[0-9A-F]{6}$/i.test(color)) { color = "FFF59D"; } if (typeof noteid != 'number') { @@ -186,7 +186,7 @@ class Note { } getTextColor() { - var color = this.getColor(); + var color = this.getColor() + ""; var r = parseInt(color.substring(0, 2), 16); var g = parseInt(color.substring(2, 4), 16); var b = parseInt(color.substring(4, 6), 16); @@ -208,7 +208,7 @@ class Note { } setColor(color) { - if (typeof color !== 'string') { + if (!/^[0-9A-F]{6}$/i.test(color)) { color = "FFF59D"; } this.color = color; diff --git a/www/js/editnote.js b/www/js/editnote.js deleted file mode 100644 index 1a7712f..0000000 --- a/www/js/editnote.js +++ /dev/null @@ -1,92 +0,0 @@ -/* - * This Source Code Form is subject to the terms of the Mozilla Public - * License, v. 2.0. If a copy of the MPL was not distributed with this - * file, You can obtain one at http://mozilla.org/MPL/2.0/. - */ - -var save_in_progress = false; - -function saveme(callback) { - if (save_in_progress) { - console.log("Warning: save already in progress, doing nothing."); - return; - } - app.toast.create({ - text: '   Saving...', - closeTimeout: 2 * 60 * 1000 // two whole minutes should be enough for *any* connection. - }).open(); - save_in_progress = true; - sync(); // update textareas with correct content - - var noteid = $("#note_content").data("noteid"); - var note = new Note(); - if (noteid != "") { - note = NOTES.get(noteid); - if (note.getSyncStatus() != "LOCAL_ONLY") { - note.setSyncStatus("LOCAL_EDITED"); - } - } - note.setText($("#note_content").val()); - note.setModified(); - NOTES.set(note); - NOTES.syncAll(function () { - app.toast.create({ - text: '   Note saved.', - closeTimeout: 3000 - }).open(); - $("#orig_content").val(note.content); - save_in_progress = false; - if (typeof callback == "function") { - callback(); - } - }, function () { - app.toast.create({ - text: '   Note saved locally.', - closeTimeout: 3000 - }).open(); - $("#orig_content").val(note.content); - save_in_progress = false; - if (typeof callback == "function") { - callback(); - } - }); -} - -function init() { - document.getElementById("noteframe").contentWindow.initEditor($("#note_content").val()); -} - -/** - * Get the text from the editor iframe and put it in the hidden textarea - * @returns {undefined} - */ -function sync() { - $("#note_content").val(document.getElementById("noteframe").contentWindow.getMarkdown()); -} - -function exiteditor() { - sync(); - if ($("#note_content").val() == "" || $("#note_content").val() === $("#orig_content").val()) { - router.back({force: true, ignoreCache: true, reload: true}); - } else { - saveme(function () { - router.back({force: true, ignoreCache: true, reload: true}); - }); - } -} - -$(window).bind('keydown', function (event) { - if (event.ctrlKey || event.metaKey) { - switch (String.fromCharCode(event.which).toLowerCase()) { - case 's': - event.preventDefault(); - sync(); - saveme(); - break; - } - } -}); - -$("#noteframe").on("load", function () { - init(); -}); \ No newline at end of file diff --git a/www/js/markdowneditor.js b/www/js/editor.js similarity index 56% rename from www/js/markdowneditor.js rename to www/js/editor.js index eafeaa2..b88e2a1 100644 --- a/www/js/markdowneditor.js +++ b/www/js/editor.js @@ -1,4 +1,4 @@ -/* +/* * This Source Code Form is subject to the terms of the Mozilla Public * License, v. 2.0. If a copy of the MPL was not distributed with this * file, You can obtain one at http://mozilla.org/MPL/2.0/. @@ -15,10 +15,11 @@ class MarkdownEditor { for (var i = 0; i < buttons.length; i++) { var div = document.createElement('div'); if (buttons[i]['spacer']) { + continue; // skip spacers div.className = "toolbar-spacer"; div.innerHTML = "|"; } else { - div.className = "toolbar-button"; + div.className = "link toolbar-button"; if (typeof buttons[i]['linestart'] == "string") { div.setAttribute("data-linestart", buttons[i]['linestart']); div.setAttribute("data-padspace", buttons[i]['padspace'] ? 1 : 0); @@ -140,4 +141,134 @@ class MarkdownEditor { return text; } +} + +var editor; +function initEditor() { + editor = new MarkdownEditor( + document.getElementById('note'), + document.getElementById("editor-toolbar"), + [ + { + label: "Bold", + icon: "fas fa-bold", + before: "**", + after: "**" + }, + { + label: "Italic", + icon: "fas fa-italic", + before: "*", + after: "*" + }, + { + label: "Heading", + icon: "fas fa-heading", + linestart: "#", + padspace: true, + maximum: 6 + }, + { + label: "Strikethrough", + icon: "fas fa-strikethrough", + before: "~~", + after: "~~" + }, + { + spacer: true + }, + { + label: "Quote", + icon: "fas fa-quote-left", + linestart: "> ", + padspace: false, + maximum: 6 + }, + { + label: "Checklist", + icon: "fas fa-tasks", + linestart: "- [ ]", + padspace: true, + maximum: 1 + }, + { + label: "List", + icon: "fas fa-list-ul", + linestart: "-", + padspace: true, + maximum: 1 + } + ]); + + document.getElementById('note').addEventListener('keydown', function (event) { + if (event.ctrlKey || event.metaKey) { + switch (String.fromCharCode(event.which).toLowerCase()) { + case 's': + event.preventDefault(); + savenote(); + break; + } + } + }); +} + +function getMarkdown() { + return document.getElementById('note').value; +} + +var save_in_progress = false; + +function savenote(callback) { + if (save_in_progress) { + console.log("Warning: save already in progress, doing nothing."); + return; + } + app.toast.create({ + text: '   Saving...', + closeTimeout: 2 * 60 * 1000 // two whole minutes should be enough for *any* connection. + }).open(); + save_in_progress = true; + + var noteid = $("#note").data("noteid"); + var note = new Note(); + if (noteid != "") { + note = NOTES.get(noteid); + if (note.getSyncStatus() != "LOCAL_ONLY") { + note.setSyncStatus("LOCAL_EDITED"); + } + } + note.setText($("#note").val()); + note.setModified(); + NOTES.set(note); + NOTES.syncAll(function () { + app.toast.create({ + text: '   Note saved.', + closeTimeout: 3000 + }).open(); + $("#orignote").val(note.content); + save_in_progress = false; + if (typeof callback == "function") { + callback(); + } + }, function () { + app.toast.create({ + text: '   Note saved locally.', + closeTimeout: 3000 + }).open(); + $("#orignote").val(note.content); + save_in_progress = false; + if (typeof callback == "function") { + callback(); + } + }); +} + +function exiteditor() { + if ($("#note").val() == "" || $("#note").val() === $("#orignote").val()) { + router.back({force: true, ignoreCache: true, reload: true}); + } else { + savenote(function () { + router.back({force: true, ignoreCache: true, reload: true}); + }); + } } \ No newline at end of file diff --git a/www/js/home.js b/www/js/home.js index e5a5e90..a17ea3d 100644 --- a/www/js/home.js +++ b/www/js/home.js @@ -147,7 +147,7 @@ function loadCards(callback) { function editNote(id) { var note = NOTES.get(id); - router.navigate("/editnote", { + router.navigate("/editor", { context: { noteid: id, content: note.getText(), diff --git a/www/js/main.js b/www/js/main.js index 334c9c1..1513326 100644 --- a/www/js/main.js +++ b/www/js/main.js @@ -62,6 +62,10 @@ router.on("pageInit", function (pagedata) { } }); +if (localStorage.getItem("darktheme") == "true") { + $("#app").addClass("theme-dark"); +} + // Run platform-specific setup code for Cordova or NW.js initPlatform(); diff --git a/www/js/platform.js b/www/js/platform.js index f3a868e..e694aec 100644 --- a/www/js/platform.js +++ b/www/js/platform.js @@ -8,8 +8,10 @@ var platform_type = ""; var nw_tray = null; -var openBrowser = function (url) { +var app_version = "unknown"; +var openBrowser = function (url) { + window.open(url); } var setTrayMenu = function (items) { @@ -154,6 +156,10 @@ function initNW() { } function initPlatform() { + $.getJSON("package.json", function (data) { + app_version = data.version; + }); + if (typeof cordova !== 'undefined') { initCordova(); } else if (typeof nw !== 'undefined') { diff --git a/www/js/settings.js b/www/js/settings.js index a4e9268..16f2871 100644 --- a/www/js/settings.js +++ b/www/js/settings.js @@ -7,6 +7,16 @@ $('.item-content[data-setting=editor] .toggle input').on("change", function () { var checked = $(this).prop('checked'); - console.log(checked); localStorage.setItem("alternateeditor", checked); -}) \ No newline at end of file +}); + +$('.item-content[data-setting=darktheme] .toggle input').on("change", function () { + var checked = $(this).prop('checked'); + localStorage.setItem("darktheme", checked); + + if (localStorage.getItem("darktheme") == "true") { + $("#app").addClass("theme-dark"); + } else { + $("#app").removeClass("theme-dark"); + } +}); \ No newline at end of file diff --git a/www/package.json b/www/package.json index efb1737..e58632d 100644 --- a/www/package.json +++ b/www/package.json @@ -1,16 +1,16 @@ { "name": "com.netsyms.NotePostApp", "displayName": "NotePost", - "version": "1.2.0", + "version": "1.3.0", "description": "A cross-platform client app for NotePost.", "author": "Netsyms Technologies", "license": "MPL-2.0", "dependencies": { - "@fortawesome/fontawesome-free": "^5.6.3", - "easymde": "^2.4.2", - "framework7": "^3.6.5", - "jquery": "^3.3.1", - "marked": "^0.6.0", - "shufflejs": "^5.2.1" + "@fortawesome/fontawesome-free": "^5.10.2", + "easymde": "^2.8.0", + "framework7": "^5.1.3", + "jquery": "^3.4.1", + "marked": "^0.7.0", + "shufflejs": "^5.2.3" } } diff --git a/www/pages/credits.html b/www/pages/credits.html index 285aa47..b650a6f 100644 --- a/www/pages/credits.html +++ b/www/pages/credits.html @@ -4,6 +4,7 @@
+
diff --git a/www/pages/editnote.html b/www/pages/editor.html similarity index 62% rename from www/pages/editnote.html rename to www/pages/editor.html index f416cb0..da02a48 100644 --- a/www/pages/editnote.html +++ b/www/pages/editor.html @@ -1,9 +1,10 @@ -
+
+
@@ -19,21 +20,24 @@ {{/if}}
- +
-
- - - - +
+
+ +
+
+
+ +
- +
\ No newline at end of file diff --git a/www/pages/editor_full.html b/www/pages/editor_full.html deleted file mode 100644 index aa0a023..0000000 --- a/www/pages/editor_full.html +++ /dev/null @@ -1,84 +0,0 @@ - - -Editor - - - - - - - - - - - \ No newline at end of file diff --git a/www/pages/editor_lite.html b/www/pages/editor_lite.html deleted file mode 100644 index 4c1ea45..0000000 --- a/www/pages/editor_lite.html +++ /dev/null @@ -1,152 +0,0 @@ - - -Editor - - - - - - - -
- -
- - - - \ No newline at end of file diff --git a/www/pages/home.html b/www/pages/home.html index f68fefc..49a4366 100644 --- a/www/pages/home.html +++ b/www/pages/home.html @@ -4,6 +4,7 @@
+
NotePost
@@ -59,7 +60,7 @@
- + add
diff --git a/www/pages/settings.html b/www/pages/settings.html index a867b9e..905c585 100644 --- a/www/pages/settings.html +++ b/www/pages/settings.html @@ -5,6 +5,7 @@
+
@@ -17,10 +18,20 @@
-
+
diff --git a/www/pages/setup0.html b/www/pages/setup0.html index 625b552..9bc4a26 100644 --- a/www/pages/setup0.html +++ b/www/pages/setup0.html @@ -5,6 +5,7 @@
+
diff --git a/www/pages/setup1.html b/www/pages/setup1.html index c608fad..13b472f 100644 --- a/www/pages/setup1.html +++ b/www/pages/setup1.html @@ -5,6 +5,7 @@
+
diff --git a/www/routes.js b/www/routes.js index dc4070b..a9c8c59 100644 --- a/www/routes.js +++ b/www/routes.js @@ -81,19 +81,20 @@ var routes = [ { setting: "account", title: "Sign in to a different account", + link: true, onclick: "router.navigate('/setup/0')" }, { - setting: "editor", - title: "Use alternative editor", - text: "Turn on if you're having issues editing notes.", + setting: "darktheme", + title: "Use dark theme", + text: "Reduces eyestrain and saves power on some devices.", toggle: true, - checked: localStorage.getItem("alternateeditor") == "true", + checked: localStorage.getItem("darktheme") == "true", onclick: "" }, { setting: "versions", - title: "NotePost app v1.2.0", + title: "NotePost app v" + app_version, text: "Copyright © 2018-2019 Netsyms Technologies. License: Mozilla Public License 2.0.", onclick: "" }, @@ -101,12 +102,14 @@ var routes = [ setting: "opensource", title: "Open Source Information", text: "", + link: true, onclick: "router.navigate('/credits')" }, { setting: "privacy", title: "Privacy Policy", text: "", + link: true, onclick: "openBrowser('https://netsyms.com/legal?pk_campaign=NotePostApp')" }] } @@ -119,18 +122,14 @@ var routes = [ name: 'credits' }, { - path: '/editnote', - name: 'editnote', - async: function (routeTo, routeFrom, resolve, reject) { - var editor = "pages/editor_full.html"; - var alternative = "pages/editor_lite.html"; - resolve({ - templateUrl: './pages/editnote.html' - }, { - context: { - editorframe: localStorage.getItem("alternateeditor") == "true" ? alternative : editor - } - }); + path: '/editor', + name: 'editor', + templateUrl: './pages/editor.html', + alias: '/editnote', // in case I missed any links + on: { + pageAfterIn: function () { + initEditor(); + } } } ]; \ No newline at end of file