mirror of
https://gerrit.wikimedia.org/r/mediawiki/extensions/WikiEditor
synced 2024-11-23 15:57:15 +00:00
Convert more functions to arrow callbacks
Change-Id: I983e2c774fe8cdfebbb8de28adbb00b744dc11d8
This commit is contained in:
parent
c56593d4c6
commit
f922f8e861
|
@ -12,10 +12,10 @@ const toolbarModule = require( './jquery.wikiEditor.toolbar.js' ),
|
|||
insertLinkLinkTypeField = new LinkTypeField(),
|
||||
configData = require( './data.json' );
|
||||
|
||||
function triggerButtonClick( element ) {
|
||||
function triggerButtonClick( $element ) {
|
||||
// The dialog action should always be a DOMElement.
|
||||
const dialogAction = $( element ).data( 'dialogaction' );
|
||||
const $button = dialogAction ? $( dialogAction ) : $( element ).find( 'button' ).first();
|
||||
const dialogAction = $element.data( 'dialogaction' );
|
||||
const $button = dialogAction ? $( dialogAction ) : $element.find( 'button' ).first();
|
||||
// Since we're reading from data attribute, make sure we got an element before clicking.
|
||||
// Note when closing a dialog this can be false leading to TypeError: $button.trigger is not a function
|
||||
// (T261529)
|
||||
|
@ -326,17 +326,18 @@ module.exports = {
|
|||
$( this ).data( 'dialogkeypressset', true );
|
||||
// Execute the action associated with the first button
|
||||
// when the user presses Enter
|
||||
$( this ).closest( '.ui-dialog' ).on( 'keypress', function ( e ) {
|
||||
const $dialog = $( this ).closest( '.ui-dialog' );
|
||||
$dialog.on( 'keypress', ( e ) => {
|
||||
if ( ( e.keyCode || e.which ) === 13 ) {
|
||||
triggerButtonClick( this );
|
||||
triggerButtonClick( $dialog );
|
||||
e.preventDefault();
|
||||
}
|
||||
} );
|
||||
|
||||
// Make tabbing to a button and pressing
|
||||
// Enter do what people expect
|
||||
$( this ).closest( '.ui-dialog' ).find( 'button' ).on( 'focus', function () {
|
||||
$( this ).closest( '.ui-dialog' ).data( 'dialogaction', this );
|
||||
$dialog.find( 'button' ).on( 'focus', ( e ) => {
|
||||
$dialog.data( 'dialogaction', e.delegateTarget );
|
||||
} );
|
||||
}
|
||||
}
|
||||
|
@ -370,10 +371,11 @@ module.exports = {
|
|||
const altHelpText = mw.msg( 'wikieditor-toolbar-file-alt-help' );
|
||||
const altHelpLabel = mw.msg( 'wikieditor-toolbar-file-alt-help-label' );
|
||||
// Expandable help message for 'alt text' field
|
||||
$( this ).find( '.wikieditor-toolbar-file-alt-help' ).text( altHelpLabel );
|
||||
$( '.wikieditor-toolbar-file-alt-help' ).on( 'click', function () {
|
||||
$( this ).text( ( i, text ) => text === altHelpLabel ? altHelpText : altHelpLabel );
|
||||
} );
|
||||
const $altHelp = $( this ).find( '.wikieditor-toolbar-file-alt-help' )
|
||||
.text( altHelpLabel )
|
||||
.on( 'click', () => {
|
||||
$altHelp.text( ( i, text ) => text === altHelpLabel ? altHelpText : altHelpLabel );
|
||||
} );
|
||||
|
||||
// Preload modules of file upload dialog.
|
||||
mw.loader.load( [
|
||||
|
@ -571,17 +573,18 @@ module.exports = {
|
|||
$( this ).data( 'dialogkeypressset', true );
|
||||
// Execute the action associated with the first button
|
||||
// when the user presses Enter
|
||||
$( this ).closest( '.ui-dialog' ).on( 'keypress', function ( e ) {
|
||||
const $dialog = $( this ).closest( '.ui-dialog' );
|
||||
$dialog.on( 'keypress', ( e ) => {
|
||||
if ( e.which === 13 ) {
|
||||
triggerButtonClick( this );
|
||||
triggerButtonClick( $dialog );
|
||||
e.preventDefault();
|
||||
}
|
||||
} );
|
||||
|
||||
// Make tabbing to a button and pressing
|
||||
// Enter do what people expect
|
||||
$( this ).closest( '.ui-dialog' ).find( 'button' ).on( 'focus', function () {
|
||||
$( this ).closest( '.ui-dialog' ).data( 'dialogaction', this );
|
||||
$dialog.find( 'button' ).on( 'focus', ( e ) => {
|
||||
$dialog.data( 'dialogaction', e.delegateTarget );
|
||||
} );
|
||||
}
|
||||
}
|
||||
|
@ -736,17 +739,18 @@ module.exports = {
|
|||
$( this ).data( 'dialogkeypressset', true );
|
||||
// Execute the action associated with the first button
|
||||
// when the user presses Enter
|
||||
$( this ).closest( '.ui-dialog' ).on( 'keypress', function ( e ) {
|
||||
const $dialog = $( this ).closest( '.ui-dialog' );
|
||||
$dialog.on( 'keypress', ( e ) => {
|
||||
if ( ( e.keyCode || e.which ) === 13 ) {
|
||||
triggerButtonClick( this );
|
||||
triggerButtonClick( $dialog );
|
||||
e.preventDefault();
|
||||
}
|
||||
} );
|
||||
|
||||
// Make tabbing to a button and pressing
|
||||
// Enter do what people expect
|
||||
$( this ).closest( '.ui-dialog' ).find( 'button' ).on( 'focus', function () {
|
||||
$( this ).closest( '.ui-dialog' ).data( 'dialogaction', this );
|
||||
$dialog.find( 'button' ).on( 'focus', ( e ) => {
|
||||
$dialog.data( 'dialogaction', e.delegateTarget );
|
||||
} );
|
||||
}
|
||||
}
|
||||
|
@ -763,7 +767,7 @@ module.exports = {
|
|||
} );
|
||||
|
||||
// TODO: Find a cleaner way to share this function
|
||||
$( this ).data( 'replaceCallback', function ( mode ) {
|
||||
$( this ).data( 'replaceCallback', ( mode ) => {
|
||||
$( '#wikieditor-toolbar-replace-nomatch, #wikieditor-toolbar-replace-success, #wikieditor-toolbar-replace-emptysearch, #wikieditor-toolbar-replace-invalidregex' ).hide();
|
||||
|
||||
// Search string cannot be empty
|
||||
|
@ -910,31 +914,32 @@ module.exports = {
|
|||
let that = this;
|
||||
$( this ).data( { offset: 0, matchIndex: 0 } );
|
||||
|
||||
const $dialog = $( this ).closest( '.ui-dialog' );
|
||||
$( '#wikieditor-toolbar-replace-search' ).trigger( 'focus' );
|
||||
$( '#wikieditor-toolbar-replace-nomatch, #wikieditor-toolbar-replace-success, #wikieditor-toolbar-replace-emptysearch, #wikieditor-toolbar-replace-invalidregex' ).hide();
|
||||
if ( !( $( this ).data( 'onetimeonlystuff' ) ) ) {
|
||||
$( this ).data( 'onetimeonlystuff', true );
|
||||
// Execute the action associated with the first button
|
||||
// when the user presses Enter
|
||||
$( this ).closest( '.ui-dialog' ).on( 'keypress', function ( e ) {
|
||||
$dialog.on( 'keypress', ( e ) => {
|
||||
if ( ( e.keyCode || e.which ) === 13 ) {
|
||||
triggerButtonClick( this );
|
||||
triggerButtonClick( $dialog );
|
||||
e.preventDefault();
|
||||
}
|
||||
} );
|
||||
// Make tabbing to a button and pressing
|
||||
// Enter do what people expect
|
||||
$( this ).closest( '.ui-dialog' ).find( 'button' ).on( 'focus', function () {
|
||||
$( this ).closest( '.ui-dialog' ).data( 'dialogaction', this );
|
||||
$dialog.find( 'button' ).on( 'focus', ( e ) => {
|
||||
$dialog.data( 'dialogaction', e.delegateTarget );
|
||||
} );
|
||||
}
|
||||
const $dialog = $( this ).closest( '.ui-dialog' );
|
||||
that = this;
|
||||
$( this ).data( 'context' ).$textarea
|
||||
const $textarea = $( this ).data( 'context' ).$textarea;
|
||||
$textarea
|
||||
.on( 'keypress.srdialog', ( e ) => {
|
||||
if ( e.which === 13 ) {
|
||||
// Enter
|
||||
triggerButtonClick( $dialog );
|
||||
triggerButtonClick( $textarea );
|
||||
e.preventDefault();
|
||||
} else if ( e.which === 27 ) {
|
||||
// Escape
|
||||
|
|
|
@ -417,6 +417,7 @@ $.fn.wikiEditor = function () {
|
|||
// Ensure that buttons and tabs are visible
|
||||
context.$controls.show();
|
||||
context.$tabs.show();
|
||||
|
||||
// Return the newly appended tab
|
||||
return $( '<div>' )
|
||||
.attr( 'rel', 'wikiEditor-ui-view-' + opts.name )
|
||||
|
@ -425,16 +426,16 @@ $.fn.wikiEditor = function () {
|
|||
.attr( 'tabindex', 0 )
|
||||
// No dragging!
|
||||
.on( 'mousedown', () => false )
|
||||
.on( 'click keydown', function ( event ) {
|
||||
.on( 'click keydown', ( event ) => {
|
||||
if (
|
||||
event.type === 'click' ||
|
||||
event.type === 'keydown' && event.key === 'Enter'
|
||||
) {
|
||||
context.$ui.find( '.wikiEditor-ui-view' ).hide();
|
||||
context.$ui.find( '.' + $( this ).parent().attr( 'rel' ) ).show();
|
||||
context.$ui.find( '.' + $( event.target ).parent().attr( 'rel' ) ).show();
|
||||
context.$tabs.find( 'div' ).removeClass( 'current' );
|
||||
$( this ).parent().addClass( 'current' );
|
||||
$( this ).trigger( 'blur' );
|
||||
$( event.target ).parent().addClass( 'current' );
|
||||
$( event.target ).trigger( 'blur' );
|
||||
if ( 'init' in opts && typeof opts.init === 'function' ) {
|
||||
opts.init( context );
|
||||
}
|
||||
|
|
|
@ -121,9 +121,10 @@ const toolbarModule = {
|
|||
e.preventDefault();
|
||||
return false;
|
||||
} )
|
||||
.on( 'click', function ( e ) {
|
||||
toolbarModule.fn.doAction( $( this ).parent().data( 'context' ),
|
||||
$( this ).parent().data( 'actions' )[ $( this ).attr( 'rel' ) ] );
|
||||
.on( 'click', ( e ) => {
|
||||
const $character = $( e.target );
|
||||
toolbarModule.fn.doAction( $character.parent().data( 'context' ),
|
||||
$character.parent().data( 'actions' )[ $character.attr( 'rel' ) ] );
|
||||
e.preventDefault();
|
||||
return false;
|
||||
} )
|
||||
|
@ -389,16 +390,17 @@ const toolbarModule = {
|
|||
e.preventDefault();
|
||||
return false;
|
||||
} )
|
||||
.on( 'click keydown', function ( e ) {
|
||||
.on( 'click keydown', ( e ) => {
|
||||
if (
|
||||
e.type === 'click' ||
|
||||
e.type === 'keydown' && e.key === 'Enter'
|
||||
) {
|
||||
const $link = $( e.target );
|
||||
toolbarModule.fn.doAction(
|
||||
$( this ).data( 'context' ), $( this ).data( 'action' ), $( this )
|
||||
$link.data( 'context' ), $link.data( 'action' ), $link
|
||||
);
|
||||
// Hide the dropdown
|
||||
$( this ).closest( '.tool-select' ).removeClass( 'options-shown' );
|
||||
$link.closest( '.tool-select' ).removeClass( 'options-shown' );
|
||||
e.preventDefault();
|
||||
return false;
|
||||
}
|
||||
|
@ -419,16 +421,17 @@ const toolbarModule = {
|
|||
e.preventDefault();
|
||||
return false;
|
||||
} )
|
||||
.on( 'click keydown', function ( e ) {
|
||||
.on( 'click keydown', ( e ) => {
|
||||
if (
|
||||
e.type === 'click' ||
|
||||
e.type === 'keydown' && e.key === 'Enter'
|
||||
) {
|
||||
const $opts = $( this ).data( 'options' );
|
||||
const $link = $( e.target );
|
||||
const $opts = $link.data( 'options' );
|
||||
// eslint-disable-next-line no-jquery/no-class-state
|
||||
const canShowOptions = !$opts.closest( '.tool-select' ).hasClass( 'options-shown' );
|
||||
$opts.closest( '.tool-select' ).toggleClass( 'options-shown', canShowOptions );
|
||||
$( this ).attr( 'aria-expanded', canShowOptions.toString() );
|
||||
$link.attr( 'aria-expanded', canShowOptions.toString() );
|
||||
e.preventDefault();
|
||||
return false;
|
||||
}
|
||||
|
@ -457,7 +460,8 @@ const toolbarModule = {
|
|||
},
|
||||
buildBookmark: function ( context, id, page ) {
|
||||
const label = $.wikiEditor.autoMsg( page, 'label' );
|
||||
return $( '<div>' )
|
||||
const $bookmark = $( '<div>' );
|
||||
return $bookmark
|
||||
.text( label )
|
||||
.attr( {
|
||||
rel: id,
|
||||
|
@ -469,16 +473,16 @@ const toolbarModule = {
|
|||
e.preventDefault();
|
||||
return false;
|
||||
} )
|
||||
.on( 'click', function ( event ) {
|
||||
$( this ).parent().parent().find( '.page' ).hide();
|
||||
$( this ).parent().parent().find( '.page-' + $( this ).attr( 'rel' ) ).show().trigger( 'loadPage' );
|
||||
$( this )
|
||||
.on( 'click', ( event ) => {
|
||||
$bookmark.parent().parent().find( '.page' ).hide();
|
||||
$bookmark.parent().parent().find( '.page-' + $bookmark.attr( 'rel' ) ).show().trigger( 'loadPage' );
|
||||
$bookmark
|
||||
.addClass( 'current' )
|
||||
.siblings().removeClass( 'current' );
|
||||
const section = $( this ).parent().parent().attr( 'rel' );
|
||||
const section = $bookmark.parent().parent().attr( 'rel' );
|
||||
$.cookie(
|
||||
'wikiEditor-' + $( this ).data( 'context' ).instance + '-booklet-' + section + '-page',
|
||||
$( this ).attr( 'rel' ),
|
||||
'wikiEditor-' + $bookmark.data( 'context' ).instance + '-booklet-' + section + '-page',
|
||||
$bookmark.attr( 'rel' ),
|
||||
{ expires: 30, path: '/' }
|
||||
);
|
||||
// No dragging!
|
||||
|
@ -545,11 +549,12 @@ const toolbarModule = {
|
|||
e.preventDefault();
|
||||
return false;
|
||||
} )
|
||||
.on( 'click', function ( e ) {
|
||||
.on( 'click', ( e ) => {
|
||||
const $character = $( e.target );
|
||||
toolbarModule.fn.doAction(
|
||||
$( this ).parent().data( 'context' ),
|
||||
$( this ).parent().data( 'actions' )[ $( this ).attr( 'rel' ) ],
|
||||
$( this )
|
||||
$character.parent().data( 'context' ),
|
||||
$character.parent().data( 'actions' )[ $character.attr( 'rel' ) ],
|
||||
$character
|
||||
);
|
||||
e.preventDefault();
|
||||
return false;
|
||||
|
@ -635,15 +640,15 @@ const toolbarModule = {
|
|||
} )
|
||||
.text( $.wikiEditor.autoMsg( section, 'label' ) )
|
||||
.data( 'context', context )
|
||||
.on( 'mouseup', function () {
|
||||
$( this ).trigger( 'blur' );
|
||||
.on( 'mouseup', () => {
|
||||
$link.trigger( 'blur' );
|
||||
} )
|
||||
.on( 'mousedown', ( e ) => {
|
||||
// No dragging!
|
||||
e.preventDefault();
|
||||
return false;
|
||||
} )
|
||||
.on( 'click keydown', function ( e ) {
|
||||
.on( 'click keydown', ( e ) => {
|
||||
if (
|
||||
e.type !== 'click' &&
|
||||
( e.type !== 'keydown' || e.key !== 'Enter' )
|
||||
|
@ -652,21 +657,21 @@ const toolbarModule = {
|
|||
}
|
||||
// We have to set aria-pressed over here, as NVDA wont recognize it
|
||||
// if we do it in the below .each as it seems
|
||||
$( this ).attr( 'aria-pressed', 'true' );
|
||||
$link.attr( 'aria-pressed', 'true' );
|
||||
$( '.tab > a' ).each( ( i, elem ) => {
|
||||
if ( elem !== e.target ) {
|
||||
$( elem ).attr( 'aria-pressed', 'false' );
|
||||
}
|
||||
} );
|
||||
const $sections = $( this ).data( 'context' ).$ui.find( '.sections' );
|
||||
const $section = $sections.find( '.section-' + $( this ).parent().attr( 'rel' ) );
|
||||
const $sections = $link.data( 'context' ).$ui.find( '.sections' );
|
||||
const $section = $sections.find( '.section-' + $link.parent().attr( 'rel' ) );
|
||||
// eslint-disable-next-line no-jquery/no-class-state
|
||||
const show = !$section.hasClass( 'section-visible' );
|
||||
$sections.find( '.section-visible' )
|
||||
.removeClass( 'section-visible' )
|
||||
.addClass( 'section-hidden' );
|
||||
|
||||
$( this )
|
||||
$link
|
||||
.attr( 'aria-expanded', 'false' )
|
||||
.parent().parent().find( 'a' ).removeClass( 'current' );
|
||||
if ( show ) {
|
||||
|
@ -675,13 +680,13 @@ const toolbarModule = {
|
|||
.attr( 'aria-expanded', 'true' )
|
||||
.addClass( 'section-visible' );
|
||||
|
||||
$( this ).attr( 'aria-expanded', 'true' )
|
||||
$link.attr( 'aria-expanded', 'true' )
|
||||
.addClass( 'current' );
|
||||
}
|
||||
|
||||
// Save the currently visible section
|
||||
$.cookie(
|
||||
'wikiEditor-' + $( this ).data( 'context' ).instance + '-toolbar-section',
|
||||
'wikiEditor-' + $link.data( 'context' ).instance + '-toolbar-section',
|
||||
show ? $section.attr( 'rel' ) : null,
|
||||
{ expires: 30, path: '/' }
|
||||
);
|
||||
|
|
Loading…
Reference in a new issue