support for loading and saving type and mime

migrations/0069__add_mime_to_note.sql

@@ -0,0 +1 @@
+ALTER TABLE notes ADD COLUMN mime TEXT NOT NULL DEFAULT 'text/html';

public/javascripts/note_editor.js

@@ -70,6 +70,8 @@ const noteEditor = (function() {
         }
         else if (note.detail.type === 'code') {
             note.detail.note_text = codeEditor.getValue();
+
+            codeEditor.setOption("mode", note.detail.mime);
         }
         else {
             throwError("Unrecognized type: " + note.detail.type);
@@ -131,6 +133,9 @@ const noteEditor = (function() {
 
         noteTitleEl.val(currentNote.detail.note_title);
 
+        noteType.setNoteType(currentNote.detail.type);
+        noteType.setNoteMime(currentNote.detail.mime);
+
         if (currentNote.detail.type === 'text') {
             // temporary workaround for https://github.com/ckeditor/ckeditor5-enter/issues/49
             editor.setData(currentNote.detail.note_text ? currentNote.detail.note_text : "<p></p>");
@@ -189,7 +194,6 @@ const noteEditor = (function() {
 
         codeEditor = CodeMirror($("#note-detail-code")[0], {
             value: "",
-            mode:  "javascript",
             viewportMargin: Infinity
         });
 
@@ -205,18 +209,6 @@ const noteEditor = (function() {
         noteDetailEl.attr("tabindex", 2);
     });
 
-    $(document).bind('keydown', 'alt+q', async e => {
-        const note = getCurrentNote();
-        const type = note.detail.type;
-        const newType = type === "text" ? "code" : "text";
-
-        await server.put('notes/' + note.detail.note_id + '/type/' + newType);
-
-        await reload();
-
-        e.preventDefault();
-    });
-
     setInterval(saveNoteIfChanged, 5000);
 
     return {

public/javascripts/note_type.js

@@ -21,9 +21,11 @@ const noteType = (function() {
             { mime: 'text/x-go', title: 'Go' },
             { mime: 'text/x-groovy', title: 'Groovy' },
             { mime: 'text/x-haskell', title: 'Haskell' },
+            { mime: 'text/html', title: 'HTML' },
             { mime: 'message/http', title: 'HTTP' },
             { mime: 'text/x-java', title: 'Java' },
-            { mime: 'text/javascript', title: 'JavaScript' },
+            { mime: 'application/javascript', title: 'JavaScript' },
+            { mime: 'application/json', title: 'JSON' },
             { mime: 'text/x-kotlin', title: 'Kotlin' },
             { mime: 'text/x-lua', title: 'Lua' },
             { mime: 'text/x-markdown', title: 'Markdown' },
@@ -64,24 +66,45 @@ const noteType = (function() {
             }
         };
 
+        async function save() {
+            const note = noteEditor.getCurrentNote();
+
+            await server.put('notes/' + note.detail.note_id
+                + '/type/' + encodeURIComponent(self.type())
+                + '/mime/' + encodeURIComponent(self.mime()));
+
+            await noteEditor.reload();
+        }
+
         this.selectText = function() {
             self.type('text');
             self.mime('');
+
+            save();
         };
 
         this.selectCode = function() {
             self.type('code');
             self.mime('');
+
+            save();
         };
 
         this.selectCodeMime = function(el) {
             self.type('code');
             self.mime(el.mime);
+
+            save();
         };
     }
 
     ko.applyBindings(noteTypeModel, document.getElementById('note-type'));
 
     return {
+        getNoteType: () => noteTypeModel.type(),
+        setNoteType: type => noteTypeModel.type(type),
+
+        getNoteMime: () => noteTypeModel.mime(),
+        setNoteMime: mime => noteTypeModel.mime(mime)
     };
 })();

routes/api/import.js

@@ -77,8 +77,7 @@ async function importNotes(dir, parentNoteId) {
             note_position: notePos,
             is_expanded: 0,
             is_deleted: 0,
-            date_modified: now,
-            type: 'text'
+            date_modified: now
         });
 
         await sync_table.addNoteTreeSync(noteTreeId);
@@ -89,6 +88,8 @@ async function importNotes(dir, parentNoteId) {
             note_text: noteText,
             is_deleted: 0,
             is_protected: 0,
+            type: 'text',
+            mime: 'text/html',
             date_created: now,
             date_modified: now
         });

routes/api/notes.js

@@ -93,14 +93,15 @@ router.put('/:noteId/protect-sub-tree/:isProtected', auth.checkApiAuth, wrap(asy
     res.send({});
 }));
 
-router.put('/:noteId/type/:type', auth.checkApiAuth, wrap(async (req, res, next) => {
+router.put('/:noteId/type/:type/mime/:mime', auth.checkApiAuth, wrap(async (req, res, next) => {
     const noteId = req.params.noteId;
     const type = req.params.type;
+    const mime = req.params.mime;
     const sourceId = req.headers.source_id;
 
     await sql.doInTransaction(async () => {
-       await sql.execute("UPDATE notes SET type = ?, date_modified = ? WHERE note_id = ?",
-           [type, utils.nowDate(), noteId]);
+       await sql.execute("UPDATE notes SET type = ?, mime = ?, date_modified = ? WHERE note_id = ?",
+           [type, mime, utils.nowDate(), noteId]);
 
        await sync_table.addNoteSync(noteId, sourceId);
     });

services/app_info.js

@@ -3,7 +3,7 @@
 const build = require('./build');
 const packageJson = require('../package');
 
-const APP_DB_VERSION = 68;
+const APP_DB_VERSION = 69;
 
 module.exports = {
     app_version: packageJson.version,

services/notes.js

@@ -40,6 +40,7 @@ async function createNewNote(parentNoteId, note, sourceId) {
             note_text: note.note_text ? note.note_text : '',
             is_protected: note.is_protected,
             type: 'text',
+            mime: 'text/html',
             date_created: now,
             date_modified: now
         });

views/index.ejs

@@ -441,6 +441,7 @@
     <script src="libraries/codemirror/codemirror.js"></script>
     <link rel="stylesheet" href="libraries/codemirror/codemirror.css">
     <script src="libraries/codemirror/mode/javascript/javascript.js"></script>
+    <script src="libraries/codemirror/mode/xml/xml.js"></script>
 
     <link href="stylesheets/style.css" rel="stylesheet">