js: Convert static/js/overlays.js to ES6 module.

Signed-off-by: Anders Kaseorg <anders@zulip.com>

.eslintrc.json

@@ -165,7 +165,6 @@
                 "narrow": false,
                 "navigate": false,
                 "notifications": false,
-                "overlays": false,
                 "padded_widget": false,
                 "page_params": false,
                 "panels": false,

frontend_tests/node_tests/dispatch_subs.js

@@ -29,7 +29,8 @@ set_global("current_msg_list", {});
 const narrow_state = {__esModule: true};
 rewiremock("../../static/js/narrow_state").with(narrow_state);
 const page_params = set_global("page_params", {});
-const overlays = set_global("overlays", {});
+const overlays = {__esModule: true};
+rewiremock("../../static/js/overlays").with(overlays);
 const settings_org = set_global("settings_org", {});
 const settings_streams = set_global("settings_streams", {});
 const stream_list = set_global("stream_list", {});

frontend_tests/node_tests/hashchange.js

@@ -32,7 +32,8 @@ rewiremock("../../static/js/info_overlay").with(info_overlay);
 const message_viewport = {__esModule: true};
 rewiremock("../../static/js/message_viewport").with(message_viewport);
 const narrow = set_global("narrow", {});
-const overlays = set_global("overlays", {});
+const overlays = {__esModule: true};
+rewiremock("../../static/js/overlays").with(overlays);
 const settings = set_global("settings", {});
 const subs = set_global("subs", {});
 const ui_util = {__esModule: true};

frontend_tests/node_tests/hotkey.js

@@ -16,14 +16,17 @@ const popovers = {
     user_info_popped: () => false,
 };
 rewiremock("../../static/js/popovers").with(popovers);
