diff --git a/static/js/compose.js b/static/js/compose.js index b74698cbe9..68ecda625f 100644 --- a/static/js/compose.js +++ b/static/js/compose.js @@ -11,6 +11,7 @@ import * as compose_fade from "./compose_fade"; import * as compose_state from "./compose_state"; import * as compose_ui from "./compose_ui"; import * as compose_validate from "./compose_validate"; +import * as composebox_typeahead from "./composebox_typeahead"; import * as echo from "./echo"; import * as giphy from "./giphy"; import {$t, $t_html} from "./i18n"; @@ -627,6 +628,46 @@ export function initialize() { } }); + let instance = null; + $("body").on("click", ".time_pick", (e) => { + e.preventDefault(); + e.stopPropagation(); + + let target_textarea; + let edit_message_id; + if ($(e.target).parents(".message_edit_form").length === 1) { + edit_message_id = rows.id($(e.target).parents(".message_row")); + target_textarea = $(`#edit_form_${CSS.escape(edit_message_id)} .message_edit_content`); + } + + if (instance === null) { + const on_timestamp_selection = (val) => { + const timestr = ` `; + compose_ui.insert_syntax_and_focus(timestr, target_textarea); + instance = null; + }; + + instance = composebox_typeahead.show_flatpickr( + $(e.target)[0], + on_timestamp_selection, + new Date(), + { + // place the time picker above the icon and centerize it horizontally + position: "above center", + }, + ); + + $(document).one("compose_canceled.zulip compose_finished.zulip", () => { + instance = null; + }); + return; + } + + instance.close(); + instance.destroy(); + instance = null; + }); + $("#compose").on("click", ".markdown_preview", (e) => { e.preventDefault(); const content = $("#compose-textarea").val(); diff --git a/static/js/composebox_typeahead.js b/static/js/composebox_typeahead.js index da5155f1e8..14b34f32b5 100644 --- a/static/js/composebox_typeahead.js +++ b/static/js/composebox_typeahead.js @@ -766,7 +766,7 @@ export function content_highlighter(item) { } } -const show_flatpickr = (element, callback, default_timestamp) => { +export function show_flatpickr(element, callback, default_timestamp, options = {}) { const flatpickr_input = $(""); const instance = flatpickr_input.flatpickr({ @@ -774,11 +774,13 @@ const show_flatpickr = (element, callback, default_timestamp) => { enableTime: true, clickOpens: false, defaultDate: default_timestamp, - plugins: [new ConfirmDatePlugin({})], + plugins: [new ConfirmDatePlugin({showAlways: true})], positionElement: element, dateFormat: "Z", formatDate: (date) => formatISO(date), + ...options, }); + const container = $($(instance.innerContainer).parent()); container.on("click", ".flatpickr-calendar", (e) => { e.stopPropagation(); @@ -792,7 +794,9 @@ const show_flatpickr = (element, callback, default_timestamp) => { }); instance.open(); container.find(".flatpickr-monthDropdown-months").trigger("focus"); -}; + + return instance; +} export function content_typeahead_selected(item, event) { const pieces = split_at_cursor(this.query, this.$element); diff --git a/static/templates/compose_control_buttons.hbs b/static/templates/compose_control_buttons.hbs index 367e5e0713..2a7125e90f 100644 --- a/static/templates/compose_control_buttons.hbs +++ b/static/templates/compose_control_buttons.hbs @@ -6,6 +6,7 @@ + diff --git a/tools/lib/capitalization.py b/tools/lib/capitalization.py index e146ad4a47..02f219ae30 100644 --- a/tools/lib/capitalization.py +++ b/tools/lib/capitalization.py @@ -105,6 +105,7 @@ IGNORED_PHRASES = [ 'API documentation?' ), r'Most stream administration is done on the Streams page.', + r"Add global time
Everyone sees global times in their own time zone.", r"one or more people...", r"confirmation email", r"invites remaining",