refactor: Extract settings_toggle.js.

This mostly moves code, and we also abandon the lookup mechanism
for finding our toggler.

.eslintrc.json

@@ -47,6 +47,7 @@
         "user_groups": false,
         "navigate": false,
         "toMarkdown": false,
+        "settings_toggle": false,
         "settings_account": false,
         "settings_display": false,
         "settings_notifications": false,

static/js/admin.js

@@ -118,7 +118,7 @@ exports.launch_page = function (tab) {
     var $active_tab = $("#settings_overlay_container li[data-section='" + tab + "']");
 
     if ($active_tab.hasClass("admin")) {
-        components.toggle.lookup("settings-toggle").goto("organization", { dont_switch_tab: true });
+        settings_toggle.highlight_toggle('organization');
     }
 
     overlays.open_settings();

static/js/click_handlers.js

@@ -762,34 +762,6 @@ $(function () {
 
         $(".settings-section" + sel + ", .settings-wrapper" + sel).addClass("show");
     });
-
-    (i18n.ensure_i18n(function () {
-        var settings_toggle = components.toggle({
-            name: "settings-toggle",
-            values: [
-                { label: i18n.t("Settings"), key: "settings" },
-                { label: i18n.t("Organization"), key: "organization" },
-            ],
-            callback: function (name, key, payload) {
-                $(".sidebar li").hide();
-
-                if (key === "organization") {
-                    $("li.admin").show();
-                    if (!payload.dont_switch_tab) {
-                        $("li[data-section='organization-profile']").click();
-                    }
-                } else {
-                    $(".settings-list li:not(.admin)").show();
-                    if (!payload.dont_switch_tab) {
-                        $("li[data-section='your-account']").click();
-                    }
-                }
-            },
-        }).get();
-
-        $("#settings_overlay_container .tab-container")
-            .append(settings_toggle);
-    }));
 });
 
 return exports;

static/js/settings.js

@@ -165,7 +165,7 @@ exports.launch_page = function (tab) {
     var $active_tab = $("#settings_overlay_container li[data-section='" + tab + "']");
 
     if (!$active_tab.hasClass("admin")) {
-        components.toggle.lookup("settings-toggle").goto("settings", { dont_switch_tab: true });
+        settings_toggle.highlight_toggle('settings');
     }
 
     overlays.open_settings();

static/js/settings_toggle.js

@@ -0,0 +1,50 @@
+var settings_toggle = (function () {
+
+var exports = {};
+
+var toggler;
+
+exports.highlight_toggle = function (tab_name) {
+    if (toggler) {
+        toggler.goto(tab_name, { dont_switch_tab: true });
+    }
+};
+
+exports.create_toggler = function () {
+    toggler = components.toggle({
+        name: "settings-toggle",
+        values: [
+            { label: i18n.t("Settings"), key: "settings" },
+            { label: i18n.t("Organization"), key: "organization" },
+        ],
+        callback: function (name, key, payload) {
+            $(".sidebar li").hide();
+
+            if (key === "organization") {
+                $("li.admin").show();
+                if (!payload.dont_switch_tab) {
+                    $("li[data-section='organization-profile']").click();
+                }
+            } else {
+                $(".settings-list li:not(.admin)").show();
+                if (!payload.dont_switch_tab) {
+                    $("li[data-section='your-account']").click();
+                }
+            }
+        },
+    });
+
+    $("#settings_overlay_container .tab-container").append(toggler.get());
+};
+
+exports.initialize = function () {
+    i18n.ensure_i18n(exports.create_toggler);
+};
+
+return exports;
+
+}());
+
+if (typeof module !== 'undefined') {
+    module.exports = settings_toggle;
+}

static/js/ui_init.js

@@ -270,6 +270,7 @@ $(function () {
     notifications.initialize();
     gear_menu.initialize();
     settings_sections.initialize();
+    settings_toggle.initialize();
     hashchange.initialize();
     pointer.initialize();
     unread_ui.initialize();

zproject/settings.py

@@ -1093,6 +1093,7 @@ JS_SPECS = {
             'js/ui_util.js',
             'js/pointer.js',
             'js/click_handlers.js',
+            'js/settings_toggle.js',
             'js/scroll_bar.js',
             'js/gear_menu.js',
             'js/copy_and_paste.js',