moved search into separate file

public/javascripts/note_tree.js

@@ -305,8 +305,6 @@ const noteTree = (function() {
     }
 
     function initFancyTree(noteTree) {
-        console.log(noteTree);
-
         const keybindings = {
             "insert": node => {
                 const parentNoteId = node.data.note_pid;
@@ -493,30 +491,6 @@ const noteTree = (function() {
         }
     }
 
-    function showSearch() {
-        $("#search-box").show();
-
-        $("input[name=search]").focus();
-    }
-
-    function toggleSearch() {
-        if ($("#search-box:hidden").length) {
-            showSearch();
-        }
-        else {
-            resetSearch();
-
-            $("#search-box").hide();
-        }
-    }
-
-    function resetSearch() {
-        $("input[name=search]").val("");
-
-        const tree = getTree();
-        tree.clearFilter();
-    }
-
     function setCurrentNoteTreeBasedOnProtectedStatus() {
         getCurrentClones().map(node => node.toggleClass("protected", !!node.data.is_protected));
     }
@@ -627,36 +601,11 @@ const noteTree = (function() {
         showMessage("Created!");
     }
 
-    $("button#reset-search-button").click(resetSearch);
-
-    $("input[name=search]").keyup(e => {
-        const searchString = $("input[name=search]").val();
-
-        if (e && e.which === $.ui.keyCode.ESCAPE || $.trim(searchString) === "") {
-            $("button#reset-search-button").click();
-            return;
-        }
-
-        if (e && e.which === $.ui.keyCode.ENTER) {
-            $.get(baseApiUrl + 'notes?search=' + searchString).then(resp => {
-                console.log("search: ", resp);
-
-                // Pass a string to perform case insensitive matching
-                getTree().filterBranches(node => {
-                    return resp.includes(node.data.note_id);
-                });
-            });
-        }
-    }).focus();
-
-    $(document).bind('keydown', 'alt+s', showSearch);
-
     return {
         getTreeLoadTime,
         reload,
         collapseTree,
         scrollToCurrentNote,
-        toggleSearch,
         setCurrentNoteTreeBasedOnProtectedStatus,
         getCurrentNode,
         activateNode,

public/javascripts/search_tree.js

@@ -0,0 +1,60 @@
+"use strict";
+
+const searchTree = (function() {
+    const treeEl = $("#tree");
+    const searchInputEl = $("input[name='search-text']");
+    const resetSearchButton = $("button#reset-search-button");
+    const searchBoxEl = $("#search-box");
+
+    resetSearchButton.click(resetSearch);
+
+    function showSearch() {
+        searchBoxEl.show();
+        searchInputEl.focus();
+    }
+
+    function toggleSearch() {
+        if (searchBoxEl.is(":hidden")) {
+            showSearch();
+        }
+        else {
+            resetSearch();
+
+            searchBoxEl.hide();
+        }
+    }
+
+    function resetSearch() {
+        searchInputEl.val("");
+
+        getTree().clearFilter();
+    }
+
+    function getTree() {
+        return treeEl.fancytree('getTree');
+    }
+
+    searchInputEl.keyup(e => {
+        const searchText = searchInputEl.val();
+
+        if (e && e.which === $.ui.keyCode.ESCAPE || $.trim(searchText) === "") {
+            resetSearchButton.click();
+            return;
+        }
+
+        if (e && e.which === $.ui.keyCode.ENTER) {
+            $.get(baseApiUrl + 'notes?search=' + searchText).then(resp => {
+                // Pass a string to perform case insensitive matching
+                getTree().filterBranches(node => {
+                    return resp.includes(node.data.note_id);
+                });
+            });
+        }
+    }).focus();
+
+    $(document).bind('keydown', 'alt+s', showSearch);
+
+    return {
+        toggleSearch
+    };
+})();

views/index.ejs

@@ -49,14 +49,14 @@
           <img src="images/icons/crosshair.png" alt="Collapse tree"/>
         </a>
 
-        <a onclick="noteTree.toggleSearch()" title="Search in notes" class="icon-action">
+        <a onclick="searchTree.toggleSearch()" title="Search in notes" class="icon-action">
           <img src="images/icons/search.png" alt="Search in notes"/>
         </a>
 
         <div id="search-box" style="display: none; padding: 10px; margin-top: 10px;">
           <p>
             <label>Search:</label>
-            <input name="search" autocomplete="off">
+            <input name="search-text" autocomplete="off">
             <button id="reset-search-button">&times;</button>
             <span id="matches"></span>
           </p>
@@ -300,6 +300,7 @@
     <script src="javascripts/tree_utils.js"></script>
     <script src="javascripts/drag_and_drop.js"></script>
     <script src="javascripts/context_menu.js"></script>
+    <script src="javascripts/search_tree.js"></script>
 
     <!-- Note detail -->
     <script src="javascripts/note_editor.js"></script>