|
|
@@ -40,107 +40,110 @@ block content
|
|
|
) {{currency}} ({{value['symbol']}})
|
|
|
div .
|
|
|
h2.pull-right {{price}}
|
|
|
- form(ng-show="planName")
|
|
|
-
|
|
|
- hr
|
|
|
+ hr
|
|
|
+ .row
|
|
|
+ .col-md-offset-1.col-md-10
|
|
|
+ form(ng-show="planName")
|
|
|
+
|
|
|
|
|
|
- .row
|
|
|
- .col-md-12
|
|
|
- .form-group
|
|
|
+ .row
|
|
|
+ .col-md-12
|
|
|
+ .form-group
|
|
|
+ .row
|
|
|
+ .col-md-3
|
|
|
+ label.radio-inline
|
|
|
+ img(src="/recurly/images/credit_cards/mastercard.png")
|
|
|
+ img(src="/recurly/images/credit_cards/visa.png")
|
|
|
+ input(type="radio",value="credit_card", ng-model="paymentMethod")
|
|
|
+ .col-md-4
|
|
|
+ label.radio-inline
|
|
|
+ img(src="/recurly/images/paypal_logo.png")
|
|
|
+ input(type="radio", value="paypal", ng-model="paymentMethod")
|
|
|
+
|
|
|
+ .alert.alert-warning.small(ng-show="genericError")
|
|
|
+ strong {{genericError}}
|
|
|
+
|
|
|
+ .div(ng-hide="paymentMethod == 'paypal'")
|
|
|
.row
|
|
|
+ .col-md-12
|
|
|
+ .form-group
|
|
|
+ div(ng-hide="validation.correctCvv") #{translate("invalid")} CVV
|
|
|
+ div(ng-hide="validation.correctCardNumber") #{translate("invalid")} #{translate("credit_card_number")}
|
|
|
+ .row
|
|
|
+ .col-md-6
|
|
|
+ .form-group(ng-class="validation.correctCardNumber ? '' : 'has-error' ")
|
|
|
+ input.form-control(ng-model='data.number', ng-blur="validateCardNumber()", placeholder="#{translate('credit_card_number')}")
|
|
|
.col-md-3
|
|
|
- label.radio-inline
|
|
|
- img(src="/recurly/images/credit_cards/mastercard.png")
|
|
|
- img(src="/recurly/images/credit_cards/visa.png")
|
|
|
- input(type="radio",value="credit_card", ng-model="paymentMethod")
|
|
|
- .col-md-4
|
|
|
- label.radio-inline
|
|
|
- img(src="/recurly/images/paypal_logo.png")
|
|
|
- input(type="radio", value="paypal", ng-model="paymentMethod")
|
|
|
-
|
|
|
- .alert.alert-warning.small(ng-show="genericError")
|
|
|
- strong {{genericError}}
|
|
|
+ .form-group(ng-class="validation.correctCvv ? '' : 'has-error' ")
|
|
|
+ input.form-control(ng-model='data.cvv', ng-blur="validateCvv()", placeholder="CVV")
|
|
|
+ .row
|
|
|
+ div(ng-hide="validation.correctExpiry") #{translate("invalid")} #{translate("expiry")}
|
|
|
+ .col-md-2
|
|
|
+ .form-group(ng-class="validation.correctExpiry ? '' : 'has-error' ")
|
|
|
+ select(data-recurly='month', ng-change="validateExpiry()", ng-model='data.month')
|
|
|
+ option(value="", disabled, selected) Month
|
|
|
+ option(value="01") 01
|
|
|
+ option(value="02") 02
|
|
|
+ option(value="03") 03
|
|
|
+ option(value="04") 04
|
|
|
+ option(value="05") 05
|
|
|
+ option(value="06") 06
|
|
|
+ option(value="07") 07
|
|
|
+ option(value="08") 08
|
|
|
+ option(value="09") 09
|
|
|
+ option(value="10") 10
|
|
|
+ option(value="11") 11
|
|
|
+ option(value="12") 12
|
|
|
+ .col-md-3
|
|
|
+ .form-group(ng-class="validation.correctExpiry ? '' : 'has-error' ")
|
|
|
+ select(data-recurly='year', ng-change="validateExpiry()", ng-model='data.year')
|
|
|
+ option(value="", disabled, selected) Year
|
|
|
+ option(value="2015") 2015
|
|
|
+ option(value="2016") 2016
|
|
|
+ option(value="2017") 2017
|
|
|
+ option(value="2018") 2018
|
|
|
+ option(value="2019") 2019
|
|
|
+ option(value="2020") 2020
|
|
|
+ option(value="2021") 2021
|
|
|
+ option(value="2022") 2022
|
|
|
+ option(value="2023") 2023
|
|
|
+ option(value="2024") 2024
|
|
|
+ option(value="2025") 2025
|
|
|
+ option(value="2026") 2026
|
|
|
+ .row
|
|
|
+ .col-md-6
|
|
|
+ .form-group
|
|
|
+ input.form-control(type='text', value='', maxlength='255', tabindex='1', onkeyup='', data-recurly="first_name", ng-model="data.first_name", required, placeholder="#{translate('first_name')}")
|
|
|
+ .col-md-6
|
|
|
+ .form-group
|
|
|
+ input.form-control(type='text', value='', maxlength='255', tabindex='1', onkeyup='', data-recurly="last_name", ng-model="data.last_name", required, placeholder="#{translate('last_name')}")
|
|
|
+ hr
|
|
|
+ .row
|
|
|
+ .col-md-12
|
|
|
+ .form-group
|
|
|
+ label #{translate("billing_address")}
|
|
|
+ input.form-control(type='text', value='', maxlength='255', tabindex='1', onkeyup='', ng-model="data.address1")
|
|
|
+ .form-group
|
|
|
+ input.form-control(type='text', value='', maxlength='255', tabindex='1', onkeyup='', ng-model="data.address2")
|
|
|
+ .row
|
|
|
+ .col-md-8
|
|
|
+ .form-group
|
|
|
+ input.form-control(type='text', value='', maxlength='255', tabindex='1', onkeyup='', data-recurly="city", ng-model="data.city", placeholder="#{translate('city')}")
|
|
|
+ .col-md-4
|
|
|
+ input.form-control(type='text', value='', maxlength='255', tabindex='1', onkeyup='', data-recurly="postal_code", ng-model="data.postal_code", placeholder="#{translate('zip_post_code')}")
|
|
|
+ .row
|
|
|
+ .col-md-8
|
|
|
+ .form-group
|
|
|
+ select.form-control(data-recurly="country", ng-model="data.country", required)
|
|
|
+ mixin countries_options()
|
|
|
+ .row
|
|
|
+ .col-md-8
|
|
|
+ if showCouponField == 'true'
|
|
|
+ .form-group
|
|
|
+ input.form-control(type='text', ng-blur="applyCoupon()", ng-model="data.coupon", placeholder="#{translate('coupon')}")
|
|
|
|
|
|
- .div(ng-hide="paymentMethod == 'paypal'")
|
|
|
- .row
|
|
|
- .col-md-12
|
|
|
- .form-group
|
|
|
- div(ng-hide="validation.correctCvv") #{translate("invalid")} CVV
|
|
|
- div(ng-hide="validation.correctCardNumber") #{translate("invalid")} #{translate("credit_card_number")}
|
|
|
- .col-md-5
|
|
|
- .form-group(ng-class="validation.correctCardNumber ? '' : 'has-error' ")
|
|
|
- input.form-control(ng-model='data.number', ng-blur="validateCardNumber()", placeholder="#{translate('credit_card_number')}")
|
|
|
- .col-md-3
|
|
|
- .form-group(ng-class="validation.correctCvv ? '' : 'has-error' ")
|
|
|
- input.form-control(ng-model='data.cvv', ng-blur="validateCvv()", placeholder="CVV")
|
|
|
- .row
|
|
|
- div(ng-hide="validation.correctExpiry") #{translate("invalid")} #{translate("expiry")}
|
|
|
- .col-md-2
|
|
|
- .form-group(ng-class="validation.correctExpiry ? '' : 'has-error' ")
|
|
|
- select(data-recurly='month', ng-change="validateExpiry()", ng-model='data.month')
|
|
|
- option(value="", disabled, selected) Month
|
|
|
- option(value="01") 01
|
|
|
- option(value="02") 02
|
|
|
- option(value="03") 03
|
|
|
- option(value="04") 04
|
|
|
- option(value="05") 05
|
|
|
- option(value="06") 06
|
|
|
- option(value="07") 07
|
|
|
- option(value="08") 08
|
|
|
- option(value="09") 09
|
|
|
- option(value="10") 10
|
|
|
- option(value="11") 11
|
|
|
- option(value="12") 12
|
|
|
- .col-md-3
|
|
|
- .form-group(ng-class="validation.correctExpiry ? '' : 'has-error' ")
|
|
|
- select(data-recurly='year', ng-change="validateExpiry()", ng-model='data.year')
|
|
|
- option(value="", disabled, selected) Year
|
|
|
- option(value="2015") 2015
|
|
|
- option(value="2016") 2016
|
|
|
- option(value="2017") 2017
|
|
|
- option(value="2018") 2018
|
|
|
- option(value="2019") 2019
|
|
|
- option(value="2020") 2020
|
|
|
- option(value="2021") 2021
|
|
|
- option(value="2022") 2022
|
|
|
- option(value="2023") 2023
|
|
|
- option(value="2024") 2024
|
|
|
- option(value="2025") 2025
|
|
|
- option(value="2026") 2026
|
|
|
- .row
|
|
|
- .col-md-4
|
|
|
- .form-group
|
|
|
- input.form-control(type='text', value='', maxlength='255', tabindex='1', onkeyup='', data-recurly="first_name", ng-model="data.first_name", required, placeholder="#{translate('first_name')}")
|
|
|
- .col-md-4
|
|
|
- .form-group
|
|
|
- input.form-control(type='text', value='', maxlength='255', tabindex='1', onkeyup='', data-recurly="last_name", ng-model="data.last_name", required, placeholder="#{translate('last_name')}")
|
|
|
- hr
|
|
|
- .row
|
|
|
- .col-md-8
|
|
|
.form-group
|
|
|
- label #{translate("billing_address")}
|
|
|
- input.form-control(type='text', value='', maxlength='255', tabindex='1', onkeyup='', ng-model="data.address1")
|
|
|
- .form-group
|
|
|
- input.form-control(type='text', value='', maxlength='255', tabindex='1', onkeyup='', ng-model="data.address2")
|
|
|
- .row
|
|
|
- .col-md-4
|
|
|
- .form-group
|
|
|
- input.form-control(type='text', value='', maxlength='255', tabindex='1', onkeyup='', data-recurly="city", ng-model="data.city", placeholder="#{translate('city')}")
|
|
|
- .col-md-4
|
|
|
- input.form-control(type='text', value='', maxlength='255', tabindex='1', onkeyup='', data-recurly="postal_code", ng-model="data.postal_code", placeholder="#{translate('zip_post_code')}")
|
|
|
- .row
|
|
|
- .col-md-8
|
|
|
- .form-group
|
|
|
- select.form-control(data-recurly="country", ng-model="data.country", required)
|
|
|
- mixin countries_options()
|
|
|
- .row
|
|
|
- .col-md-8
|
|
|
- if showCouponField == 'true'
|
|
|
- .form-group
|
|
|
- input.form-control(type='text', ng-blur="applyCoupon()", ng-model="data.coupon", placeholder="#{translate('coupon')}")
|
|
|
-
|
|
|
- .form-group
|
|
|
- button.btn.btn-success(ng-click="submit()", ng-disabled="processing") #{translate("upgrade_now")}
|
|
|
+ button.btn.btn-success(ng-click="submit()", ng-disabled="processing") #{translate("upgrade_now")}
|
|
|
|
|
|
|
|
|
|
Henry Oswald