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

popover_menus: Extract popovers using tippy in a separate module.

Browse Source
This commit is contained in:
Aman Agrawal
2021-06-17 17:05:34 +00:00
committed by Tim Abbott
parent 563f8aba1e
commit 182f47b7c6
5 changed files with 91 additions and 85 deletions
Download Patch File Download Diff File Expand all files Collapse all files

82
static/js/tippyjs.js
View File

@@ -1,15 +1,8 @@
import $ from "jquery";
import tippy, {delegate} from "tippy.js";
import render_left_sidebar_stream_setting_popover from "../templates/left_sidebar_stream_setting_popover.hbs";
import render_mobile_message_buttons_popover_content from "../templates/mobile_message_buttons_popover_content.hbs";
import * as compose_actions from "./compose_actions";
import * as narrow_state from "./narrow_state";
import * as popovers from "./popovers";
import * as reactions from "./reactions";
import * as rows from "./rows";
import * as settings_data from "./settings_data";
// We override the defaults set by tippy library here,
// so make sure to check this too after checking tippyjs
@@ -42,17 +35,6 @@ tippy.setDefaultProps({
// in the tag or a parameter.
});
let left_sidebar_stream_setting_popover_displayed = false;
let compose_mobile_button_popover_displayed = false;
export function is_left_sidebar_stream_setting_popover_displayed() {
return left_sidebar_stream_setting_popover_displayed;
}
export function is_compose_mobile_button_popover_displayed() {
return compose_mobile_button_popover_displayed;
}
export function initialize() {
delegate("body", {
// Add elements here which are not displayed on
@@ -152,68 +134,4 @@ export function initialize() {
return true;
},
});
// ------------------ Popovers ----------------------------------------------
delegate("body", {
delay: 0,
target: "#streams_inline_cog",
onShow(instance) {
popovers.hide_all_except_sidebars(instance);
instance.setContent(
render_left_sidebar_stream_setting_popover({
can_create_streams: settings_data.user_can_create_streams(),
}),
);
left_sidebar_stream_setting_popover_displayed = true;
$(instance.popper).one("click", instance.hide);
},
appendTo: () => document.body,
trigger: "click",
allowHTML: true,
interactive: true,
hideOnClick: true,
theme: "light-border",
touch: true,
onHidden() {
left_sidebar_stream_setting_popover_displayed = false;
},
});
// compose box buttons popover shown on mobile widths.
delegate("body", {
target: ".compose_mobile_button",
placement: "top",
onShow(instance) {
popovers.hide_all_except_sidebars(instance);
instance.setContent(
render_mobile_message_buttons_popover_content({
is_in_private_narrow: narrow_state.narrowed_to_pms(),
}),
);
compose_mobile_button_popover_displayed = true;
const $popper = $(instance.popper);
$popper.one("click", instance.hide);
$popper.one("click", ".compose_mobile_stream_button", () => {
compose_actions.start("stream", {trigger: "new topic button"});
});
$popper.one("click", ".compose_mobile_private_button", () => {
compose_actions.start("private");
});
},
appendTo: () => document.body,
trigger: "click",
allowHTML: true,
interactive: true,
hideOnClick: true,
theme: "light-border",
touch: true,
onHidden(instance) {
// Destroy instance so that event handlers
// are destroyed too.
instance.destroy();
compose_mobile_button_popover_displayed = false;
},
});
}