mirror of https://github.com/zulip/zulip.git
compose: Fix recent autocomplete regression.
As part of giving the stream/topic fields in the compose box longer ids, I broke the autocomplete code that handles re-focusing the cursor after a user hits enter. The worst symptom of this was that we tried to send a message before compose finished (although it wouldn't fully deliver the message). The new code should be a bit easier to grep for if we rename these fields again, as we explicitly use selector syntax.
This commit is contained in:
parent
ca22302763
commit
72576b3a77
|
@ -828,7 +828,7 @@ run_test('initialize', () => {
|
||||||
var event = {
|
var event = {
|
||||||
keyCode: 13,
|
keyCode: 13,
|
||||||
target: {
|
target: {
|
||||||
id: 'stream',
|
id: 'stream_message_recipient_stream',
|
||||||
},
|
},
|
||||||
preventDefault: noop,
|
preventDefault: noop,
|
||||||
};
|
};
|
||||||
|
@ -872,7 +872,7 @@ run_test('initialize', () => {
|
||||||
$('#compose-textarea').caret = noop;
|
$('#compose-textarea').caret = noop;
|
||||||
|
|
||||||
event.keyCode = 13;
|
event.keyCode = 13;
|
||||||
event.target.id = 'subject';
|
event.target.id = 'stream_message_recipient_topic';
|
||||||
$('form#send_message_form').keydown(event);
|
$('form#send_message_form').keydown(event);
|
||||||
event.target.id = 'compose-textarea';
|
event.target.id = 'compose-textarea';
|
||||||
page_params.enter_sends = false;
|
page_params.enter_sends = false;
|
||||||
|
@ -909,7 +909,7 @@ run_test('initialize', () => {
|
||||||
event = {
|
event = {
|
||||||
keyCode: 13,
|
keyCode: 13,
|
||||||
target: {
|
target: {
|
||||||
id: 'stream',
|
id: 'stream_message_recipient_stream',
|
||||||
},
|
},
|
||||||
preventDefault: noop,
|
preventDefault: noop,
|
||||||
};
|
};
|
||||||
|
|
|
@ -115,31 +115,42 @@ function handle_keydown(e) {
|
||||||
var code = e.keyCode || e.which;
|
var code = e.keyCode || e.which;
|
||||||
|
|
||||||
if (code === 13 || code === 9 && !e.shiftKey) { // Enter key or tab key
|
if (code === 13 || code === 9 && !e.shiftKey) { // Enter key or tab key
|
||||||
if (e.target.id === "stream" || e.target.id === "subject" || e.target.id === "private_message_recipient") {
|
var target_sel;
|
||||||
|
|
||||||
|
if (e.target.id) {
|
||||||
|
target_sel = '#' + e.target.id;
|
||||||
|
}
|
||||||
|
|
||||||
|
var on_stream = target_sel === "#stream_message_recipient_stream";
|
||||||
|
var on_topic = target_sel === "#stream_message_recipient_topic";
|
||||||
|
var on_pm = target_sel === "#private_message_recipient";
|
||||||
|
var on_compose = target_sel === '#compose-textarea';
|
||||||
|
|
||||||
|
if (on_stream || on_topic || on_pm) {
|
||||||
// For enter, prevent the form from submitting
|
// For enter, prevent the form from submitting
|
||||||
// For tab, prevent the focus from changing again
|
// For tab, prevent the focus from changing again
|
||||||
e.preventDefault();
|
e.preventDefault();
|
||||||
}
|
}
|
||||||
|
|
||||||
// In the compose_textarea box, preventDefault() for tab but not for enter
|
// In the compose_textarea box, preventDefault() for tab but not for enter
|
||||||
if (e.target.id === 'compose-textarea' && code !== 13) {
|
if (on_compose && code !== 13) {
|
||||||
e.preventDefault();
|
e.preventDefault();
|
||||||
}
|
}
|
||||||
|
|
||||||
if (e.target.id === "stream") {
|
if (on_stream) {
|
||||||
nextFocus = "subject";
|
nextFocus = "#stream_message_recipient_topic";
|
||||||
} else if (e.target.id === "subject") {
|
} else if (on_topic) {
|
||||||
if (code === 13) {
|
if (code === 13) {
|
||||||
e.preventDefault();
|
e.preventDefault();
|
||||||
}
|
}
|
||||||
nextFocus = 'compose-textarea';
|
nextFocus = '#compose-textarea';
|
||||||
} else if (e.target.id === "private_message_recipient") {
|
} else if (on_pm) {
|
||||||
nextFocus = 'compose-textarea';
|
nextFocus = '#compose-textarea';
|
||||||
} else if (e.target.id === 'compose-textarea') {
|
} else if (on_compose) {
|
||||||
if (code === 13) {
|
if (code === 13) {
|
||||||
nextFocus = false;
|
nextFocus = false;
|
||||||
} else {
|
} else {
|
||||||
nextFocus = "compose-send-button";
|
nextFocus = "#compose-send-button";
|
||||||
}
|
}
|
||||||
} else {
|
} else {
|
||||||
nextFocus = false;
|
nextFocus = false;
|
||||||
|
@ -159,11 +170,11 @@ function handle_keydown(e) {
|
||||||
// takes the typeaheads a little time to open after the user finishes typing, which
|
// takes the typeaheads a little time to open after the user finishes typing, which
|
||||||
// can lead to the focus moving without the autocomplete having a chance to happen.
|
// can lead to the focus moving without the autocomplete having a chance to happen.
|
||||||
if (nextFocus) {
|
if (nextFocus) {
|
||||||
ui_util.focus_on(nextFocus);
|
$(nextFocus).focus();
|
||||||
nextFocus = false;
|
nextFocus = false;
|
||||||
}
|
}
|
||||||
|
|
||||||
if (e.target.id === 'compose-textarea' && code === 13) {
|
if (on_compose && code === 13) {
|
||||||
var has_non_shift_modifier_key = e.ctrlKey || e.metaKey || e.altKey;
|
var has_non_shift_modifier_key = e.ctrlKey || e.metaKey || e.altKey;
|
||||||
var has_modifier_key = e.shiftKey || has_non_shift_modifier_key;
|
var has_modifier_key = e.shiftKey || has_non_shift_modifier_key;
|
||||||
var this_enter_sends;
|
var this_enter_sends;
|
||||||
|
@ -230,7 +241,7 @@ function handle_keyup(e) {
|
||||||
var code = e.keyCode || e.which;
|
var code = e.keyCode || e.which;
|
||||||
if (code === 13 || code === 9 && !e.shiftKey) { // Enter key or tab key
|
if (code === 13 || code === 9 && !e.shiftKey) { // Enter key or tab key
|
||||||
if (nextFocus) {
|
if (nextFocus) {
|
||||||
ui_util.focus_on(nextFocus);
|
$(nextFocus).focus();
|
||||||
nextFocus = false;
|
nextFocus = false;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -9,16 +9,6 @@ exports.change_tab_to = function (tabname) {
|
||||||
$('#gear-menu a[href="' + tabname + '"]').tab('show');
|
$('#gear-menu a[href="' + tabname + '"]').tab('show');
|
||||||
};
|
};
|
||||||
|
|
||||||
exports.focus_on = function (field_id) {
|
|
||||||
// Call after autocompleting on a field, to advance the focus to
|
|
||||||
// the next input field.
|
|
||||||
|
|
||||||
// Bootstrap's typeahead does not expose a callback for when an
|
|
||||||
// autocomplete selection has been made, so we have to do this
|
|
||||||
// manually.
|
|
||||||
$("#" + field_id).focus();
|
|
||||||
};
|
|
||||||
|
|
||||||
// http://stackoverflow.com/questions/4233265/contenteditable-set-caret-at-the-end-of-the-text-cross-browser
|
// http://stackoverflow.com/questions/4233265/contenteditable-set-caret-at-the-end-of-the-text-cross-browser
|
||||||
exports.place_caret_at_end = function (el) {
|
exports.place_caret_at_end = function (el) {
|
||||||
el.focus();
|
el.focus();
|
||||||
|
|
Loading…
Reference in New Issue