paulmataruso/zulip
1
0
Fork 0
mirror of https://github.com/zulip/zulip.git synced 2025-11-11 09:27:43 +00:00
Code Issues Packages Projects Releases Wiki Activity

dropdown_widget: Refactor to use Class.

Browse Source
This commit is contained in:
Aman Agrawal
2023-07-19 19:39:53 +05:30
committed by Tim Abbott
parent d91d6d1fd1
commit 6efcb7a349
28 changed files with 363 additions and 305 deletions
Download Patch File Download Diff File Expand all files Collapse all files

45
web/src/compose_recipient.js
View File

@@ -165,9 +165,11 @@ function switch_message_type(message_type) {
function update_recipient_label(stream_name) {
const stream = stream_data.get_sub_by_name(stream_name);
if (stream === undefined) {
$("#compose_select_recipient_name").text($t({defaultMessage: "Select a stream"}));
$("#compose_select_recipient_widget .dropdown_widget_value").text(
$t({defaultMessage: "Select a stream"}),
);
} else {
$("#compose_select_recipient_name").html(
$("#compose_select_recipient_widget .dropdown_widget_value").html(
render_inline_decorated_stream_name({stream, show_colored_icon: true}),
);
}
@@ -192,7 +194,7 @@ export function update_compose_for_message_type(message_type, opts) {
// the "DM" button display string so we wouldn't have to manually change
// it here.
const direct_message_label = $t({defaultMessage: "DM"});
$("#compose_select_recipient_name").html(
$("#compose_select_recipient_widget .dropdown_widget_value").html(
`<i class="zulip-icon zulip-icon-users stream-privacy-type-icon"></i> ${direct_message_label}`,
);
}
@@ -216,7 +218,7 @@ export function on_compose_select_recipient_update() {
if (curr_message_type === "stream") {
// Update stream name in the recipient box.
const $stream_header_colorblock = $(
"#compose_recipient_selection_dropdown .stream_header_colorblock",
"#compose_select_recipient_widget_wrapper .stream_header_colorblock",
);
const stream_name = compose_state.stream_name();
update_recipient_label(stream_name);
@@ -270,7 +272,7 @@ function compose_recipient_dropdown_on_show(dropdown) {
const window_height = window.innerHeight;
const search_box_and_padding_height = 50;
// pixels above compose box.
const recipient_input_top = $("#compose_recipient_selection_dropdown").get_offset_to_window()
const recipient_input_top = $("#compose_select_recipient_widget_wrapper").get_offset_to_window()
.top;
const top_space = recipient_input_top - top_offset - search_box_and_padding_height;
// pixels below compose starting from top of compose box.
@@ -296,7 +298,7 @@ export function open_compose_recipient_dropdown() {
}
function focus_compose_recipient() {
$("#compose_recipient_selection_dropdown").trigger("focus");
$("#compose_select_recipient_widget_wrapper").trigger("focus");
}
// NOTE: Since tippy triggers this on `mousedown` it is always triggered before say a `click` on `textarea`.
@@ -316,28 +318,17 @@ function on_hidden_callback() {
}
export function initialize() {
dropdown_widget.setup(
{
target: "#compose_select_recipient_widget",
},
get_options_for_recipient_widget,
new dropdown_widget.DropdownWidget({
widget_name: "compose_select_recipient",
get_options: get_options_for_recipient_widget,
item_click_callback,
{
on_show_callback: compose_recipient_dropdown_on_show,
on_exit_with_escape_callback: focus_compose_recipient,
// We want to focus on topic box if dropdown was closed via selecting an item.
focus_target_on_hidden: false,
on_hidden_callback,
},
);
$("#compose_recipient_selection_dropdown").on("keydown", (e) => {
if (e.key === "Enter") {
open_compose_recipient_dropdown();
e.stopPropagation();
e.preventDefault();
}
});
$events_container: $("body"),
on_show_callback: compose_recipient_dropdown_on_show,
on_exit_with_escape_callback: focus_compose_recipient,
// We want to focus on topic box if dropdown was closed via selecting an item.
focus_target_on_hidden: false,
on_hidden_callback,
}).setup();
// `keyup` isn't relevant for streams since it registers as a change only
// when an item in the dropdown is selected.