Skip to content
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
75 changes: 75 additions & 0 deletions validator.coffee
Original file line number Diff line number Diff line change
@@ -0,0 +1,75 @@

# constants

EMAIL_REGEX = /// # this is NOT comprehensive and only allows common format emails
[a-z0-9._-]+
@
[a-z0-9._-]+
\.
[a-z0-9._-]+
///i

ERROR_MESSAGE_MAP = # edit this if error message types or their ordering changes
invalidEmail: 0
passwordTooShort: 1
passwordMissingDigit: 2
passwordMissingCapitalLetter: 3

# html elements we will use

loginForm = $ "form"
emailInput = loginForm.children("input[type='text']")
passwordInput = loginForm.children("input[type='password']")
submitButton = loginForm.children("input[type='submit']")
errorMessages = $ ".errors li"
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

👍 for saving jQuery elements to variables. I recommend adding $ to the beginning of your variable names, I find it makes it easier to remember if a variable represents a jQuery element or a standard JavaScript element (Node).


# helper functions

getEmailErrors = (typing) ->
emailAddress = emailInput.val()
return {} if emailAddress.length == 0 && typing
invalidEmail: not EMAIL_REGEX.test emailAddress

getPasswordErrors = (typing) ->
password = passwordInput.val()
return {} if password.length == 0 && typing
passwordTooShort: password.length < 8
passwordMissingDigit: not /\d/.test password
passwordMissingCapitalLetter: not /[A-Z]/.test password

getAllErrors = (typing) ->
$.extend {}, getEmailErrors(typing), getPasswordErrors(typing)

isErrorFree = (errors) ->
for own errorKey, hasError of errors
return false if hasError
true
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

You might find Array.prototype.some() helpful here (it's similar to any? in Ruby).


updateErrorVisibility = (errors) ->
for own errorKey, errorIndex of ERROR_MESSAGE_MAP
errorMessages.eq(errorIndex).toggle !!errors[errorKey]

doTypingErrorCheck = () ->
errors = getAllErrors true
updateErrorVisibility errors
if (errorKey for own errorKey of errors).length > 0 && isErrorFree errors
submitButton.removeAttr "disabled"
else
submitButton.attr "disabled", "disabled"

# dom events

loginForm.submit (event) ->
errors = getAllErrors(false)
return if isErrorFree(errors)
updateErrorVisibility errors
event.preventDefault()

emailInput.change doTypingErrorCheck
emailInput.keyup doTypingErrorCheck
passwordInput.change doTypingErrorCheck
passwordInput.keyup doTypingErrorCheck

# initialization

doTypingErrorCheck()
118 changes: 113 additions & 5 deletions validator.js

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.