-const overlays = set_global("overlays", {
+const overlays = {
+    __esModule: true,
     is_active: () => false,
     settings_open: () => false,
     streams_open: () => false,
     lightbox_open: () => false,
     drafts_open: () => false,
     info_overlay_open: () => false,
-});
+};
+
+rewiremock("../../static/js/overlays").with(overlays);
 
 rewiremock("../../static/js/stream_popover").with({
     stream_popped: () => false,

frontend_tests/node_tests/lightbox.js

@@ -9,7 +9,7 @@ const {run_test} = require("../zjsunit/test");
 const $ = require("../zjsunit/zjquery");
 
 set_global("Image", class Image {});
-set_global("overlays", {
+rewiremock("../../static/js/overlays").with({
     close_overlay: () => {},
     close_active: () => {},
     open_overlay: () => {},

frontend_tests/node_tests/settings_org.js

@@ -53,7 +53,9 @@ stub_templates((name, data) => {
     throw new Error(`Unknown template ${name}`);
 });
 
-const overlays = set_global("overlays", {});
+const overlays = {__esModule: true};
+
+rewiremock("../../static/js/overlays").with(overlays);
 
 const _ui_report = {
     __esModule: true,

frontend_tests/node_tests/stream_events.js

@@ -38,7 +38,7 @@ set_global("message_list", {
 });
 
 subs = set_global("subs", {update_settings_for_subscribed: noop});
-set_global("overlays", {streams_open: () => true});
+rewiremock("../../static/js/overlays").with({streams_open: () => true});
 
 rewiremock.enable();
 

frontend_tests/node_tests/stream_list.js

@@ -20,7 +20,7 @@ const noop = () => {};
 
 const topic_list = {__esModule: true};
 rewiremock("../../static/js/topic_list").with(topic_list);
-set_global("overlays", {});
+rewiremock("../../static/js/overlays").with({});
 rewiremock("../../static/js/popovers").with({});
 
 rewiremock("../../static/js/keydown_util").with({

frontend_tests/node_tests/tutorial.js

@@ -31,7 +31,8 @@ const home_msg_list = set_global("home_msg_list", {});
 const message_list = set_global("message_list", {});
 const message_util = set_global("message_util", {});
 const notifications = set_global("notifications", {});
-const overlays = set_global("overlays", {});
+const overlays = {__esModule: true};
+rewiremock("../../static/js/overlays").with(overlays);
 const resize = {__esModule: true};
 rewiremock("../../static/js/resize").with(resize);
 let stream_list = set_global("stream_list", {});

frontend_tests/node_tests/ui_init.js

@@ -110,7 +110,6 @@ rewiremock.enable();
 const util = zrequire("util");
 
 zrequire("hash_util");
-zrequire("overlays");
 zrequire("message_view_header");
 zrequire("presence");
 zrequire("search_pill_widget");

static/js/admin.js

@@ -3,6 +3,7 @@
 const render_admin_tab = require("../templates/admin_tab.hbs");
 const render_settings_organization_settings_tip = require("../templates/settings/organization_settings_tip.hbs");
 
+const overlays = require("./overlays");
 const settings_config = require("./settings_config");
 const settings_data = require("./settings_data");
 const settings_panel_menu = require("./settings_panel_menu");

static/js/bundles/app.js

@@ -27,7 +27,6 @@ import "../reload";
 import "../compose_actions";
 import "../subs";
 import "../ui";
-import "../overlays";
 import "../typeahead_helper";
 import "../search_suggestion";
 import "../search";

static/js/click_handlers.js

@@ -12,6 +12,7 @@ import * as compose_state from "./compose_state";
 import * as message_edit from "./message_edit";
 import * as message_edit_history from "./message_edit_history";
 import * as muting_ui from "./muting_ui";
+import * as overlays from "./overlays";
 import * as popovers from "./popovers";
 import * as rows from "./rows";
 import * as settings_panel_menu from "./settings_panel_menu";

static/js/confirm_dialog.js

@@ -2,6 +2,8 @@
 
 const render_confirm_dialog = require("../templates/confirm_dialog.hbs");
 
+const overlays = require("./overlays");
+
 /*
     Look for confirm_dialog in settings_user_groups
     to see an example of how to use this widget.  It's

static/js/drafts.js

@@ -8,6 +8,7 @@ import * as compose_fade from "./compose_fade";
 import * as compose_state from "./compose_state";
 import {localstorage} from "./localstorage";
 import * as markdown from "./markdown";
+import * as overlays from "./overlays";
 import * as people from "./people";
 import * as stream_color from "./stream_color";
 import * as stream_data from "./stream_data";

static/js/global.d.ts

@@ -39,7 +39,6 @@ declare let message_util: any;
 declare let narrow: any;
 declare let navigate: any;
 declare let notifications: any;
-declare let overlays: any;
 declare let padded_widget: any;
 declare let page_params: any;
 declare let panels: any;

static/js/hashchange.js

@@ -5,6 +5,7 @@ const floating_recipient_bar = require("./floating_recipient_bar");
 const info_overlay = require("./info_overlay");
 const invite = require("./invite");
 const message_viewport = require("./message_viewport");
+const overlays = require("./overlays");
 const settings_panel_menu = require("./settings_panel_menu");
 const top_left_corner = require("./top_left_corner");
 const ui_util = require("./ui_util");

static/js/hotkey.js

@@ -13,6 +13,7 @@ const gear_menu = require("./gear_menu");
 const lightbox = require("./lightbox");
 const message_edit = require("./message_edit");
 const muting_ui = require("./muting_ui");
+const overlays = require("./overlays");
 const popovers = require("./popovers");
 const stream_popover = require("./stream_popover");
 const topic_zoom = require("./topic_zoom");

static/js/info_overlay.js

@@ -1,6 +1,7 @@
 import * as common from "./common";
 import * as components from "./components";
 import * as keydown_util from "./keydown_util";
+import * as overlays from "./overlays";
 import * as popovers from "./popovers";
 
 // Make it explicit that our toggler is undefined until

static/js/invite.js

@@ -8,6 +8,7 @@ import render_settings_dev_env_email_access from "../templates/settings/dev_env_
 
 import * as channel from "./channel";
 import * as common from "./common";
+import * as overlays from "./overlays";
 import * as stream_data from "./stream_data";
 import * as ui_report from "./ui_report";
 

static/js/lightbox.js

@@ -1,4 +1,5 @@
 import {LightboxCanvas} from "./lightbox_canvas";
+import * as overlays from "./overlays";
 import * as people from "./people";
 import * as popovers from "./popovers";
 import * as rows from "./rows";

static/js/lightbox_canvas.js

@@ -1,3 +1,5 @@
+import * as overlays from "./overlays";
+
 const funcs = {
     setZoom(meta, zoom) {
         // condition to handle zooming event by zoom hotkeys

static/js/muting_ui.js

@@ -5,6 +5,7 @@ import * as channel from "./channel";
 import * as feedback_widget from "./feedback_widget";
 import * as ListWidget from "./list_widget";
 import * as muting from "./muting";
+import * as overlays from "./overlays";
 import * as settings_muting from "./settings_muting";
 import * as stream_data from "./stream_data";
 import * as stream_popover from "./stream_popover";

static/js/overlays.js

@@ -1,6 +1,4 @@
-"use strict";
+import * as popovers from "./popovers";
-
-const popovers = require("./popovers");
 
 let active_overlay;
 let close_handler;
@@ -12,33 +10,33 @@ function reset_state() {
     open_overlay_name = undefined;
 }
 
-exports.is_active = function () {
+export function is_active() {
     return Boolean(open_overlay_name);
-};
+}
 
-exports.is_modal_open = function () {
+export function is_modal_open() {
     return $(".modal").hasClass("in");
-};
+}
 
-exports.info_overlay_open = function () {
+export function info_overlay_open() {
     return open_overlay_name === "informationalOverlays";
-};
+}
 
-exports.settings_open = function () {
+export function settings_open() {
     return open_overlay_name === "settings";
-};
+}
 
-exports.streams_open = function () {
+export function streams_open() {
     return open_overlay_name === "subscriptions";
-};
+}
 
-exports.lightbox_open = function () {
+export function lightbox_open() {
     return open_overlay_name === "lightbox";
-};
+}
 
-exports.drafts_open = function () {
+export function drafts_open() {
     return open_overlay_name === "drafts";
-};
+}
 
 // To address bugs where mouse might apply to the streams/settings
 // overlays underneath an open modal within those settings UI, we add
@@ -47,26 +45,26 @@ exports.drafts_open = function () {
 //
 // This is kinda hacky; it only works for modals within overlays, and
 // we need to make sure it gets re-enabled when the modal closes.
-exports.disable_background_mouse_events = function () {
+export function disable_background_mouse_events() {
     $(".overlay.show").attr("style", "pointer-events: none");
-};
+}
 
 // This removes only the inline-style of the element that
 // was added in disable_background_mouse_events and
 // enables the background mouse events.
-exports.enable_background_mouse_events = function () {
+export function enable_background_mouse_events() {
     $(".overlay.show").attr("style", null);
-};
+}
 
-exports.active_modal = function () {
+export function active_modal() {
-    if (!exports.is_modal_open()) {
+    if (!is_modal_open()) {
         blueslip.error("Programming error — Called active_modal when there is no modal open");
         return undefined;
     }
     return `#${CSS.escape($(".modal.in").attr("id"))}`;
-};
+}
 
-exports.open_overlay = function (opts) {
+export function open_overlay(opts) {
     popovers.hide_all();
 
     if (!opts.name || !opts.overlay || !opts.on_close) {
@@ -107,9 +105,9 @@ exports.open_overlay = function (opts) {
         opts.on_close();
         reset_state();
     };
-};
+}
 
-exports.open_modal = function (selector) {
+export function open_modal(selector) {
     if (selector === undefined) {
         blueslip.error("Undefined selector was passed into open_modal");
         return;
@@ -120,10 +118,8 @@ exports.open_modal = function (selector) {
         return;
     }
 
-    if (exports.is_modal_open()) {
+    if (is_modal_open()) {
-        blueslip.error(
+        blueslip.error("open_modal() was called while " + active_modal() + " modal was open.");
-            "open_modal() was called while " + exports.active_modal() + " modal was open.",
-        );
         return;
     }
 
@@ -132,13 +128,13 @@ exports.open_modal = function (selector) {
     const elem = $(selector).expectOne();
     elem.modal("show").attr("aria-hidden", false);
     // Disable background mouse events when modal is active
-    exports.disable_background_mouse_events();
+    disable_background_mouse_events();
     // Remove previous alert messages from modal, if exists.
     elem.find(".alert").hide();
     elem.find(".alert-notification").html("");
-};
+}
 
-exports.close_overlay = function (name) {
+export function close_overlay(name) {
     popovers.hide_all();
 
     if (name !== open_overlay_name) {
@@ -166,31 +162,31 @@ exports.close_overlay = function (name) {
     }
 
     close_handler();
-};
+}
 
-exports.close_active = function () {
+export function close_active() {
     if (!open_overlay_name) {
         blueslip.warn("close_active() called without checking is_active()");
         return;
     }
 
-    exports.close_overlay(open_overlay_name);
+    close_overlay(open_overlay_name);
-};
+}
 
-exports.close_modal = function (selector) {
+export function close_modal(selector) {
     if (selector === undefined) {
         blueslip.error("Undefined selector was passed into close_modal");
         return;
     }
 
-    if (!exports.is_modal_open()) {
+    if (!is_modal_open()) {
         blueslip.warn("close_active_modal() called without checking is_modal_open()");
         return;
     }
 
-    if (exports.active_modal() !== selector) {
+    if (active_modal() !== selector) {
         blueslip.error(
-            "Trying to close " + selector + " modal when " + exports.active_modal() + " is open.",
+            "Trying to close " + selector + " modal when " + active_modal() + " is open.",
         );
         return;
     }
@@ -200,36 +196,36 @@ exports.close_modal = function (selector) {
     const elem = $(selector).expectOne();
     elem.modal("hide").attr("aria-hidden", true);
     // Enable mouse events for the background as the modal closes.
-    exports.enable_background_mouse_events();
+    enable_background_mouse_events();
-};
+}
 
-exports.close_active_modal = function () {
+export function close_active_modal() {
-    if (!exports.is_modal_open()) {
+    if (!is_modal_open()) {
         blueslip.warn("close_active_modal() called without checking is_modal_open()");
         return;
     }
 
     $(".modal.in").modal("hide").attr("aria-hidden", true);
-};
+}
 
-exports.close_for_hash_change = function () {
+export function close_for_hash_change() {
     $(".overlay.show").removeClass("show");
     if (active_overlay) {
         close_handler();
     }
-};
+}
 
-exports.open_settings = function () {
+export function open_settings() {
-    exports.open_overlay({
+    open_overlay({
         name: "settings",
         overlay: $("#settings_overlay_container"),
         on_close() {
             hashchange.exit_overlay();
         },
     });
-};
+}
 
-exports.initialize = function () {
+export function initialize() {
     $("body").on("click", ".overlay, .overlay .exit", (e) => {
         let $target = $(e.target);
 
@@ -244,11 +240,9 @@ exports.initialize = function () {
 
         const target_name = $target.attr("data-overlay");
 
-        exports.close_overlay(target_name);
+        close_overlay(target_name);
 
         e.preventDefault();
         e.stopPropagation();
     });
-};
+}
-
-window.overlays = exports;

static/js/popovers.js

@@ -22,6 +22,7 @@ import * as message_viewport from "./message_viewport";
 import * as muting from "./muting";
 import * as muting_ui from "./muting_ui";
 import * as narrow_state from "./narrow_state";
+import * as overlays from "./overlays";
 import * as people from "./people";
 import * as resize from "./resize";
 import * as rows from "./rows";

static/js/server_events_dispatch.js

@@ -8,6 +8,7 @@ import * as message_edit from "./message_edit";
 import * as muting_ui from "./muting_ui";
 import * as narrow_state from "./narrow_state";
 import * as night_mode from "./night_mode";
+import * as overlays from "./overlays";
 import * as peer_data from "./peer_data";
 import * as people from "./people";
 import * as reload from "./reload";

static/js/settings.js

@@ -3,6 +3,7 @@
 const timezones = require("../generated/timezones.json");
 const render_settings_tab = require("../templates/settings_tab.hbs");
 
+const overlays = require("./overlays");
 const people = require("./people");
 const settings_config = require("./settings_config");
 const settings_panel_menu = require("./settings_panel_menu");

static/js/settings_account.js

@@ -8,6 +8,7 @@ const render_settings_dev_env_email_access = require("../templates/settings/dev_
 
 const channel = require("./channel");
 const common = require("./common");
+const overlays = require("./overlays");
 const people = require("./people");
 const pill_typeahead = require("./pill_typeahead");
 const popovers = require("./popovers");

static/js/settings_bots.js

@@ -9,6 +9,7 @@ const render_settings_edit_outgoing_webhook_service = require("../templates/sett
 
 const channel = require("./channel");
 const loading = require("./loading");
+const overlays = require("./overlays");
 const people = require("./people");
 
 exports.hide_errors = function () {

static/js/settings_display.js

@@ -3,6 +3,7 @@
 const channel = require("./channel");
 const emojisets = require("./emojisets");
 const loading = require("./loading");
+const overlays = require("./overlays");
 const settings_config = require("./settings_config");
 const settings_ui = require("./settings_ui");
 const ui_report = require("./ui_report");

static/js/settings_org.js

@@ -6,6 +6,7 @@ const render_settings_admin_realm_domains_list = require("../templates/settings/
 
 const channel = require("./channel");
 const loading = require("./loading");
+const overlays = require("./overlays");
 const settings_config = require("./settings_config");
 const settings_ui = require("./settings_ui");
 const stream_data = require("./stream_data");

static/js/settings_users.js

@@ -7,6 +7,7 @@ const render_admin_user_list = require("../templates/admin_user_list.hbs");
 const channel = require("./channel");
 const ListWidget = require("./list_widget");
 const loading = require("./loading");
+const overlays = require("./overlays");
 const people = require("./people");
 const settings_config = require("./settings_config");
 const settings_data = require("./settings_data");

static/js/stream_edit.js

@@ -7,6 +7,7 @@ import render_subscription_stream_privacy_modal from "../templates/subscription_
 import * as channel from "./channel";
 import * as ListWidget from "./list_widget";
 import * as narrow_state from "./narrow_state";
+import * as overlays from "./overlays";
 import * as peer_data from "./peer_data";
 import * as people from "./people";
 import * as pill_typeahead from "./pill_typeahead";

static/js/stream_events.js

@@ -1,5 +1,6 @@
 import * as color_data from "./color_data";
 import * as narrow_state from "./narrow_state";
+import * as overlays from "./overlays";
 import * as peer_data from "./peer_data";
 import * as stream_color from "./stream_color";
 import * as stream_data from "./stream_data";

static/js/stream_muting.js

@@ -1,5 +1,6 @@
 import * as message_scroll from "./message_scroll";
 import * as message_viewport from "./message_viewport";
+import * as overlays from "./overlays";
 
 export function update_is_muted(sub, value) {
     sub.is_muted = value;

static/js/subs.js

@@ -12,6 +12,7 @@ const components = require("./components");
 const compose_state = require("./compose_state");
 const loading = require("./loading");
 const message_live_update = require("./message_live_update");
+const overlays = require("./overlays");
 const people = require("./people");
 const scroll_util = require("./scroll_util");
 const search_util = require("./search_util");

static/js/ui_init.js

@@ -26,6 +26,7 @@ const message_edit = require("./message_edit");
 const message_scroll = require("./message_scroll");
 const message_viewport = require("./message_viewport");
 const muting = require("./muting");
+const overlays = require("./overlays");
 const people = require("./people");
 const pm_conversations = require("./pm_conversations");
 const pm_list = require("./pm_list");

static/js/unread_ops.js

@@ -2,6 +2,7 @@
 
 const channel = require("./channel");
 const message_viewport = require("./message_viewport");
+const overlays = require("./overlays");
 const reload = require("./reload");
 const unread_ui = require("./unread_ui");
 

static/js/user_status_ui.js

@@ -1,3 +1,4 @@
+import * as overlays from "./overlays";
 import * as people from "./people";
 import * as user_status from "./user_status";