| Index: branches/liangent/makeCollapsible_custom/phase3/resources/jquery/jquery.makeCollapsible.js |
| — | — | @@ -200,7 +200,7 @@ |
| 201 | 201 | return; |
| 202 | 202 | }, |
| 203 | 203 | // Toggles customcollapsible |
| 204 | | - toggleLinkCustom = function( $that, e, $collapsible ) { |
| | 204 | + toggleLinkCustom = function( $that, e, $collapsible, $customTogglers ) { |
| 205 | 205 | var instantHide = true; |
| 206 | 206 | // For the initial state call of customtogglers there is no event passed |
| 207 | 207 | if (e) { |
| — | — | @@ -213,14 +213,14 @@ |
| 214 | 214 | // It's expanded right now |
| 215 | 215 | if ( $collapsible.hasClass( 'mw-collapsed' ) ) { |
| 216 | 216 | // Change text to "Show" |
| 217 | | - $( '.mw-customtoggletext', $that ).text( expandtext ); |
| | 217 | + $( '.mw-customtoggletext', $customTogglers ).text( expandtext ); |
| 218 | 218 | // Collapse element |
| 219 | 219 | toggleElement( $collapsible, 'collapse', $that, instantHide ); |
| 220 | 220 | |
| 221 | 221 | // It's collapsed right now |
| 222 | 222 | } else { |
| 223 | 223 | // Change text to "Hide" |
| 224 | | - $( '.mw-customtoggletext', $that ).text( collapsetext ); |
| | 224 | + $( '.mw-customtoggletext', $customTogglers ).text( collapsetext ); |
| 225 | 225 | // Expand element |
| 226 | 226 | toggleElement( $collapsible, 'expand', $that, instantHide ); |
| 227 | 227 | } |
| — | — | @@ -257,63 +257,46 @@ |
| 258 | 258 | // Check if this element has a custom position for the toggle link |
| 259 | 259 | // (ie. outside the container or deeper inside the tree) |
| 260 | 260 | // Then: Locate the custom toggle link(s) and bind them |
| 261 | | - if ( ( $that.attr( 'id' ) || '' ).indexOf( 'mw-customcollapsible-' ) === 0 ) { |
| | 261 | + if ( ( $that.attr( 'id' ) || '' ).indexOf( 'mw-customcollapsible-' ) === 0 |
| | 262 | + || $that.hasClass( 'mw-customcollapsiblechildren' ) ) { |
| 262 | 263 | |
| 263 | | - var thatId = $that.attr( 'id' ), |
| 264 | | - $customTogglers = $( '.' + thatId.replace( 'mw-customcollapsible', 'mw-customtoggle' ) ); |
| 265 | | - mw.log( _fn + 'Found custom collapsible: #' + thatId ); |
| | 264 | + var $customTogglers = $(); |
| 266 | 265 | |
| 267 | | - // Double check that there is actually a customtoggle link |
| 268 | | - if ( $customTogglers.length ) { |
| 269 | | - $customTogglers.bind( 'click.mw-collapse', function( e ) { |
| 270 | | - toggleLinkCustom( $(this), e, $that ); |
| 271 | | - } ); |
| 272 | | - |
| 273 | | - // If there's no link for users using keyboard navigation |
| 274 | | - if ( !$customTogglers.is( 'a' ) && !$customTogglers.find( 'a' ).length ) { |
| 275 | | - $customTogglers.attr( 'tabindex', '0' ).bind( 'keydown.mw-collapse', function( e ) { |
| 276 | | - if ( e.which === 13 ) { // Enter key |
| 277 | | - toggleLinkCustom( $(this), e, $that ); |
| 278 | | - } |
| 279 | | - } ); |
| 280 | | - } |
| 281 | | - } else { |
| 282 | | - mw.log( _fn + '#' + thatId + ': Missing toggler!' ); |
| | 266 | + // Custom toggle link specified by id/class name match |
| | 267 | + if ( ( $that.attr( 'id' ) || '' ).indexOf( 'mw-customcollapsible-' ) === 0 ) { |
| | 268 | + var thatId = $that.attr( 'id' ); |
| | 269 | + $customTogglers = $customTogglers.add( |
| | 270 | + '.' + thatId.replace( 'mw-customcollapsible', 'mw-customtoggle' ) ); |
| | 271 | + mw.log( _fn + 'Found custom collapsible: #' + thatId ); |
| 283 | 272 | } |
| 284 | 273 | |
| 285 | | - // Initial state |
| 286 | | - if ( $that.hasClass( 'mw-collapsed' ) ) { |
| 287 | | - toggleLinkCustom( $customTogglers, null, $that ); |
| 288 | | - } else { |
| 289 | | - $( '.mw-customtoggletext', $customTogglers ).text( collapsetext ); |
| | 274 | + // Custom toggle link specified by children with a certain class |
| | 275 | + if ( $that.hasClass( 'mw-customcollapsiblechildren' ) ) { |
| | 276 | + $customTogglers = $customTogglers.add( $( '.mw-customtoggle', $that ) ); |
| | 277 | + mw.log( _fn + 'Found custom collapsible: <children>' ); |
| 290 | 278 | } |
| 291 | 279 | |
| 292 | | - // Custom toggle link specified by children with a certain class |
| 293 | | - } else if ( $that.hasClass( 'mw-customcollapsiblechildren' ) ) { |
| 294 | | - |
| 295 | | - var $customTogglers = $( '.mw-customtoggle', $that ); |
| 296 | | - |
| 297 | 280 | // Double check that there is actually a customtoggle link |
| 298 | 281 | if ( $customTogglers.length ) { |
| 299 | 282 | $customTogglers.bind( 'click.mw-collapse', function( e ) { |
| 300 | | - toggleLinkCustom( $(this), e, $that ); |
| | 283 | + toggleLinkCustom( $(this), e, $that, $customTogglers ); |
| 301 | 284 | } ); |
| 302 | 285 | |
| 303 | 286 | // If there's no link for users using keyboard navigation |
| 304 | 287 | if ( !$customTogglers.is( 'a' ) && !$customTogglers.find( 'a' ).length ) { |
| 305 | 288 | $customTogglers.attr( 'tabindex', '0' ).bind( 'keydown.mw-collapse', function( e ) { |
| 306 | 289 | if ( e.which === 13 ) { // Enter key |
| 307 | | - toggleLinkCustom( $(this), e, $that ); |
| | 290 | + toggleLinkCustom( $(this), e, $that, $customTogglers ); |
| 308 | 291 | } |
| 309 | 292 | } ); |
| 310 | 293 | } |
| 311 | 294 | } else { |
| 312 | | - mw.log( _fn + '.mw-customcollapsiblechildren: Missing toggler!' ); |
| | 295 | + mw.log( _fn + 'mw-customcollapsible: Missing toggler!' ); |
| 313 | 296 | } |
| 314 | 297 | |
| 315 | 298 | // Initial state |
| 316 | 299 | if ( $that.hasClass( 'mw-collapsed' ) ) { |
| 317 | | - toggleLinkCustom( $customTogglers, null, $that ); |
| | 300 | + toggleLinkCustom( $customTogglers, null, $that, $customTogglers ); |
| 318 | 301 | } else { |
| 319 | 302 | $( '.mw-customtoggletext', $customTogglers ).text( collapsetext ); |
| 320 | 303 | } |