convert more note details to new style

src/public/javascripts/services/note_detail_search.js

@@ -1,46 +1,55 @@
 import noteDetailService from "./note_detail.js";
 import searchNotesService from "./search_notes.js";
 
-const $searchString = $("#search-string");
-const $component = $('#note-detail-search');
-const $refreshButton = $('#note-detail-search-refresh-results-button');
-const $help = $("#note-detail-search-help");
+class NoteDetailSearch {
+    /**
+     * @param {NoteContext} ctx
+     */
+    constructor(ctx) {
+        this.ctx = ctx;
+        this.$searchString = ctx.$noteTabContent.find(".search-string");
+        this.$component = ctx.$noteTabContent.find('.note-detail-search');
+        this.$help = ctx.$noteTabContent.find(".note-detail-search-help");
+        this.$refreshButton = ctx.$noteTabContent.find('.note-detail-search-refresh-results-button');
 
-function show() {
-    $help.html(searchNotesService.getHelpText());
+        this.$refreshButton.click(async () => {
+            await noteDetailService.saveNotesIfChanged();
 
-    $component.show();
-
-    try {
-        const json = JSON.parse(noteDetailService.getActiveNote().content);
-
-        $searchString.val(json.searchString);
-    }
-    catch (e) {
-        console.log(e);
-        $searchString.val('');
+            await searchNotesService.refreshSearch();
+        });
     }
 
-    $searchString.on('input', noteDetailService.noteChanged);
+    show() {
+        this.$help.html(searchNotesService.getHelpText());
+
+        this.$component.show();
+
+        try {
+            const json = JSON.parse(this.ctx.note.content);
+
+            this.$searchString.val(json.searchString);
+        }
+        catch (e) {
+            console.log(e);
+            this.$searchString.val('');
+        }
+
+        this.$searchString.on('input', noteDetailService.noteChanged);
+    }
+
+    getContent() {
+        return JSON.stringify({
+            searchString: this.$searchString.val()
+        });
+    }
+
+    focus() {}
+
+    onNoteChange() {}
+
+    cleanup() {}
+
+    scrollToTop() {}
 }
 
-function getContent() {
-    return JSON.stringify({
-        searchString: $searchString.val()
-    });
-}
-
-$refreshButton.click(async () => {
-    await noteDetailService.saveNotesIfChanged();
-
-    await searchNotesService.refreshSearch();
-});
-
-export default {
-    getContent,
-    show,
-    focus: () => null,
-    onNoteChange: () => null,
-    cleanup: () => null,
-    scrollToTop: () => null
-}
+export default NoteDetailSearch;