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

Fix keyboard handling for info overlays. 

For info overlays (keyboard/markdown/search help) we now let
the modal portions of the widget have focus, so that you can
page around.  And then tab switching still works with the arrow
keys.
This commit is contained in:
Steve Howell 2018-04-04 11:01:34 -04:00 committed by Tim Abbott
parent bd591424e2
commit 0e7073ec29
2 changed files with 31 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
static/js/components.js
View File

@ -62,7 +62,10 @@ exports.toggle = (function () {
}
meta.idx = idx;
elem.focus();
if (!opts.child_wants_focus) {
elem.focus();
}
}
function maybe_go_left() {
@ -99,6 +102,9 @@ exports.toggle = (function () {
}());
var prototype = {
maybe_go_left: maybe_go_left,
maybe_go_right: maybe_go_right,
value: function () {
if (meta.idx >= 0) {
return opts.values[meta.idx].label;

28
static/js/info_overlay.js
View File

@ -22,9 +22,10 @@ function adjust_mac_shortcuts() {
}
function _setup_info_overlay() {
var info_overlay_toggle = components.toggle({
var opts = {
name: "info-overlay-toggle",
selected: 0,
child_wants_focus: true,
values: [
{ label: i18n.t("Keyboard shortcuts"), key: "keyboard-shortcuts" },
{ label: i18n.t("Message formatting"), key: "markdown-help" },
@ -35,10 +36,29 @@ function _setup_info_overlay() {
$("#" + key).show();
$("#" + key).find(".modal-body").focus();
},
}).get();
};
$(".informational-overlays .overlay-tabs")
.append($(info_overlay_toggle).addClass("large"));
var toggler = components.toggle(opts);
var elem = toggler.get();
elem.addClass('large');
var modals = _.map(opts.values, function (item) {
var key = item.key; // e.g. markdown-help
var modal = $('#' + key).find('.modal-body');
return modal;
});
_.each(modals, function (modal) {
keydown_util.handle({
elem: modal,
handlers: {
left_arrow: toggler.maybe_go_left,
right_arrow: toggler.maybe_go_right,
},
});
});
$(".informational-overlays .overlay-tabs").append(elem);
if (/Mac/i.test(navigator.userAgent)) {
adjust_mac_shortcuts();