Skip to content

Commit

Permalink
payment with cards and paypal supported on single page
Browse files Browse the repository at this point in the history
  • Loading branch information
SirDomin committed Oct 26, 2020
1 parent 72a23ed commit 6622377
Show file tree
Hide file tree
Showing 6 changed files with 18 additions and 21 deletions.
5 changes: 1 addition & 4 deletions src/Controller/PayPalButtonsController.php
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,6 @@
use Sylius\Component\Channel\Context\ChannelContextInterface;
use Sylius\Component\Core\Model\ChannelInterface;
use Sylius\Component\Core\Model\OrderInterface;
use Sylius\Component\Core\Model\Payment;
use Sylius\Component\Core\Model\PaymentInterface;
use Sylius\Component\Core\Model\PaymentMethodInterface;
use Sylius\Component\Core\Repository\OrderRepositoryInterface;
Expand Down Expand Up @@ -149,8 +148,6 @@ public function renderPaymentPageButtonsAction(Request $request): Response
public function renderPayPalPaymentAction(Request $request): Response
{
$orderId = $request->attributes->getInt('orderId');
/** @var ChannelInterface $channel */
$channel = $this->channelContext->getChannel();
/** @var OrderInterface $order */
$order = $this->orderRepository->find($orderId);
/** @var PaymentInterface $payment */
Expand Down Expand Up @@ -178,7 +175,7 @@ public function renderPayPalPaymentAction(Request $request): Response
'currency' => $order->getCurrencyCode(),
'locale' => $request->getLocale(),
'merchant_id' => $gatewayConfig->getConfig()['merchant_id'],
'order_token' => 'test',
'order_id' => $order->getId(),
'partner_attribution_id' => $partnerAttributionId,
]));
}
Expand Down
2 changes: 1 addition & 1 deletion src/DependencyInjection/SyliusPayPalExtension.php
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,7 @@ public function load(array $config, ContainerBuilder $container): void
$container->setParameter('sylius.paypal.logging.increased', $config['logging']['increased']);

