mirror of https://github.com/zulip/zulip.git
list_widget: Refactor `widget` object.
This is a prep commit for migrating `list_widget` to TypeScript, In this commit we declare all our methods for the widget directly inside `widget` object to avoid making an incomplete object when we add a type for our widget.
This commit is contained in:
parent
de23949a36
commit
e8390a529a
|
@ -172,13 +172,12 @@ export function create($container, list, opts) {
|
|||
return undefined;
|
||||
}
|
||||
|
||||
const widget = {};
|
||||
|
||||
widget.get_current_list = function () {
|
||||
const widget = {
|
||||
get_current_list() {
|
||||
return meta.filtered_list;
|
||||
};
|
||||
},
|
||||
|
||||
widget.filter_and_sort = function () {
|
||||
filter_and_sort() {
|
||||
meta.filtered_list = get_filtered_items(meta.filter_value, meta.list, opts);
|
||||
|
||||
if (meta.sorting_function) {
|
||||
|
@ -188,11 +187,11 @@ export function create($container, list, opts) {
|
|||
if (meta.reverse_mode) {
|
||||
meta.filtered_list.reverse();
|
||||
}
|
||||
};
|
||||
},
|
||||
|
||||
// Used in case of Multiselect DropdownListWidget to retain
|
||||
// previously checked items even after widget redraws.
|
||||
widget.retain_selected_items = function () {
|
||||
retain_selected_items() {
|
||||
const items = opts.multiselect;
|
||||
|
||||
if (items.selected_items) {
|
||||
|
@ -206,12 +205,12 @@ export function create($container, list, opts) {
|
|||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
},
|
||||
|
||||
// Reads the provided list (in the scope directly above)
|
||||
// and renders the next block of messages automatically
|
||||
// into the specified container.
|
||||
widget.render = function (how_many) {
|
||||
render(how_many) {
|
||||
let load_count = how_many || DEFAULTS.LOAD_COUNT;
|
||||
if (opts.get_min_load_count) {
|
||||
load_count = opts.get_min_load_count(meta.offset, load_count);
|
||||
|
@ -249,9 +248,9 @@ export function create($container, list, opts) {
|
|||
if (opts.callback_after_render) {
|
||||
opts.callback_after_render();
|
||||
}
|
||||
};
|
||||
},
|
||||
|
||||
widget.render_item = (item) => {
|
||||
render_item(item) {
|
||||
if (!opts.html_selector) {
|
||||
// We don't have any way to find the existing item.
|
||||
return;
|
||||
|
@ -275,25 +274,25 @@ export function create($container, list, opts) {
|
|||
// At this point, we have asserted we have all the information to replace
|
||||
// the html now.
|
||||
$html_item.replaceWith(html);
|
||||
};
|
||||
},
|
||||
|
||||
widget.clear = function () {
|
||||
clear() {
|
||||
$container.empty();
|
||||
meta.offset = 0;
|
||||
};
|
||||
},
|
||||
|
||||
widget.set_filter_value = function (filter_value) {
|
||||
set_filter_value(filter_value) {
|
||||
meta.filter_value = filter_value;
|
||||
};
|
||||
},
|
||||
|
||||
widget.set_reverse_mode = function (reverse_mode) {
|
||||
set_reverse_mode(reverse_mode) {
|
||||
meta.reverse_mode = reverse_mode;
|
||||
};
|
||||
},
|
||||
|
||||
// the sorting function is either the function or string that calls the
|
||||
// function to sort the list by. The prop is used for generic functions
|
||||
// that can be called to sort with a particular prop.
|
||||
widget.set_sorting_function = function (sorting_function, prop) {
|
||||
set_sorting_function(sorting_function, prop) {
|
||||
if (typeof sorting_function === "function") {
|
||||
meta.sorting_function = sorting_function;
|
||||
} else if (typeof sorting_function === "string") {
|
||||
|
@ -303,9 +302,9 @@ export function create($container, list, opts) {
|
|||
meta.sorting_function = meta.sorting_functions.get(sorting_function);
|
||||
}
|
||||
}
|
||||
};
|
||||
},
|
||||
|
||||
widget.set_up_event_handlers = function () {
|
||||
set_up_event_handlers() {
|
||||
meta.$scroll_container = scroll_util.get_scroll_element(opts.$simplebar_container);
|
||||
|
||||
// on scroll of the nearest scrolling container, if it hits the bottom
|
||||
|
@ -338,9 +337,9 @@ export function create($container, list, opts) {
|
|||
widget.hard_redraw();
|
||||
});
|
||||
}
|
||||
};
|
||||
},
|
||||
|
||||
widget.clear_event_handlers = function () {
|
||||
clear_event_handlers() {
|
||||
meta.$scroll_container.off("scroll.list_widget_container");
|
||||
|
||||
if (opts.$parent_container) {
|
||||
|
@ -350,23 +349,36 @@ export function create($container, list, opts) {
|
|||
if (opts.filter && opts.filter.$element) {
|
||||
opts.filter.$element.off("input.list_widget_filter");
|
||||
}
|
||||
};
|
||||
},
|
||||
|
||||
widget.increase_rendered_offset = function () {
|
||||
increase_rendered_offset() {
|
||||
meta.offset = Math.min(meta.offset + 1, meta.filtered_list.length);
|
||||
};
|
||||
},
|
||||
|
||||
widget.reduce_rendered_offset = function () {
|
||||
reduce_rendered_offset() {
|
||||
meta.offset = Math.max(meta.offset - 1, 0);
|
||||
};
|
||||
},
|
||||
|
||||
widget.remove_rendered_row = function (rendered_row) {
|
||||
remove_rendered_row(rendered_row) {
|
||||
rendered_row.remove();
|
||||
// We removed a rendered row, so we need to reduce one offset.
|
||||
widget.reduce_rendered_offset();
|
||||
};
|
||||
},
|
||||
|
||||
widget.insert_rendered_row = function (item) {
|
||||
clean_redraw() {
|
||||
widget.filter_and_sort();
|
||||
widget.clear();
|
||||
widget.render(DEFAULTS.INITIAL_RENDER_COUNT);
|
||||
},
|
||||
|
||||
hard_redraw() {
|
||||
widget.clean_redraw();
|
||||
if (opts.filter && opts.filter.onupdate) {
|
||||
opts.filter.onupdate();
|
||||
}
|
||||
},
|
||||
|
||||
insert_rendered_row(item) {
|
||||
// NOTE: Caller should call `filter_and_sort` before calling this function
|
||||
// so that `meta.filtered_list` already has the `item`.
|
||||
if (meta.filtered_list.length <= 2) {
|
||||
|
@ -393,35 +405,26 @@ export function create($container, list, opts) {
|
|||
}
|
||||
const rendered_row = opts.modifier(item);
|
||||
if (topic_insert_index === meta.filtered_list.length - 1) {
|
||||
const $target_row = opts.html_selector(meta.filtered_list[topic_insert_index - 1]);
|
||||
const $target_row = opts.html_selector(
|
||||
meta.filtered_list[topic_insert_index - 1],
|
||||
);
|
||||
$target_row.after(rendered_row);
|
||||
} else {
|
||||
const $target_row = opts.html_selector(meta.filtered_list[topic_insert_index + 1]);
|
||||
const $target_row = opts.html_selector(
|
||||
meta.filtered_list[topic_insert_index + 1],
|
||||
);
|
||||
$target_row.before(rendered_row);
|
||||
}
|
||||
widget.increase_rendered_offset();
|
||||
}
|
||||
};
|
||||
},
|
||||
|
||||
widget.sort = function (sorting_function, prop) {
|
||||
sort(sorting_function, prop) {
|
||||
widget.set_sorting_function(sorting_function, prop);
|
||||
widget.hard_redraw();
|
||||
};
|
||||
},
|
||||
|
||||
widget.clean_redraw = function () {
|
||||
widget.filter_and_sort();
|
||||
widget.clear();
|
||||
widget.render(DEFAULTS.INITIAL_RENDER_COUNT);
|
||||
};
|
||||
|
||||
widget.hard_redraw = function () {
|
||||
widget.clean_redraw();
|
||||
if (opts.filter && opts.filter.onupdate) {
|
||||
opts.filter.onupdate();
|
||||
}
|
||||
};
|
||||
|
||||
widget.replace_list_data = function (list) {
|
||||
replace_list_data(list) {
|
||||
/*
|
||||
We mostly use this widget for lists where you are
|
||||
not adding or removing rows, so when you do modify
|
||||
|
@ -429,6 +432,7 @@ export function create($container, list, opts) {
|
|||
*/
|
||||
meta.list = list;
|
||||
widget.hard_redraw();
|
||||
},
|
||||
};
|
||||
|
||||
widget.set_up_event_handlers();
|
||||
|
|
Loading…
Reference in New Issue