Extracted code into compose_fade.js.

The compose_fade has three public exports:

    set_focused_recipient
    unfade_messages
    update_faded_messages

All code was pulled directly from compose.js, except for the
one-line setter of set_focused_recipient.  The focused_recipients
variable that used to be in compose.js was moved to compose_fade.js,
hence the need for the setter.

(imported from commit 462ca5d0d0bd58612d0197f3734a8c78de8c6d30)

static/js/compose.js

@@ -2,7 +2,6 @@ var compose = (function () {
 
 var exports = {};
 var is_composing_message = false;
-var focused_recipient;
 var message_snapshot;
 var empty_subject_placeholder = "(no topic)";
 
@@ -70,7 +69,7 @@ function hide_box() {
     $('#private-message').hide();
     $(".new_message_textarea").css("min-height", "");
     notifications_bar.enable();
-    exports.unfade_messages(true);
+    compose_fade.unfade_messages(true);
     $('.message_comp').hide();
     $("#compose_controls").show();
 }
@@ -97,64 +96,6 @@ exports.decorate_stream_bar = function (stream_name) {
         .addClass(stream_color.get_color_class(color));
 };
 
-exports.unfade_messages = function (clear_state) {
-    if (focused_recipient === undefined) {
-        return;
-    }
-
-    rows.get_table(current_msg_list.table_name).find(".recipient_row, .message_row")
-                                               .removeClass("faded").addClass("unfaded");
-    if (clear_state === true) {
-        focused_recipient = undefined;
-    }
-    ui.update_floating_recipient_bar();
-};
-
-function _update_faded_messages() {
-    // See also update_faded_messages(), which just wraps this with a debounce.
-    if (focused_recipient === undefined) {
-        return;
-    }
-
-    if ((focused_recipient.type === "stream" && focused_recipient.subject === "") ||
-        (focused_recipient.type === "private" && focused_recipient.reply_to === "")) {
-        exports.unfade_messages();
-        return;
-    }
-
-    var i;
-    var all_elts = rows.get_table(current_msg_list.table_name).find(".recipient_row, .message_row");
-    var should_fade_message = false;
-    // Note: The below algorithm relies on the fact that all_elts is
-    // sorted as it would be displayed in the message view
-    for (i = 0; i < all_elts.length; i++) {
-        var elt = $(all_elts[i]);
-        if (elt.hasClass("recipient_row")) {
-            should_fade_message = !util.same_recipient(focused_recipient, current_msg_list.get(rows.id(elt)));
-        }
-
-        // Usually we are not actually switching up the classes here, so the hasClass()
-        // calls here will usually short circuit two function calls that are more expensive.
-        // So, while the hasClass() checks are semantically unnecessary, they should improve
-        // performance.  See trac #1633 for more context.
-        if (should_fade_message) {
-            if (!elt.hasClass("faded")) {
-                elt.removeClass("unfaded").addClass("faded");
-            }
-        } else {
-            if (!elt.hasClass("unfaded")) {
-                elt.removeClass("faded").addClass("unfaded");
-            }
-        }
-    }
-
-    ui.update_floating_recipient_bar();
-}
-
-// See trac #1633.  For fast typists, calls to _update_faded_messages can
-// cause typing sluggishness.
-exports.update_faded_messages = _.debounce(_update_faded_messages, 150);
-
 exports.update_recipient_on_narrow = function () {
     if (!compose.composing()) {
         return;
@@ -178,7 +119,7 @@ function update_fade () {
 
     // Construct focused_recipient as a mocked up element which has all the
     // fields of a message used by util.same_recipient()
-    focused_recipient = {
+    var focused_recipient = {
         type: is_composing_message
     };
 
@@ -192,7 +133,8 @@ function update_fade () {
                 $('#private_message_recipient').val());
     }
 
-    compose.update_faded_messages();
+    compose_fade.set_focused_recipient(focused_recipient);
+    compose_fade.update_faded_messages();
 }
 
 $(function () {
@@ -353,7 +295,7 @@ exports.restore_message = function () {
                                  snapshot_copy);
     }
     clear_message_snapshot();
-    exports.unfade_messages(true);
+    compose_fade.unfade_messages(true);
     compose.start(snapshot_copy.type, snapshot_copy);
 };
 

static/js/compose_fade.js

@@ -0,0 +1,71 @@
+var compose_fade = (function () {
+
+var exports = {};
+
+var focused_recipient;
+
+exports.set_focused_recipient = function (recipient) {
+    focused_recipient = recipient;
+};
+
+exports.unfade_messages = function (clear_state) {
+    if (focused_recipient === undefined) {
+        return;
+    }
+
+    rows.get_table(current_msg_list.table_name).find(".recipient_row, .message_row")
+                                               .removeClass("faded").addClass("unfaded");
+    if (clear_state === true) {
+        focused_recipient = undefined;
+    }
+    ui.update_floating_recipient_bar();
+};
+
+function _update_faded_messages() {
+    // See also update_faded_messages(), which just wraps this with a debounce.
+    if (focused_recipient === undefined) {
+        return;
+    }
+
+    if ((focused_recipient.type === "stream" && focused_recipient.subject === "") ||
+        (focused_recipient.type === "private" && focused_recipient.reply_to === "")) {
+        exports.unfade_messages();
+        return;
+    }
+
+    var i;
+    var all_elts = rows.get_table(current_msg_list.table_name).find(".recipient_row, .message_row");
+    var should_fade_message = false;
+    // Note: The below algorithm relies on the fact that all_elts is
+    // sorted as it would be displayed in the message view
+    for (i = 0; i < all_elts.length; i++) {
+        var elt = $(all_elts[i]);
+        if (elt.hasClass("recipient_row")) {
+            should_fade_message = !util.same_recipient(focused_recipient, current_msg_list.get(rows.id(elt)));
+        }
+
+        // Usually we are not actually switching up the classes here, so the hasClass()
+        // calls here will usually short circuit two function calls that are more expensive.
+        // So, while the hasClass() checks are semantically unnecessary, they should improve
+        // performance.  See trac #1633 for more context.
+        if (should_fade_message) {
+            if (!elt.hasClass("faded")) {
+                elt.removeClass("unfaded").addClass("faded");
+            }
+        } else {
+            if (!elt.hasClass("unfaded")) {
+                elt.removeClass("faded").addClass("unfaded");
+            }
+        }
+    }
+
+    ui.update_floating_recipient_bar();
+}
+
+// See trac #1633.  For fast typists, calls to _update_faded_messages can
+// cause typing sluggishness.
+exports.update_faded_messages = _.debounce(_update_faded_messages, 150);
+
+return exports;
+
+}());

static/js/message_list.js

@@ -622,7 +622,7 @@ MessageList.prototype = {
         }
 
         // Re-add the fading of messages that is lost when we re-render.
-        compose.update_faded_messages();
+        compose_fade.update_faded_messages();
         kiosk.update_new_messages();
 
         if (this === current_msg_list && messages_are_new) {

static/js/narrow.js

@@ -412,7 +412,7 @@ exports.activate = function (operators, opts) {
     }
 
     // Unfade the home view before we switch tables.
-    compose.unfade_messages();
+    compose_fade.unfade_messages();
 
     var was_narrowed_already = exports.active();
     var then_select_id = opts.then_select_id;
@@ -524,7 +524,7 @@ exports.activate = function (operators, opts) {
     $('#search_query').val(exports.unparse(operators));
     search.update_button_visibility();
     compose.update_recipient_on_narrow();
-    compose.update_faded_messages();
+    compose_fade.update_faded_messages();
 
     $(document).trigger($.Event('narrow_activated.zulip', {msg_list: narrowed_msg_list,
                                                             filter: current_filter,
@@ -628,7 +628,7 @@ exports.deactivate = function () {
     }
 
     hashchange.save_narrow();
-    compose.update_faded_messages();
+    compose_fade.update_faded_messages();
 
     $(document).trigger($.Event('narrow_deactivated.zulip', {msg_list: current_msg_list}));
 };

static/js/zulip.js

@@ -731,7 +731,7 @@ function maybe_add_narrowed_messages(messages, msg_list, messages_are_new) {
             new_messages = _.map(new_messages, add_message_metadata);
             add_messages(new_messages, msg_list, messages_are_new);
             process_visible_unread_messages();
-            compose.update_faded_messages();
+            compose_fade.update_faded_messages();
         },
         error: function (xhr) {
             // We might want to be more clever here
@@ -789,7 +789,7 @@ function update_messages(events) {
     if (current_msg_list === narrowed_msg_list) {
         narrowed_msg_list.rerender();
     }
-    compose.update_faded_messages();
+    compose_fade.update_faded_messages();
     update_unread_counts();
     stream_list.update_streams_sidebar();
 }
@@ -928,7 +928,7 @@ function get_updates_success(data) {
 
         process_visible_unread_messages();
         notifications.received_messages(messages);
-        compose.update_faded_messages();
+        compose_fade.update_faded_messages();
         stream_list.update_streams_sidebar();
     }
 

tools/jslint/check-all.js

@@ -21,7 +21,7 @@ var globals =
     + ' csrf_token'
 
     // Modules, defined in their respective files.
-    + ' compose rows hotkeys narrow reload notifications_bar search subs'
+    + ' compose compose_fade rows hotkeys narrow reload notifications_bar search subs'
     + ' composebox_typeahead typeahead_helper notifications hashchange'
     + ' invite ui util activity timerender MessageList blueslip unread stream_list'
     + ' onboarding message_edit tab_bar emoji popovers navigate message_tour'

zproject/settings.py

@@ -373,6 +373,7 @@ JS_SPECS = {
             'js/narrow.js',
             'js/reload.js',
             'js/notifications_bar.js',
+            'js/compose_fade.js',
             'js/compose.js',
             'js/stream_color.js',
             'js/subs.js',