paulmataruso/zulip
1
0
Fork 0
mirror of https://github.com/zulip/zulip.git synced 2025-11-06 15:03:34 +00:00
Code Issues Packages Projects Releases Wiki Activity

list_render: Remove data-list-render markup.

Browse Source 
We already know which list widget a `<th>`
tag is associated with when we set up the
event handler, so it's silly to read data
from the DOM to find that widget again
when the handler runs.

This commit eliminates a whole class of possible
errors and busy work.
This commit is contained in:
Steve Howell
2020-04-15 10:22:23 +00:00
committed by Tim Abbott
parent 37eeb90695
commit 19cf6d0e04
11 changed files with 33 additions and 50 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
frontend_tests/node_tests/list_render.js
View File

@@ -228,9 +228,7 @@ function sort_button(opts) {
}; };
} }
let button; const button = {
const $button = {
data: data, data: data,
closest: lookup('.progressive-table-wrapper', { closest: lookup('.progressive-table-wrapper', {
data: lookup('list-render', opts.list_name), data: lookup('list-render', opts.list_name),
@@ -252,10 +250,6 @@ function sort_button(opts) {
assert.equal(sel, 'active'); assert.equal(sel, 'active');
button.activated = true; button.activated = true;
}, },
};
button = {
to_jquery: () => $button,
siblings_deactivated: false, siblings_deactivated: false,
activated: false, activated: false,
}; };
@@ -321,7 +315,7 @@ run_test('sorting', () => {
return people.map(opts.modifier).join(''); return people.map(opts.modifier).join('');
} }
list_render.create(container, list, opts); const widget = list_render.create(container, list, opts);
let button_opts; let button_opts;
let button; let button;
@@ -336,7 +330,7 @@ run_test('sorting', () => {
button = sort_button(button_opts); button = sort_button(button_opts);
list_render.handle_sort.call(button); list_render.handle_sort(button, widget);
assert(cleared); assert(cleared);
assert(button.siblings_deactivated); assert(button.siblings_deactivated);
@@ -357,7 +351,7 @@ run_test('sorting', () => {
cleared = false; cleared = false;
button.siblings_deactivated = false; button.siblings_deactivated = false;
list_render.handle_sort.call(button); list_render.handle_sort(button, widget);
assert(cleared); assert(cleared);
assert(button.siblings_deactivated); assert(button.siblings_deactivated);

51
static/js/list_render.js
View File

@@ -214,7 +214,9 @@ exports.create = function ($container, list, opts) {
}); });
if (opts.parent_container) { if (opts.parent_container) {
opts.parent_container.on('click.list_widget_sort', "[data-sort]", exports.handle_sort); opts.parent_container.on('click.list_widget_sort', "[data-sort]", function () {
exports.handle_sort($(this), widget);
});
} }
if (opts.filter && opts.filter.element) { if (opts.filter && opts.filter.element) {
@@ -311,48 +313,35 @@ exports.get = function (name) {
return DEFAULTS.instances.get(name) || false; return DEFAULTS.instances.get(name) || false;
}; };
exports.handle_sort = function () { exports.handle_sort = function (th, list) {
/* /*
one would specify sort parameters like this: one would specify sort parameters like this:
- name => sort alphabetic. - name => sort alphabetic.
- age => sort numeric. - age => sort numeric.
- status => look up `status` in sort_fields
to find custom sort function
you MUST specify the `data-list-render` in the `.progressive-table-wrapper` <thead>
<th data-sort="alphabetic" data-sort-prop="name"></th>
<div class="progressive-table-wrapper" data-list-render="some-list"> <th data-sort="numeric" data-sort-prop="age"></th>
<table> <th data-sort="status"></th>
<thead> </thead>
<th data-sort="alphabetic" data-sort-prop="name"></th>
<th data-sort="numeric" data-sort-prop="age"></th>
</thead>
<tbody></tbody>
</table>
</div>
*/ */
const $this = $(this); const sort_type = th.data("sort");
const sort_type = $this.data("sort"); const prop_name = th.data("sort-prop");
const prop_name = $this.data("sort-prop");
const list_name = $this.closest(".progressive-table-wrapper").data("list-render");
const list = exports.get(list_name); if (th.hasClass("active")) {
if (!th.hasClass("descend")) {
if (!list) { th.addClass("descend");
blueslip.error("Error. This `.progressive-table-wrapper` has no `data-list-render` attribute.");
return;
}
if ($this.hasClass("active")) {
if (!$this.hasClass("descend")) {
$this.addClass("descend");
} else { } else {
$this.removeClass("descend"); th.removeClass("descend");
} }
} else { } else {
$this.siblings(".active").removeClass("active"); th.siblings(".active").removeClass("active");
$this.addClass("active"); th.addClass("active");
} }
list.set_reverse_mode($this.hasClass("descend")); list.set_reverse_mode(th.hasClass("descend"));
// if `prop_name` is defined, it will trigger the generic codepath, // if `prop_name` is defined, it will trigger the generic codepath,
// and not if it is undefined. // and not if it is undefined.

2
static/templates/settings/attachments_settings.hbs
View File

@@ -3,7 +3,7 @@
<input id="upload_file_search" class="search" type="text" placeholder="{{t 'Search uploads...' }}" aria-label="{{t 'Search uploads...' }}"/> <input id="upload_file_search" class="search" type="text" placeholder="{{t 'Search uploads...' }}" aria-label="{{t 'Search uploads...' }}"/>
<div class="clear-float"></div> <div class="clear-float"></div>
<div class="alert" id="delete-upload-status"></div> <div class="alert" id="delete-upload-status"></div>
<div class="progressive-table-wrapper" data-simplebar data-list-render="uploaded-files-list"> <div class="progressive-table-wrapper" data-simplebar>
<table class="table table-condensed table-striped wrapped-table"> <table class="table table-condensed table-striped wrapped-table">
<thead> <thead>
<th data-sort="alphabetic" data-sort-prop="name" class="upload-file-name">{{t "File" }}</th> <th data-sort="alphabetic" data-sort-prop="name" class="upload-file-name">{{t "File" }}</th>

2
static/templates/settings/bot_list_admin.hbs
View File

@@ -4,7 +4,7 @@
<input type="text" class="search" placeholder="{{t 'Filter bots' }}" aria-label="{{t 'Filter bots' }}"/> <input type="text" class="search" placeholder="{{t 'Filter bots' }}" aria-label="{{t 'Filter bots' }}"/>
<div class="alert-notification" id="bot-field-status"></div> <div class="alert-notification" id="bot-field-status"></div>
<div class="clear-float"></div> <div class="clear-float"></div>
<div class="progressive-table-wrapper" data-simplebar data-list-render="admin_bot_list"> <div class="progressive-table-wrapper" data-simplebar>
<table class="table table-condensed table-striped wrapped-table"> <table class="table table-condensed table-striped wrapped-table">
<thead> <thead>
<th class="active" data-sort="alphabetic" data-sort-prop="full_name">{{t "Name" }}</th> <th class="active" data-sort="alphabetic" data-sort-prop="full_name">{{t "Name" }}</th>

2
static/templates/settings/data_exports_admin.hbs
View File

@@ -30,7 +30,7 @@
{{/if}} {{/if}}
<input type="hidden" class="search" placeholder="{{t 'Filter exports' }}" <input type="hidden" class="search" placeholder="{{t 'Filter exports' }}"
aria-label="{{t 'Filter exports' }}"/> aria-label="{{t 'Filter exports' }}"/>
<div class="progressive-table-wrapper" data-simplebar data-list-render="admin_exports_list"> <div class="progressive-table-wrapper" data-simplebar>
<table class="table table-condensed table-striped wrapped-table admin_exports_table"> <table class="table table-condensed table-striped wrapped-table admin_exports_table">
<thead> <thead>
<th class="active" data-sort="user">{{t "Requesting user" }}</th> <th class="active" data-sort="user">{{t "Requesting user" }}</th>

2
static/templates/settings/deactivated_users_admin.hbs
View File

@@ -8,7 +8,7 @@
<div class="alert-notification" id="deactivated-user-field-status"></div> <div class="alert-notification" id="deactivated-user-field-status"></div>
<div class="clear-float"></div> <div class="clear-float"></div>
<div class="progressive-table-wrapper" data-simplebar data-list-render="deactivated_users_table_list"> <div class="progressive-table-wrapper" data-simplebar>
<table class="table table-condensed table-striped wrapped-table"> <table class="table table-condensed table-striped wrapped-table">
<thead> <thead>
<th class="active" data-sort="alphabetic" data-sort-prop="full_name">{{t "Name" }}</th> <th class="active" data-sort="alphabetic" data-sort-prop="full_name">{{t "Name" }}</th>

2
static/templates/settings/default_streams_list_admin.hbs
View File

@@ -24,7 +24,7 @@
<input type="text" class="search" placeholder="{{t 'Filter streams' }}" aria-label="{{t 'Filter streams' }}"/> <input type="text" class="search" placeholder="{{t 'Filter streams' }}" aria-label="{{t 'Filter streams' }}"/>
<div class="clear-float"></div> <div class="clear-float"></div>
<div class="progressive-table-wrapper" data-simplebar data-list-render="default_streams_list"> <div class="progressive-table-wrapper" data-simplebar>
<table class="table table-condensed table-striped wrapped-table"> <table class="table table-condensed table-striped wrapped-table">
<thead> <thead>
<th class="active" data-sort="alphabetic" data-sort-prop="name">{{t "Name" }}</th> <th class="active" data-sort="alphabetic" data-sort-prop="name">{{t "Name" }}</th>

2
static/templates/settings/emoji_settings_admin.hbs
View File

@@ -32,7 +32,7 @@
<input type="text" class="search" placeholder="{{t 'Filter emojis' }}" <input type="text" class="search" placeholder="{{t 'Filter emojis' }}"
aria-label="{{t 'Filter linkifiers' }}"/> aria-label="{{t 'Filter linkifiers' }}"/>
<div class="progressive-table-wrapper" data-simplebar data-list-render="emoji_list"> <div class="progressive-table-wrapper" data-simplebar>
<table class="table table-condensed table-striped wrapped-table admin_emoji_table"> <table class="table table-condensed table-striped wrapped-table admin_emoji_table">
<thead> <thead>
<th class="active" data-sort="alphabetic" data-sort-prop="name">{{t "Name" }}</th> <th class="active" data-sort="alphabetic" data-sort-prop="name">{{t "Name" }}</th>

2
static/templates/settings/invites_list_admin.hbs
View File

@@ -7,7 +7,7 @@
</div> </div>
<div class="clear-float"></div> <div class="clear-float"></div>
<div class="progressive-table-wrapper" data-simplebar data-list-render="admin_invites_list"> <div class="progressive-table-wrapper" data-simplebar>
<table class="table table-condensed table-striped"> <table class="table table-condensed table-striped">
<thead> <thead>
<th class="active" data-sort="invitee">{{t "Invitee" }}</th> <th class="active" data-sort="invitee">{{t "Invitee" }}</th>

2
static/templates/settings/linkifier_settings_admin.hbs
View File

@@ -65,7 +65,7 @@
{{/if}} {{/if}}
<input type="text" class="search" placeholder="{{t 'Filter linkifiers' }}" aria-label="{{t 'Filter linkifiers' }}"/> <input type="text" class="search" placeholder="{{t 'Filter linkifiers' }}" aria-label="{{t 'Filter linkifiers' }}"/>
<div class="progressive-table-wrapper" data-simplebar data-list-render="linkifiers_list"> <div class="progressive-table-wrapper" data-simplebar>
<table class="table table-condensed table-striped wrapped-table admin_filters_table"> <table class="table table-condensed table-striped wrapped-table admin_filters_table">
<thead> <thead>
<th class="active" data-sort="pattern">{{t "Pattern" }}</th> <th class="active" data-sort="pattern">{{t "Pattern" }}</th>

2
static/templates/settings/user_list_admin.hbs
View File

@@ -5,7 +5,7 @@
<div class="alert-notification" id="user-field-status"></div> <div class="alert-notification" id="user-field-status"></div>
<div class="clear-float"></div> <div class="clear-float"></div>
<div class="progressive-table-wrapper" data-simplebar data-list-render="users_table_list"> <div class="progressive-table-wrapper" data-simplebar>
<table class="table table-condensed table-striped wrapped-table"> <table class="table table-condensed table-striped wrapped-table">
<thead> <thead>
<th class="active" data-sort="alphabetic" data-sort-prop="full_name">{{t "Name" }}</th> <th class="active" data-sort="alphabetic" data-sort-prop="full_name">{{t "Name" }}</th>