#129, added input icon to trigger recent notes for easy discovery and mouse control

src/public/javascripts/dialogs/add_link.js

@@ -15,6 +15,7 @@ const $prefixFormGroup = $("#add-link-prefix-form-group");
 const $linkTypeDiv = $("#add-link-type-div");
 const $linkTypes = $("input[name='add-link-type']");
 const $linkTypeHtml = $linkTypes.filter('input[value="html"]');
+const $showRecentNotesButton = $("#add-link-show-recent-notes");
 
 function setLinkType(linkType) {
     $linkTypes.each(function () {
@@ -74,6 +75,10 @@ async function showDialog() {
         },
         minLength: 0,
         change: async (event, ui) => {
+            if (!ui.item) {
+                return;
+            }
+
             const notePath = linkService.getNodePathFromLabel(ui.item.value);
 
             if (!notePath) {
@@ -103,7 +108,7 @@ async function showDialog() {
         }
     });
 
-    $autoComplete.autocomplete("search", "");
+    showRecentNotes();
 }
 
 $form.submit(() => {
@@ -167,8 +172,14 @@ function linkTypeChanged() {
     $linkTypeDiv.toggle(!hasSelection());
 }
 
+function showRecentNotes() {
+    $autoComplete.autocomplete("search", "");
+}
+
 $linkTypes.change(linkTypeChanged);
 
+$showRecentNotesButton.click(showRecentNotes);
+
 export default {
     showDialog
 };

src/public/javascripts/dialogs/jump_to_note.js

@@ -1,11 +1,11 @@
 import treeService from '../services/tree.js';
-import linkService from '../services/link.js';
 import server from '../services/server.js';
 import searchNotesService from '../services/search_notes.js';
 
 const $dialog = $("#jump-to-note-dialog");
 const $autoComplete = $("#jump-to-note-autocomplete");
 const $showInFullTextButton = $("#show-in-full-text-button");
+const $showRecentNotesButton = $("#jump-to-note-show-recent-notes");
 
 async function showDialog() {
     glob.activeDialog = $dialog;
@@ -48,7 +48,7 @@ async function showDialog() {
         }
     });
 
-    $autoComplete.autocomplete("search", "");
+    showRecentNotes();
 }
 
 function showInFullText(e) {
@@ -65,8 +65,14 @@ function showInFullText(e) {
     $dialog.dialog('close');
 }
 
+function showRecentNotes() {
+    $autoComplete.autocomplete("search", "");
+}
+
 $showInFullTextButton.click(showInFullText);
 
+$showRecentNotesButton.click(showRecentNotes);
+
 $dialog.bind('keydown', 'ctrl+return', showInFullText);
 
 export default {

src/public/javascripts/dialogs/labels.js

@@ -1,5 +1,4 @@
 import noteDetailService from '../services/note_detail.js';
-import utils from '../services/utils.js';
 import server from '../services/server.js';
 import infoService from "../services/info.js";
 

src/views/index.ejs

@@ -279,27 +279,36 @@
 
         <div class="form-group">
           <label for="note-autocomplete">Note</label>
-          <input id="note-autocomplete" placeholder="search for note by its name" style="width: 100%;">
+
+            <div class="input-group">
+                <input id="note-autocomplete" class="form-control" placeholder="search for note by its name" style="width: 100%;">
+
+                <span class="input-group-addon" id="add-link-show-recent-notes" title="Show recent notes" style="background: url('/images/icons/clock-16.png') no-repeat center; cursor: pointer;"></span>
+            </div>
         </div>
 
         <div class="form-group" id="add-link-title-form-group">
           <label for="link-title">Link title</label>
-          <input id="link-title" style="width: 100%;">
+          <input id="link-title" class="form-control" style="width: 100%;">
         </div>
 
         <div class="form-group" id="add-link-prefix-form-group" title="Cloned note will be shown in note tree with given prefix">
           <label for="clone-prefix">Prefix (optional)</label>
-          <input id="clone-prefix" style="width: 100%;">
+          <input id="clone-prefix" class="form-control" style="width: 100%;">
         </div>
 
-        <button class="btn btn-sm">Add note link</button>
+        <button class="btn btn-primary">Add note link <kbd>enter</kbd></button>
       </form>
     </div>
 
     <div id="jump-to-note-dialog" title="Jump to note" style="display: none;">
       <div class="form-group">
         <label for="jump-to-note-autocomplete">Note</label>
-        <input id="jump-to-note-autocomplete" placeholder="search for note by its name" style="width: 100%;">
+        <div class="input-group">
+          <input id="jump-to-note-autocomplete" class="form-control" placeholder="search for note by its name" style="width: 100%;">
+
+          <span class="input-group-addon" id="jump-to-note-show-recent-notes" title="Show recent notes" style="background: url('/images/icons/clock-16.png') no-repeat center; cursor: pointer;"></span>
+        </div>
       </div>
 
       <button id="show-in-full-text-button" class="btn btn-sm">Search in full text <kbd>ctrl+enter</kbd></button>