if ($config['sandbox']) {
$container->setParameter('sylius.pay_pal.facilitator_url', 'https://sylius.local:8001');
$container->setParameter('sylius.pay_pal.facilitator_url', 'https://paypal.sylius.com');
$container->setParameter('sylius.pay_pal.api_base_url', 'https://api.sandbox.paypal.com/');
$container->setParameter('sylius.pay_pal.reports_sftp_host', 'reports.sandbox.paypal.com');
} else {
Expand Down
2 changes: 1 addition & 1 deletion src/Resources/config/shop_routing.yaml
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@ sylius_paypal_plugin_pay_with_paypal_form:
_controller: Sylius\PayPalPlugin\Controller\PayWithPayPalFormAction

sylius_paypal_plugin_create_paypal_order:
path: /create-pay-pal-order/{token}
path: /create-pay-pal-order/{id}
methods: [POST]
defaults:
_controller: Sylius\PayPalPlugin\Controller\CreatePayPalOrderAction
Expand Down
28 changes: 13 additions & 15 deletions src/Resources/views/payWithPaypal.html.twig
Original file line number Diff line number Diff line change
Expand Up @@ -150,8 +150,7 @@
</div>
<div class="ui bottom attached tab segment" data-tab="card">
<div class="button-container padding">
<div id="advanced-cards-container"></div>
<form id="advanced-cards-form">
<div id="advanced-cards-container">
<label for="card-number">{{ 'sylius.pay_pal.credit_card_number'|trans }}</label>
<div id="card-number" class="input"><div id="card-image"></div></div>
<label for="expiration-date">{{ 'sylius.pay_pal.expiration_date'|trans }}</label>
Expand All @@ -172,17 +171,17 @@
<input type='text' id='card-billing-address-zip' name='card-billing-address-zip' autocomplete='off' placeholder='{{ 'sylius.ui.postcode'|trans }}' value="{{ billing_address.postcode }}"/>
<input type='text' id='card-billing-address-country' name='card-billing-address-country' autocomplete='off' placeholder='{{ 'sylius.ui.country'|trans }}' value="{{ billing_address.countryCode }}" />
</div>
<button value="submit" id="submit" class="ui button yellow fluid">{{ 'sylius.pay_pal.pay_with_card'|trans }}</button>
</form>
<button id="submit-card" class="ui button yellow fluid">{{ 'sylius.pay_pal.pay_with_card'|trans }}</button>
</div>
</div>
</div>
</div>
</div>
{% include '@SyliusUi/_javascripts.html.twig' with {'path': 'assets/shop/js/app.js'} %}
<script src="https://www.paypal.com/sdk/js?components=hosted-fields,buttons,funding-eligibility&locale={{ locale }}&currency={{ currency }}&vault=false&client-id={{ client_id }}&merchant-id={{ merchant_id }}&intent=capture" data-partner-attribution-id="{{ partner_attribution_id }}" data-enable-3ds data-client-token="{{ client_token }}"></script>
<script>
let createPayPalOrderUrl = "{{ path('sylius_paypal_plugin_create_paypal_order', {'token': order_token}) }}";
let completePayPalOrderUrl = "{{ path('sylius_paypal_plugin_complete_paypal_order', {'token': order_token }) }}"
let createPayPalOrderUrl = "{{ path('sylius_paypal_plugin_create_paypal_order_from_payment_page', { 'id': order_id }) }}";
let completePayPalOrderUrl = "{{ path('sylius_paypal_plugin_complete_paypal_order_from_payment_page', { 'id': order_id }) }}"
let errorPayPalPaymentUrl = "{{ path('sylius_paypal_plugin_payment_error') }}";
let availableCountries = {{ available_countries|json_encode|raw }};
let cancelPayPalPaymentUrl = "{{ path('sylius_paypal_plugin_cancel_checkout_payment') }}";
Expand All @@ -200,7 +199,7 @@
document.querySelector('#paypal-payment-container').classList.add('loading');
document.querySelector('#paypal-button-container').classList.add('low-opacity');
return res.json();
}).then(data => data.orderID);
}).then(data => data.order_id);
},
onApprove: function(data, actions) {
return fetch(completePayPalOrderUrl, {
Expand Down Expand Up @@ -240,7 +239,6 @@
}
}).render('#paypal-button-container');
//once we add onshippingchange button doesnt render anymore
paypal.getFundingSources().forEach(function(fundingSource) {
var button = paypal.Buttons({
fundingSource: fundingSource,
Expand All @@ -251,7 +249,7 @@
document.querySelector('#paypal-payment-container').classList.add('loading');
document.querySelector('#paypal-button-container').classList.add('low-opacity');
return res.json();
}).then(data => data.orderID);
}).then(data => data.order_id);
},
onApprove: function(data, actions) {
return fetch(completePayPalOrderUrl, {
Expand Down Expand Up @@ -290,7 +288,7 @@
}).then(function(res) {
return res.json();
}).then(function(data) {
return data.orderID;
return data.order_id;
});
},
styles: {
Expand Down Expand Up @@ -335,8 +333,8 @@
hostedFields.on('cardTypeChange', function (event) {
if (event.cards.length === 1) {
document.querySelector('#advanced-cards-form').classList = [];
document.querySelector('#advanced-cards-form').classList.add(event.cards[0].type);
document.querySelector('#advanced-cards-container').classList = [];
document.querySelector('#advanced-cards-container').classList.add(event.cards[0].type);
document.querySelector('#card-image').classList = [];
document.querySelector('#card-image').classList.add(event.cards[0].type);
// Change the CVV length for AmericanExpress cards
Expand All @@ -354,11 +352,11 @@
value: '123'
});
document.querySelector('#card-image').classList = [];
document.querySelector('#advanced-cards-form').classList = [];
document.querySelector('#advanced-cards-container').classList = [];
}
});
document.querySelector('#advanced-cards-form').addEventListener('submit', event => {
document.querySelector('#submit-card').addEventListener('click', event => {
event.preventDefault();
let state = hostedFields.getState();
Expand Down Expand Up @@ -398,7 +396,7 @@
} else {
alert(invalidFormMessage);
}
});
})
});
}
Expand Down
1 change: 1 addition & 0 deletions tests/Application/templates/bundles/SyliusAdminBundle
1 change: 1 addition & 0 deletions tests/Application/templates/bundles/SyliusShopBundle

0 comments on commit 6622377

Please sign in to comment.