resources/src/mediawiki.special.preferences.ooui/signature.js

   1 /*!
   2  * JavaScript for Special:Preferences: signature field enhancements.
   3  */
   4 ( function () {
   5         mw.hook( 'htmlform.enhance' ).add( ( $root ) => {
   6                 const $signatureInput = $root.find( '#mw-input-wpnickname' );
   7                 if (
   8                         // This preference could theoretically be disabled ($wgHiddenPrefs)
   9                         !$signatureInput.length ||
  10                         $signatureInput.closest( '.mw-htmlform-autoinfuse-lazy' ).length
  11                 ) {
  12                         return;
  13                 }
  14
  15                 const signatureInput = OO.ui.infuse( $signatureInput );
  16
  17                 // Add a visible length limit
  18                 mw.widgets.visibleCodePointLimit( signatureInput );
  19
  20                 // Use appropriate font
  21                 function updateFont( useEditFont ) {
  22                         // The following classes are used here:
  23                         // * mw-editfont-monospace
  24                         // * mw-editfont-sans-serif
  25                         // * mw-editfont-serif
  26                         signatureInput.$element.toggleClass(
  27                                 'mw-editfont-' + mw.user.options.get( 'editfont' ),
  28                                 useEditFont
  29                         );
  30                 }
  31                 const $fancyToggleInput = $root.find( '#mw-input-wpfancysig' );
  32                 if ( $fancyToggleInput.length ) {
  33                         const fancyToggleInput = OO.ui.infuse( $fancyToggleInput );
  34                         fancyToggleInput.on( 'change', () => {
  35                                 updateFont( fancyToggleInput.isSelected() );
  36                         } );
  37                         // !!+ casts '0' to false
  38                         updateFont( !!+mw.user.options.get( 'fancysig' ) );
  39                 }
  40
  41                 // Highlight lint errors
  42                 $root.find( '[data-mw-lint-error-location]' ).each( function () {
  43                         const
  44                                 $item = $( this ),
  45                                 location = $item.data( 'mw-lint-error-location' ),
  46                                 button = new OO.ui.ButtonWidget( {
  47                                         label: mw.msg( 'prefs-signature-highlight-error' )
  48                                 } );
  49
  50                         button.on( 'click', () => {
  51                                 signatureInput.selectRange( location[ 0 ], location[ 1 ] );
  52                         } );
  53
  54                         $item.append( button.$element );
  55                 } );
  56
  57         } );
  58 }() );