paulmataruso/zulip
1
0
Fork 0
mirror of https://github.com/zulip/zulip.git synced 2025-10-24 16:43:57 +00:00
Code Issues Packages Projects Releases Wiki Activity

emoji: Add support for using emoji picker in message edit.

Browse Source 
This code will correctly render emoji to the message textarea based on
whether emoji was selected from message composition form or message
edit form.

Fixes part of #11188.
This commit is contained in:
Abhinav Singh
2019-01-15 13:46:59 +05:30
committed by Tim Abbott
parent a92a5f19f0
commit e6493ef0c8
2 changed files with 24 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

25
static/js/emoji_picker.js
View File

@@ -22,6 +22,7 @@ var current_index = 0;
var search_is_active = false;
var search_results = [];
var section_head_offsets = [];
var edit_message_id = null;
function get_all_emoji_categories() {
return [
@@ -644,14 +645,34 @@ exports.register_click_handlers = function () {
$(document).on('click', '.emoji-popover-emoji.composition', function (e) {
var emoji_name = $(this).data("emoji-name");
var emoji_text = ':' + emoji_name + ':';
compose_ui.insert_syntax_and_focus(emoji_text);
// The following check will return false if emoji was not selected in
// message edit form.
if (edit_message_id !== null) {
var edit_message_textarea = $("#message_edit_content_" + edit_message_id);
// Assign null to edit_message_id so that the selection of emoji in new
// message composition form works correctly.
edit_message_id = null;
compose_ui.insert_syntax_and_focus(emoji_text, edit_message_textarea);
} else {
compose_ui.insert_syntax_and_focus(emoji_text);
}
e.stopPropagation();
emoji_picker.hide_emoji_popover();
});
$("#compose").on("click", "#emoji_map", function (e) {
$("body").on("click", "#emoji_map", function (e) {
e.preventDefault();
e.stopPropagation();
// The data-message-id atribute is only present in the emoji icon present in
// the message edit form. So the following check will return false if this
// event was not fired from message edit form.
if ($(this).attr("data-message-id") !== undefined) {
// Store data-message-id value in global variable edit_message_id so that
// its value can be further used to correclty find the message textarea element.
edit_message_id = $(this).attr("data-message-id");
} else {
edit_message_id = null;
}
emoji_picker.toggle_emoji_popover(this);
});

1
static/templates/message_edit_form.handlebars
View File

@@ -40,6 +40,7 @@
<input type="file" id="message_edit_file_input_{{message_id}}" class="notvisible pull-left" multiple />
<a class="message-control-button fa fa-font" aria-hidden="true" title="{{t 'Formatting' }}" data-overlay-trigger="message-formatting" ></a>
<a class="message-control-button fa fa-paperclip notdisplayed" aria-hidden="true" id="attach_files_{{message_id}}" href="#" title="{{t "Attach files" }}"></a>
<a class="message-control-button fa fa-smile-o" aria-hidden="true" id="emoji_map" href="#" data-message-id="{{message_id}}" title="{{t 'Add emoji' }}"></a>
</div>
<div class="message-edit-timer-control-group">
<span class="message_edit_countdown_timer"></span>