mirror of
				https://github.com/zulip/zulip.git
				synced 2025-11-03 21:43:21 +00:00 
			
		
		
		
	Make subscriptions page error bar visible even when scrolled down.
Previously, the Zulip subscriptions page's error bar would always be at the very top of the scrollable view, and thus would likely be out of view when an error happened. This fixes it by having the error bar always placed below the search box (and thus visible regardless of where in the scrollable streams view we are). Fixes: #515. [commit message and comments expanded by tabbott]
This commit is contained in:
		@@ -489,7 +489,8 @@ exports.setup_page = function () {
 | 
			
		||||
 | 
			
		||||
    function failed_listing(xhr, error) {
 | 
			
		||||
        loading.destroy_indicator($('#subs_page_loading_indicator'));
 | 
			
		||||
        ui.report_error("Error listing streams or subscriptions", xhr, $("#subscriptions-status"));
 | 
			
		||||
        ui.report_error("Error listing streams or subscriptions", xhr,
 | 
			
		||||
                        $("#subscriptions-status"), 'subscriptions-status');
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    if (should_list_all_streams()) {
 | 
			
		||||
@@ -558,13 +559,13 @@ function ajaxSubscribe(stream) {
 | 
			
		||||
                // Display the canonical stream capitalization.
 | 
			
		||||
                true_stream_name = res.already_subscribed[page_params.email][0];
 | 
			
		||||
                ui.report_success("Already subscribed to " + true_stream_name,
 | 
			
		||||
                                  $("#subscriptions-status"));
 | 
			
		||||
                                  $("#subscriptions-status"), 'subscriptions-status');
 | 
			
		||||
            }
 | 
			
		||||
            // The rest of the work is done via the subscribe event we will get
 | 
			
		||||
        },
 | 
			
		||||
        error: function (xhr) {
 | 
			
		||||
            ui.report_error("Error adding subscription", xhr, $("#subscriptions-status"));
 | 
			
		||||
            $("#create_stream_name").focus();
 | 
			
		||||
            ui.report_error("Error adding subscription", xhr,
 | 
			
		||||
                            $("#subscriptions-status"), 'subscriptions-status');
 | 
			
		||||
        }
 | 
			
		||||
    });
 | 
			
		||||
}
 | 
			
		||||
@@ -579,8 +580,8 @@ function ajaxUnsubscribe(stream) {
 | 
			
		||||
            // The rest of the work is done via the unsubscribe event we will get
 | 
			
		||||
        },
 | 
			
		||||
        error: function (xhr) {
 | 
			
		||||
            ui.report_error("Error removing subscription", xhr, $("#subscriptions-status"));
 | 
			
		||||
            $("#create_stream_name").focus();
 | 
			
		||||
            ui.report_error("Error removing subscription", xhr,
 | 
			
		||||
                            $("#subscriptions-status"), 'subscriptions-status');
 | 
			
		||||
        }
 | 
			
		||||
    });
 | 
			
		||||
}
 | 
			
		||||
@@ -601,7 +602,8 @@ function ajaxSubscribeForCreation(stream, principals, invite_only, announce) {
 | 
			
		||||
            // The rest of the work is done via the subscribe event we will get
 | 
			
		||||
        },
 | 
			
		||||
        error: function (xhr) {
 | 
			
		||||
            ui.report_error("Error creating stream", xhr, $("#subscriptions-status"));
 | 
			
		||||
            ui.report_error("Error creating stream", xhr,
 | 
			
		||||
                            $("#subscriptions-status"), 'subscriptions-status');
 | 
			
		||||
            $('#stream-creation').modal("hide");
 | 
			
		||||
        }
 | 
			
		||||
    });
 | 
			
		||||
@@ -762,6 +764,10 @@ $(function () {
 | 
			
		||||
        $(e.target).removeClass("btn-danger").text("Subscribed");
 | 
			
		||||
    });
 | 
			
		||||
 | 
			
		||||
    $("#subscriptions-status").on("click", "#close-subscriptions-status", function (e) {
 | 
			
		||||
        $("#subscriptions-status").hide();
 | 
			
		||||
    });
 | 
			
		||||
 | 
			
		||||
    $("#subscriptions_table").on("click", ".email-address", function (e) {
 | 
			
		||||
        selectText(this);
 | 
			
		||||
    });
 | 
			
		||||
