mirror of
https://github.com/ether/etherpad-lite.git
synced 2025-02-01 03:12:42 +01:00
pad_editbar: Convert bodyKeyEvent()
into a method
This commit is contained in:
parent
b2fe6e3e7e
commit
11faf6104a
1 changed files with 57 additions and 57 deletions
|
@ -126,6 +126,8 @@ const padeditbar = (() => {
|
||||||
const syncAnimation = syncAnimationFn();
|
const syncAnimation = syncAnimationFn();
|
||||||
|
|
||||||
const self = {
|
const self = {
|
||||||
|
_editbarPosition: 0,
|
||||||
|
|
||||||
init() {
|
init() {
|
||||||
this.dropdowns = [];
|
this.dropdowns = [];
|
||||||
|
|
||||||
|
@ -139,7 +141,7 @@ const padeditbar = (() => {
|
||||||
});
|
});
|
||||||
|
|
||||||
$('body:not(#editorcontainerbox)').on('keydown', (evt) => {
|
$('body:not(#editorcontainerbox)').on('keydown', (evt) => {
|
||||||
bodyKeyEvent(evt);
|
this._bodyKeyEvent(evt);
|
||||||
});
|
});
|
||||||
|
|
||||||
$('.show-more-icon-btn').click(() => {
|
$('.show-more-icon-btn').click(() => {
|
||||||
|
@ -294,71 +296,69 @@ const padeditbar = (() => {
|
||||||
$('.toolbar').addClass('cropped');
|
$('.toolbar').addClass('cropped');
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
};
|
|
||||||
|
|
||||||
let editbarPosition = 0;
|
_bodyKeyEvent(evt) {
|
||||||
|
// If the event is Alt F9 or Escape & we're already in the editbar menu
|
||||||
const bodyKeyEvent = (evt) => {
|
// Send the users focus back to the pad
|
||||||
// If the event is Alt F9 or Escape & we're already in the editbar menu
|
if ((evt.keyCode === 120 && evt.altKey) || evt.keyCode === 27) {
|
||||||
// Send the users focus back to the pad
|
if ($(':focus').parents('.toolbar').length === 1) {
|
||||||
if ((evt.keyCode === 120 && evt.altKey) || evt.keyCode === 27) {
|
// If we're in the editbar already..
|
||||||
if ($(':focus').parents('.toolbar').length === 1) {
|
// Close any dropdowns we have open..
|
||||||
// If we're in the editbar already..
|
this.toggleDropDown('none');
|
||||||
// Close any dropdowns we have open..
|
// Check we're on a pad and not on the timeslider
|
||||||
padeditbar.toggleDropDown('none');
|
// Or some other window I haven't thought about!
|
||||||
// Check we're on a pad and not on the timeslider
|
if (typeof pad === 'undefined') {
|
||||||
// Or some other window I haven't thought about!
|
// Timeslider probably..
|
||||||
if (typeof pad === 'undefined') {
|
// Shift focus away from any drop downs
|
||||||
// Timeslider probably..
|
$(':focus').blur(); // required to do not try to remove!
|
||||||
// Shift focus away from any drop downs
|
$('#editorcontainerbox').focus(); // Focus back onto the pad
|
||||||
$(':focus').blur(); // required to do not try to remove!
|
} else {
|
||||||
$('#editorcontainerbox').focus(); // Focus back onto the pad
|
// Shift focus away from any drop downs
|
||||||
|
$(':focus').blur(); // required to do not try to remove!
|
||||||
|
padeditor.ace.focus(); // Sends focus back to pad
|
||||||
|
// The above focus doesn't always work in FF, you have to hit enter afterwards
|
||||||
|
evt.preventDefault();
|
||||||
|
}
|
||||||
} else {
|
} else {
|
||||||
// Shift focus away from any drop downs
|
// Focus on the editbar :)
|
||||||
$(':focus').blur(); // required to do not try to remove!
|
const firstEditbarElement = parent.parent.$('#editbar button').first();
|
||||||
padeditor.ace.focus(); // Sends focus back to pad
|
|
||||||
// The above focus doesn't always work in FF, you have to hit enter afterwards
|
$(evt.currentTarget).blur();
|
||||||
|
firstEditbarElement.focus();
|
||||||
evt.preventDefault();
|
evt.preventDefault();
|
||||||
}
|
}
|
||||||
} else {
|
|
||||||
// Focus on the editbar :)
|
|
||||||
const firstEditbarElement = parent.parent.$('#editbar button').first();
|
|
||||||
|
|
||||||
$(evt.currentTarget).blur();
|
|
||||||
firstEditbarElement.focus();
|
|
||||||
evt.preventDefault();
|
|
||||||
}
|
}
|
||||||
}
|
// Are we in the toolbar??
|
||||||
// Are we in the toolbar??
|
if ($(':focus').parents('.toolbar').length === 1) {
|
||||||
if ($(':focus').parents('.toolbar').length === 1) {
|
// On arrow keys go to next/previous button item in editbar
|
||||||
// On arrow keys go to next/previous button item in editbar
|
if (evt.keyCode !== 39 && evt.keyCode !== 37) return;
|
||||||
if (evt.keyCode !== 39 && evt.keyCode !== 37) return;
|
|
||||||
|
|
||||||
// Get all the focusable items in the editbar
|
// Get all the focusable items in the editbar
|
||||||
const focusItems = $('#editbar').find('button, select');
|
const focusItems = $('#editbar').find('button, select');
|
||||||
|
|
||||||
// On left arrow move to next button in editbar
|
// On left arrow move to next button in editbar
|
||||||
if (evt.keyCode === 37) {
|
if (evt.keyCode === 37) {
|
||||||
// If a dropdown is visible or we're in an input don't move to the next button
|
// If a dropdown is visible or we're in an input don't move to the next button
|
||||||
if ($('.popup').is(':visible') || evt.target.localName === 'input') return;
|
if ($('.popup').is(':visible') || evt.target.localName === 'input') return;
|
||||||
|
|
||||||
editbarPosition--;
|
this._editbarPosition--;
|
||||||
// Allow focus to shift back to end of row and start of row
|
// Allow focus to shift back to end of row and start of row
|
||||||
if (editbarPosition === -1) editbarPosition = focusItems.length - 1;
|
if (this._editbarPosition === -1) this._editbarPosition = focusItems.length - 1;
|
||||||
$(focusItems[editbarPosition]).focus();
|
$(focusItems[this._editbarPosition]).focus();
|
||||||
|
}
|
||||||
|
|
||||||
|
// On right arrow move to next button in editbar
|
||||||
|
if (evt.keyCode === 39) {
|
||||||
|
// If a dropdown is visible or we're in an input don't move to the next button
|
||||||
|
if ($('.popup').is(':visible') || evt.target.localName === 'input') return;
|
||||||
|
|
||||||
|
this._editbarPosition++;
|
||||||
|
// Allow focus to shift back to end of row and start of row
|
||||||
|
if (this._editbarPosition >= focusItems.length) this._editbarPosition = 0;
|
||||||
|
$(focusItems[this._editbarPosition]).focus();
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
},
|
||||||
// On right arrow move to next button in editbar
|
|
||||||
if (evt.keyCode === 39) {
|
|
||||||
// If a dropdown is visible or we're in an input don't move to the next button
|
|
||||||
if ($('.popup').is(':visible') || evt.target.localName === 'input') return;
|
|
||||||
|
|
||||||
editbarPosition++;
|
|
||||||
// Allow focus to shift back to end of row and start of row
|
|
||||||
if (editbarPosition >= focusItems.length) editbarPosition = 0;
|
|
||||||
$(focusItems[editbarPosition]).focus();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
};
|
};
|
||||||
|
|
||||||
const aceAttributeCommand = (cmd, ace) => {
|
const aceAttributeCommand = (cmd, ace) => {
|
||||||
|
|
Loading…
Reference in a new issue