From 86947ae9aa0e3065542fe0993db724cf515a78ad Mon Sep 17 00:00:00 2001 From: =?utf8?q?Bartosz=20Dziewo=C5=84ski?= Date: Sat, 22 Feb 2014 20:19:49 +0100 Subject: [PATCH] Stop using and deprecate jquery.delayedBind Reasons: * It provides the same functionality as jquery.throttle-debounce, but in a hackier and less flexible way * It's (to my knowledge) not used outside of core, while jquery.throttle-debounce is - deciding on one can lower the payload size a little bit * It's a custom library and we have too many of those Only two modules in core were using it: * jquery.expandableField: It was, in fact, used incorrectly, the code needs a simple setTimeout / clearTimeout pair with no debouncing. The bug made it possible to keep focus on a field while it was unexpanded (by quickly triggering blur and focus events in order). * skins.vector.js: Straightforwardly converted the usage to a $.debounce call. Also fixed a bug where the window resize handler was bound for each $.fn.collapsibleTabs call instead of once. The module will be removed in MediaWiki 1.24: Ifc84b09a78007a6a0ea5676b0f12a38937dca2e7. Change-Id: I83ba37a9568a171d9f3654f6bfdb6064e0e65bd4 --- RELEASE-NOTES-1.23 | 2 ++ resources/Resources.php | 3 +-- resources/jquery/jquery.delayedBind.js | 11 +++++++++-- resources/jquery/jquery.expandableField.js | 9 ++++++--- skins/vector/collapsibleTabs.js | 14 ++++++-------- 5 files changed, 24 insertions(+), 15 deletions(-) diff --git a/RELEASE-NOTES-1.23 b/RELEASE-NOTES-1.23 index 2350b8e48a..d520de5413 100644 --- a/RELEASE-NOTES-1.23 +++ b/RELEASE-NOTES-1.23 @@ -248,6 +248,8 @@ changes to languages because of Bugzilla reports. was removed. * A user_password_expires column has been added to the user table. The User object expects this column to exist. Use update.php to create this new field. +* The jquery.delayedBind ResourceLoader module was deprecated in favor of the + jquery.throttle-debounce module. It will be removed in MediaWiki 1.24. ==== Removed classes ==== * FakeMemCachedClient (deprecated in 1.18) diff --git a/resources/Resources.php b/resources/Resources.php index 7f5b75ab52..f8c6114b93 100644 --- a/resources/Resources.php +++ b/resources/Resources.php @@ -150,7 +150,7 @@ return array( 'vector/vector.js', ), 'position' => 'top', - 'dependencies' => 'jquery.delayedBind', + 'dependencies' => 'jquery.throttle-debounce', 'remoteBasePath' => $GLOBALS['wgStylePath'], 'localBasePath' => $GLOBALS['wgStyleDirectory'], ), @@ -238,7 +238,6 @@ return array( ), 'jquery.expandableField' => array( 'scripts' => 'resources/jquery/jquery.expandableField.js', - 'dependencies' => 'jquery.delayedBind', ), 'jquery.farbtastic' => array( 'scripts' => 'resources/jquery/jquery.farbtastic.js', diff --git a/resources/jquery/jquery.delayedBind.js b/resources/jquery/jquery.delayedBind.js index 40f3d44eb5..874c111828 100644 --- a/resources/jquery/jquery.delayedBind.js +++ b/resources/jquery/jquery.delayedBind.js @@ -1,4 +1,4 @@ -( function ( $ ) { +( function ( mw, $ ) { /** * Function that escapes spaces in event names. This is needed because * "_delayedBind-foo bar-1000" refers to two events @@ -73,4 +73,11 @@ $.fn.extend( { } } ); -}( jQuery ) ); +mw.log.deprecate( $.fn, 'delayedBind', $.fn.delayedBind, + 'Use the jquery.throttle-debounce module instead' ); +mw.log.deprecate( $.fn, 'delayedBindCancel', $.fn.delayedBindCancel, + 'Use the jquery.throttle-debounce module instead' ); +mw.log.deprecate( $.fn, 'delayedBindUnbind', $.fn.delayedBindUnbind, + 'Use the jquery.throttle-debounce module instead' ); + +}( mediaWiki, jQuery ) ); diff --git a/resources/jquery/jquery.expandableField.js b/resources/jquery/jquery.expandableField.js index 9e532e527a..732cc6ecc2 100644 --- a/resources/jquery/jquery.expandableField.js +++ b/resources/jquery/jquery.expandableField.js @@ -56,7 +56,7 @@ args = arguments; $( this ).each( function () { - var key, context; + var key, context, timeout; /* Construction / Loading */ @@ -122,10 +122,13 @@ $( this ) .addClass( 'expandableField' ) .focus( function ( e ) { + clearTimeout( timeout ); $.expandableField.expandField( e, context ); } ) - .delayedBind( 250, 'blur', function ( e ) { - $.expandableField.condenseField( e, context ); + .blur( function ( e ) { + timeout = setTimeout( function () { + $.expandableField.condenseField( e, context ); + }, 250 ); } ); } // Store the context for next time diff --git a/skins/vector/collapsibleTabs.js b/skins/vector/collapsibleTabs.js index e33cfc9560..0e4974414f 100644 --- a/skins/vector/collapsibleTabs.js +++ b/skins/vector/collapsibleTabs.js @@ -24,13 +24,14 @@ } ); } ); - // if we haven't already bound our resize hanlder, bind it now + // if we haven't already bound our resize handler, bind it now if ( !$.collapsibleTabs.boundEvent ) { - $( window ) - .delayedBind( 500, 'resize', function () { - $.collapsibleTabs.handleResize(); - } ); + $( window ).on( 'resize', $.debounce( 500, function () { + $.collapsibleTabs.handleResize(); + } ) ); + $.collapsibleTabs.boundEvent = true; } + // call our resize handler to setup the page $.collapsibleTabs.handleResize(); return this; @@ -101,9 +102,6 @@ } return $settings; }, - /** - * @param {jQuery.Event} e - */ handleResize: function () { $.collapsibleTabs.instances.each( function () { var $el = $( this ), -- 2.20.1