|
var SUCCESS_MESSAGES = { |
|
'en': { |
|
'complete the subscription': 'Confirm the subscription in your inbox', |
|
'default': 'Confirm the subscription in your inbox' |
|
}, |
|
'de': { |
|
'complete the subscription': 'Bestätigen Sie das Abonnement in Ihrer Inbox', |
|
'default': 'Bestätigen Sie das Abonnement in Ihrer Inbox' |
|
} |
|
} |
|
|
|
var ERROR_MESSAGES = { |
|
'en': { |
|
'contain a single': 'Your email must contain an @', |
|
'enter a value': 'Your email can\'t be blank', |
|
'the portion after': 'Your email looks incorrect', |
|
'the portion before': 'Your email looks incorrect', |
|
'looks fake or invalid': 'Your email looks incorrect', |
|
'already subscribed': 'Your email is already subscribed', |
|
'default': 'Your subscription didn\'t go through. Try again.' |
|
}, |
|
'de': { |
|
'contain a single': 'Ihre E-Mail muss eine @', |
|
'enter a value': 'Ihre E-Mail kann nicht leer sein', |
|
'the portion after': 'Ihre E-Mail-Adresse ist falsch', |
|
'the portion before': 'Ihre E-Mail-Adresse ist falsch', |
|
'looks fake or invalid': 'Ihre E-Mail-Adresse ist falsch', |
|
'already subscribed': 'Ihre E-Mail ist schon abonniert', |
|
'default': 'Ihr Abonnement ging nicht durch. Versuch es noch einmal.' |
|
} |
|
}; |
|
|
|
function getMessage(target, where) { |
|
for (var piece in where) { |
|
if(target.indexOf(piece) >= 0) { |
|
return where[piece]; |
|
} |
|
} |
|
|
|
return where['default']; |
|
} |
|
|
|
// return an appropriate success message |
|
function getSuccessMessage(message, lang) { |
|
return getMessage(message, SUCCESS_MESSAGES[lang]); |
|
} |
|
|
|
// return an appropriate error message |
|
function getErrorMessage(message, lang) { |
|
return getMessage(message, ERROR_MESSAGES[lang]); |
|
} |
|
|
|
function handleSubmitSuccess($form, data, message, xhr) { |
|
var $message = $form.find('.message'); |
|
var $input = $form.find('input[type="email"]'); |
|
var lang = $form.hasClass('de') ? 'de' : 'en'; |
|
|
|
if(data.result === 'error') { |
|
$form.addClass('error'); |
|
$message.text(getErrorMessage(data.msg, lang)); |
|
$input.focus(); |
|
return; |
|
} |
|
|
|
$form.addClass('ok'); |
|
$message.text(getSuccessMessage(data.msg, lang)); |
|
$input.blur(); |
|
$form.focus(); |
|
} |
|
|
|
function handleSubmitError($form) { |
|
var $message = $form.find('.message'); |
|
var $input = $form.find('input[type="email"]'); |
|
var lang = $form.hasClass('de') ? 'de' : 'en'; |
|
|
|
console.error('Submit error', arguments) |
|
|
|
$form.addClass('error'); |
|
$message.text(getErrorMessage('default', lang)); |
|
$input.focus(); |
|
} |
|
|
|
function handleSubmitTeardown($form) { |
|
var $submit = $form.find('input[type="submit"]'); |
|
$submit.prop('disabled', false); |
|
} |
|
|
|
function handleSubmit(event) { |
|
var $form = $(event.target).closest('form'); |
|
var $submit = $form.find('input[type="submit"]'); |
|
var $input = $form.find('input[type="email"]'); |
|
var url = $form.attr('action'); |
|
var requestData = {}; |
|
|
|
event.preventDefault(); |
|
|
|
$.each($form.serializeArray(), function (index, item) { |
|
requestData[item.name] = item.value; |
|
}); |
|
|
|
$submit.prop('disabled', true); |
|
$form.removeClass('ok error'); |
|
|
|
$.ajax({ |
|
url: url, |
|
data: requestData, |
|
dataType: 'jsonp' |
|
}) |
|
.done($.proxy(handleSubmitSuccess, this, $form)) |
|
.fail($.proxy(handleSubmitError, this, $form)) |
|
.always($.proxy(handleSubmitTeardown, this, $form)); |
|
$input.focus(); |
|
} |
|
|
|
function handleFocus(event) { |
|
var $target = $(event.target); |
|
var $form = $target.closest('form'); |
|
|
|
if($form.hasClass('ok')) { |
|
$form.removeClass('ok'); |
|
} |
|
} |
|
|
|
function init() { |
|
var $form = $('.newsletter form'); |
|
var $input = $('.newsletter input[type="email"]'); |
|
|
|
$form.on('submit', handleSubmit); |
|
$input.on('focus', handleFocus); |
|
} |
|
|
|
$(init); |