created note info dialog, closes #408

src/public/javascripts/dialogs/note_info.js

@@ -0,0 +1,29 @@
+import noteDetailService from '../services/note_detail.js';
+
+const $dialog = $("#note-info-dialog");
+const $noteId = $("#note-info-note-id");
+const $dateCreated = $("#note-info-date-created");
+const $dateModified = $("#note-info-date-modified");
+const $type = $("#note-info-type");
+const $mime = $("#note-info-mime");
+const $okButton = $("#note-info-ok-button");
+
+function showDialog() {
+    glob.activeDialog = $dialog;
+
+    $dialog.modal();
+
+    const currentNote = noteDetailService.getCurrentNote();
+
+    $noteId.text(currentNote.noteId);
+    $dateCreated.text(currentNote.dateCreated);
+    $dateModified.text(currentNote.dateModified);
+    $type.text(currentNote.type);
+    $mime.text(currentNote.mime);
+}
+
+$okButton.click(() => $dialog.modal('hide'));
+
+export default {
+    showDialog
+};

src/public/javascripts/entities/note_full.js

@@ -10,13 +10,11 @@ class NoteFull extends NoteShort {
         /** @param {string} */
         this.noteContent = row.noteContent;
 
-        // if (this.content !== "" && this.isJson()) {
-        //     try {
-        //         /** @param {object} */
-        //         this.jsonContent = JSON.parse(this.content);
-        //     }
-        //     catch(e) {}
-        // }
+        /** @param {string} */
+        this.dateCreated = row.dateCreated;
+
+        /** @param {string} */
+        this.dateModified = row.dateModified;
     }
 }
 

src/public/javascripts/services/entrypoints.js

@@ -13,6 +13,7 @@ import sqlConsoleDialog from "../dialogs/sql_console.js";
 import searchNotesService from "./search_notes.js";
 import attributesDialog from "../dialogs/attributes.js";
 import helpDialog from "../dialogs/help.js";
+import noteInfoDialog from "../dialogs/note_info.js";
 import protectedSessionService from "./protected_session.js";
 
 function registerEntrypoints() {
@@ -61,6 +62,8 @@ function registerEntrypoints() {
     $("#open-sql-console-button").click(sqlConsoleDialog.showDialog);
     utils.bindShortcut('alt+o', sqlConsoleDialog.showDialog);
 
+    $("#show-note-info-button").click(noteInfoDialog.showDialog);
+
     if (utils.isElectron()) {
         $("#history-navigation").show();
         $("#history-back-button").click(window.history.back);

src/public/stylesheets/desktop.css

@@ -104,4 +104,8 @@ body {
 ::-webkit-scrollbar-thumb {
     border-radius: 3px;
     border: 1px solid var(--main-border-color);
+}
+
+#note-info-table td, #note-info-table th {
+    padding: 15px;
 }

src/views/desktop.ejs

@@ -199,6 +199,7 @@
                             <a class="dropdown-item" id="show-source-button" data-bind="css: { disabled: type() != 'text' && type() != 'code' && type() != 'relation-map' && type() != 'search' }">Note source</a>
                             <a class="dropdown-item" id="upload-file-button">Upload file</a>
                             <a class="dropdown-item" id="export-note-button" data-bind="css: { disabled: type() != 'text' }">Export note</a>
+                            <a class="dropdown-item" id="show-note-info-button">Note info</a>
                         </div>
                     </div>
                 </div>
@@ -226,6 +227,7 @@
     <% include dialogs/prompt.ejs %>
     <% include dialogs/confirm.ejs %>
     <% include dialogs/help.ejs %>
+    <% include dialogs/note_info.ejs %>
 </div>
 
 <webview class="electron-in-page-search-window" nodeintegration disablewebsecurity src="libraries/electron-in-page-search/search-window.html"></webview>

src/views/dialogs/note_info.ejs

@@ -0,0 +1,39 @@
+<div id="note-info-dialog" class="modal fade mx-auto" tabindex="-1" role="dialog">
+    <div class="modal-dialog" role="document">
+        <div class="modal-content">
+            <div class="modal-header">
+                <h5 class="modal-title">Note info</h5>
+                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
+                    <span aria-hidden="true">&times;</span>
+                </button>
+            </div>
+            <div class="modal-body">
+                <table id="note-info-table">
+                    <tr>
+                        <th>Note ID</th>
+                        <td id="note-info-note-id"></td>
+                    </tr>
+                    <tr>
+                        <th>Date created</th>
+                        <td id="note-info-date-created"></td>
+                    </tr>
+                    <tr>
+                        <th>Date modified</th>
+                        <td id="note-info-date-modified"></td>
+                    </tr>
+                    <tr>
+                        <th>Type</th>
+                        <td id="note-info-type"></td>
+                    </tr>
+                    <tr>
+                        <th>MIME</th>
+                        <td id="note-info-mime"></td>
+                    </tr>
+                </table>
+            </div>
+            <div class="modal-footer">
+                <button class="btn btn-primary" id="note-info-ok-button">OK</button>
+            </div>
+        </div>
+    </div>
+</div>