From dbd28377e364142c42b50cedec790db247065352 Mon Sep 17 00:00:00 2001
From: azivner <adam.zivner@gmail.com>
Date: Sat, 10 Feb 2018 08:44:34 -0500
Subject: [PATCH] change in naming conventions for element variables from *El
 to $name

---
 src/public/javascripts/dialogs/add_link.js    | 68 +++++++-------
 src/public/javascripts/dialogs/attributes.js  |  2 +
 .../javascripts/dialogs/edit_tree_prefix.js   | 22 ++---
 src/public/javascripts/dialogs/event_log.js   | 12 +--
 .../javascripts/dialogs/jump_to_note.js       | 22 ++---
 .../javascripts/dialogs/note_history.js       | 32 +++----
 src/public/javascripts/dialogs/note_source.js | 10 +-
 .../javascripts/dialogs/recent_changes.js     | 10 +-
 .../javascripts/dialogs/recent_notes.js       | 22 ++---
 src/public/javascripts/dialogs/settings.js    | 94 +++++++++----------
 src/public/javascripts/dialogs/sql_console.js | 28 +++---
 11 files changed, 162 insertions(+), 160 deletions(-)

diff --git a/src/public/javascripts/dialogs/add_link.js b/src/public/javascripts/dialogs/add_link.js
index 2985a8ef1..ea91e33a8 100644
--- a/src/public/javascripts/dialogs/add_link.js
+++ b/src/public/javascripts/dialogs/add_link.js
@@ -1,18 +1,18 @@
 "use strict";
 
 const addLink = (function() {
-    const dialogEl = $("#add-link-dialog");
-    const formEl = $("#add-link-form");
-    const autoCompleteEl = $("#note-autocomplete");
-    const linkTitleEl = $("#link-title");
-    const clonePrefixEl = $("#clone-prefix");
-    const linkTitleFormGroup = $("#add-link-title-form-group");
-    const prefixFormGroup = $("#add-link-prefix-form-group");
-    const linkTypeEls = $("input[name='add-link-type']");
-    const linkTypeHtmlEl = linkTypeEls.filter('input[value="html"]');
+    const $dialog = $("#add-link-dialog");
+    const $form = $("#add-link-form");
+    const $autoComplete = $("#note-autocomplete");
+    const $linkTitle = $("#link-title");
+    const $clonePrefix = $("#clone-prefix");
+    const $linkTitleFormGroup = $("#add-link-title-form-group");
+    const $prefixFormGroup = $("#add-link-prefix-form-group");
+    const $linkTypes = $("input[name='add-link-type']");
+    const $linkTypeHtml = $linkTypes.filter('input[value="html"]');
 
     function setLinkType(linkType) {
-        linkTypeEls.each(function () {
+        $linkTypes.each(function () {
             $(this).prop('checked', $(this).val() === linkType);
         });
 
@@ -20,39 +20,39 @@ const addLink = (function() {
     }
 
     function showDialog() {
-        glob.activeDialog = dialogEl;
+        glob.activeDialog = $dialog;
 
         if (noteEditor.getCurrentNoteType() === 'text') {
-            linkTypeHtmlEl.prop('disabled', false);
+            $linkTypeHtml.prop('disabled', false);
 
             setLinkType('html');
         }
         else {
-            linkTypeHtmlEl.prop('disabled', true);
+            $linkTypeHtml.prop('disabled', true);
 
             setLinkType('selected-to-current');
         }
 
-        dialogEl.dialog({
+        $dialog.dialog({
             modal: true,
             width: 700
         });
 
-        autoCompleteEl.val('').focus();
-        clonePrefixEl.val('');
-        linkTitleEl.val('');
+        $autoComplete.val('').focus();
+        $clonePrefix.val('');
+        $linkTitle.val('');
 
         function setDefaultLinkTitle(noteId) {
             const noteTitle = noteTree.getNoteTitle(noteId);
 
-            linkTitleEl.val(noteTitle);
+            $linkTitle.val(noteTitle);
         }
 
-        autoCompleteEl.autocomplete({
+        $autoComplete.autocomplete({
             source: noteTree.getAutocompleteItems(),
             minLength: 0,
             change: () => {
-                const val = autoCompleteEl.val();
+                const val = $autoComplete.val();
                 const notePath = link.getNodePathFromLabel(val);
                 if (!notePath) {
                     return;
@@ -75,8 +75,8 @@ const addLink = (function() {
         });
     }
 
-    formEl.submit(() => {
-        const value = autoCompleteEl.val();
+    $form.submit(() => {
+        const value = $autoComplete.val();
 
         const notePath = link.getNodePathFromLabel(value);
         const noteId = treeUtils.getNoteIdFromNotePath(notePath);
@@ -85,25 +85,25 @@ const addLink = (function() {
             const linkType = $("input[name='add-link-type']:checked").val();
 
             if (linkType === 'html') {
-                const linkTitle = linkTitleEl.val();
+                const linkTitle = $linkTitle.val();
 
-                dialogEl.dialog("close");
+                $dialog.dialog("close");
 
                 link.addLinkToEditor(linkTitle, '#' + notePath);
             }
             else if (linkType === 'selected-to-current') {
-                const prefix = clonePrefixEl.val();
+                const prefix = $clonePrefix.val();
 
                 cloning.cloneNoteTo(noteId, noteEditor.getCurrentNoteId(), prefix);
 
-                dialogEl.dialog("close");
+                $dialog.dialog("close");
             }
             else if (linkType === 'current-to-selected') {
-                const prefix = clonePrefixEl.val();
+                const prefix = $clonePrefix.val();
 
                 cloning.cloneNoteTo(noteEditor.getCurrentNoteId(), noteId, prefix);
 
-                dialogEl.dialog("close");
+                $dialog.dialog("close");
             }
         }
 
@@ -111,19 +111,19 @@ const addLink = (function() {
     });
 
     function linkTypeChanged() {
-        const value = linkTypeEls.filter(":checked").val();
+        const value = $linkTypes.filter(":checked").val();
 
         if (value === 'html') {
-            linkTitleFormGroup.show();
-            prefixFormGroup.hide();
+            $linkTitleFormGroup.show();
+            $prefixFormGroup.hide();
         }
         else {
-            linkTitleFormGroup.hide();
-            prefixFormGroup.show();
+            $linkTitleFormGroup.hide();
+            $prefixFormGroup.show();
         }
     }
 
-    linkTypeEls.change(linkTypeChanged);
+    $linkTypes.change(linkTypeChanged);
 
     $(document).bind('keydown', 'ctrl+l', e => {
         showDialog();
diff --git a/src/public/javascripts/dialogs/attributes.js b/src/public/javascripts/dialogs/attributes.js
index 837e96e8d..bd3afa366 100644
--- a/src/public/javascripts/dialogs/attributes.js
+++ b/src/public/javascripts/dialogs/attributes.js
@@ -33,6 +33,8 @@ const attributesDialog = (function() {
                 update: function() {
                     let position = 0;
 
+                    // we need to update positions by searching in the DOM, because order of the
+                    // attributes in the viewmodel (self.attributes()) stays the same
                     $attributesBody.find('input[name="position"]').each(function() {
                         const attr = self.getTargetAttribute(this);
 
diff --git a/src/public/javascripts/dialogs/edit_tree_prefix.js b/src/public/javascripts/dialogs/edit_tree_prefix.js
index e84e3d2b1..1729c1051 100644
--- a/src/public/javascripts/dialogs/edit_tree_prefix.js
+++ b/src/public/javascripts/dialogs/edit_tree_prefix.js
@@ -1,17 +1,17 @@
 "use strict";
 
 const editTreePrefix = (function() {
-    const dialogEl = $("#edit-tree-prefix-dialog");
-    const formEl = $("#edit-tree-prefix-form");
-    const treePrefixInputEl = $("#tree-prefix-input");
-    const noteTitleEl = $('#tree-prefix-note-title');
+    const $dialog = $("#edit-tree-prefix-dialog");
+    const $form = $("#edit-tree-prefix-form");
+    const $treePrefixInput = $("#tree-prefix-input");
+    const $noteTitle = $('#tree-prefix-note-title');
 
     let noteTreeId;
 
     async function showDialog() {
-        glob.activeDialog = dialogEl;
+        glob.activeDialog = $dialog;
 
-        await dialogEl.dialog({
+        await $dialog.dialog({
             modal: true,
             width: 500
         });
@@ -20,21 +20,21 @@ const editTreePrefix = (function() {
 
         noteTreeId = currentNode.data.noteTreeId;
 
-        treePrefixInputEl.val(currentNode.data.prefix).focus();
+        $treePrefixInput.val(currentNode.data.prefix).focus();
 
         const noteTitle = noteTree.getNoteTitle(currentNode.data.noteId);
 
-        noteTitleEl.html(noteTitle);
+        $noteTitle.html(noteTitle);
     }
 
-    formEl.submit(() => {
-        const prefix = treePrefixInputEl.val();
+    $form.submit(() => {
+        const prefix = $treePrefixInput.val();
 
         server.put('tree/' + noteTreeId + '/set-prefix', {
             prefix: prefix
         }).then(() => noteTree.setPrefix(noteTreeId, prefix));
 
-        dialogEl.dialog("close");
+        $dialog.dialog("close");
 
         return false;
     });
diff --git a/src/public/javascripts/dialogs/event_log.js b/src/public/javascripts/dialogs/event_log.js
index 2d65a30c9..1d223e68f 100644
--- a/src/public/javascripts/dialogs/event_log.js
+++ b/src/public/javascripts/dialogs/event_log.js
@@ -1,13 +1,13 @@
 "use strict";
 
 const eventLog = (function() {
-    const dialogEl = $("#event-log-dialog");
-    const listEl = $("#event-log-list");
+    const $dialog = $("#event-log-dialog");
+    const $list = $("#event-log-list");
 
     async function showDialog() {
-        glob.activeDialog = dialogEl;
+        glob.activeDialog = $dialog;
 
-        dialogEl.dialog({
+        $dialog.dialog({
             modal: true,
             width: 800,
             height: 700
@@ -15,7 +15,7 @@ const eventLog = (function() {
 
         const result = await server.get('event-log');
 
-        listEl.html('');
+        $list.html('');
 
         for (const event of result) {
             const dateTime = formatDateTime(parseDate(event.dateAdded));
@@ -28,7 +28,7 @@ const eventLog = (function() {
 
             const eventEl = $('<li>').html(dateTime + " - " + event.comment);
 
-            listEl.append(eventEl);
+            $list.append(eventEl);
         }
     }
 
diff --git a/src/public/javascripts/dialogs/jump_to_note.js b/src/public/javascripts/dialogs/jump_to_note.js
index 9066ad616..f7c151254 100644
--- a/src/public/javascripts/dialogs/jump_to_note.js
+++ b/src/public/javascripts/dialogs/jump_to_note.js
@@ -1,28 +1,28 @@
 "use strict";
 
 const jumpToNote = (function() {
-    const dialogEl = $("#jump-to-note-dialog");
-    const autoCompleteEl = $("#jump-to-note-autocomplete");
-    const formEl = $("#jump-to-note-form");
+    const $dialog = $("#jump-to-note-dialog");
+    const $autoComplete = $("#jump-to-note-autocomplete");
+    const $form = $("#jump-to-note-form");
 
     async function showDialog() {
-        glob.activeDialog = dialogEl;
+        glob.activeDialog = $dialog;
 
-        autoCompleteEl.val('');
+        $autoComplete.val('');
 
-        dialogEl.dialog({
+        $dialog.dialog({
             modal: true,
             width: 800
         });
 
-        await autoCompleteEl.autocomplete({
+        await $autoComplete.autocomplete({
             source: await stopWatch("building autocomplete", noteTree.getAutocompleteItems),
             minLength: 0
         });
     }
 
     function getSelectedNotePath() {
-        const val = autoCompleteEl.val();
+        const val = $autoComplete.val();
         return link.getNodePathFromLabel(val);
     }
 
@@ -32,7 +32,7 @@ const jumpToNote = (function() {
         if (notePath) {
             noteTree.activateNode(notePath);
 
-            dialogEl.dialog('close');
+            $dialog.dialog('close');
         }
     }
 
@@ -42,8 +42,8 @@ const jumpToNote = (function() {
         e.preventDefault();
     });
 
-    formEl.submit(() => {
-        const action = dialogEl.find("button:focus").val();
+    $form.submit(() => {
+        const action = $dialog.find("button:focus").val();
 
         goToNote();
 
diff --git a/src/public/javascripts/dialogs/note_history.js b/src/public/javascripts/dialogs/note_history.js
index f92a66a13..48f54610d 100644
--- a/src/public/javascripts/dialogs/note_history.js
+++ b/src/public/javascripts/dialogs/note_history.js
@@ -1,10 +1,10 @@
 "use strict";
 
 const noteHistory = (function() {
-    const dialogEl = $("#note-history-dialog");
-    const listEl = $("#note-history-list");
-    const contentEl = $("#note-history-content");
-    const titleEl = $("#note-history-title");
+    const $dialog = $("#note-history-dialog");
+    const $list = $("#note-history-list");
+    const $content = $("#note-history-content");
+    const $title = $("#note-history-title");
 
     let historyItems = [];
 
@@ -13,23 +13,23 @@ const noteHistory = (function() {
     }
 
     async function showNoteHistoryDialog(noteId, noteRevisionId) {
-        glob.activeDialog = dialogEl;
+        glob.activeDialog = $dialog;
 
-        dialogEl.dialog({
+        $dialog.dialog({
             modal: true,
             width: 800,
             height: 700
         });
 
-        listEl.empty();
-        contentEl.empty();
+        $list.empty();
+        $content.empty();
 
         historyItems = await server.get('notes-history/' + noteId);
 
         for (const item of historyItems) {
             const dateModified = parseDate(item.dateModifiedFrom);
 
-            listEl.append($('<option>', {
+            $list.append($('<option>', {
                 value: item.noteRevisionId,
                 text: formatDateTime(dateModified)
             }));
@@ -37,13 +37,13 @@ const noteHistory = (function() {
 
         if (historyItems.length > 0) {
             if (!noteRevisionId) {
-                noteRevisionId = listEl.find("option:first").val();
+                noteRevisionId = $list.find("option:first").val();
             }
 
-            listEl.val(noteRevisionId).trigger('change');
+            $list.val(noteRevisionId).trigger('change');
         }
         else {
-            titleEl.text("No history for this note yet...");
+            $title.text("No history for this note yet...");
         }
     }
 
@@ -53,13 +53,13 @@ const noteHistory = (function() {
         e.preventDefault();
     });
 
-    listEl.on('change', () => {
-        const optVal = listEl.find(":selected").val();
+    $list.on('change', () => {
+        const optVal = $list.find(":selected").val();
 
         const historyItem = historyItems.find(r => r.noteRevisionId === optVal);
 
-        titleEl.html(historyItem.title);
-        contentEl.html(historyItem.content);
+        $title.html(historyItem.title);
+        $content.html(historyItem.content);
     });
 
     $(document).on('click', "a[action='note-history']", event => {
diff --git a/src/public/javascripts/dialogs/note_source.js b/src/public/javascripts/dialogs/note_source.js
index 9bc1f9fb0..ac68b9057 100644
--- a/src/public/javascripts/dialogs/note_source.js
+++ b/src/public/javascripts/dialogs/note_source.js
@@ -1,13 +1,13 @@
 "use strict";
 
 const noteSource = (function() {
-    const dialogEl = $("#note-source-dialog");
-    const noteSourceEl = $("#note-source");
+    const $dialog = $("#note-source-dialog");
+    const $noteSource = $("#note-source");
 
     function showDialog() {
-        glob.activeDialog = dialogEl;
+        glob.activeDialog = $dialog;
 
-        dialogEl.dialog({
+        $dialog.dialog({
             modal: true,
             width: 800,
             height: 500
@@ -15,7 +15,7 @@ const noteSource = (function() {
 
         const noteText = noteEditor.getCurrentNote().detail.content;
 
-        noteSourceEl.text(formatHtml(noteText));
+        $noteSource.text(formatHtml(noteText));
     }
 
     function formatHtml(str) {
diff --git a/src/public/javascripts/dialogs/recent_changes.js b/src/public/javascripts/dialogs/recent_changes.js
index c7f98800e..e05fc94e1 100644
--- a/src/public/javascripts/dialogs/recent_changes.js
+++ b/src/public/javascripts/dialogs/recent_changes.js
@@ -1,12 +1,12 @@
 "use strict";
 
 const recentChanges = (function() {
-    const dialogEl = $("#recent-changes-dialog");
+    const $dialog = $("#recent-changes-dialog");
 
     async function showDialog() {
-        glob.activeDialog = dialogEl;
+        glob.activeDialog = $dialog;
 
-        dialogEl.dialog({
+        $dialog.dialog({
             modal: true,
             width: 800,
             height: 700
@@ -14,7 +14,7 @@ const recentChanges = (function() {
 
         const result = await server.get('recent-changes/');
 
-        dialogEl.html('');
+        $dialog.html('');
 
         const groupedByDate = groupByDate(result);
 
@@ -48,7 +48,7 @@ const recentChanges = (function() {
                     .append(' (').append(revLink).append(')'));
             }
 
-            dialogEl.append(dayEl);
+            $dialog.append(dayEl);
         }
     }
 
diff --git a/src/public/javascripts/dialogs/recent_notes.js b/src/public/javascripts/dialogs/recent_notes.js
index 3dd4b10ff..a9667f394 100644
--- a/src/public/javascripts/dialogs/recent_notes.js
+++ b/src/public/javascripts/dialogs/recent_notes.js
@@ -1,8 +1,8 @@
 "use strict";
 
 const recentNotes = (function() {
-    const dialogEl = $("#recent-notes-dialog");
-    const searchInputEl = $('#recent-notes-search-input');
+    const $dialog = $("#recent-notes-dialog");
+    const $searchInput = $('#recent-notes-search-input');
 
     // list of recent note paths
     let list = [];
@@ -25,20 +25,20 @@ const recentNotes = (function() {
     }
 
     function showDialog() {
-        glob.activeDialog = dialogEl;
+        glob.activeDialog = $dialog;
 
-        dialogEl.dialog({
+        $dialog.dialog({
             modal: true,
             width: 800,
             height: 400
         });
 
-        searchInputEl.val('');
+        $searchInput.val('');
 
         // remove the current note
         const recNotes = list.filter(note => note !== noteTree.getCurrentNotePath());
 
-        searchInputEl.autocomplete({
+        $searchInput.autocomplete({
             source: recNotes.map(notePath => {
                 const noteTitle = noteTree.getNotePathTitle(notePath);
 
@@ -52,17 +52,17 @@ const recentNotes = (function() {
             select: function (event, ui) {
                 noteTree.activateNode(ui.item.value);
 
-                searchInputEl.autocomplete('destroy');
-                dialogEl.dialog('close');
+                $searchInput.autocomplete('destroy');
+                $dialog.dialog('close');
             },
             focus: function (event, ui) {
                 event.preventDefault();
             },
             close: function (event, ui) {
-                searchInputEl.autocomplete('destroy');
-                dialogEl.dialog('close');
+                $searchInput.autocomplete('destroy');
+                $dialog.dialog('close');
             },
-            create: () => searchInputEl.autocomplete("search", ""),
+            create: () => $searchInput.autocomplete("search", ""),
             classes: {
                 "ui-autocomplete": "recent-notes-autocomplete"
             }
diff --git a/src/public/javascripts/dialogs/settings.js b/src/public/javascripts/dialogs/settings.js
index 5d7c57d69..70a4b9779 100644
--- a/src/public/javascripts/dialogs/settings.js
+++ b/src/public/javascripts/dialogs/settings.js
@@ -1,8 +1,8 @@
 "use strict";
 
 const settings = (function() {
-    const dialogEl = $("#settings-dialog");
-    const tabsEl = $("#settings-tabs");
+    const $dialog = $("#settings-dialog");
+    const $tabs = $("#settings-tabs");
 
     const settingModules = [];
 
@@ -11,16 +11,16 @@ const settings = (function() {
     }
 
     async function showDialog() {
-        glob.activeDialog = dialogEl;
+        glob.activeDialog = $dialog;
 
         const settings = await server.get('settings');
 
-        dialogEl.dialog({
+        $dialog.dialog({
             modal: true,
             width: 900
         });
 
-        tabsEl.tabs();
+        $tabs.tabs();
 
         for (const module of settingModules) {
             if (module.settingsLoaded) {
@@ -46,22 +46,22 @@ const settings = (function() {
 })();
 
 settings.addModule((function() {
-    const formEl = $("#change-password-form");
-    const oldPasswordEl = $("#old-password");
-    const newPassword1El = $("#new-password1");
-    const newPassword2El = $("#new-password2");
+    const $form = $("#change-password-form");
+    const $oldPassword = $("#old-password");
+    const $newPassword1 = $("#new-password1");
+    const $newPassword2 = $("#new-password2");
 
     function settingsLoaded(settings) {
     }
 
-    formEl.submit(() => {
-        const oldPassword = oldPasswordEl.val();
-        const newPassword1 = newPassword1El.val();
-        const newPassword2 = newPassword2El.val();
+    $form.submit(() => {
+        const oldPassword = $oldPassword.val();
+        const newPassword1 = $newPassword1.val();
+        const newPassword2 = $newPassword2.val();
 
-        oldPasswordEl.val('');
-        newPassword1El.val('');
-        newPassword2El.val('');
+        $oldPassword.val('');
+        $newPassword1.val('');
+        $newPassword2.val('');
 
         if (newPassword1 !== newPassword2) {
             alert("New passwords are not the same.");
@@ -92,16 +92,16 @@ settings.addModule((function() {
 })());
 
 settings.addModule((function() {
-    const formEl = $("#protected-session-timeout-form");
-    const protectedSessionTimeoutEl = $("#protected-session-timeout-in-seconds");
+    const $form = $("#protected-session-timeout-form");
+    const $protectedSessionTimeout = $("#protected-session-timeout-in-seconds");
     const settingName = 'protected_session_timeout';
 
     function settingsLoaded(settings) {
-        protectedSessionTimeoutEl.val(settings[settingName]);
+        $protectedSessionTimeout.val(settings[settingName]);
     }
 
-    formEl.submit(() => {
-        const protectedSessionTimeout = protectedSessionTimeoutEl.val();
+    $form.submit(() => {
+        const protectedSessionTimeout = $protectedSessionTimeout.val();
 
         settings.saveSettings(settingName, protectedSessionTimeout).then(() => {
             protected_session.setProtectedSessionTimeout(protectedSessionTimeout);
@@ -116,16 +116,16 @@ settings.addModule((function() {
 })());
 
 settings.addModule((function () {
-    const formEl = $("#history-snapshot-time-interval-form");
-    const timeIntervalEl = $("#history-snapshot-time-interval-in-seconds");
+    const $form = $("#history-snapshot-time-interval-form");
+    const $timeInterval = $("#history-snapshot-time-interval-in-seconds");
     const settingName = 'history_snapshot_time_interval';
 
     function settingsLoaded(settings) {
-        timeIntervalEl.val(settings[settingName]);
+        $timeInterval.val(settings[settingName]);
     }
 
-    formEl.submit(() => {
-        settings.saveSettings(settingName, timeIntervalEl.val());
+    $form.submit(() => {
+        settings.saveSettings(settingName, $timeInterval.val());
 
         return false;
     });
@@ -136,50 +136,50 @@ settings.addModule((function () {
 })());
 
 settings.addModule((async function () {
-    const appVersionEl = $("#app-version");
-    const dbVersionEl = $("#db-version");
-    const buildDateEl = $("#build-date");
-    const buildRevisionEl = $("#build-revision");
+    const $appVersion = $("#app-version");
+    const $dbVersion = $("#db-version");
+    const $buildDate = $("#build-date");
+    const $buildRevision = $("#build-revision");
 
     const appInfo = await server.get('app-info');
 
-    appVersionEl.html(appInfo.app_version);
-    dbVersionEl.html(appInfo.db_version);
-    buildDateEl.html(appInfo.build_date);
-    buildRevisionEl.html(appInfo.build_revision);
-    buildRevisionEl.attr('href', 'https://github.com/zadam/trilium/commit/' + appInfo.build_revision);
+    $appVersion.html(appInfo.app_version);
+    $dbVersion.html(appInfo.db_version);
+    $buildDate.html(appInfo.build_date);
+    $buildRevision.html(appInfo.build_revision);
+    $buildRevision.attr('href', 'https://github.com/zadam/trilium/commit/' + appInfo.build_revision);
 
     return {};
 })());
 
 settings.addModule((async function () {
-    const forceFullSyncButton = $("#force-full-sync-button");
-    const fillSyncRowsButton = $("#fill-sync-rows-button");
-    const anonymizeButton = $("#anonymize-button");
-    const cleanupSoftDeletedButton = $("#cleanup-soft-deleted-items-button");
-    const cleanupUnusedImagesButton = $("#cleanup-unused-images-button");
-    const vacuumDatabaseButton = $("#vacuum-database-button");
+    const $forceFullSyncButton = $("#force-full-sync-button");
+    const $fillSyncRowsButton = $("#fill-sync-rows-button");
+    const $anonymizeButton = $("#anonymize-button");
+    const $cleanupSoftDeletedButton = $("#cleanup-soft-deleted-items-button");
+    const $cleanupUnusedImagesButton = $("#cleanup-unused-images-button");
+    const $vacuumDatabaseButton = $("#vacuum-database-button");
 
-    forceFullSyncButton.click(async () => {
+    $forceFullSyncButton.click(async () => {
         await server.post('sync/force-full-sync');
 
         showMessage("Full sync triggered");
     });
 
-    fillSyncRowsButton.click(async () => {
+    $fillSyncRowsButton.click(async () => {
         await server.post('sync/fill-sync-rows');
 
         showMessage("Sync rows filled successfully");
     });
 
 
-    anonymizeButton.click(async () => {
+    $anonymizeButton.click(async () => {
         await server.post('anonymization/anonymize');
 
         showMessage("Created anonymized database");
     });
 
-    cleanupSoftDeletedButton.click(async () => {
+    $cleanupSoftDeletedButton.click(async () => {
         if (confirm("Do you really want to clean up soft-deleted items?")) {
             await server.post('cleanup/cleanup-soft-deleted-items');
 
@@ -187,7 +187,7 @@ settings.addModule((async function () {
         }
     });
 
-    cleanupUnusedImagesButton.click(async () => {
+    $cleanupUnusedImagesButton.click(async () => {
         if (confirm("Do you really want to clean up unused images?")) {
             await server.post('cleanup/cleanup-unused-images');
 
@@ -195,7 +195,7 @@ settings.addModule((async function () {
         }
     });
 
-    vacuumDatabaseButton.click(async () => {
+    $vacuumDatabaseButton.click(async () => {
         await server.post('cleanup/vacuum-database');
 
         showMessage("Database has been vacuumed");
diff --git a/src/public/javascripts/dialogs/sql_console.js b/src/public/javascripts/dialogs/sql_console.js
index 4c2647da3..4d2c88de1 100644
--- a/src/public/javascripts/dialogs/sql_console.js
+++ b/src/public/javascripts/dialogs/sql_console.js
@@ -1,16 +1,16 @@
 "use strict";
 
 const sqlConsole = (function() {
-    const dialogEl = $("#sql-console-dialog");
-    const queryEl = $('#sql-console-query');
-    const executeButton = $('#sql-console-execute');
-    const resultHeadEl = $('#sql-console-results thead');
-    const resultBodyEl = $('#sql-console-results tbody');
+    const $dialog = $("#sql-console-dialog");
+    const $query = $('#sql-console-query');
+    const $executeButton = $('#sql-console-execute');
+    const $resultHead = $('#sql-console-results thead');
+    const $resultBody = $('#sql-console-results tbody');
 
     function showDialog() {
-        glob.activeDialog = dialogEl;
+        glob.activeDialog = $dialog;
 
-        dialogEl.dialog({
+        $dialog.dialog({
             modal: true,
             width: $(window).width(),
             height: $(window).height()
@@ -18,7 +18,7 @@ const sqlConsole = (function() {
     }
 
     async function execute() {
-        const sqlQuery = queryEl.val();
+        const sqlQuery = $query.val();
 
         const result = await server.post("sql/execute", {
             query: sqlQuery
@@ -34,8 +34,8 @@ const sqlConsole = (function() {
 
         const rows = result.rows;
 
-        resultHeadEl.empty();
-        resultBodyEl.empty();
+        $resultHead.empty();
+        $resultBody.empty();
 
         if (rows.length > 0) {
             const result = rows[0];
@@ -45,7 +45,7 @@ const sqlConsole = (function() {
                 rowEl.append($("<th>").html(key));
             }
 
-            resultHeadEl.append(rowEl);
+            $resultHead.append(rowEl);
         }
 
         for (const result of rows) {
@@ -55,15 +55,15 @@ const sqlConsole = (function() {
                 rowEl.append($("<td>").html(result[key]));
             }
 
-            resultBodyEl.append(rowEl);
+            $resultBody.append(rowEl);
         }
     }
 
     $(document).bind('keydown', 'alt+o', showDialog);
 
-    queryEl.bind('keydown', 'ctrl+return', execute);
+    $query.bind('keydown', 'ctrl+return', execute);
 
-    executeButton.click(execute);
+    $executeButton.click(execute);
 
     return {
         showDialog