When a narrow would have no messages and just be grey, show a notice instead.

(imported from commit 2b2b653805cb1ebdb545f83b20c01f1d6cbde9b7)

templates/zephyr/home.html

@@ -27,7 +27,7 @@
     <div class="message_list" id="main_div">
       <div id="loading_more_messages_indicator"></div>
       <div id="page_loading_indicator"></div>
-      <div id="first_run_message">
+      <div id="first_run_message" class="empty_feed_notice">
         <h4>Welcome to Humbug</h4>
         <p>See, the thing about it is... there aren't any messages
         here for you right now. I'm sure someone will eventually send
@@ -37,6 +37,12 @@
         and <a href="#" onclick="compose.start('stream');return false;">
         compose a new stream message</a>.</p>
       </div>
+      <div id="empty_narrow_message" class="empty_feed_notice">
+        <h4>Nothing's been sent here yet!</h4>
+
+        <p>Why not <a href="#" onclick="compose.start('stream'); return false;">
+            start the conversation</a>?</p>
+      </div>
       <table class="message_table focused_table" id="zhome">
         <tbody>
         </tbody>

zephyr/static/js/narrow.js

@@ -337,6 +337,8 @@ exports.deactivate = function () {
     filter_function   = false;
     current_operators = false;
 
+    util.hide_empty_narrow_message();
+
     $("#main_div").removeClass('narrowed_view');
     $("#searchbox").removeClass('narrowed_view');
     $("#zfilt").removeClass('focused_table');

zephyr/static/js/util.js

@@ -91,6 +91,14 @@ exports.destroy_first_run_message = function () {
     $('#first_run_message').remove();
 };
 
+exports.show_empty_narrow_message = function () {
+    $('#empty_narrow_message').show();
+};
+
+exports.hide_empty_narrow_message = function () {
+    $('#empty_narrow_message').hide();
+};
+
 // Takes a one-argument function.  Returns a variant of that
 // function which caches result values.
 //

zephyr/static/js/zephyr.js

@@ -574,6 +574,13 @@ function add_messages(messages, msg_list, opts) {
         prepended = true;
     }
 
+    if ((msg_list === narrowed_msg_list) && !msg_list.empty()) {
+        // If adding some new messages to the message tables caused
+        // our current narrow to no longer be empty, hide the empty
+        // feed placeholder text.
+        util.hide_empty_narrow_message();
+    }
+
     if (msg_list === all_msg_list && opts.update_unread_counts) {
         process_unread_counts(messages, false);
     }
@@ -711,6 +718,13 @@ function load_old_messages(anchor, num_before, num_after, msg_list, cont, for_na
     function process_result(messages) {
         $('#connection-error').hide();
 
+        if ((messages.length === 0) && (current_msg_list === narrowed_msg_list) &&
+            narrowed_msg_list.empty()) {
+            // Even after trying to load more messages, we have no
+            // messages to display in this narrow.
+            util.show_empty_narrow_message();
+        }
+
         if (messages.length !== 0 && !cont_will_add_messages) {
             add_messages(messages, msg_list);
         }

zephyr/static/styles/zephyr.css

@@ -981,11 +981,15 @@ table.floating_recipient {
     overflow-y: scroll;
 }
 
-#first_run_message {
+.empty_feed_notice {
     padding: 1em 4em;
     display: none;
 }
 
-#first_run_message h4 {
+.empty_feed_notice h4 {
+    text-align: center;
+}
+
+#empty_narrow_message p {
     text-align: center;
 }