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

confirm_dialog: Add support for loading spinner.

This commit is contained in:
Ganesh Pawar 2021-05-09 12:59:16 +05:30 committed by Tim Abbott
parent 4ed643ab8c
commit 1afcc98be2
3 changed files with 23 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
static/js/confirm_dialog.js
View File

@ -4,6 +4,7 @@ import render_confirm_dialog from "../templates/confirm_dialog.hbs";
import render_confirm_dialog_heading from "../templates/confirm_dialog_heading.hbs"; import render_confirm_dialog_heading from "../templates/confirm_dialog_heading.hbs";
import * as blueslip from "./blueslip"; import * as blueslip from "./blueslip";
import * as loading from "./loading";
import * as overlays from "./overlays"; import * as overlays from "./overlays";
/* /*
@ -29,8 +30,23 @@ import * as overlays from "./overlays";
only ever have one confirm dialog active at any only ever have one confirm dialog active at any
time. time.
6) If a modal wants a loading spinner, it should pass loading_spinner: true
and manage the spinner via calling the functions hide_confirm_dialog_spinner
and show_confirm_dialog_spinner via its callback hooks.
*/ */
export function hide_confirm_dialog_spinner() {
const spinner = $("#confirm_dialog_spinner");
loading.destroy_indicator(spinner);
$("#confirm_dialog_modal > div.modal-footer > button").show();
}
export function show_confirm_dialog_spinner() {
const spinner = $("#confirm_dialog_spinner");
$("#confirm_dialog_modal > div.modal-footer > button").hide();
loading.make_indicator(spinner);
}
export function launch(conf) { export function launch(conf) {
const html = render_confirm_dialog({fade: conf.fade}); const html = render_confirm_dialog({fade: conf.fade});
const confirm_dialog = $(html); const confirm_dialog = $(html);
@ -74,7 +90,11 @@ export function launch(conf) {
// Set up handlers. // Set up handlers.
yes_button.on("click", () => { yes_button.on("click", () => {
overlays.close_modal("#confirm_dialog_modal"); if (conf.loading_spinner) {
show_confirm_dialog_spinner();
} else {
overlays.close_modal("#confirm_dialog_modal");
}
conf.on_click(); conf.on_click();
}); });

2
static/styles/zulip.css
View File

@ -2342,7 +2342,7 @@ div.topic_edit_spinner .loading_indicator_spinner {
} }
.topic_move_spinner, .topic_move_spinner,
#do_delete_message_spinner { #confirm_dialog_spinner {
margin: 0 auto; margin: 0 auto;
} }

1
static/templates/confirm_dialog.hbs
View File

@ -8,5 +8,6 @@
<div class="modal-footer"> <div class="modal-footer">
<button class="button rounded close-modal-btn" data-dismiss="modal">{{t "Cancel" }}</button> <button class="button rounded close-modal-btn" data-dismiss="modal">{{t "Cancel" }}</button>
<button class="button rounded btn-danger confirm_dialog_yes_button"></button> <button class="button rounded btn-danger confirm_dialog_yes_button"></button>
<div id="confirm_dialog_spinner"></div>
</div> </div>
</div> </div>