From 01613e71fbf17468eb1759bb7bffb124ee23acdf Mon Sep 17 00:00:00 2001 From: Anders Kaseorg Date: Fri, 17 May 2019 14:11:33 -0700 Subject: [PATCH] ui: Replace set_up_scrollbar with data-simplebar attribute. With perfectScrollbar, we needed to call a function from JavaScript to enable a scrollbar on a new element, but simplebar has a much simpler default API one can do by using data-simplebar attributes in the HTML. So we can delete all the scrollbar creation/deletion code. Signed-off-by: Anders Kaseorg --- frontend_tests/node_tests/activity.js | 1 - frontend_tests/node_tests/pm_list.js | 1 - frontend_tests/node_tests/ui_init.js | 1 - static/js/activity.js | 3 --- static/js/attachments_ui.js | 3 --- static/js/emoji_picker.js | 4 ---- static/js/invite.js | 2 -- static/js/pm_list.js | 1 - static/js/popovers.js | 2 -- static/js/scroll_bar.js | 1 - static/js/settings.js | 3 --- static/js/settings_org.js | 2 -- static/js/settings_streams.js | 2 -- static/js/settings_users.js | 4 ---- static/js/stream_edit.js | 2 -- static/js/subs.js | 4 ---- static/js/ui.js | 10 +--------- static/templates/emoji_popover_content.handlebars | 4 ++-- .../templates/settings/attachments-settings.handlebars | 2 +- static/templates/settings/bot-list-admin.handlebars | 2 +- .../settings/deactivated-users-admin.handlebars | 2 +- .../settings/default-streams-list-admin.handlebars | 2 +- .../settings/organization-settings-admin.handlebars | 4 ++-- static/templates/settings/user-list-admin.handlebars | 2 +- static/templates/subscription_members.handlebars | 2 +- static/templates/subscription_table_body.handlebars | 4 ++-- .../user_group_info_popover_content.handlebars | 2 +- static/templates/user_profile_modal.handlebars | 2 +- templates/zerver/app/invite_user.html | 2 +- templates/zerver/app/left_sidebar.html | 4 ++-- templates/zerver/app/right_sidebar.html | 4 ++-- templates/zerver/app/settings_overlay.html | 4 ++-- 32 files changed, 22 insertions(+), 66 deletions(-) diff --git a/frontend_tests/node_tests/activity.js b/frontend_tests/node_tests/activity.js index 60f9750bc2..8f9e78995c 100644 --- a/frontend_tests/node_tests/activity.js +++ b/frontend_tests/node_tests/activity.js @@ -19,7 +19,6 @@ const _document = { const _channel = {}; const _ui = { - set_up_scrollbar: function () {}, get_content_element: element => element, }; diff --git a/frontend_tests/node_tests/pm_list.js b/frontend_tests/node_tests/pm_list.js index dfb4e412e2..7be6e56161 100644 --- a/frontend_tests/node_tests/pm_list.js +++ b/frontend_tests/node_tests/pm_list.js @@ -5,7 +5,6 @@ set_global('resize', { resize_stream_filters_container: function () {}, }); set_global('ui', { - set_up_scrollbar: function () {}, get_content_element: element => element, }); set_global('stream_popover', { diff --git a/frontend_tests/node_tests/ui_init.js b/frontend_tests/node_tests/ui_init.js index bd365b118f..55af39807d 100644 --- a/frontend_tests/node_tests/ui_init.js +++ b/frontend_tests/node_tests/ui_init.js @@ -74,7 +74,6 @@ zrequire('util'); util.is_mobile = () => false; templates.render = () => 'some-html'; -ui.set_up_scrollbar = () => {}; ui.get_scroll_element = element => element; zrequire('echo'); diff --git a/static/js/activity.js b/static/js/activity.js index 6ceb59891f..708b37ba20 100644 --- a/static/js/activity.js +++ b/static/js/activity.js @@ -328,7 +328,6 @@ exports.initialize = function () { exports.build_user_sidebar(); exports.update_huddles(); - ui.set_up_scrollbar($("#buddy_list_wrapper")); buddy_list.start_scroll_handler(); // Let the server know we're here, but pass "false" for @@ -340,8 +339,6 @@ exports.initialize = function () { } setInterval(get_full_presence_list_update, ACTIVE_PING_INTERVAL_MS); - - ui.set_up_scrollbar($("#group-pms")); }; exports.update_presence_info = function (email, info, server_time) { diff --git a/static/js/attachments_ui.js b/static/js/attachments_ui.js index bdc60ec16f..d5324a9c34 100644 --- a/static/js/attachments_ui.js +++ b/static/js/attachments_ui.js @@ -131,12 +131,9 @@ exports.update_attachments = function (event) { exports.set_up_attachments = function () { // The settings page must be rendered before this function gets called. - var uploaded_files_table = $("#uploaded_files_table").expectOne(); var status = $('#delete-upload-status'); loading.make_indicator($('#attachments_loading_indicator'), {text: 'Loading...'}); - ui.set_up_scrollbar(uploaded_files_table.closest(".progressive-table-wrapper")); - $('#uploaded_files_table').on('click', '.remove-attachment', function (e) { delete_attachments($(e.target).closest(".uploaded_file_row").attr('data-attachment-id')); }); diff --git a/static/js/emoji_picker.js b/static/js/emoji_picker.js index 0e3c9e299a..4d97da6c05 100644 --- a/static/js/emoji_picker.js +++ b/static/js/emoji_picker.js @@ -175,8 +175,6 @@ exports.hide_emoji_popover = function () { $('.has_popover').removeClass('has_popover has_emoji_popover'); if (exports.reactions_popped()) { var orig_title = current_message_emoji_popover_elem.data("original-title"); - ui.destroy_scrollbar($(".emoji-popover-emoji-map")); - ui.destroy_scrollbar($(".emoji-search-results-container")); current_message_emoji_popover_elem.popover("destroy"); current_message_emoji_popover_elem.prop("title", orig_title); current_message_emoji_popover_elem.removeClass("reaction_button_visible"); @@ -602,8 +600,6 @@ exports.render_emoji_popover = function (elt, id) { var popover = elt.data('popover').$tip; popover.find('.emoji-popover-filter').focus(); - ui.set_up_scrollbar(popover.find(".emoji-popover-emoji-map")); - ui.set_up_scrollbar(popover.find(".emoji-search-results-container")); current_message_emoji_popover_elem = elt; emoji_catalog_last_coordinates = { diff --git a/static/js/invite.js b/static/js/invite.js index d0da4c4dc1..7f72dbe782 100644 --- a/static/js/invite.js +++ b/static/js/invite.js @@ -138,8 +138,6 @@ function prepare_form_to_be_shown() { } exports.launch = function () { - ui.set_up_scrollbar($("#invite_user_form .modal-body")); - $('#submit-invitation').button(); prepare_form_to_be_shown(); $("#invitee_emails").focus().autosize(); diff --git a/static/js/pm_list.js b/static/js/pm_list.js index f0d3c4e541..b20f172eba 100644 --- a/static/js/pm_list.js +++ b/static/js/pm_list.js @@ -185,7 +185,6 @@ exports.update_dom_with_unread_counts = function (counts) { exports.initialize = function () { - ui.set_up_scrollbar($("#private-container")); }; return exports; diff --git a/static/js/popovers.js b/static/js/popovers.js index 8dcc66f7f6..b43ecb9000 100644 --- a/static/js/popovers.js +++ b/static/js/popovers.js @@ -276,7 +276,6 @@ exports.show_user_profile = function (user) { }; $("#user-profile-modal-holder").html(templates.render("user_profile_modal", args)); - ui.set_up_scrollbar($("#user-profile-modal #body")); $("#user-profile-modal").modal("show"); settings_account.initialize_custom_user_type_fields("#user-profile-modal #content", user.user_id, false, false); @@ -355,7 +354,6 @@ function show_user_group_info_popover(element, group, message) { trigger: "manual", }); elt.popover("show"); - ui.set_up_scrollbar($('.group-info-popover .member-list')); current_message_info_popover_elem = elt; } } diff --git a/static/js/scroll_bar.js b/static/js/scroll_bar.js index f54dc3613a..818bcda08f 100644 --- a/static/js/scroll_bar.js +++ b/static/js/scroll_bar.js @@ -64,7 +64,6 @@ exports.initialize = function () { exports.set_layout_width(); } - ui.set_up_scrollbar($("#stream-filters-container")); }; exports.set_layout_width = function () { diff --git a/static/js/settings.js b/static/js/settings.js index d071245cbe..220037ba13 100644 --- a/static/js/settings.js +++ b/static/js/settings.js @@ -119,9 +119,6 @@ function setup_settings_label() { } exports.build_page = function () { - ui.set_up_scrollbar($("#settings_page .sidebar.left")); - ui.set_up_scrollbar($("#settings_content")); - setup_settings_label(); var rendered_settings_tab = templates.render('settings_tab', { diff --git a/static/js/settings_org.js b/static/js/settings_org.js index fd1dfda311..1648894f44 100644 --- a/static/js/settings_org.js +++ b/static/js/settings_org.js @@ -372,8 +372,6 @@ exports.populate_notifications_stream_dropdown = function (stream_list) { }, }).init(); - ui.set_up_scrollbar(dropdown_list_body); - $("#id_realm_notifications_stream .dropdown-search").click(function (e) { e.stopPropagation(); }); diff --git a/static/js/settings_streams.js b/static/js/settings_streams.js index a895630283..63c3cf9e9d 100644 --- a/static/js/settings_streams.js +++ b/static/js/settings_streams.js @@ -46,8 +46,6 @@ exports.build_default_stream_table = function (streams_data) { }, }).init(); - ui.set_up_scrollbar(table.closest(".progressive-table-wrapper")); - loading.destroy_indicator($('#admin_page_default_streams_loading_indicator')); self.remove = function (stream_id) { diff --git a/static/js/settings_users.js b/static/js/settings_users.js index 7526fd3fc5..25657c8c02 100644 --- a/static/js/settings_users.js +++ b/static/js/settings_users.js @@ -203,10 +203,6 @@ function populate_users(realm_people_data) { }, }).init(); - [$bots_table, $users_table, $deactivated_users_table].forEach(function ($o) { - ui.set_up_scrollbar($o.closest(".progressive-table-wrapper")); - }); - loading.destroy_indicator($('#admin_page_users_loading_indicator')); loading.destroy_indicator($('#admin_page_bots_loading_indicator')); loading.destroy_indicator($('#admin_page_deactivated_users_loading_indicator')); diff --git a/static/js/stream_edit.js b/static/js/stream_edit.js index 07574bc9cb..6e3a531558 100644 --- a/static/js/stream_edit.js +++ b/static/js/stream_edit.js @@ -194,8 +194,6 @@ function show_subscription_settings(sub_row) { }, }).init(); - ui.set_up_scrollbar($(".subscriber_list_container")); - sub_settings.find('input[name="principal"]').typeahead({ source: people.get_realm_persons, // This is a function. items: 5, diff --git a/static/js/subs.js b/static/js/subs.js index b5d5b9956c..cb77a3cdb9 100644 --- a/static/js/subs.js +++ b/static/js/subs.js @@ -638,10 +638,6 @@ exports.launch = function (section) { on_close: exports.close, }); exports.change_state(section); - - ui.set_up_scrollbar($("#subscription_overlay .streams-list")); - ui.set_up_scrollbar($("#subscription_overlay .settings")); - }); if (!exports.get_active_data().id) { $('#search_stream_name').focus(); diff --git a/static/js/ui.js b/static/js/ui.js index b749576c56..195b436b09 100644 --- a/static/js/ui.js +++ b/static/js/ui.js @@ -1,6 +1,6 @@ var ui = (function () { -var SimpleBar = require("simplebar").default; +require("simplebar"); var exports = {}; @@ -15,10 +15,6 @@ exports.replace_emoji_with_text = function (element) { }); }; -exports.set_up_scrollbar = function (element_selector) { - new SimpleBar(element_selector.expectOne()[0]); -}; - exports.get_content_element = function (element_selector) { var element = element_selector.expectOne()[0]; if (element.SimpleBar) { @@ -44,10 +40,6 @@ exports.reset_scrollbar = function (element_selector) { } }; -exports.destroy_scrollbar = function (element_selector) { - element_selector.expectOne()[0].SimpleBar.unMount(); -}; - function update_message_in_all_views(message_id, callback) { _.each([message_list.all, home_msg_list, message_list.narrowed], function (list) { if (list === undefined) { diff --git a/static/templates/emoji_popover_content.handlebars b/static/templates/emoji_popover_content.handlebars index f2381582bf..cfc235834c 100644 --- a/static/templates/emoji_popover_content.handlebars +++ b/static/templates/emoji_popover_content.handlebars @@ -8,7 +8,7 @@ {{/each}} -
+
{{#each emoji_categories }}
{{name}}
@@ -18,7 +18,7 @@
{{/each}}
-
+
{{t "Search results" }}
diff --git a/static/templates/settings/attachments-settings.handlebars b/static/templates/settings/attachments-settings.handlebars index 878c99899d..a6294edc6a 100644 --- a/static/templates/settings/attachments-settings.handlebars +++ b/static/templates/settings/attachments-settings.handlebars @@ -12,7 +12,7 @@ {{t "Actions" }} -
+
diff --git a/static/templates/settings/bot-list-admin.handlebars b/static/templates/settings/bot-list-admin.handlebars index 2c25d61284..ffb6a6c4e6 100644 --- a/static/templates/settings/bot-list-admin.handlebars +++ b/static/templates/settings/bot-list-admin.handlebars @@ -15,7 +15,7 @@ {{/if}}
-
+
diff --git a/static/templates/settings/deactivated-users-admin.handlebars b/static/templates/settings/deactivated-users-admin.handlebars index ad8d6ffe35..617184c990 100644 --- a/static/templates/settings/deactivated-users-admin.handlebars +++ b/static/templates/settings/deactivated-users-admin.handlebars @@ -4,7 +4,7 @@
-
+
diff --git a/static/templates/settings/default-streams-list-admin.handlebars b/static/templates/settings/default-streams-list-admin.handlebars index fc421a6357..87239248fc 100644 --- a/static/templates/settings/default-streams-list-admin.handlebars +++ b/static/templates/settings/default-streams-list-admin.handlebars @@ -24,7 +24,7 @@
-
+
{{t "Name" }}
diff --git a/static/templates/settings/organization-settings-admin.handlebars b/static/templates/settings/organization-settings-admin.handlebars index 9727ca8c03..ddd2601c47 100644 --- a/static/templates/settings/organization-settings-admin.handlebars +++ b/static/templates/settings/organization-settings-admin.handlebars @@ -113,7 +113,7 @@ - + @@ -135,7 +135,7 @@ - + diff --git a/static/templates/settings/user-list-admin.handlebars b/static/templates/settings/user-list-admin.handlebars index f7f203f968..a9107b9d06 100644 --- a/static/templates/settings/user-list-admin.handlebars +++ b/static/templates/settings/user-list-admin.handlebars @@ -16,7 +16,7 @@ {{/if}}
{{t "Name" }}
-
+
diff --git a/static/templates/subscription_members.handlebars b/static/templates/subscription_members.handlebars index 4d51c5e919..113d0bbebb 100644 --- a/static/templates/subscription_members.handlebars +++ b/static/templates/subscription_members.handlebars @@ -21,7 +21,7 @@
-
+
diff --git a/static/templates/subscription_table_body.handlebars b/static/templates/subscription_table_body.handlebars index a3c76a1b6c..b1bf2c48bd 100644 --- a/static/templates/subscription_table_body.handlebars +++ b/static/templates/subscription_table_body.handlebars @@ -20,7 +20,7 @@
-
+
@@ -34,7 +34,7 @@ {{t 'First time? Read our guidelines for creating and naming streams.' }} {{/if}}
-
+
{{!-- edit stream here --}}
{{ partial "stream_creation_form" }} diff --git a/static/templates/user_group_info_popover_content.handlebars b/static/templates/user_group_info_popover_content.handlebars index 1056c31606..7b2a405864 100644 --- a/static/templates/user_group_info_popover_content.handlebars +++ b/static/templates/user_group_info_popover_content.handlebars @@ -6,7 +6,7 @@
-
    +
      {{#each members}}
    • {{#if is_active }} diff --git a/static/templates/user_profile_modal.handlebars b/static/templates/user_profile_modal.handlebars index b4fc192581..892ecad145 100644 --- a/static/templates/user_profile_modal.handlebars +++ b/static/templates/user_profile_modal.handlebars @@ -1,4 +1,4 @@ -
    • @@ -71,7 +71,7 @@ -
      +
        {% if show_add_streams %} {{ _('Add streams') }} diff --git a/templates/zerver/app/right_sidebar.html b/templates/zerver/app/right_sidebar.html index d45d301585..17eacee539 100644 --- a/templates/zerver/app/right_sidebar.html +++ b/templates/zerver/app/right_sidebar.html @@ -18,7 +18,7 @@
        -
        +
          @@ -27,7 +27,7 @@
          -
            +
          {% if show_invites %} diff --git a/templates/zerver/app/settings_overlay.html b/templates/zerver/app/settings_overlay.html index da96bced6e..59c1212a78 100644 --- a/templates/zerver/app/settings_overlay.html +++ b/templates/zerver/app/settings_overlay.html @@ -7,7 +7,7 @@
      -
      +
        @@ -152,7 +152,7 @@ ×
      -
      +