= javascript_include_tag 'catarse_pagarme', 'https://pagar.me/assets/pagarme-v2.min.js'

#catarse_pagarme_form
  .next_step_after_valid_document
    .w-row.list_payment.w-form
      .w-col.w-col-7.w-col-small-7.back-payment-moip-options-column
        .w-radio.w-clearfix
          = radio_button_tag 'payment_type', "credit_card", false, class: 'w-radio-input back-payment-radio-button'
          = label_tag :payment_type_credit_card, nil, class: "cards w-form-label" do
            = image_tag 'catarse_bootstrap/payment_cards_pagarme.png'
      .w-col.w-col-5.w-col-small-5.back-payment-moip-options-column
        .w-radio.w-clearfix
          = radio_button_tag 'payment_type', "slip", false, class: 'w-radio-input back-payment-radio-button'
          = label_tag :payment_type_slip, class: "boleto w-form-label" do
            = image_tag 'catarse_bootstrap/payment_boleto.png'

  #payment_type_credit_card_section.payment_section
    = form_tag 'javascript:void(0);', :class => 'pagarme' do
      .pagarme-e-key data-key=CatarsePagarme.configuration.ecr_key
      div[class="my-credit-cards w-form back-payment-form-creditcard records-choice #{(current_user.credit_cards.present? ? '' : 'w-hidden')}"]
        - current_user.credit_cards.each_with_index do |credit_card, i|
          = label_tag "payment_subscription_card_#{credit_card.card_key}" do
            .w-row.creditcard-records
              .w-col.w-col-1.w-sub-col
                .w-radio.w-clearfix.back-payment-credit-card-radio-field
                  = radio_button_tag :payment_subscription_card, credit_card.card_key, i == 0, {"data-stored" => true}
              .w-col.w-col-2.w-sub-col.w-sub-col-middle
                .fontsize-small.fontweight-semibold.text-success
                  = credit_card.card_brand.upcase
              .w-col.w-col-5.w-sub-col.w-sub-col-middle
                .fontsize-small.fontweight-semibold.u-marginbottom-20
                  = "XXXX.XXXX.XXXX.#{credit_card.last_digits}"
              .w-col.w-col-4
                - if @contribution.value.to_f >= CatarsePagarme.configuration.minimum_value_for_installment.to_f
                  = select_tag :payment_card_installments, options_for_select(installments_for_select(payment)), class: 'w-select text-field text-field-creditcard'
        = label_tag :payment_subscription_card_0 do
          .w-row.creditcard-records
            .w-col.w-col-1.w-sub-col
              .w-radio.w-clearfix.back-payment-credit-card-radio-field
                = radio_button_tag :payment_subscription_card, 0
            .w-col.w-col-11
              .fontsize-small.fontweight-semibold.fontcolor-secondary
                = t('projects.contributions.edit.form_labels.user_another_card')
      div[class="w-form formwrapper type_card_data #{(current_user.credit_cards.present? ? 'w-hidden' : '')}"]
        .w-row
          .w-col.w-col-12
            .field-label.fontweight-semibold
              = label_tag :payment_card_name, t('projects.contributions.edit.form_labels.payment_card_name'), class: 'field-label fontweight-semibold'
              = text_field_tag :payment_card_name, nil, class: 'w-input text-field', required: true
              .fontsize-smaller.text-error.u-marginbottom-20.fa.fa-exclamation-triangle.w-hidden[data-error-for="payment_card_name"]
                | Por favor digite o nome escrito no cartão
        .w-row
          
          .w-col.w-col-9.w-col-small-9.w-col-tiny-9.w-sub-col
            = label_tag :payment_card_number, t('projects.contributions.edit.form_labels.payment_card_number'), class: 'fontweight-semibold field-label'
            = phone_field_tag :payment_card_number, nil, class: 'w-input text-field', required: true
            .fontsize-smaller.text-error.u-marginbottom-20.fa.fa-exclamation-triangle.w-hidden[data-error-for="payment_card_number"]
              | Por favor verifique o número do cartão de crédito
          .w-col.w-col-3.w-col-small-3.w-col-tiny-3
            = label_tag :payment_card_flag, t('projects.contributions.edit.form_labels.payment_card_flag'), class: 'fontweight-semibold field-label'
            #payment_card_flag.fontsize-smallest.fontcolor-secondary.u-text-center.w-input.text-field
              | 
        .w-row
          .w-col.w-col-6.w-col-small-6.w-col-tiny-6.w-sub-col
            = label_tag :payment_card_source, t('projects.contributions.edit.form_labels.payment_card_source'), class: 'field-label fontweight-semibold w-hidden-medium'
            = label_tag :payment_card_source, t('projects.contributions.edit.form_labels.payment_card_source_short'), class: 'field-label fontweight-semibold w-hidden-main w-hidden-small w-hidden-tiny'
            = phone_field_tag :payment_card_source, nil, class: 'w-input text-field', required: true, autocomplete: 'off'
            .fontsize-smaller.text-error.u-marginbottom-20.fa.fa-exclamation-triangle.w-hidden[data-error-for="payment_card_source"]
              | Veja o código de segurança do cartão abaixo da tarja magnética
          .w-col.w-col-6.w-col-small-6.w-col-tiny-6
            = label_tag :payment_card_date, t('projects.contributions.edit.form_labels.payment_card_date'), class: 'field-label fontweight-semibold'
            = phone_field_tag :payment_card_date, nil, class: 'w-input text-field', required: true
            .fontsize-smaller.text-error.u-marginbottom-20.fa.fa-exclamation-triangle.w-hidden[data-error-for="payment_card_date"]
              | Qual a data de expiração no cartão?
        - if @contribution.value.to_f >= CatarsePagarme.configuration.minimum_value_for_installment.to_f
          .w-row
            .w-col.w-col-6
              = label_tag :payment_card_installments, t('projects.contributions.edit.form_labels.payment_card_installments'), class: 'field-label fontweight-semibold'
              = select_tag :payment_card_installments, options_for_select(installments_for_select(payment)), class: 'w-select text-field'
        .w-checkbox.w-clearfix
          = check_box_tag :payment_save_card, 1, false, class: 'w-checkbox-input'
          = label_tag :payment_save_card, t('projects.contributions.edit.payment_save_card'), class: 'w-form-label'
      .w-row
        .w-col.w-col-12
          .payment-error-message.card.card-error.u-radius.zindex-10.u-marginbottom-30.w-hidden
            .fontsize-smaller.fontweight-bold.u-marginbottom-10= t('projects.contributions.edit.review_errors_title')
            .message-text.fontsize-smaller = t('.review_errors')
      .w-row
        .w-col.w-col-push-3.w-col-6
          #card-loading.loader.u-text-center.w-col.w-col-12.u-marginbottom-30 = image_tag "catarse_bootstrap/loader.gif"
          = submit_tag t('projects.contributions.review.form.labels.submit'), :class => 'btn btn-large u-marginbottom-20', :id => "credit_card_submit"
          = render partial: 'terms'

  #payment_type_slip_section.payment_section.w-hidden
    = simple_form_for current_user, url: 'javascript:void(0)' do |f|
      .w-row
        .w-col.w-col-12
          .payment-error-message.card.card-error.u-radius.zindex-10.u-marginbottom-30.w-hidden
            .fontsize-smaller.fontweight-bold.u-marginbottom-10= t('projects.contributions.edit.review_errors_title')
            .message-text.fontsize-smaller = t('.review_errors')
      .w-row.after-success
        .w-col.w-col-12
          #payment-slip-link.card.card-message.fontsize-small.u-radius.u-marginbottom-30.zindex-10.w-hidden
            .link_content.fontsize-small
            .fontsize-small= t('projects.contributions.edit.review_slip_email')
      .w-row
        .w-col.w-col-12
          .u-margintop-30.u-marginbottom-60.u-radius.card-big.card
            - expiration_date = (CatarsePagarme.configuration.slip_week_day_interval || 2).weekdays_from_now
            .fontsize-small.u-marginbottom-20= t('projects.contributions.edit.slip_expiration', date: l(expiration_date.to_date))
            .fontsize-small.u-marginbottom-40= t('projects.contributions.edit.slip_message')

            .w-row
              .w-col.w-col-8.w-col-offset-2
                #card-loading.loader.u-text-center.w-col.w-col-12.u-marginbottom-30 = image_tag "catarse_bootstrap/loader.gif"
                = submit_tag t('projects.contributions.review.form.labels.build_boleto'), :class => 'btn btn-large u-marginbottom-20', :id => "build_boleto"
                = render partial: 'terms'