r79910 MediaWiki - Code Review archive

Repository:MediaWiki
Revision:r79909‎ | r79910 | r79911 >
Date:18:36, 9 January 2011
Author:hashar
Status:ok (Comments)
Tags:
Comment:
js email validation improvment (onBlur)

commit log more or less follow the diff order:
* adds an id to the UserPreferences form (#mw-prefs-form)
* Add an handler on the form submission to validate the email. This also
update the label and, when email is invalid, get focus on the field.
* use onBlur javascript event instead of onKeyUp (per r75670 CR)
* Label update is now a function ... (wfUpdateMailValidityLabel)
* ... let us update the label on form submission
* Clear the label message when email is empty (null)
* Made the js regexp to stop capturing
* Fix js email validation function to return a boolean
(it still return 'null' when given an empty email address)
Modified paths:
  • /trunk/phase3/includes/Preferences.php (modified) (history)
  • /trunk/phase3/resources/mediawiki.special/mediawiki.special.preferences.js (modified) (history)

Diff [purge]

Index: trunk/phase3/includes/Preferences.php
@@ -1154,6 +1154,7 @@
11551155 $formDescriptor = Preferences::getPreferences( $user );
11561156 $htmlForm = new $formClass( $formDescriptor, 'prefs' );
11571157
 1158+ $htmlForm->setId( 'mw-prefs-form' );
11581159 $htmlForm->setSubmitText( wfMsg( 'saveprefs' ) );
11591160 # Used message keys: 'accesskey-preferences-save', 'tooltip-preferences-save'
11601161 $htmlForm->setSubmitTooltip( 'preferences-save' );
Index: trunk/phase3/resources/mediawiki.special/mediawiki.special.preferences.js
@@ -39,26 +39,52 @@
4040 );
4141 } );
4242
 43+// User preference form validation
 44+$( '#mw-prefs-form' )
 45+ .submit( function () {
 46+ var isValid = wfValidateEmail( $('#mw-input-wpemailaddress').val() );
 47+ wfUpdateMailValidityLabel( isValid );
 48+ if(isValid == false ) {
 49+ $('#mw-input-wpemailaddress').focus();
 50+ return false;
 51+ }
 52+ }
 53+);
 54+
4355 // Lame tip to let user know if its email is valid. See bug 22449
4456 $( '#mw-input-wpemailaddress' )
45 - .keyup( function () {
 57+ .blur( function () {
4658 if( $( "#mw-emailaddress-validity" ).length == 0 ) {
4759 $(this).after( '<label for="mw-input-wpemailaddress" id="mw-emailaddress-validity"></label>' );
4860 }
4961 var isValid = wfValidateEmail( $(this).val() );
50 - var class_to_add = isValid ? 'valid' : 'invalid';
51 - var class_to_remove = isValid ? 'invalid' : 'valid';
52 - $( '#mw-emailaddress-validity' )
53 - .text(
54 - isValid ?
55 - mediaWiki.msg( 'email-address-validity-valid' )
56 - : mediaWiki.msg( 'email-address-validity-invalid' )
57 - )
58 - .addClass( class_to_add )
59 - .removeClass( class_to_remove );
 62+ wfUpdateMailValidityLabel( isValid );
6063 } );
6164
6265 /**
 66+ * Given an email validity status (true, false, null) update the label CSS class
 67+ */
 68+wfUpdateMailValidityLabel = function( isValid ) {
 69+ var class_to_add = isValid ? 'valid' : 'invalid';
 70+ var class_to_remove = isValid ? 'invalid' : 'valid';
 71+
 72+ // We allow null address
 73+ if( isValid == null ) {
 74+ $( '#mw-emailaddress-validity' ).text( '' )
 75+ .removeClass( 'valid invalid');
 76+ } else {
 77+ $( '#mw-emailaddress-validity' )
 78+ .text(
 79+ isValid ?
 80+ mediaWiki.msg( 'email-address-validity-valid' )
 81+ : mediaWiki.msg( 'email-address-validity-invalid' )
 82+ )
 83+ .addClass( class_to_add )
 84+ .removeClass( class_to_remove );
 85+ }
 86+}
 87+
 88+/**
6389 * Validate a string as representing a valid e-mail address
6490 * according to HTML5 specification. Please note the specification
6591 * does not validate a domain with one character.
@@ -120,12 +146,12 @@
121147 '[' + rfc1034_ldh_str + ']+'
122148 +
123149 // Second part and following are separated by a dot
124 - '(\\.[' + rfc1034_ldh_str + ']+)+'
 150+ '(?:\\.[' + rfc1034_ldh_str + ']+)+'
125151 +
126152 // End of string
127153 '$',
128154 // RegExp is case insensitive
129155 'i'
130156 );
131 - return mailtxt.match( HTML5_email_regexp );
 157+ return (null != mailtxt.match( HTML5_email_regexp ) );
132158 };

Follow-up revisions

RevisionCommit summaryAuthorDate
r79924* Consistent single quotes...krinkle04:40, 10 January 2011

Past revisions this follows-up on

RevisionCommit summaryAuthorDate
r75670Follow up r75627 (code review comments):...hashar20:44, 29 October 2010

Comments

#Comment by Krinkle (talk | contribs)   03:14, 10 January 2011
+		if(isValid == false ) {

Use a strict comparison (===) to compare boleaan values, or better use the reverse:

		if ( !isValid ) {
+wfUpdateMailValidityLabel = function( isValid ) {

Please don't use the "wf" prefix as this is a PHP convention that does not apply to JavaScript and is also (if we would apply it) false since this is not a global function.

Define it as local using "var updateMailValidityLabel" or attach it to the global window object "window.UpdateMailValidityLabel = " if you need it in other files. ..which is not the case ,and if it would be, mediawiki.special.preferences.js is the wrong place for it to be defined in since that file is not loaded on other pages and on the pages it is loaded it's not in the global namespace.

#Comment by Hashar (talk | contribs)   20:03, 10 January 2011

Above comment implemented by Krinkle with r79924.

Status & tagging log