resources/src/mediawiki.special/mediawiki.special.userlogin.signup.js

   1 /*!
   2  * JavaScript for signup form.
   3  */
   4 ( function ( mw, $ ) {
   5         // Check if the username is invalid or already taken
   6         $( function () {
   7                 var
   8                         // We need to hook to all of these events to be sure we are notified of all changes to the
   9                         // value of an <input type=text> field.
  10                         events = 'keyup keydown change mouseup cut paste focus blur',
  11                         $input = $( '#wpName2' ),
  12                         $statusContainer = $( '#mw-createacct-status-area' ),
  13                         api = new mw.Api(),
  14                         currentRequest;
  15
  16                 // Hide any present status messages.
  17                 function clearStatus() {
  18                         $statusContainer.slideUp( function () {
  19                                 $statusContainer
  20                                         .removeAttr( 'class' )
  21                                         .empty();
  22                         } );
  23                 }
  24
  25                 // Returns a promise receiving a { state:, username: } object, where:
  26                 // * 'state' is one of 'invalid', 'taken', 'ok'
  27                 // * 'username' is the validated username if 'state' is 'ok', null otherwise (if it's not
  28                 //   possible to register such an account)
  29                 function checkUsername( username ) {
  30                         // We could just use .then() if we didn't have to pass on .abort()…
  31                         var d, apiPromise;
  32
  33                         d = $.Deferred();
  34                         apiPromise = api.get( {
  35                                 action: 'query',
  36                                 list: 'users',
  37                                 ususers: username // '|' in usernames is handled below
  38                         } )
  39                                 .done( function ( resp ) {
  40                                         var userinfo = resp.query.users[ 0 ];
  41
  42                                         if ( resp.query.users.length !== 1 ) {
  43                                                 // Happens if the user types '|' into the field
  44                                                 d.resolve( { state: 'invalid', username: null } );
  45                                         } else if ( userinfo.invalid !== undefined ) {
  46                                                 d.resolve( { state: 'invalid', username: null } );
  47                                         } else if ( userinfo.userid !== undefined ) {
  48                                                 d.resolve( { state: 'taken', username: null } );
  49                                         } else {
  50                                                 d.resolve( { state: 'ok', username: username } );
  51                                         }
  52                                 } )
  53                                 .fail( d.reject );
  54
  55                         return d.promise( { abort: apiPromise.abort } );
  56                 }
  57
  58                 function updateUsernameStatus() {
  59                         var
  60                                 username = $.trim( $input.val() ),
  61                                 currentRequestInternal;
  62
  63                         // Abort any pending requests.
  64                         if ( currentRequest ) {
  65                                 currentRequest.abort();
  66                         }
  67
  68                         if ( username === '' ) {
  69                                 clearStatus();
  70                                 return;
  71                         }
  72
  73                         currentRequest = currentRequestInternal = checkUsername( username ).done( function ( info ) {
  74                                 var message;
  75
  76                                 // Another request was fired in the meantime, the result we got here is no longer current.
  77                                 // This shouldn't happen as we abort pending requests, but you never know.
  78                                 if ( currentRequest !== currentRequestInternal ) {
  79                                         return;
  80                                 }
  81                                 // If we're here, then the current request has finished, avoid calling .abort() needlessly.
  82                                 currentRequest = undefined;
  83
  84                                 if ( info.state === 'ok' ) {
  85                                         clearStatus();
  86                                 } else {
  87                                         if ( info.state === 'invalid' ) {
  88                                                 message = mw.message( 'noname' ).text();
  89                                         } else if ( info.state === 'taken' ) {
  90                                                 message = mw.message( 'userexists' ).text();
  91                                         }
  92
  93                                         $statusContainer
  94                                                 .attr( 'class', 'errorbox' )
  95                                                 .empty()
  96                                                 .append(
  97                                                         // Ugh…
  98                                                         // TODO Change the HTML structure in includes/templates/Usercreate.php
  99                                                         $( '<strong>' ).text( mw.message( 'createacct-error' ).text() ),
 100                                                         $( '<br>' ),
 101                                                         document.createTextNode( message )
 102                                                 )
 103                                                 .slideDown();
 104                                 }
 105                         } ).fail( function () {
 106                                 clearStatus();
 107                         } );
 108                 }
 109
 110                 $input.on( events, $.debounce( 1000, updateUsernameStatus ) );
 111         } );
 112 }( mediaWiki, jQuery ) );