From 1bcc0dbd8117382de0f16eab2f8735498171e504 Mon Sep 17 00:00:00 2001 From: Akhil Date: Sat, 10 Jun 2017 05:03:53 +0000 Subject: [PATCH] org-settings: Add UI for changing the notifications stream. Added a dropdown in the organization settings page with a search-box and required styles. Also added an element to disable it. Added a method to populate the dropdown using list_rendering.js. Also altered response to the event of deletion of the notifications stream on the frontend. On selection of a new stream or on clicking 'Disable', a patch request is made with stream-id to /json/realm. Fixes: #3708. --- frontend_tests/casper_tests/10-admin.js | 26 ++++++ frontend_tests/node_tests/templates.js | 22 +++++ static/js/admin.js | 1 + static/js/server_events_dispatch.js | 8 ++ static/js/settings_org.js | 88 +++++++++++++++++++ static/styles/settings.css | 12 +++ ...dmin-realm-dropdown-stream-list.handlebars | 8 ++ .../organization-settings-admin.handlebars | 22 +++++ 8 files changed, 187 insertions(+) create mode 100644 static/templates/settings/admin-realm-dropdown-stream-list.handlebars diff --git a/frontend_tests/casper_tests/10-admin.js b/frontend_tests/casper_tests/10-admin.js index 4fe2ec9a09..65bc9bfd1d 100644 --- a/frontend_tests/casper_tests/10-admin.js +++ b/frontend_tests/casper_tests/10-admin.js @@ -19,6 +19,32 @@ casper.waitForSelector('#settings_overlay_container.show', function () { casper.test.assertUrlMatch(/^http:\/\/[^/]+\/#organization/, 'URL suggests we are on organization page'); }); +// Test changing notifications stream +casper.then(function () { + casper.test.info('Changing notifications stream to Verona by filtering with "verona"'); + casper.click("#id_realm_notifications_stream > a.dropdown-toggle"); + + casper.waitUntilVisible('ul.dropdown-menu', function () { + casper.sendKeys('.dropdown-search > input[type=text]', 'verona'); + casper.click(".dropdown-list-body li.stream_name"); + }); + + casper.waitUntilVisible('#admin-realm-notifications-stream-status', function () { + casper.test.assertSelectorHasText('#admin-realm-notifications-stream-status', + 'Notifications stream changed!'); + casper.test.assertSelectorHasText('#realm_notifications_stream_name', '#Verona'); + }); +}); + +casper.then(function () { + casper.click(".notifications-stream-disable"); + casper.waitUntilVisible('#admin-realm-notifications-stream-status', function () { + casper.test.assertSelectorHasText('#admin-realm-notifications-stream-status', + 'Notifications stream disabled!'); + casper.test.assertSelectorHasText('#realm_notifications_stream_name', 'Disabled'); + }); +}); + // Test permissions setting casper.then(function () { casper.click("li[data-section='organization-permissions']"); diff --git a/frontend_tests/node_tests/templates.js b/frontend_tests/node_tests/templates.js index 9b47139663..2cd3de36e6 100644 --- a/frontend_tests/node_tests/templates.js +++ b/frontend_tests/node_tests/templates.js @@ -119,6 +119,28 @@ function render(template_name, args) { global.write_handlebars_output("admin-realm-domains-list", html); }()); +(function admin_realm_dropdown_stream_list() { + var html = ""; + + var link = $(html).find("a"); + var list_item = $(html).find("li"); + + assert.equal(link.text().trim(), "Italy"); + assert(list_item.hasClass("stream_name")); + assert.equal(list_item.attr("data-stream-id"), "18"); + + global.write_handlebars_output("admin-realm-dropdown-stream-list", html); +}()); + (function admin_default_streams_list() { var html = ''; var streams = ['devel', 'trac', 'zulip']; diff --git a/static/js/admin.js b/static/js/admin.js index 7d2077b9d1..2bbcfe164b 100644 --- a/static/js/admin.js +++ b/static/js/admin.js @@ -45,6 +45,7 @@ function _setup_page() { language_list: page_params.language_list, realm_default_language: page_params.realm_default_language, realm_waiting_period_threshold: page_params.realm_waiting_period_threshold, + realm_notifications_stream_id: page_params.realm_notifications_stream_id, is_admin: page_params.is_admin, realm_icon_source: page_params.realm_icon_source, realm_icon_url: page_params.realm_icon_url, diff --git a/static/js/server_events_dispatch.js b/static/js/server_events_dispatch.js index d58ebefb43..fa5cedacd8 100644 --- a/static/js/server_events_dispatch.js +++ b/static/js/server_events_dispatch.js @@ -87,6 +87,9 @@ exports.dispatch_normal_event = function dispatch_normal_event(event) { if (event.data.authentication_methods !== undefined) { settings_org.populate_auth_methods(event.data.authentication_methods); } + } else if (event.op === 'update' && event.property === 'notifications_stream_id') { + page_params.realm_notifications_stream_id = event.value; + settings_org.render_notifications_stream_ui(page_params.realm_notifications_stream_id); } else if (event.op === 'update' && event.property === 'default_language') { page_params.realm_default_language = event.value; settings_org.reset_realm_default_language(); @@ -188,6 +191,11 @@ exports.dispatch_normal_event = function dispatch_normal_event(event) { stream_data.delete_sub(stream.stream_id); settings_streams.remove_default_stream(stream.stream_id); stream_data.remove_default_stream(stream.stream_id); + if (page_params.realm_notifications_stream_id === stream.stream_id) { + page_params.realm_notifications_stream_id = -1; + settings_org.render_notifications_stream_ui( + page_params.realm_notifications_stream_id); + } }); } break; diff --git a/static/js/settings_org.js b/static/js/settings_org.js index 493d3b3ab1..c694930e30 100644 --- a/static/js/settings_org.js +++ b/static/js/settings_org.js @@ -107,6 +107,42 @@ exports.populate_auth_methods = function (auth_methods) { } }; +exports.render_notifications_stream_ui = function (stream_id) { + var currrent_notifications_stream = stream_data.get_sub_by_id(stream_id); + if (currrent_notifications_stream) { + $("#realm_notifications_stream_name").text(i18n.t("#__stream_name__", + { stream_name: currrent_notifications_stream.name })).removeClass("text-warning"); + } else { + $("#realm_notifications_stream_name").text(i18n.t("Disabled")).addClass("text-warning"); + } +}; + +exports.populate_notifications_stream_dropdown = function (stream_list) { + var dropdown_list_body = $("#id_realm_notifications_stream .dropdown-list-body").expectOne(); + var search_input = $("#id_realm_notifications_stream .dropdown-search > input[type=text]"); + + list_render(dropdown_list_body, stream_list, { + name: "admin-realm-dropdown-stream-list", + modifier: function (item) { + return templates.render("admin-realm-dropdown-stream-list", { stream: item }); + }, + filter: { + element: search_input, + callback: function (item, value) { + return item.name.toLowerCase().match(value); + }, + }, + }).init(); + + $("#id_realm_notifications_stream .dropdown-search").click(function (e) { + e.stopPropagation(); + }); + + $("#id_realm_notifications_stream .dropdown-toggle").click(function () { + search_input.val("").trigger("input"); + }); +}; + function property_type_status_element(element) { return $("#admin-realm-" + element.split('_').join('-') + "-status").expectOne(); } @@ -116,6 +152,12 @@ function _set_up() { loading.make_indicator($('#admin_page_auth_methods_loading_indicator')); + // Populate notifications stream modal + if (page_params.is_admin) { + exports.populate_notifications_stream_dropdown(stream_data.get_streams_for_settings_page()); + } + exports.render_notifications_stream_ui(page_params.realm_notifications_stream_id); + // Populate realm domains exports.populate_realm_domains(page_params.realm_domains); @@ -510,6 +552,52 @@ function _set_up() { }); }); + var notifications_stream_status = $("#admin-realm-notifications-stream-status").expectOne(); + function update_notifications_stream(new_notifications_stream_id) { + exports.render_notifications_stream_ui(new_notifications_stream_id); + notifications_stream_status.hide(); + + var url = "/json/realm"; + var data = { + notifications_stream_id: JSON.stringify(parseInt(new_notifications_stream_id, 10)), + }; + + channel.patch({ + url: url, + data: data, + + success: function (response_data) { + if (response_data.notifications_stream_id !== undefined) { + if (response_data.notifications_stream_id < 0) { + ui_report.success(i18n.t("Notifications stream disabled!"), notifications_stream_status); + } else { + ui_report.success(i18n.t("Notifications stream changed!"), notifications_stream_status); + } + } + }, + error: function (xhr) { + ui_report.error(i18n.t("Failed to change notifications stream!"), xhr, notifications_stream_status); + }, + }); + } + + var dropdown_menu = $("#id_realm_notifications_stream .dropdown-menu"); + $("#id_realm_notifications_stream .dropdown-list-body").on("click keypress", ".stream_name", function (e) { + if (e.type === "keypress") { + if (e.which === 13) { + dropdown_menu.dropdown("toggle"); + } else { + return; + } + } + + update_notifications_stream($(this).attr("data-stream-id")); + }); + + $(".notifications-stream-disable").click(function () { + update_notifications_stream(-1); + }); + function upload_realm_icon(file_input) { var form_data = new FormData(); diff --git a/static/styles/settings.css b/static/styles/settings.css index 1fc791456c..0d87825453 100644 --- a/static/styles/settings.css +++ b/static/styles/settings.css @@ -1006,6 +1006,18 @@ input[type=checkbox].inline-block { border-radius: 0px; } +#id_realm_notifications_stream .dropdown-search > input[type=text] { + margin: 9px; +} + +#id_realm_notifications_stream .dropdown-list-body { + height: auto; + max-height: 200px; + overflow-y: auto; + margin-top: 0; + display: block; +} + input[type=text]#settings_search { width: calc(100% - 10px - 2px); margin: 0px; diff --git a/static/templates/settings/admin-realm-dropdown-stream-list.handlebars b/static/templates/settings/admin-realm-dropdown-stream-list.handlebars new file mode 100644 index 0000000000..c16c740e03 --- /dev/null +++ b/static/templates/settings/admin-realm-dropdown-stream-list.handlebars @@ -0,0 +1,8 @@ +{{#with stream}} + +{{/with}} diff --git a/static/templates/settings/organization-settings-admin.handlebars b/static/templates/settings/organization-settings-admin.handlebars index 1ee4104ab6..b232c01f99 100644 --- a/static/templates/settings/organization-settings-admin.handlebars +++ b/static/templates/settings/organization-settings-admin.handlebars @@ -4,6 +4,7 @@
+
@@ -42,6 +43,27 @@ {{/if}} +
+ + {{#if is_admin }} + + {{t "[Change]" }} + + + {{t "[Disable]" }} + {{/if}} +
+

{{t "Organization avatar" }}