@@ -922,10 +928,12 @@ $(function () {
 | 
			
		||||
                old_name_box.text(new_name);
 | 
			
		||||
                sub_row.find(".email-address").text(data.email_address);
 | 
			
		||||
 | 
			
		||||
                ui.report_success("The stream has been renamed!", $("#subscriptions-status"));
 | 
			
		||||
                ui.report_success("The stream has been renamed!", $("#subscriptions-status "),
 | 
			
		||||
                                  'subscriptions-status');
 | 
			
		||||
            },
 | 
			
		||||
            error: function (xhr) {
 | 
			
		||||
                ui.report_error("Error renaming stream", xhr, $("#subscriptions-status"));
 | 
			
		||||
                ui.report_error("Error renaming stream", xhr,
 | 
			
		||||
                                $("#subscriptions-status"), 'subscriptions-status');
 | 
			
		||||
            }
 | 
			
		||||
        });
 | 
			
		||||
    });
 | 
			
		||||
@@ -938,7 +946,7 @@ $(function () {
 | 
			
		||||
        var stream_name = $sub_row.find('.subscription_name').text();
 | 
			
		||||
        var description = $sub_row.find('input[name="description"]').val();
 | 
			
		||||
 | 
			
		||||
        $('#subscription_status').hide();
 | 
			
		||||
        $('#subscriptions-status').hide();
 | 
			
		||||
 | 
			
		||||
        channel.patch({
 | 
			
		||||
            url: '/json/streams/' + stream_name,
 | 
			
		||||
@@ -947,10 +955,12 @@ $(function () {
 | 
			
		||||
            },
 | 
			
		||||
            success: function () {
 | 
			
		||||
                // The event from the server will update the rest of the UI
 | 
			
		||||
                ui.report_success("The stream description has been updated!", $("#subscriptions-status"));
 | 
			
		||||
                ui.report_success("The stream description has been updated!",
 | 
			
		||||
                                 $("#subscriptions-status"), 'subscriptions-status');
 | 
			
		||||
            },
 | 
			
		||||
            error: function (xhr) {
 | 
			
		||||
                ui.report_error("Error updating the stream description", xhr, $("#subscriptions-status"));
 | 
			
		||||
                ui.report_error("Error updating the stream description", xhr,
 | 
			
		||||
                                $("#subscriptions-status"), 'subscriptions-status');
 | 
			
		||||
            }
 | 
			
		||||
        });
 | 
			
		||||
    });
 | 
			
		||||
 
 | 
			
		||||
@@ -122,28 +122,45 @@ function message_hover(message_row) {
 | 
			
		||||
    current_message_hover = message_row;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
exports.report_message = function (response, status_box, cls) {
 | 
			
		||||
/* Arguments used in the report_* functions are,
 | 
			
		||||
   response- response that we want to display
 | 
			
		||||
   status_box- element being used to display the response
 | 
			
		||||
   cls- class that we want to add/remove to/from the status_box
 | 
			
		||||
   type- used to define more complex logic for special cases (currently being
 | 
			
		||||
         used only for subscriptions-status) */
 | 
			
		||||
 | 
			
		||||
exports.report_message = function (response, status_box, cls, type) {
 | 
			
		||||
    if (cls === undefined) {
 | 
			
		||||
        cls = 'alert';
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    status_box.removeClass(status_classes).addClass(cls)
 | 
			
		||||
    if (type === undefined) {
 | 
			
		||||
        type = ' ';
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    if (type === 'subscriptions-status') {
 | 
			
		||||
        status_box.removeClass(status_classes).addClass(cls).children('#response')
 | 
			
		||||
              .text(response).stop(true).fadeTo(0, 1);
 | 
			
		||||
    } else {
 | 
			
		||||
        status_box.removeClass(status_classes).addClass(cls)
 | 
			
		||||
              .text(response).stop(true).fadeTo(0, 1);
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    status_box.show();
 | 
			
		||||
};
 | 
			
		||||
 | 
			
		||||
exports.report_error = function (response, xhr, status_box) {
 | 
			
		||||
exports.report_error = function (response, xhr, status_box, type) {
 | 
			
		||||
    if (xhr && xhr.status.toString().charAt(0) === "4") {
 | 
			
		||||
        // Only display the error response for 4XX, where we've crafted
 | 
			
		||||
        // a nice response.
 | 
			
		||||
        response += ": " + $.parseJSON(xhr.responseText).msg;
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    ui.report_message(response, status_box, 'alert-error');
 | 
			
		||||
    ui.report_message(response, status_box, 'alert-error', type);
 | 
			
		||||
};
 | 
			
		||||
 | 
			
		||||
exports.report_success = function (response, status_box) {
 | 
			
		||||
    ui.report_message(response, status_box, 'alert-success');
 | 
			
		||||
exports.report_success = function (response, status_box, type) {
 | 
			
		||||
    ui.report_message(response, status_box, 'alert-success', type);
 | 
			
		||||
};
 | 
			
		||||
 | 
			
		||||
function need_skinny_mode() {
 | 
			
		||||
 
 | 
			
		||||
@@ -2467,6 +2467,26 @@ div.floating_recipient {
 | 
			
		||||
    text-align: center;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
#subscriptions-status {
 | 
			
		||||
    position: fixed;
 | 
			
		||||
    z-index: 999;
 | 
			
		||||
    display: block;
 | 
			
		||||
    left: 300px;
 | 
			
		||||
    right: 300px;
 | 
			
		||||
    margin: 0px auto;
 | 
			
		||||
    opacity: 0.9 !important;
 | 
			
		||||
    top: 55px;
 | 
			
		||||
    max-width: 800px;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
#close-subscriptions-status {
 | 
			
		||||
    position: absolute;
 | 
			
		||||
    top: 8px;
 | 
			
		||||
    cursor: pointer;
 | 
			
		||||
    font-size: 17px;
 | 
			
		||||
    right: 8px;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.subject-name {
 | 
			
		||||
    display: block;
 | 
			
		||||
    line-height: 1.3em;
 | 
			
		||||
@@ -3612,6 +3632,10 @@ div.edit_bot {
 | 
			
		||||
    font-weight: 300;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
#subscriptions h1 {
 | 
			
		||||
    padding-top: 40px;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
#administration .administration-icon,
 | 
			
		||||
#settings .settings-icon,
 | 
			
		||||
#subscriptions .streams-icon {
 | 
			
		||||
@@ -3896,6 +3920,11 @@ form.admin-realm .control-label {
 | 
			
		||||
        margin-right: 7px;
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    #subscriptions-status {
 | 
			
		||||
        left: 300px;
 | 
			
		||||
        right: 50px;
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
@media (max-width: 775px) {
 | 
			
		||||
@@ -3982,6 +4011,10 @@ form.admin-realm .control-label {
 | 
			
		||||
        margin-right: 81px;
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    #subscriptions-status {
 | 
			
		||||
        left: 35px;
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
@media (max-width: 500px) {
 | 
			
		||||
 
 | 
			
		||||
@@ -3,7 +3,10 @@
 | 
			
		||||
 | 
			
		||||
    <div class="subscriptions">
 | 
			
		||||
      <h1><i class="icon-vector-exchange streams-icon"></i>{% trans "Streams" %}</h1>
 | 
			
		||||
      <div class="alert" id="subscriptions-status"></div>
 | 
			
		||||
      <div class="alert" id="subscriptions-status">
 | 
			
		||||
        <span id="response"></span>
 | 
			
		||||
        <span id="close-subscriptions-status"><i class="icon-vector-remove"></i></span>
 | 
			
		||||
      </div>
 | 
			
		||||
      <div id="subs_page_loading_indicator"></div>
 | 
			
		||||
      <div id="subscriptions_table">
 | 
			
		||||
      </div>
 | 
			
		||||
 
 | 
			
		||||
		Reference in New Issue
	
	Block a user