resources/mediawiki.special/mediawiki.special.preferences.js

   1 /*
   2  * JavaScript for Special:Preferences
   3  */
   4 ( function( $, mw ) {
   5
   6 $( '#prefsubmit' ).attr( 'id', 'prefcontrol' );
   7 $( '#preferences' )
   8         .addClass( 'jsprefs' )
   9         .before( $( '<ul id="preftoc"></ul>' ) )
  10         .children( 'fieldset' )
  11                 .hide()
  12                 .addClass( 'prefsection' )
  13                 .children( 'legend' )
  14                         .addClass( 'mainLegend' )
  15                         .each( function( i, legend ) {
  16                                         $(legend).parent().attr( 'id', 'prefsection-' + i );
  17                                         if ( i === 0 ) {
  18                                                 $(legend).parent().show();
  19                                         }
  20                                         var ident = $(legend).parent().attr( 'title' );
  21                                         $( '#preftoc' ).append(
  22                                                 $( '<li></li>' )
  23                                                         .addClass( i === 0 ? 'selected' : null )
  24                                                         .append(
  25                                                                 $( '<a></a>')
  26                                                                         .text( $(legend).text() )
  27                                                                         .attr( 'id', 'preftab-' + ident + '-tab' )
  28                                                                         .attr( 'href', '#preftab-' + ident ) // Use #preftab-N instead of #prefsection-N to avoid jumping on click
  29                                                                         .click( function() {
  30                                                                                 $(this).parent().parent().find( 'li' ).removeClass( 'selected' );
  31                                                                                 $(this).parent().addClass( 'selected' );
  32                                                                                 $( '#preferences > fieldset' ).hide();
  33                                                                                 $( '#prefsection-' + i ).show();
  34                                                                         } )
  35                                                         )
  36                                         );
  37                                 }
  38                         );
  39
  40 // If we've reloaded the page or followed an open-in-new-window,
  41 // make the selected tab visible.
  42 // On document ready:
  43 $( function() {
  44         var hash = window.location.hash;
  45         if( hash.match( /^#preftab-[\w-]+/ ) ) {
  46                 var $tab = $( hash + '-tab' );
  47                 $tab.click();
  48         }
  49 } );
  50
  51 /**
  52  * Given an email validity status (true, false, null) update the label CSS class
  53  */
  54 var updateMailValidityLabel = function( mail ) {
  55         var     isValid = mw.util.validateEmail( mail ),
  56                 $label = $( '#mw-emailaddress-validity' );
  57
  58         // We allow empty address
  59         if( isValid === null ) {
  60                 $label.text( '' ).removeClass( 'valid invalid' );
  61
  62         // Valid
  63         } else if ( isValid ) {
  64                 $label.text( mw.msg( 'email-address-validity-valid' ) ).addClass( 'valid' ).removeClass( 'invalid' );
  65
  66         // Not valid
  67         } else {
  68                 $label.text( mw.msg( 'email-address-validity-invalid' ) ).addClass( 'invalid' ).removeClass( 'valid' );
  69         }
  70 };
  71
  72 // Lame tip to let user know if its email is valid. See bug 22449
  73 // Only bind once for 'blur' so that the user can fill it in without errors
  74 // After that look at every keypress for direct feedback if it was invalid onblur
  75 $( '#mw-input-wpemailaddress' ).one( 'blur', function() {
  76         if ( $( '#mw-emailaddress-validity' ).length === 0 ) {
  77                 $(this).after( '<label for="mw-input-wpemailaddress" id="mw-emailaddress-validity"></label>' );
  78         }
  79         updateMailValidityLabel( $(this).val() );
  80         $(this).keyup( function() {
  81                 updateMailValidityLabel( $(this).val() );
  82         } );
  83 } );
  84
  85
  86
  87 /**
  88 * Timezone functions.
  89 * Guesses Timezone from browser and updates fields onchange
  90 */
  91
  92 var $tzSelect = $( '#mw-input-wptimecorrection' );
  93 var $tzTextbox = $( '#mw-input-wptimecorrection-other' );
  94
  95 var $localtimeHolder = $( '#wpLocalTime' );
  96 var servertime = parseInt( $( 'input[name=wpServerTime]' ).val(), 10 );
  97 var minuteDiff = 0;
  98
  99 var minutesToHours = function( min ) {
 100         var tzHour = Math.floor( Math.abs( min ) / 60 );
 101         var tzMin = Math.abs( min ) % 60;
 102         var tzString = ( ( min >= 0 ) ? '' : '-' ) + ( ( tzHour < 10 ) ? '0' : '' ) + tzHour +
 103                 ':' + ( ( tzMin < 10 ) ? '0' : '' ) + tzMin;
 104         return tzString;
 105 };
 106
 107 var hoursToMinutes = function( hour ) {
 108         var arr = hour.split( ':' );
 109         arr[0] = parseInt( arr[0], 10 );
 110
 111         var minutes;
 112         if ( arr.length == 1 ) {
 113                 // Specification is of the form [-]XX
 114                 minutes = arr[0] * 60;
 115         } else {
 116                 // Specification is of the form [-]XX:XX
 117                 minutes = Math.abs( arr[0] ) * 60 + parseInt( arr[1], 10 );
 118                 if ( arr[0] < 0 ) {
 119                         minutes *= -1;
 120                 }
 121         }
 122         // Gracefully handle non-numbers.
 123         if ( isNaN( minutes ) ) {
 124                 return 0;
 125         } else {
 126                 return minutes;
 127         }
 128 };
 129
 130 var updateTimezoneSelection = function() {
 131         var type = $tzSelect.val();
 132         if ( type == 'guess' ) {
 133                 // Get browser timezone & fill it in
 134                 minuteDiff = -new Date().getTimezoneOffset();
 135                 $tzTextbox.val( minutesToHours( minuteDiff ) );
 136                 $tzSelect.val( 'other' );
 137                 $tzTextbox.get( 0 ).disabled = false;
 138         } else if ( type == 'other'  ) {
 139                 // Grab data from the textbox, parse it.
 140                 minuteDiff = hoursToMinutes( $tzTextbox.val() );
 141         } else {
 142                 // Grab data from the $tzSelect value
 143                 minuteDiff = parseInt( type.split( '|' )[1], 10 ) || 0;
 144                 $tzTextbox.val( minutesToHours( minuteDiff ) );
 145         }
 146
 147         // Determine local time from server time and minutes difference, for display.
 148         var localTime = servertime + minuteDiff;
 149
 150         // Bring time within the [0,1440) range.
 151         while ( localTime < 0 ) {
 152                 localTime += 1440;
 153         }
 154         while ( localTime >= 1440 ) {
 155                 localTime -= 1440;
 156         }
 157         $localtimeHolder.text( minutesToHours( localTime ) );
 158 };
 159
 160 if ( $tzSelect.length && $tzTextbox.length ) {
 161         $tzSelect.change( function() { updateTimezoneSelection(); } );
 162         $tzTextbox.blur( function() { updateTimezoneSelection(); } );
 163         updateTimezoneSelection();
 164 }
 165 } )( jQuery, mediaWiki );