resources/src/mediawiki.action/mediawiki.action.edit.collapsibleFooter.js

   1 ( function ( mw ) {
   2         var collapsibleLists, handleOne;
   3
   4         // Collapsible lists of categories and templates
   5         // If changing or removing a storeKey, ensure there is a strategy for old keys.
   6         // E.g. detect existence via requestIdleCallback and remove. (T121646)
   7         collapsibleLists = [
   8                 {
   9                         listSel: '.templatesUsed ul',
  10                         togglerSel: '.mw-templatesUsedExplanation',
  11                         storeKey: 'mwedit-state-templatesUsed'
  12                 },
  13                 {
  14                         listSel: '.hiddencats ul',
  15                         togglerSel: '.mw-hiddenCategoriesExplanation',
  16                         storeKey: 'mwedit-state-hiddenCategories'
  17                 },
  18                 {
  19                         listSel: '.preview-limit-report-wrapper',
  20                         togglerSel: '.mw-limitReportExplanation',
  21                         storeKey: 'mwedit-state-limitReport'
  22                 }
  23         ];
  24
  25         handleOne = function ( $list, $toggler, storeKey ) {
  26                 var collapsedVal = '0',
  27                         expandedVal = '1',
  28                         // Default to collapsed if not set
  29                         isCollapsed = mw.storage.get( storeKey ) !== expandedVal;
  30
  31                 // Style the toggler with an arrow icon and add a tabIndex and a role for accessibility
  32                 $toggler.addClass( 'mw-editfooter-toggler' ).prop( 'tabIndex', 0 ).attr( 'role', 'button' );
  33                 $list.addClass( 'mw-editfooter-list' );
  34
  35                 $list.makeCollapsible( {
  36                         $customTogglers: $toggler,
  37                         linksPassthru: true,
  38                         plainMode: true,
  39                         collapsed: isCollapsed
  40                 } );
  41
  42                 $toggler.addClass( isCollapsed ? 'mw-icon-arrow-collapsed' : 'mw-icon-arrow-expanded' );
  43
  44                 $list.on( 'beforeExpand.mw-collapsible', function () {
  45                         $toggler.removeClass( 'mw-icon-arrow-collapsed' ).addClass( 'mw-icon-arrow-expanded' );
  46                         mw.storage.set( storeKey, expandedVal );
  47                 } );
  48
  49                 $list.on( 'beforeCollapse.mw-collapsible', function () {
  50                         $toggler.removeClass( 'mw-icon-arrow-expanded' ).addClass( 'mw-icon-arrow-collapsed' );
  51                         mw.storage.set( storeKey, collapsedVal );
  52                 } );
  53         };
  54
  55         mw.hook( 'wikipage.editform' ).add( function ( $editForm ) {
  56                 var i;
  57                 for ( i = 0; i < collapsibleLists.length; i++ ) {
  58                         // Pass to a function for iteration-local variables
  59                         handleOne(
  60                                 $editForm.find( collapsibleLists[ i ].listSel ),
  61                                 $editForm.find( collapsibleLists[ i ].togglerSel ),
  62                                 collapsibleLists[ i ].storeKey
  63                         );
  64                 }
  65         } );
  66 }( mediaWiki ) );