<hr class="clear" />
<div class="module-newsletter top-margin-large">
  <div class="container-fluid vertical-padding-x-large">
    <div class="row">
      <div class="col-xs-12">
        <div class="content-box text-center">
          <b class="text-medium text-uppercase visible-block text-dark">
            {{text_mensagem}}
          </b>
          <span class="text-small visible-block bottom-margin-large text-dark">
            {{text_infomacao}}
          </span>
          <div class="field-group field-group-inline field-newsletter margin-x-small vertical-top">
            <input type="text" class="input-text field-entry field-entry-medium input-newsletter" name="newsletter_email" value="" placeholder="{{text_placeholder_email}}">
          </div>
          <div class="field-group field-group-inline margin-x-small vertical-top">
            <button type="button" class="btn-default btn-medium-square js-btn-inscrever" title="{{button_add}}">
              <span>{{button_add}}</span>
            </button>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>


<script type="text/javascript">
window.waitEvent('scripts_document', function() {
$('.js-btn-inscrever').on('click', function(event) {

    event.preventDefault();

    $.ajax({
      url: 'index.php?route=common/module_newsletter/newsletter',
      type: 'POST',
      data: 'email='+$("input[name='newsletter_email']").val(),
      dataType: 'json',
      beforeSend: function(){
        $('.js-btn-inscrever').addClass('btn-loading');
        $('.js-btn-inscrever').attr('disabled', true);
      },
      complete: function(){
        $('.js-btn-inscrever').removeClass('btn-loading');
        $('.js-btn-inscrever').attr('disabled', false);
      },
      success: function(json) {

        $('.text-error, .text-success').remove();
        $('.input-newsletter').removeClass('border-error border-success');

        if(json['error']){
          $('.input-newsletter').addClass('border-error').after('<span class="text-error visible-block top-margin-small abs">' + json['error'] + '</span>');
        }

        if(json['success']){
          $('.input-newsletter').addClass('border-success').after('<span class="text-success visible-block top-margin-small abs">' + json['success'] + '</span>');
        }

        $('.text-error, .text-success').delay(5000).fadeOut(400,function(){
          $('.text-error, .text-success').remove();
          $('.input-newsletter').removeClass('border-error border-success');
        });

      }
    });

});
});
</script>
