<?php
/**
 * @version 7.9 [rev.7.9.02]
 */
?>
<h5><?php echo $this->_('Subscribe to Newsletter'); ?></h5>
<form method="post"
      class="form-inline"
      action="<?php echo $this->url(array('module' => 'app', 'controller' => 'async', 'action' => 'newsletter-subscription')); ?>"
      id="form-newsletter-subscription">
    <input type="text" name="email" value="" class="form-control input-medium"
           placeholder="<?php echo $this->_('Enter your email address'); ?>">
    <button type="submit" name="submit" class="btn btn-primary"><?php echo $this->_('Subscribe'); ?></button>
    <div class="message"></div>
</form>

<script type="text/javascript">
    $(document).ready(function () {
        // submit modal forms in the modal box, and replace the current html with the response html
        $('#form-newsletter-subscription').find('[type=submit]').on('click', function (e) {
            e.preventDefault();

            var newsletterSubmitButton = $(this);
            var newsletterSubmitValue = newsletterSubmitButton.text();

            newsletterSubmitButton.attr('disabled', true).text('Please wait..');

            var newsletterSubscriptionForm = $(this).closest('form');

            $.ajax({
                type: newsletterSubscriptionForm.attr('method'),
                url: newsletterSubscriptionForm.attr('action'),
                data: newsletterSubscriptionForm.serialize(),

                success: function (data) {
                    newsletterSubmitButton.attr('disabled', false).text(newsletterSubmitValue);
                    newsletterSubscriptionForm.find('.message').html(data.message);
                    newsletterSubscriptionForm.find('[name="email"]').val('');

                    setTimeout(function() {
                        newsletterSubscriptionForm.find('.message').html('');
                    }, 5000);
                }
            });
        });
    });
</script>


