ui-refactor: Rename modals.js to overlays.js.

Fixed #4702.

.eslintrc.json

@@ -57,7 +57,7 @@
         "compose_actions": false,
         "compose_state": false,
         "compose_fade": false,
-        "modals": false,
+        "overlays": false,
         "stream_create": false,
         "stream_edit": false,
         "subs": false,

frontend_tests/node_tests/hotkey.js

@@ -2,7 +2,7 @@
 //
 // The way the Zulip hotkey tests work is as follows.  First, we set
 // up various contexts by monkey-patching the various hotkeys exports
-// functions (like modals.settings_open).  Within that context, to
+// functions (like overlays.settings_open).  Within that context, to
 // test whether a given key (e.g. `x`) results in a specific function
 // (e.g. `ui.foo()`), we fail to import any modules other than
 // hotkey.js so that accessing them will result in a ReferenceError.
@@ -17,7 +17,7 @@ set_global('activity', {
 set_global('drafts', {
 });
 
-set_global('modals', {
+set_global('overlays', {
 });
 
 set_global('reactions', {
@@ -158,7 +158,7 @@ function stubbing(func_name_to_stub, test_function) {
     // We have to skip some checks due to the way the code is
     // currently organized for mapped keys.
     hotkey.is_editing_stream_name = return_false;
-    modals.settings_open = return_false;
+    overlays.settings_open = return_false;
 
     set_global('popovers', {
         actions_popped: return_false,
@@ -182,7 +182,7 @@ function stubbing(func_name_to_stub, test_function) {
     _.each([return_true, return_false], function (settings_open) {
         _.each([return_true, return_false], function (is_active) {
             _.each([return_true, return_false], function (info_overlay_open) {
-                set_global('modals', {
+                set_global('overlays', {
                     is_active: is_active,
                     settings_open: settings_open,
                     info_overlay_open: info_overlay_open});
@@ -194,15 +194,15 @@ function stubbing(func_name_to_stub, test_function) {
 
     // Ok, now test keys that work when we're viewing messages.
     hotkey.processing_text = return_false;
-    modals.settings_open = return_false;
+    overlays.settings_open = return_false;
 
-    modals.streams_open = return_true;
+    overlays.streams_open = return_true;
-    modals.is_active = return_true;
+    overlays.is_active = return_true;
     assert_mapping('S', 'subs.keyboard_sub');
-    modals.is_active = return_false;
+    overlays.is_active = return_false;
     assert_mapping('V', 'subs.view_stream');
     assert_mapping('n', 'subs.new_stream_clicked');
-    modals.streams_open = return_false;
+    overlays.streams_open = return_false;
 
     assert_mapping('?', 'ui.show_info_overlay');
     assert_mapping('/', 'search.initiate_search');
@@ -228,9 +228,9 @@ function stubbing(func_name_to_stub, test_function) {
     global.current_msg_list.empty = return_false;
 
     // Check that they do nothing while in the settings overlay
-    modals.settings_open = return_true;
+    overlays.settings_open = return_true;
     assert_unmapped('@*+rRjJkKsSvi:GM');
-    modals.settings_open = return_false;
+    overlays.settings_open = return_false;
 
     // TODO: Similar check for being in the subs page
 
@@ -307,9 +307,9 @@ function stubbing(func_name_to_stub, test_function) {
     list_util.inside_list = return_false;
     global.current_msg_list.empty = return_true;
     global.drafts.drafts_overlay_open = return_false;
-    modals.settings_open = return_false;
+    overlays.settings_open = return_false;
-    modals.streams_open = return_false;
+    overlays.streams_open = return_false;
-    modals.lightbox_open = return_false;
+    overlays.lightbox_open = return_false;
 
     assert_unmapped('down_arrow');
     assert_unmapped('end');
@@ -334,27 +334,27 @@ function stubbing(func_name_to_stub, test_function) {
     assert_mapping('spacebar', 'navigate.page_down');
     assert_mapping('up_arrow', 'navigate.up');
 
-    modals.info_overlay_open = return_true;
+    overlays.info_overlay_open = return_true;
     assert_unmapped('down_arrow');
     assert_unmapped('up_arrow');
-    modals.info_overlay_open = return_false;
+    overlays.info_overlay_open = return_false;
 
-    modals.streams_open = return_true;
+    overlays.streams_open = return_true;
     assert_mapping('up_arrow', 'subs.switch_rows');
     assert_mapping('down_arrow', 'subs.switch_rows');
-    modals.streams_open = return_false;
+    overlays.streams_open = return_false;
 
-    modals.lightbox_open = return_true;
+    overlays.lightbox_open = return_true;
     assert_mapping('left_arrow', 'lightbox.prev');
     assert_mapping('right_arrow', 'lightbox.next');
-    modals.lightbox_open = return_false;
+    overlays.lightbox_open = return_false;
 
     hotkey.is_editing_stream_name = return_true;
     assert_unmapped('down_arrow');
     assert_unmapped('up_arrow');
     hotkey.is_editing_stream_name = return_false;
 
-    modals.settings_open = return_true;
+    overlays.settings_open = return_true;
     assert_unmapped('end');
     assert_unmapped('home');
     assert_unmapped('left_arrow');
@@ -364,7 +364,7 @@ function stubbing(func_name_to_stub, test_function) {
 
     assert_mapping('up_arrow', 'settings.handle_up_arrow');
     assert_mapping('down_arrow', 'settings.handle_down_arrow');
-    modals.settings_open = return_false;
+    overlays.settings_open = return_false;
 
     global.drafts.drafts_overlay_open = return_true;
     assert_mapping('up_arrow', 'drafts.drafts_handle_events');

static/js/admin.js

@@ -86,7 +86,7 @@ exports.launch_page = function (tab) {
         $(".sidebar .ind-tab[data-tab-key='organization']").click();
     }
 
-    modals.open_settings();
+    overlays.open_settings();
     $active_tab.click();
 };
 

static/js/click_handlers.js

@@ -314,7 +314,7 @@ $(function () {
     });
 
     $(".brand").on('click', function (e) {
-        if (modals.is_active()) {
+        if (overlays.is_active()) {
             ui_util.change_tab_to('#home');
         } else {
             narrow.restore_home_state();
@@ -599,7 +599,7 @@ $(function () {
         }
 
         // Unfocus our compose area if we click out of it. Don't let exits out
-        // of modals or selecting text (for copy+paste) trigger cancelling.
+        // of overlays or selecting text (for copy+paste) trigger cancelling.
         if (compose_state.composing() && !$(e.target).is("a") &&
             ($(e.target).closest(".modal").length === 0) &&
             window.getSelection().toString() === "" &&

static/js/drafts.js

@@ -128,7 +128,7 @@ exports.restore_draft = function (draft_id) {
                               draft_copy);
     }
 
-    modals.close_modal("drafts");
+    overlays.close_overlay("drafts");
     compose_fade.clear_compose();
     if (draft.type === "stream" && draft.stream === "") {
         draft_copy.subject = "";
@@ -354,7 +354,7 @@ exports.drafts_handle_events = function (e, event_key) {
 
 exports.toggle = function () {
     if (exports.drafts_overlay_open()) {
-        modals.close_modal("drafts");
+        overlays.close_overlay("drafts");
     } else {
         exports.launch();
     }
@@ -362,7 +362,7 @@ exports.toggle = function () {
 
 exports.launch = function () {
     exports.setup_page(function () {
-        modals.open_overlay({
+        overlays.open_overlay({
             name: 'drafts',
             overlay: $('#draft_overlay'),
             on_close: function () {

static/js/hashchange.js

@@ -243,7 +243,7 @@ function hashchanged(from_reload, e) {
 
         if (!should_ignore(old_hash || "#") || ignore.group !== get_hash_group(base)) {
             if (ignore.group !== get_hash_group(base)) {
-                modals.close_for_hash_change();
+                overlays.close_for_hash_change();
             }
 
             // now only if the previous one should not have been ignored.
@@ -267,7 +267,7 @@ function hashchanged(from_reload, e) {
             subs.change_state(get_hash_components());
         }
     } else if (!should_ignore(window.location.hash) && !ignore.flag) {
-        modals.close_for_hash_change();
+        overlays.close_for_hash_change();
         changing_hash = true;
         var ret = do_hashchange(from_reload);
         changing_hash = false;

static/js/hotkey.js

@@ -166,8 +166,8 @@ exports.process_escape_key = function (e) {
         return false;
     }
 
-    if (modals.is_active()) {
+    if (overlays.is_active()) {
-        modals.close_active();
+        overlays.close_active();
         return true;
     }
 
@@ -268,13 +268,13 @@ exports.process_enter_key = function (e) {
         return true;
     }
 
-    if (modals.settings_open()) {
+    if (overlays.settings_open()) {
         // On the settings page just let the browser handle
         // the enter key for things like submitting forms.
         return false;
     }
 
-    if (modals.streams_open()) {
+    if (overlays.streams_open()) {
         return false;
     }
 
@@ -416,18 +416,18 @@ exports.process_hotkey = function (e, hotkey) {
             }
     }
 
-    if (hotkey.message_view_only && modals.is_active()) {
+    if (hotkey.message_view_only && overlays.is_active()) {
         if (exports.processing_text()) {
             return false;
         }
-        if (event_name === 'narrow_by_subject' && modals.streams_open()) {
+        if (event_name === 'narrow_by_subject' && overlays.streams_open()) {
             subs.keyboard_sub();
             return true;
         }
         return false;
     }
 
-    if (modals.settings_open()) {
+    if (overlays.settings_open()) {
         if (exports.processing_text()) {
             return false;
         }
@@ -446,11 +446,11 @@ exports.process_hotkey = function (e, hotkey) {
         return reactions.reaction_navigate(e, event_name);
     }
 
-    if (modals.info_overlay_open()) {
+    if (overlays.info_overlay_open()) {
         return false;
     }
 
-    if ((event_name === 'up_arrow' || event_name === 'down_arrow') && modals.streams_open()) {
+    if ((event_name === 'up_arrow' || event_name === 'down_arrow') && overlays.streams_open()) {
         return subs.switch_rows(event_name);
     }
 
@@ -516,10 +516,10 @@ exports.process_hotkey = function (e, hotkey) {
     }
 
     if (event_name === 'left_arrow') {
-        if (modals.lightbox_open()) {
+        if (overlays.lightbox_open()) {
             lightbox.prev();
             return true;
-        } else if (modals.streams_open()) {
+        } else if (overlays.streams_open()) {
             subs.toggle_view(event_name);
             return true;
         }
@@ -529,10 +529,10 @@ exports.process_hotkey = function (e, hotkey) {
     }
 
     if (event_name === 'right_arrow') {
-        if (modals.lightbox_open()) {
+        if (overlays.lightbox_open()) {
             lightbox.next();
             return true;
-        } else if (modals.streams_open()) {
+        } else if (overlays.streams_open()) {
             subs.toggle_view(event_name);
             return true;
         }
@@ -572,12 +572,12 @@ exports.process_hotkey = function (e, hotkey) {
             navigate.cycle_stream('forward');
             return true;
         case 'view_selected_stream':
-            if (modals.streams_open()) {
+            if (overlays.streams_open()) {
                 subs.view_stream();
             }
             return true;
         case 'n_key':
-            if (modals.streams_open()) {
+            if (overlays.streams_open()) {
                 subs.new_stream_clicked();
             } else {
                 narrow.narrow_to_next_topic();

static/js/invite.js

@@ -120,7 +120,7 @@ exports.initialize = function () {
         },
     });
 
-    modals.open_overlay({
+    overlays.open_overlay({
         name: 'invite',
         overlay: $('#invite-user'),
         on_close: function () {

static/js/lightbox.js

@@ -105,16 +105,16 @@ exports.open = function (image) {
         return;
     }
 
-    function lightbox_close_modal() {
+    function lightbox_close_overlay() {
         $(".player-container iframe").remove();
         is_open = false;
         document.activeElement.blur();
     }
 
-    modals.open_overlay({
+    overlays.open_overlay({
         name: 'lightbox',
         overlay: $("#lightbox_overlay"),
-        on_close: lightbox_close_modal,
+        on_close: lightbox_close_overlay,
     });
 
     popovers.hide_all();

static/js/narrow.js

@@ -446,7 +446,7 @@ exports.restore_home_state = function () {
     // If we click on the Home link from another nav pane, just go
     // back to the state you were in (possibly still narrowed) before
     // you left the Home pane.
-    if (!modals.is_active()) {
+    if (!overlays.is_active()) {
         exports.deactivate();
     }
     navigate.maybe_scroll_to_selected();

static/js/overlays.js

@@ -1,46 +1,46 @@
-var modals = (function () {
+var overlays = (function () {
 
 var exports = {};
 
 var active_overlay;
 var close_handler;
-var open_modal_name;
+var open_overlay_name;
 
 function reset_state() {
     active_overlay = undefined;
     close_handler = undefined;
-    open_modal_name = undefined;
+    open_overlay_name = undefined;
 }
 
 exports.is_active = function () {
-    return !!open_modal_name;
+    return !!open_overlay_name;
 };
 
 exports.info_overlay_open = function () {
-    return open_modal_name === 'informationalOverlays';
+    return open_overlay_name === 'informationalOverlays';
 };
 
 exports.settings_open = function () {
-    return open_modal_name === 'settings';
+    return open_overlay_name === 'settings';
 };
 
 exports.streams_open = function () {
-    return open_modal_name === 'subscriptions';
+    return open_overlay_name === 'subscriptions';
 };
 
 exports.lightbox_open = function () {
-    return open_modal_name === 'lightbox';
+    return open_overlay_name === 'lightbox';
 };
 
 exports.open_overlay = function (opts) {
     if (!opts.name || !opts.overlay || !opts.on_close) {
-        blueslip.error('Programming error in open_modal');
+        blueslip.error('Programming error in open_overlay');
         return;
     }
 
-    if (active_overlay || open_modal_name || close_handler) {
+    if (active_overlay || open_overlay_name || close_handler) {
         blueslip.error('Programming error--trying to open ' + opts.name +
-            ' before closing ' + open_modal_name);
+            ' before closing ' + open_overlay_name);
         return;
     }
 
@@ -52,7 +52,7 @@ exports.open_overlay = function (opts) {
         return;
     }
 
-    open_modal_name = opts.name;
+    open_overlay_name = opts.name;
     active_overlay = opts.overlay;
     opts.overlay.addClass('show');
 
@@ -62,16 +62,16 @@ exports.open_overlay = function (opts) {
     };
 };
 
-exports.close_modal = function (name) {
+exports.close_overlay = function (name) {
-    if (name !== open_modal_name) {
+    if (name !== open_overlay_name) {
-        blueslip.error("Trying to close " + name + " when " + open_modal_name + " is open." );
+        blueslip.error("Trying to close " + name + " when " + open_overlay_name + " is open." );
         return;
     }
 
     active_overlay.removeClass("show");
 
     if (!close_handler) {
-        blueslip.error("Modal close handler for " + name + " not properly setup." );
+        blueslip.error("Overlay close handler for " + name + " not properly setup." );
         return;
     }
 
@@ -79,12 +79,12 @@ exports.close_modal = function (name) {
 };
 
 exports.close_active = function () {
-    if (!open_modal_name) {
+    if (!open_overlay_name) {
         blueslip.warn('close_active() called without checking is_active()');
         return;
     }
 
-    exports.close_modal(open_modal_name);
+    exports.close_overlay(open_overlay_name);
 };
 
 exports.close_for_hash_change = function () {
@@ -93,7 +93,7 @@ exports.close_for_hash_change = function () {
 };
 
 exports.open_settings = function () {
-    modals.open_overlay({
+    overlays.open_overlay({
         name: 'settings',
         overlay: $("#settings_overlay_container"),
         on_close: function () {
@@ -117,7 +117,7 @@ $(function () {
 
         var target_name = $target.attr("data-overlay");
 
-        exports.close_modal(target_name);
+        exports.close_overlay(target_name);
 
         e.preventDefault();
         e.stopPropagation();
@@ -129,5 +129,5 @@ return exports;
 }());
 
 if (typeof module !== 'undefined') {
-    module.exports = modals;
+    module.exports = overlays;
 }

static/js/settings.js

@@ -113,7 +113,7 @@ exports.launch_page = function (tab) {
         $(".sidebar .ind-tab[data-tab-key='settings']").click();
     }
 
-    modals.open_settings();
+    overlays.open_settings();
 
     $active_tab.click();
 };

static/js/stream_list.js

@@ -438,7 +438,7 @@ $(function () {
         if (e.metaKey || e.ctrlKey) {
             return;
         }
-        if (modals.is_active()) {
+        if (overlays.is_active()) {
             ui_util.change_tab_to('#home');
         }
         var stream = $(e.target).parents('li').attr('data-name');
@@ -511,7 +511,7 @@ function maybe_select_stream(e) {
         var topStream = $('#stream_filters li.narrow-filter').first().data('name');
         if (topStream !== undefined) {
             // undefined if there are no results
-            if (modals.is_active()) {
+            if (overlays.is_active()) {
                 ui_util.change_tab_to('#home');
             }
             exports.clear_and_hide_search();

static/js/stream_muting.js

@@ -11,7 +11,7 @@ exports.update_in_home_view = function (sub, value) {
         var msg_offset;
         var saved_ypos;
         // Save our current scroll position
-        if (modals.is_active()) {
+        if (overlays.is_active()) {
             saved_ypos = message_viewport.scrollTop();
         } else if (home_msg_list === current_msg_list &&
                    current_msg_list.selected_row().offset() !== null) {
@@ -24,7 +24,7 @@ exports.update_in_home_view = function (sub, value) {
         message_util.add_messages(message_list.all.all_messages(), home_msg_list);
 
         // Ensure we're still at the same scroll position
-        if (modals.is_active()) {
+        if (overlays.is_active()) {
             message_viewport.scrollTop(saved_ypos);
         } else if (home_msg_list === current_msg_list) {
             // We pass use_closest to handle the case where the

static/js/subs.js

@@ -449,7 +449,7 @@ exports.change_state = (function () {
 
 exports.launch = function (hash) {
     exports.setup_page(function () {
-        modals.open_overlay({
+        overlays.open_overlay({
             name: 'subscriptions',
             overlay: $("#subscription_overlay"),
             on_close: exports.close,
@@ -542,7 +542,7 @@ function ajaxSubscribe(stream) {
         url: "/json/users/me/subscriptions",
         data: {subscriptions: JSON.stringify([{name: stream}]) },
         success: function (resp, statusText, xhr) {
-            if (modals.streams_open()) {
+            if (overlays.streams_open()) {
                 $("#create_stream_name").val("");
 
                 actually_filter_streams();

static/js/topic_list.js

@@ -214,7 +214,7 @@ exports.set_click_handlers = function (callbacks) {
 
         // In a more componentized world, we would delegate some
         // of this stuff back up to our parents.
-        if (modals.is_active()) {
+        if (overlays.is_active()) {
             ui_util.change_tab_to('#home');
         }
 

static/js/tutorial.js

@@ -504,7 +504,7 @@ function welcome() {
 }
 
 exports.start = function () {
-    if (modals.is_active()) {
+    if (overlays.is_active()) {
         ui_util.change_tab_to('#home');
     }
     narrow.deactivate();

static/js/ui.js

@@ -130,7 +130,7 @@ exports.show_info_overlay = function (target) {
     var overlay = $(".informational-overlays");
 
     if (!overlay.hasClass("show")) {
-        modals.open_overlay({
+        overlays.open_overlay({
             name:  'informationalOverlays',
             overlay: overlay,
             on_close: function () {},

static/js/ui_init.js

@@ -68,7 +68,7 @@ $(function () {
     });
 
     message_viewport.message_pane.mousewheel(function (e, delta) {
-        if (!modals.is_active()) {
+        if (!overlays.is_active()) {
             // In the message view, we use a throttled mousewheel handler.
             throttled_mousewheelhandler(e, delta);
         }
@@ -78,7 +78,7 @@ $(function () {
 
     $(window).resize($.throttle(50, resize.handler));
 
-    // Scrolling in modals, input boxes, and other elements that
+    // Scrolling in overlays. input boxes, and other elements that
     // explicitly scroll should not scroll the main view.  Stop
     // propagation in all cases.  Also, ignore the event if the
     // element is already at the top or bottom.  Otherwise we get a

tools/js-dep-visualizer.py

@@ -221,14 +221,14 @@ def find_edges_to_remove(graph, methods):
         ('subs', 'narrow'),
         ('unread_ui', 'pm_list'),
         ('unread_ui', 'stream_list'),
-        ('modals', 'hashchange'),
+        ('overlays', 'hashchange'),
         ('emoji_picker', 'reactions'),
     ]
 
     def cut_is_legal(edge):
         # type: (Edge) -> bool
         parent, child = edge
-        if child in ['reload', 'popovers', 'modals', 'notifications',
+        if child in ['reload', 'popovers', 'overlays', 'notifications',
                      'server_events', 'compose_actions']:
             return True
         return edge in APPROVED_CUTS

zproject/settings.py

@@ -916,7 +916,7 @@ JS_SPECS = {
             'js/copy_and_paste.js',
             'js/stream_popover.js',
             'js/popovers.js',
-            'js/modals.js',
+            'js/overlays.js',
             'js/typeahead_helper.js',
             'js/search_suggestion.js',
             'js/search.js',