mediawiki.checkboxtoggle: Fix minor issues.

Follows-up 606a21c, 79414f8, 870c5e2.

* Mention class name in PHP source. Since there is no obvious link
  between "mediawiki.checkboxtoggle.js" and "ListToggle.php" these
  comments make it possible to find the PHP class. Previously
  these css classes had 0 matches across all source code, thus
  risking accidental removing.

* Quote attribute selector.

* Ensure default prevented before instead of after the handler. These toggles
  have no fallback (href="#"). As such, navigation should be prevented
  regardless of whether the JS fails or succeeds.

* Remove use of is(':checked'). These is no need to reach out to the
  selector engine to determine whether 'checked' property is true or false.
  Instead, use prop('checked') for both getting and setting.

* Simplify code by using this.checked directly instead of $().prop().

* Simplify code by using one loop (from $.prop) instead of two loops
  ($.prop inside $.each). This pattern is also used by selectAll().

Test by using "All", "None" and "Invert" on Special:Log.

Bug: T131318
Change-Id: Idfc43f094c6147d69104416b3f8622eabb20b824

diff --git a/includes/ListToggle.php b/includes/ListToggle.php
index 4733dfb..2c87b8b 100644 (file)
--- a/includes/ListToggle.php
+++ b/includes/ListToggle.php
@@ -41,6 +41,7 @@ class ListToggle {
 
        private function checkboxLink( $checkboxType ) {
                return Html::element(
+                       // CSS classes: mw-checkbox-all, mw-checkbox-none, mw-checkbox-invert
                        'a', [ 'href' => '#', 'class' => 'mw-checkbox-' . $checkboxType ],
                        $this->output->msg( 'checkbox-' . $checkboxType )->text()
                );

diff --git a/resources/src/mediawiki/mediawiki.checkboxtoggle.js b/resources/src/mediawiki/mediawiki.checkboxtoggle.js
index 62760d2..ab7a74e 100644 (file)
--- a/resources/src/mediawiki/mediawiki.checkboxtoggle.js
+++ b/resources/src/mediawiki/mediawiki.checkboxtoggle.js
@@ -13,25 +13,27 @@
        'use strict';
 
        $( function () {
-               var $checkboxes = $( 'li input[type=checkbox]' );
+               // FIXME: This shouldn't be a global selector to avoid conflicts
+               // with unrelated content on the same page. (T131318)
+               var $checkboxes = $( 'li input[type="checkbox"]' );
 
                function selectAll( check ) {
                        $checkboxes.prop( 'checked', check );
                }
 
                $( '.mw-checkbox-all' ).click( function ( e ) {
-                       selectAll( true );
                        e.preventDefault();
+                       selectAll( true );
                } );
                $( '.mw-checkbox-none' ).click( function ( e ) {
-                       selectAll( false );
                        e.preventDefault();
+                       selectAll( false );
                } );
                $( '.mw-checkbox-invert' ).click( function ( e ) {
-                       $checkboxes.each( function () {
-                               $( this ).prop( 'checked', !$( this ).is( ':checked' ) );
-                       } );
                        e.preventDefault();
+                       $checkboxes.prop( 'checked', function ( i, val ) {
+                               return !val;
+                       } );
                } );
 
        } );