resources/src/mediawiki.action/mediawiki.action.view.metadata.js

   1 /*!
   2  * Exif metadata display for MediaWiki file uploads
   3  *
   4  * Add an expand/collapse link and collapse by default if set to
   5  * (with JS disabled, user will see all items)
   6  *
   7  * See also ImagePage.php#makeMetadataTable (creates the HTML)
   8  */
   9 ( function ( mw, $ ) {
  10         $( function () {
  11                 var $row, $col, $link,
  12                         showText = mw.msg( 'metadata-expand' ),
  13                         hideText = mw.msg( 'metadata-collapse' ),
  14                         $table = $( '#mw_metadata' ),
  15                         $tbody = $table.find( 'tbody' );
  16
  17                 if ( !$tbody.find( '.collapsable' ).length ) {
  18                         return;
  19                 }
  20
  21                 $row = $( '<tr class="mw-metadata-show-hide-extended"></tr>' );
  22                 $col = $( '<td colspan="2"></td>' );
  23
  24                 $link = $( '<a>' )
  25                 .text( showText )
  26                 .attr( {
  27                         role: 'button',
  28                         tabindex: 0
  29                 } )
  30                 .on( 'click keypress', function ( e ) {
  31                         if (
  32                                 e.type === 'click' ||
  33                                 e.type === 'keypress' && e.which === 13
  34                         ) {
  35                                 if ( $table.hasClass( 'collapsed' ) ) {
  36                                         $( this ).text( hideText );
  37                                 } else {
  38                                         $( this ).text( showText );
  39                                 }
  40                                 $table.toggleClass( 'expanded collapsed' );
  41                         }
  42                 } );
  43
  44                 $col.append( $link );
  45                 $row.append( $col );
  46                 $tbody.append( $row );
  47
  48                 // And collapse!
  49                 $table.addClass( 'collapsed' );
  50         } );
  51
  52 }( mediaWiki, jQuery ) );