mirror of
https://github.com/zulip/zulip.git
synced 2025-11-06 06:53:25 +00:00
143db56992
Earlier the `/poll` slash command was the only way to create polls. To increase user friendliness with a GUI, a button to launch a modal to create a poll, has been added to the compose box. This button is enabled only when the compose box is empty, to avoid complexities with losing / having to save as draft any message already being composed. The modal has a form which on submission frames a message using the `/poll` syntax and the data input in the form, and sets the content of the compose box to that message, which the user can then send. The question field is mandatory for form submission. Fixes: #20304.
69 lines
2.4 KiB
JavaScript
69 lines
2.4 KiB
JavaScript
import $ from "jquery";
|
|
import {Sortable} from "sortablejs";
|
|
|
|
import render_poll_modal_option from "../templates/poll_modal_option.hbs";
|
|
|
|
function create_option_row($last_option_row_input) {
|
|
const row = render_poll_modal_option();
|
|
const $row_container = $last_option_row_input.closest(".simplebar-content");
|
|
$row_container.append(row);
|
|
}
|
|
|
|
function add_option_row(e) {
|
|
// if the option triggering the input event e is not the last,
|
|
// that is, its next sibling has the class `option-row`, we
|
|
// do not add a new option row and return from this function
|
|
// This handles a case when the next empty input row is already
|
|
// added and user is updating the above row(s).
|
|
if ($(e.target).closest(".option-row").next().hasClass("option-row")) {
|
|
return;
|
|
}
|
|
create_option_row($(e.target));
|
|
}
|
|
|
|
function delete_option_row(e) {
|
|
const $row = $(e.target).closest(".option-row");
|
|
$row.remove();
|
|
}
|
|
|
|
export function poll_options_setup() {
|
|
const $poll_options_list = $("#add-poll-form .poll-options-list");
|
|
const $submit_button = $("#add-poll-modal .dialog_submit_button");
|
|
const $question_input = $("#add-poll-form #poll-question-input");
|
|
|
|
// Disable the submit button if the question is empty.
|
|
$submit_button.prop("disabled", true);
|
|
$question_input.on("input", () => {
|
|
if ($question_input.val().trim() !== "") {
|
|
$submit_button.prop("disabled", false);
|
|
} else {
|
|
$submit_button.prop("disabled", true);
|
|
}
|
|
});
|
|
|
|
$poll_options_list.on("input", "input.poll-option-input", add_option_row);
|
|
$poll_options_list.on("click", "button.delete-option", delete_option_row);
|
|
|
|
// setTimeout is needed to here to give time for simplebar to initialise
|
|
setTimeout(() => {
|
|
Sortable.create($("#add-poll-form .poll-options-list .simplebar-content")[0], {
|
|
onUpdate() {},
|
|
// We don't want the last (empty) row to be draggable, as a new row
|
|
// is added on input event of the last row.
|
|
filter: "input, .option-row:last-child",
|
|
preventOnFilter: false,
|
|
});
|
|
}, 0);
|
|
}
|
|
|
|
export function frame_poll_message_content() {
|
|
const question = $("#poll-question-input").val().trim();
|
|
const options = $(".poll-option-input")
|
|
.map(function () {
|
|
return $(this).val().trim();
|
|
})
|
|
.toArray()
|
|
.filter(Boolean);
|
|
return "/poll " + question + "\n" + options.join("\n");
|
|
}
|