From af4ef8153354b02ec910fd98ec7af024c64ab104 Mon Sep 17 00:00:00 2001 From: Timo Tijhof Date: Thu, 7 Nov 2013 18:35:24 +0100 Subject: [PATCH] Migrate usage of wikibits in legacy protect.js and upload.js Follows-up fcf4934a52. protect: * Use jQuery instead. * Removing now-obsolete dependency. * Make cell.appendChild more obvious and potentialy faster by grouping the dom actions in 1 sequence. config: * Removing obsolete dependency. upload: * Use jquery.spinner instead. * Removing now-obsolete dependency. jquery.spinner: * While at it, updated documentation to be included in our jsduck index, similar to jquery.localize. jsduck/external.js: * Added @static to jQuery.ajax which was missing, it showed up between instance methods like jQuery#injectSpinner. The only module left using mediawiki.legacy.wikibits is mediawiki.legacy.ajax which remains in tact for now. Bug: 56726 Change-Id: I712112626a99dc2d0090f554c56052770cd0ae88 --- maintenance/jsduck/config.json | 3 +- maintenance/jsduck/external.js | 1 + resources/Resources.php | 8 +++-- resources/jquery/jquery.spinner.js | 47 +++++++++++++++++++----------- skins/common/protect.js | 7 +++-- skins/common/upload.js | 16 ++++++---- 6 files changed, 52 insertions(+), 30 deletions(-) diff --git a/maintenance/jsduck/config.json b/maintenance/jsduck/config.json index 12458eeb00..e6e0f65875 100644 --- a/maintenance/jsduck/config.json +++ b/maintenance/jsduck/config.json @@ -21,6 +21,7 @@ "../../resources/mediawiki.action/mediawiki.action.view.postEdit.js", "../../resources/mediawiki.page/mediawiki.page.startup.js", "../../resources/mediawiki.api", - "../../resources/jquery/jquery.localize.js" + "../../resources/jquery/jquery.localize.js", + "../../resources/jquery/jquery.spinner.js" ] } diff --git a/maintenance/jsduck/external.js b/maintenance/jsduck/external.js index 7910ec8d6b..4bb8369487 100644 --- a/maintenance/jsduck/external.js +++ b/maintenance/jsduck/external.js @@ -5,6 +5,7 @@ /** * @method ajax + * @static * @source * @return {jqXHR} */ diff --git a/resources/Resources.php b/resources/Resources.php index 463dec823a..9eb5227bcb 100644 --- a/resources/Resources.php +++ b/resources/Resources.php @@ -1043,7 +1043,10 @@ return array( 'size-gigabytes', 'largefileserver', ), - 'dependencies' => array( 'mediawiki.libs.jpegmeta', 'mediawiki.util' ), + 'dependencies' => array( + 'mediawiki.libs.jpegmeta', + 'mediawiki.util', + ), ), 'mediawiki.special.userlogin' => array( 'styles' => array( @@ -1124,7 +1127,6 @@ return array( 'remoteBasePath' => $GLOBALS['wgStylePath'], 'localBasePath' => $GLOBALS['wgStyleDirectory'], 'dependencies' => array( - 'mediawiki.legacy.wikibits', 'jquery.byteLimit', ), 'position' => 'top', @@ -1145,9 +1147,9 @@ return array( 'remoteBasePath' => $GLOBALS['wgStylePath'], 'localBasePath' => $GLOBALS['wgStyleDirectory'], 'dependencies' => array( + 'jquery.spinner', 'mediawiki.api', 'mediawiki.Title', - 'mediawiki.legacy.wikibits', 'mediawiki.util', ), ), diff --git a/resources/jquery/jquery.spinner.js b/resources/jquery/jquery.spinner.js index 93e30b9a1a..27dabc6c98 100644 --- a/resources/jquery/jquery.spinner.js +++ b/resources/jquery/jquery.spinner.js @@ -1,7 +1,9 @@ /** - * jQuery spinner + * jQuery Spinner * * Simple jQuery plugin to create, inject and remove spinners. + * + * @class jQuery.plugin.spinner */ ( function ( $ ) { @@ -15,36 +17,37 @@ $.extend({ /** - * Creates a spinner element. + * Create a spinner element * * The argument is an object with options used to construct the spinner. These can be: * * It is a good practice to keep a reference to the created spinner to be able to remove it later. - * Alternatively one can use the id option and removeSpinner() (but make sure to choose an id + * Alternatively one can use the id option and #removeSpinner (but make sure to choose an id * that's unlikely to cause conflicts, e.g. with extensions, gadgets or user scripts). * * CSS classes used: - * .mw-spinner for every spinner - * .mw-spinner-small / .mw-spinner-large for size - * .mw-spinner-block / .mw-spinner-inline for display types + * - .mw-spinner for every spinner + * - .mw-spinner-small / .mw-spinner-large for size + * - .mw-spinner-block / .mw-spinner-inline for display types * - * @example * // Create a large spinner reserving all available horizontal space. * var $spinner = $.createSpinner({ size: 'large', type: 'block' }); * // Insert above page content. * $( '#mw-content-text' ).prepend( $spinner ); - * @example + * * // Place a small inline spinner next to the "Save" button * var $spinner = $.createSpinner({ size: 'small', type: 'inline' }); * // Alternatively, just `$.createSpinner();` as these are the default options. * $( '#wpSave' ).after( $spinner ); - * @example + * * // The following two are equivalent: * $.createSpinner( 'magic' ); * $.createSpinner({ id: 'magic' }); * - * @param {Object|String} opts [optional] ID string or options: - * - id: If given, spinner will be given an id of "mw-spinner-" + * @static + * @inheritable + * @param {Object|string} [opts] ID string or options: + * - id: If given, spinner will be given an id of "mw-spinner-{id}" * - size: 'small' (default) or 'large' for a 20-pixel or 32-pixel spinner * - type: 'inline' (default) or 'block'. Inline creates an inline-block with width and * height equal to spinner size. Block is a block-level element with width 100%, height @@ -72,10 +75,12 @@ }, /** - * Removes a spinner element. + * Remove a spinner element * - * @param {String} id [optional] Id of the spinner, as passed to createSpinner. - * @return {jQuery} The (now detached) spinner. + * @static + * @inheritable + * @param {string} id Id of the spinner, as passed to #createSpinner + * @return {jQuery} The (now detached) spinner element */ removeSpinner: function ( id ) { return $( '#mw-spinner-' + id ).remove(); @@ -83,13 +88,21 @@ }); /** - * Injects a spinner after the elements in the jQuery collection - * (as siblings, not children). Collection contents remain unchanged. + * Inject a spinner after each element in the collection + * + * Inserts spinner as siblings, not children, of the target elements. + * Collection contents remain unchanged. * - * @param {Object|String} opts See createSpinner() for description. + * @param {Object|string} [opts] See #createSpinner * @return {jQuery} */ $.fn.injectSpinner = function ( opts ) { return this.after( $.createSpinner( opts ) ); }; + + /** + * @class jQuery + * @mixins jQuery.plugin.spinner + */ + }( jQuery ) ); diff --git a/skins/common/protect.js b/skins/common/protect.js index 462fa9c654..dc142ca967 100644 --- a/skins/common/protect.js +++ b/skins/common/protect.js @@ -38,15 +38,16 @@ var ProtectionForm = window.ProtectionForm = { check = document.createElement( 'input' ); check.id = 'mwProtectUnchained'; check.type = 'checkbox'; - cell.appendChild( check ); - window.addClickHandler( check, function () { + $( check ).click( function () { ProtectionForm.onChainClick(); } ); - cell.appendChild( document.createTextNode( ' ' ) ); label = document.createElement( 'label' ); label.htmlFor = 'mwProtectUnchained'; label.appendChild( document.createTextNode( opts.labelText ) ); + + cell.appendChild( check ); + cell.appendChild( document.createTextNode( ' ' ) ); cell.appendChild( label ); check.checked = !this.areAllTypesMatching(); diff --git a/skins/common/upload.js b/skins/common/upload.js index 580cf255ad..d639f63a14 100644 --- a/skins/common/upload.js +++ b/skins/common/upload.js @@ -2,7 +2,8 @@ ( function ( mw, $ ) { var licenseSelectorCheck, wgUploadWarningObj, wgUploadLicenseObj, fillDestFilename, ajaxUploadDestCheck = mw.config.get( 'wgAjaxUploadDestCheck' ), - fileExtensions = mw.config.get( 'wgFileExtensions' ); + fileExtensions = mw.config.get( 'wgFileExtensions' ), + $spinnerDestCheck, $spinnerLicense; licenseSelectorCheck = window.licenseSelectorCheck = function () { var selector = document.getElementById( 'wpLicense' ), @@ -151,7 +152,7 @@ wgUploadWarningObj = window.wgUploadWarningObj = { if ( !ajaxUploadDestCheck || this.nameToCheck === '' ) { return; } - window.injectSpinner( document.getElementById( 'wpDestFile' ), 'destcheck' ); + $spinnerDestCheck = $.createSpinner().insertAfter( '#wpDestFile' ); var uploadWarningObj = this; ( new mw.Api() ).get( { @@ -170,7 +171,8 @@ wgUploadWarningObj = window.wgUploadWarningObj = { }, processResult: function ( result, fileName ) { - window.removeSpinner( 'destcheck' ); + $spinnerDestCheck.remove(); + $spinnerDestCheck = undefined; this.setWarning( result.html ); this.responseCache[fileName] = result.html; }, @@ -179,7 +181,7 @@ wgUploadWarningObj = window.wgUploadWarningObj = { var warningElt = document.getElementById( 'wpDestFile-warning' ), ackElt = document.getElementsByName( 'wpDestFileWarningAck' ); - this.setInnerHTML(warningElt, warning); + this.setInnerHTML( warningElt, warning ); // Set a value in the form indicating that the warning is acknowledged and // doesn't need to be redisplayed post-upload @@ -314,7 +316,8 @@ wgUploadLicenseObj = window.wgUploadLicenseObj = { return; } } - window.injectSpinner( document.getElementById( 'wpLicense' ), 'license' ); + + $spinnerLicense = $.createSpinner().insertAfter( '#wpLicense' ); title = document.getElementById( 'wpDestFile' ).value; if ( !title ) { @@ -333,7 +336,8 @@ wgUploadLicenseObj = window.wgUploadLicenseObj = { }, processResult: function ( result, license ) { - window.removeSpinner( 'license' ); + $spinnerLicense.remove(); + $spinnerLicense = undefined; this.responseCache[license] = result.parse.text['*']; this.showPreview( this.responseCache[license] ); }, -- 2.20.1