Mirror
/
zulip
mirror of https://github.com/zulip/zulip.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

list_cursor: Convert list_cursor to an ES6 class ListCursor. 

Signed-off-by: Anders Kaseorg <anders@zulip.com>
This commit is contained in:
Anders Kaseorg 2020-07-22 16:48:16 -07:00 committed by Tim Abbott
parent 9d90ae0e69
commit 2e94914be4
7 changed files with 82 additions and 81 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
.eslintrc.json
View File

@ -102,6 +102,7 @@
"Filter": false,
"Handlebars": false,
"LightboxCanvas": false,
"ListCursor": false,
"MessageListData": false,
"MessageListView": false,
"Plotly": false,
@ -162,7 +163,6 @@
"jQuery": false,
"keydown_util": false,
"lightbox": false,
"list_cursor": false,
"list_render": false,
"list_util": false,
"loading": false,

10
frontend_tests/node_tests/list_cursor.js
View File

@ -2,7 +2,7 @@ zrequire("list_cursor");
run_test("config errors", () => {
blueslip.expect("error", "Programming error");
list_cursor({});
new ListCursor({});
});
function basic_conf() {
@ -25,7 +25,7 @@ function basic_conf() {
run_test("misc errors", () => {
const conf = basic_conf();
const cursor = list_cursor(conf);
const cursor = new ListCursor(conf);
// Test that we just ignore empty
// lists for unknown keys.
@ -37,10 +37,10 @@ run_test("misc errors", () => {
cursor.get_row("nada");
blueslip.expect("error", "Caller is not checking keys for list_cursor.go_to");
blueslip.expect("error", "Caller is not checking keys for ListCursor.go_to");
cursor.go_to(undefined);
blueslip.expect("error", "Cannot highlight key for list_cursor: nada");
blueslip.expect("error", "Cannot highlight key for ListCursor: nada");
cursor.go_to("nada");
cursor.prev();
@ -49,7 +49,7 @@ run_test("misc errors", () => {
run_test("single item list", () => {
const conf = basic_conf();
const cursor = list_cursor(conf);
const cursor = new ListCursor(conf);
const valid_key = "42";
const li_stub = {

6
static/js/activity.js
View File

@ -288,7 +288,7 @@ function keydown_enter_key() {
}
exports.set_cursor_and_filter = function () {
exports.user_cursor = list_cursor({
exports.user_cursor = new ListCursor({
list: buddy_list,
highlight_class: "highlighted_user",
});
@ -296,12 +296,12 @@ exports.set_cursor_and_filter = function () {
exports.user_filter = new UserSearch({
update_list: update_users_for_search,
reset_items: exports.reset_users,
on_focus: exports.user_cursor.reset,
on_focus: () => exports.user_cursor.reset(),
});
const $input = exports.user_filter.input_field();
$input.on("blur", exports.user_cursor.clear);
$input.on("blur", () => exports.user_cursor.clear());
keydown_util.handle({
elem: $input,

2
static/js/buddy_list.js
View File

@ -192,7 +192,7 @@ class BuddyList extends BuddyListConf {
const pos = this.keys.indexOf(key);
if (pos < 0) {
// TODO: See list_cursor.get_row() for why this is
// TODO: See ListCursor.get_row() for why this is
// a bit janky now.
return [];
}

2
static/js/global.d.ts vendored
View File

@ -6,6 +6,7 @@
declare let FetchStatus: any;
declare let Filter: any;
declare let LightboxCanvas: any;
declare let ListCursor: any;
declare let MessageListData: any;
declare let MessageListView: any;
declare let UserSearch: any;
@ -59,7 +60,6 @@ declare let input_pill: any;
declare let invite: any;
declare let keydown_util: any;
declare let lightbox: any;
declare let list_cursor: any;
declare let list_render: any;
declare let list_util: any;
declare let loading: any;

125
static/js/list_cursor.js
View File

@ -1,35 +1,38 @@
const list_cursor = function (opts) {
const self = {};
class ListCursor {
constructor({highlight_class, list}) {
const config_ok =
opts.highlight_class &&
opts.list &&
opts.list.scroll_container_sel &&
opts.list.find_li &&
opts.list.first_key &&
opts.list.prev_key &&
opts.list.next_key;
highlight_class &&
list &&
list.scroll_container_sel &&
list.find_li &&
list.first_key &&
list.prev_key &&
list.next_key;
if (!config_ok) {
blueslip.error("Programming error");
return;
}
self.clear = function () {
if (self.curr_key === undefined) {
this.highlight_class = highlight_class;
this.list = list;
}
clear() {
if (this.curr_key === undefined) {
return;
}
const row = self.get_row(self.curr_key);
const row = this.get_row(this.curr_key);
if (row) {
row.clear();
}
self.curr_key = undefined;
};
this.curr_key = undefined;
}
self.get_key = function () {
return self.curr_key;
};
get_key() {
return this.curr_key;
}
self.get_row = function (key) {
get_row(key) {
// TODO: The list class should probably do more of the work
// here, so we're not so coupled to jQuery, and
// so we instead just get back a widget we can say
@ -41,7 +44,7 @@ const list_cursor = function (opts) {
return;
}
const li = opts.list.find_li({
const li = this.list.find_li({
key,
force_render: true,
});
@ -51,91 +54,89 @@ const list_cursor = function (opts) {
}
return {
highlight() {
li.addClass(opts.highlight_class);
self.adjust_scroll(li);
highlight: () => {
li.addClass(this.highlight_class);
this.adjust_scroll(li);
},
clear() {
li.removeClass(opts.highlight_class);
clear: () => {
li.removeClass(this.highlight_class);
},
};
};
}
self.adjust_scroll = function (li) {
const scroll_container = $(opts.list.scroll_container_sel);
adjust_scroll(li) {
const scroll_container = $(this.list.scroll_container_sel);
scroll_util.scroll_element_into_container(li, scroll_container);
};
}
self.redraw = function () {
redraw() {
// We should only call this for situations like the buddy
// list where we redraw the whole list without necessarily
// changing it, so we just want to re-highlight the current
// row in the new DOM. If you are filtering, for now you
// should call the 'reset()' method.
const row = self.get_row(self.curr_key);
const row = this.get_row(this.curr_key);
if (row === undefined) {
return;
}
row.highlight();
};
}
self.go_to = function (key) {
go_to(key) {
if (key === undefined) {
blueslip.error("Caller is not checking keys for list_cursor.go_to");
blueslip.error("Caller is not checking keys for ListCursor.go_to");
return;
}
if (key === self.curr_key) {
if (key === this.curr_key) {
return;
}
self.clear();
const row = self.get_row(key);
this.clear();
const row = this.get_row(key);
if (row === undefined) {
blueslip.error("Cannot highlight key for list_cursor: " + key);
blueslip.error("Cannot highlight key for ListCursor: " + key);
return;
}
self.curr_key = key;
this.curr_key = key;
row.highlight();
};
}
self.reset = function () {
self.clear();
const key = opts.list.first_key();
reset() {
this.clear();
const key = this.list.first_key();
if (key === undefined) {
self.curr_key = undefined;
this.curr_key = undefined;
return;
}
self.go_to(key);
};
this.go_to(key);
}
self.prev = function () {
if (self.curr_key === undefined) {
prev() {
if (this.curr_key === undefined) {
return;
}
const key = opts.list.prev_key(self.curr_key);
const key = this.list.prev_key(this.curr_key);
if (key === undefined) {
// leave the current key
return;
}
self.go_to(key);
};
this.go_to(key);
}
self.next = function () {
if (self.curr_key === undefined) {
next() {
if (this.curr_key === undefined) {
// This is sort of a special case where we went from
// an empty filter to having data.
self.reset();
this.reset();
return;
}
const key = opts.list.next_key(self.curr_key);
const key = this.list.next_key(this.curr_key);
if (key === undefined) {
// leave the current key
return;
}
self.go_to(key);
};
return self;
};
module.exports = list_cursor;
window.list_cursor = list_cursor;
this.go_to(key);
}
}
module.exports = ListCursor;
window.ListCursor = ListCursor;

4
static/js/stream_list.js
View File

@ -509,7 +509,7 @@ exports.set_event_handlers = function () {
$(this).off("scroll");
});
exports.stream_cursor = list_cursor({
exports.stream_cursor = new ListCursor({
list: {
scroll_container_sel: "#stream-filters-container",
find_li(opts) {
@ -545,7 +545,7 @@ exports.set_event_handlers = function () {
});
$search_input.on("click", focus_stream_filter);
$search_input.on("focusout", exports.stream_cursor.clear);
$search_input.on("focusout", () => exports.stream_cursor.clear());
$search_input.on("input", update_streams_for_search);
};