mirror of
https://github.com/invoiceninja/invoiceninja.git
synced 2024-09-19 16:01:34 +02:00
Added card library
This commit is contained in:
parent
be02c69017
commit
44c2959f05
@ -34,7 +34,8 @@
|
||||
"jSignature": "brinley/jSignature#^2.1.0",
|
||||
"select2": "select2-dist#^4.0.3",
|
||||
"mousetrap": "^1.6.0",
|
||||
"tablesorter": "jquery.tablesorter#^2.28.4"
|
||||
"tablesorter": "jquery.tablesorter#^2.28.4",
|
||||
"card": "^2.1.1"
|
||||
},
|
||||
"resolutions": {
|
||||
"jquery": "~1.11"
|
||||
|
@ -95,6 +95,10 @@ elixir(function(mix) {
|
||||
bowerDir + '/bootstrap-daterangepicker/daterangepicker.js'
|
||||
], 'public/js/daterangepicker.min.js');
|
||||
|
||||
mix.scripts([
|
||||
bowerDir + '/card/dist/card.js',
|
||||
], 'public/js/card.min.js');
|
||||
|
||||
mix.scripts([
|
||||
bowerDir + '/tablesorter/dist/js/jquery.tablesorter.combined.js',
|
||||
bowerDir + '/tablesorter/dist/js/widgets/widget-grouping.min.js',
|
||||
|
2497
public/css/card.css
vendored
Normal file
2497
public/css/card.css
vendored
Normal file
File diff suppressed because one or more lines are too long
1
public/css/card.css.map
Normal file
1
public/css/card.css.map
Normal file
File diff suppressed because one or more lines are too long
3
public/js/card.min.js
vendored
Normal file
3
public/js/card.min.js
vendored
Normal file
File diff suppressed because one or more lines are too long
1
public/js/card.min.js.map
Normal file
1
public/js/card.min.js.map
Normal file
File diff suppressed because one or more lines are too long
@ -2370,6 +2370,9 @@ $LANG = array(
|
||||
// New Client Portal styling
|
||||
'invoice_from' => 'Invoices From:',
|
||||
'email_alias_message' => 'Note: we require each user to have a unique email address.<br/>Consider using an alias. ie, email+label@example.com',
|
||||
'full_name' => 'Full Name',
|
||||
'month_year' => 'MONTH/YEAR',
|
||||
'valid_thru' => 'Valid\nthru',
|
||||
|
||||
);
|
||||
|
||||
|
@ -3,7 +3,10 @@
|
||||
@section('head')
|
||||
@parent
|
||||
|
||||
<script src="{{ asset('js/card.min.js') }}"></script>
|
||||
|
||||
<script type="text/javascript">
|
||||
|
||||
$(function() {
|
||||
$('.payment-form').submit(function(event) {
|
||||
var $form = $(this);
|
||||
@ -13,6 +16,43 @@
|
||||
|
||||
return true;
|
||||
});
|
||||
|
||||
@if ($accountGateway->gateway_id != GATEWAY_BRAINTREE)
|
||||
var card = new Card({
|
||||
form: 'form#payment-form', // *required*
|
||||
container: '.card-wrapper', // *required*
|
||||
|
||||
formSelectors: {
|
||||
numberInput: 'input#card_number', // optional — default input[name="number"]
|
||||
expiryInput: 'input#expiry', // optional — default input[name="expiry"]
|
||||
cvcInput: 'input#cvv', // optional — default input[name="cvc"]
|
||||
nameInput: 'input#first_name, input#last_name'
|
||||
},
|
||||
|
||||
width: 255, // optional — default 350px
|
||||
formatting: true, // optional - default true
|
||||
|
||||
// Strings for translation - optional
|
||||
messages: {
|
||||
monthYear: "{{ trans('texts.month_year') }}",
|
||||
validDate: "{{ trans('texts.valid_thru') }}",
|
||||
},
|
||||
|
||||
// Default placeholders for rendered fields - optional
|
||||
placeholders: {
|
||||
number: '•••• •••• •••• ••••',
|
||||
name: "{{ $client ? ($contact->first_name . ' ' . $contact->last_name) : trans('texts.full_name') }}",
|
||||
expiry: '••/••',
|
||||
cvc: '•••'
|
||||
},
|
||||
|
||||
masks: {
|
||||
cardNumber: '•' // optional - mask card number
|
||||
},
|
||||
debug: true,
|
||||
});
|
||||
|
||||
@endif
|
||||
});
|
||||
</script>
|
||||
|
||||
@ -155,10 +195,22 @@
|
||||
<p> <br/> </p>
|
||||
@endif
|
||||
|
||||
<h3>{{ trans('texts.billing_method') }}</h3>
|
||||
<div class="row">
|
||||
<div class="col-md-{{ ($accountGateway->gateway_id == GATEWAY_BRAINTREE) ? 12 : 8 }}">
|
||||
|
||||
<h3>
|
||||
{{ trans('texts.billing_method') }}
|
||||
@if (isset($acceptedCreditCardTypes))
|
||||
|
||||
@foreach ($acceptedCreditCardTypes as $card)
|
||||
<img src="{{ $card['source'] }}" alt="{{ $card['alt'] }}" style="width: 34px; display: inline; margin-left: 8px;"/>
|
||||
@endforeach
|
||||
@endif
|
||||
<br/>
|
||||
</h3>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-md-9">
|
||||
<div class="col-md-12">
|
||||
@if ($accountGateway->gateway_id == GATEWAY_BRAINTREE)
|
||||
<div id="card_number" class="braintree-hosted form-control"></div>
|
||||
@else
|
||||
@ -169,20 +221,9 @@
|
||||
->label('') !!}
|
||||
@endif
|
||||
</div>
|
||||
<div class="col-md-3">
|
||||
@if ($accountGateway->gateway_id == GATEWAY_BRAINTREE)
|
||||
<div id="cvv" class="braintree-hosted form-control"></div>
|
||||
@else
|
||||
{!! Former::text(!empty($tokenize) ? '' : 'cvv')
|
||||
->id('cvv')
|
||||
->placeholder(trans('texts.cvv'))
|
||||
->autocomplete('off')
|
||||
->label('') !!}
|
||||
@endif
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-md-6">
|
||||
<div class="col-md-5">
|
||||
@if ($accountGateway->gateway_id == GATEWAY_BRAINTREE)
|
||||
<div id="expiration_month" class="braintree-hosted form-control"></div>
|
||||
@else
|
||||
@ -205,7 +246,7 @@
|
||||
!!}
|
||||
@endif
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<div class="col-md-4">
|
||||
@if ($accountGateway->gateway_id == GATEWAY_BRAINTREE)
|
||||
<div id="expiration_year" class="braintree-hosted form-control"></div>
|
||||
@else
|
||||
@ -227,9 +268,23 @@
|
||||
!!}
|
||||
@endif
|
||||
</div>
|
||||
<div class="col-md-3">
|
||||
@if ($accountGateway->gateway_id == GATEWAY_BRAINTREE)
|
||||
<div id="cvv" class="braintree-hosted form-control"></div>
|
||||
@else
|
||||
{!! Former::text(!empty($tokenize) ? '' : 'cvv')
|
||||
->id('cvv')
|
||||
->placeholder(trans('texts.cvv'))
|
||||
->autocomplete('off')
|
||||
->label('') !!}
|
||||
@endif
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row" style="padding-top:18px">
|
||||
|
||||
<div class="col-md-5">
|
||||
|
||||
@if (isset($amount) && $client && $account->showTokenCheckbox($storageGateway/* will contain gateway id */))
|
||||
<input id="token_billing" type="checkbox" name="token_billing" {{ $account->selectTokenCheckbox() ? 'CHECKED' : '' }} value="1" style="margin-left:0px; vertical-align:top">
|
||||
<label for="token_billing" class="checkbox" style="display: inline;">{{ trans('texts.token_billing') }}</label>
|
||||
@ -242,15 +297,10 @@
|
||||
</span>
|
||||
@endif
|
||||
</div>
|
||||
|
||||
<div class="col-md-7">
|
||||
@if (isset($acceptedCreditCardTypes))
|
||||
<div class="pull-right">
|
||||
@foreach ($acceptedCreditCardTypes as $card)
|
||||
<img src="{{ $card['source'] }}" alt="{{ $card['alt'] }}" style="width: 70px; display: inline; margin-right: 6px;"/>
|
||||
@endforeach
|
||||
</div>
|
||||
@endif
|
||||
</div>
|
||||
<div class="col-md-4">
|
||||
<div class='card-wrapper'></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
@ -42,6 +42,7 @@ body {
|
||||
}
|
||||
|
||||
div.col-md-3,
|
||||
div.col-md-4,
|
||||
div.col-md-5,
|
||||
div.col-md-6,
|
||||
div.col-md-7,
|
||||
|
Loading…
Reference in New Issue
Block a user