using ES6 modules for whole frontend SPA app

src/public/javascripts/dialogs/sql_console.js

@@ -1,106 +1,106 @@
 "use strict";
 
-const sqlConsole = (function() {
-    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');
+import utils from '../utils.js';
 
-    let codeEditor;
+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 = $dialog;
+let codeEditor;
 
-        $dialog.dialog({
-            modal: true,
-            width: $(window).width(),
-            height: $(window).height(),
-            open: function() {
-                initEditor();
-            }
-        });
-    }
+function showDialog() {
+    glob.activeDialog = $dialog;
 
-    async function initEditor() {
-        if (!codeEditor) {
-            await utils.requireLibrary(utils.CODE_MIRROR);
-
-            CodeMirror.keyMap.default["Shift-Tab"] = "indentLess";
-            CodeMirror.keyMap.default["Tab"] = "indentMore";
-
-            // removing Escape binding so that Escape will propagate to the dialog (which will close on escape)
-            delete CodeMirror.keyMap.basic["Esc"];
-
-            CodeMirror.modeURL = 'libraries/codemirror/mode/%N/%N.js';
-
-            codeEditor = CodeMirror($query[0], {
-                value: "",
-                viewportMargin: Infinity,
-                indentUnit: 4,
-                highlightSelectionMatches: {showToken: /\w/, annotateScrollbar: false}
-            });
-
-            codeEditor.setOption("mode", "text/x-sqlite");
-            CodeMirror.autoLoadMode(codeEditor, "sql");
+    $dialog.dialog({
+        modal: true,
+        width: $(window).width(),
+        height: $(window).height(),
+        open: function() {
+            initEditor();
         }
+    });
+}
 
-        codeEditor.focus();
-    }
+async function initEditor() {
+    if (!codeEditor) {
+        await utils.requireLibrary(utils.CODE_MIRROR);
 
-    async function execute(e) {
-        // stop from propagating upwards (dangerous especially with ctrl+enter executable javascript notes)
-        e.preventDefault();
-        e.stopPropagation();
+        CodeMirror.keyMap.default["Shift-Tab"] = "indentLess";
+        CodeMirror.keyMap.default["Tab"] = "indentMore";
 
-        const sqlQuery = codeEditor.getValue();
+        // removing Escape binding so that Escape will propagate to the dialog (which will close on escape)
+        delete CodeMirror.keyMap.basic["Esc"];
 
-        const result = await server.post("sql/execute", {
-            query: sqlQuery
+        CodeMirror.modeURL = 'libraries/codemirror/mode/%N/%N.js';
+
+        codeEditor = CodeMirror($query[0], {
+            value: "",
+            viewportMargin: Infinity,
+            indentUnit: 4,
+            highlightSelectionMatches: {showToken: /\w/, annotateScrollbar: false}
         });
 
-        if (!result.success) {
-            utils.showError(result.error);
-            return;
-        }
-        else {
-            utils.showMessage("Query was executed successfully.");
-        }
-
-        const rows = result.rows;
-
-        $resultHead.empty();
-        $resultBody.empty();
-
-        if (rows.length > 0) {
-            const result = rows[0];
-            const rowEl = $("<tr>");
-
-            for (const key in result) {
-                rowEl.append($("<th>").html(key));
-            }
-
-            $resultHead.append(rowEl);
-        }
-
-        for (const result of rows) {
-            const rowEl = $("<tr>");
-
-            for (const key in result) {
-                rowEl.append($("<td>").html(result[key]));
-            }
-
-            $resultBody.append(rowEl);
-        }
+        codeEditor.setOption("mode", "text/x-sqlite");
+        CodeMirror.autoLoadMode(codeEditor, "sql");
     }
 
-    $(document).bind('keydown', 'alt+o', showDialog);
+    codeEditor.focus();
+}
 
-    $query.bind('keydown', 'ctrl+return', execute);
+async function execute(e) {
+    // stop from propagating upwards (dangerous especially with ctrl+enter executable javascript notes)
+    e.preventDefault();
+    e.stopPropagation();
 
-    $executeButton.click(execute);
+    const sqlQuery = codeEditor.getValue();
 
-    return {
-        showDialog
-    };
-})();
+    const result = await server.post("sql/execute", {
+        query: sqlQuery
+    });
+
+    if (!result.success) {
+        utils.showError(result.error);
+        return;
+    }
+    else {
+        utils.showMessage("Query was executed successfully.");
+    }
+
+    const rows = result.rows;
+
+    $resultHead.empty();
+    $resultBody.empty();
+
+    if (rows.length > 0) {
+        const result = rows[0];
+        const rowEl = $("<tr>");
+
+        for (const key in result) {
+            rowEl.append($("<th>").html(key));
+        }
+
+        $resultHead.append(rowEl);
+    }
+
+    for (const result of rows) {
+        const rowEl = $("<tr>");
+
+        for (const key in result) {
+            rowEl.append($("<td>").html(result[key]));
+        }
+
+        $resultBody.append(rowEl);
+    }
+}
+
+$(document).bind('keydown', 'alt+o', showDialog);
+
+$query.bind('keydown', 'ctrl+return', execute);
+
+$executeButton.click(execute);
+
+export default {
+    showDialog
+};