Last active
January 29, 2016 10:16
-
-
Save Corstiaan84/0eba16d99c22b6378edd to your computer and use it in GitHub Desktop.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<style>.email-octopus-form-wrapper h2{font-size:20px;margin:0 0 25px 0;}.email-octopus-form-row{margin-bottom:15px;}.email-octopus-form-row label{display:block;}.email-octopus-form-row input{width:400px;padding:8px;height:32px;border:1px solid #ccc;}.email-octopus-form-row-subscribe{margin-top:20px;}.email-octopus-form-row-subscribe button{background-color:#e0e0e0;padding:6px 12px;border:0;font-weight:bold;}.email-octopus-form-row-hp{position:absolute;left:-5000px;}.email-octopus-error-message{color:#e74c3c;}.email-octopus-referral{margin-top:20px;}</style> | |
<div class="email-octopus-form-wrapper"> | |
<h2 class="email-octopus-heading" style="display: none;">Subscribe to Fluxmatix NL</h2> | |
<p class="email-octopus-success-message"></p> | |
<p class="email-octopus-error-message"></p> | |
<form method="post" action="https://emailoctopus.com/lists/34cea4d0-9b4d-11e5-a76d-0a4287b2e8c5/members/external-add" class="email-octopus-form"> | |
<div class="email-octopus-form-row"> | |
<label>Email address (required)</label> | |
<input type="email" name="emailAddress" class="email-octopus-email-address"> | |
</div> | |
<div class="email-octopus-form-row" style="display: none;"> | |
<label>First name</label> | |
<input type="text" name="firstName" class="email-octopus-first-name"> | |
</div> | |
<div class="email-octopus-form-row" style="display: none;"> | |
<label>Last name</label> | |
<input type="text" name="lastName" class="email-octopus-last-name"> | |
</div> | |
<div class="email-octopus-form-row-hp"> | |
<label>Protecting against bot signups - leave this field blank</label> | |
<input type="text" name="hp34cea4d0-9b4d-11e5-a76d-0a4287b2e8c5" autocomplete="off"> | |
</div> | |
<div class="email-octopus-form-row-subscribe"> | |
<button type="submit">Subscribe</button> | |
</div> | |
</form> | |
<div class="email-octopus-referral" style="display: none;"> | |
Powered by <a href="/">EmailOctopus</a> | |
</div> | |
</div> | |
<script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script> | |
<script> | |
var emailOctopus = { | |
successMessage: 'Thanks for subscribing!', | |
missingEmailAddressMessage: 'Your email address is required.', | |
invalidEmailAddressMessage: 'Your email address looks incorrect, please try again.', | |
botSubmissionErrorMessage: 'This doesn\'t look like a human submission.', | |
unknownErrorMessage: 'Sorry, an unknown error has occurred. Please try again later.', | |
isBotPost: function() { | |
return $('.email-octopus-form-row-hp input').val(); | |
}, | |
basicValidateEmail: function(email) { | |
var regex = /\S+@\S+\.\S+/; | |
return regex.test(email); | |
}, | |
ajaxSuccess: function() { | |
$('.email-octopus-success-message').text( | |
emailOctopus.successMessage | |
); | |
$('.email-octopus-form').hide(); | |
}, | |
ajaxError: function(textStatus) { | |
var response = $.parseJSON(textStatus.responseText); | |
if (response && response.error && response.error.code) { | |
switch(response.error.code) { | |
case 'INVALID_PARAMETERS': | |
$('.email-octopus-error-message').text( | |
emailOctopus.invalidParametersErrorMessage | |
); | |
return; | |
case 'BOT_SUBMISSION': | |
$('.email-octopus-error-message').text( | |
emailOctopus.botSubmissionErrorMessage | |
); | |
return; | |
} | |
} | |
$('.email-octopus-error-message').text( | |
emailOctopus.unknownErrorMessage | |
); | |
}, | |
ajaxSubmit: function() { | |
var form = $('.email-octopus-form'); | |
$.ajax({ | |
type: form.attr('method'), | |
url: form.attr('action'), | |
data: form.serialize(), | |
success: function() { | |
emailOctopus.ajaxSuccess(); | |
}, | |
error: function(textStatus) { | |
emailOctopus.ajaxError(textStatus); | |
}, | |
}); | |
} | |
} | |
$(function() { | |
$('.email-octopus-form').submit(function(e) { | |
$('.email-octopus-error-message').empty(); | |
var emailAddress = $('.email-octopus-email-address').val(); | |
if (emailOctopus.isBotPost()) { | |
$('.email-octopus-error-message').text( | |
emailOctopus.botSubmissionErrorMessage | |
); | |
} else if (!$.trim(emailAddress)) { | |
$('.email-octopus-error-message').text( | |
emailOctopus.missingEmailAddressMessage | |
); | |
} else if (!emailOctopus.basicValidateEmail(emailAddress)) { | |
$('.email-octopus-error-message').text( | |
emailOctopus.invalidParametersErrorMessage | |
); | |
} else { | |
emailOctopus.ajaxSubmit(); | |
} | |
return false; | |
}); | |
}); | |
</script> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment