Am 153 move creditcard form

src/Controller/OrderController.php

@@ -49,4 +49,21 @@ public function return(): ?string
 
         return null;
     }
+
+    /*
+     * before the adyen credit card payment can be finalized,
+     * it needs to be validated because this step is skipped for this payment type
+     */
+    public function execute()
+    {
+        if ($this->getPayment()->isAdyenCreditCardPayment()) {
+            $paymentController = oxNew(\OxidEsales\Eshop\Application\Controller\PaymentController::class);
+
+            if ($paymentController->validatePayment() !== "order") {
+                Registry::getUtils()->redirect(Registry::getConfig()->getShopHomeUrl() . 'cl=payment');
+            }
+        }
+
+        return parent::execute();
+    }
 }

src/Controller/PaymentController.php

@@ -14,6 +14,7 @@
 use OxidSolutionCatalysts\Adyen\Model\Payment as AdyenPayment;
 use OxidSolutionCatalysts\Adyen\Service\CountryRepository;
 use OxidSolutionCatalysts\Adyen\Service\PaymentCancel;
+use OxidSolutionCatalysts\Adyen\Service\PaymentConfigService;
 use OxidSolutionCatalysts\Adyen\Service\SessionSettings;
 use OxidSolutionCatalysts\Adyen\Traits\RequestGetter;
 use OxidSolutionCatalysts\Adyen\Service\ModuleSettings;
@@ -133,15 +134,19 @@ public function getPaymentError()
     public function validatePayment()
     {
         $session = $this->getServiceFromContainer(SessionSettings::class);
-        $moduleService = $this->getServiceFromContainer(ModuleService::class);
-        $actualPaymentId = $session->getPaymentId();
-        $newPaymentId = $this->getStringRequestData('paymentid');
-        $pspReference = $session->getPspReference();
+        $moduleService      = $this->getServiceFromContainer(ModuleService::class);
+        $actualPaymentId    = $session->getPaymentId();
+        $newPaymentId       = $this->getStringRequestData('paymentid');
+        $pspReference       = $session->getPspReference();
+
+        //if the payment is adyen credit card, it will be validated from the order step where a new paymentId is impossible
+        $isAdyenCreditCard  = $this->getAdyenPaymentConfigService()->isAdyenCreditCardPayment($actualPaymentId);
+        $paymentChanged     = !$isAdyenCreditCard && ($actualPaymentId !== $newPaymentId);
 
         // remove a possible old adyen payment if another one was selected
         if (
             $actualPaymentId &&
-            $actualPaymentId !== $newPaymentId &&
+            $paymentChanged &&
             $moduleService->isAdyenPayment($actualPaymentId)
         ) {
             $this->removeAdyenPaymentFromSession();
@@ -208,4 +213,9 @@ protected function removeAdyenPaymentFromSession(): void
             $session->deletePaymentSession();
         }
     }
+
+    protected function getAdyenPaymentConfigService(): PaymentConfigService
+    {
+        return $this->getServiceFromContainer(PaymentConfigService::class);
+    }
 }

src/Core/Module.php

@@ -102,7 +102,6 @@ final class Module
             'constraints' => self::PAYMENT_CONSTRAINTS,
             'sort' => -1,
             'capturedelay' => true,
-            'paymentCtrl' => true,
             'handleAssets' => true,
             'hideInitially' => false,
         ],

src/Core/ViewConfig.php

@@ -211,6 +211,11 @@ public function getAdyenErrorInvalidSession(): string
         return Module::ADYEN_ERROR_INVALIDSESSION_NAME;
     }
 
+    public function getAdyenCreditCardTooltipText(): string
+    {
+        return Registry::getLang()->translateString("OSC_ADYEN_ORDER_TOOLTIP");
+    }
+
     /**
      * @throws ContainerExceptionInterface
      * @throws NotFoundExceptionInterface
@@ -303,6 +308,14 @@ public function isApplePay(
             ->isApplePay($payment);
     }
 
+    public function isOrderPaymentCreditCard(
+        FrontendController $oView,
+        ?Payment $payment
+    ): string {
+        return $this->getServiceFromContainer(JSAPITemplateConfiguration::class)
+            ->isOrderPaymentCreditCard($oView, $payment);
+    }
+
     /**
      * @throws ContainerExceptionInterface
      * @throws NotFoundExceptionInterface

src/Model/Payment.php

@@ -31,6 +31,14 @@ public function isAdyenPayment(): bool
         return $this->getAdyenPaymentConfigService()->isAdyenPayment($this->getId());
     }
 
+    /**
+     * Checks if the payment method is an Adyen credit card payment method
+     */
+    public function isAdyenCreditCardPayment() :bool
+    {
+        return $this->getAdyenPaymentConfigService()->isAdyenCreditCardPayment($this->getId());
+    }
+
     /**
      * Checks if the payment method is show on Payment Controller
      */

src/Service/JSAPIConfigurationService.php

@@ -74,11 +74,10 @@ private function getPaymentPageConfigFields(
         ViewConfig $viewConfig
     ): array {
         /** @var AdyenViewConfig $viewConfig */
-        return ($viewConfig->getTopActiveClassName() === 'payment') ?
+        return
             [
                 'paymentMethodsResponse' => $viewConfig->getAdyenPaymentMethods(),
-            ] :
-            [];
+            ];
     }
 
     private function getOrderPageConfigFields(

src/Service/JSAPITemplateCheckoutCreate.php

@@ -16,6 +16,7 @@ class JSAPITemplateCheckoutCreate
         Module::PAYMENT_KLARNA_LATER_ID => 'klarna',
         Module::PAYMENT_KLARNA_IMMEDIATE_ID => 'klarna_paynow',
         Module::PAYMENT_KLARNA_OVER_TIME_ID => 'klarna_account',
+        Module::PAYMENT_CREDITCARD_ID => 'oscadyencreditcard',
     ];
 
     public function getCreateId(string $paymentId): string

src/Service/JSAPITemplateConfiguration.php

@@ -54,6 +54,16 @@ public function isApplePay(
         return $paymentId === Module::PAYMENT_APPLE_PAY_ID;
     }
 
+    public function isOrderPaymentCreditCard(
+        FrontendController $controller,
+        ?Payment $payment
+    ): bool {
+        $paymentId = $payment instanceof Payment ? $payment->getId() : '';
+
+        return $controller instanceof OrderController
+        && $paymentId === Module::PAYMENT_CREDITCARD_ID;
+    }
+
     private function getViewData(
         ViewConfig $viewConfig,
         FrontendController $controller,
@@ -72,6 +82,8 @@ private function getViewData(
                 && $paymentId === Module::PAYMENT_GOOGLE_PAY_ID,
             'orderPaymentApplePay' => $controller instanceof OrderController
                 && $paymentId === Module::PAYMENT_APPLE_PAY_ID,
+            'orderPaymentCreditCard' => $controller instanceof Ordercontroller
+                && $paymentId === Module::PAYMENT_CREDITCARD_ID,
             'paymentConfigNeedsCard' => $this->paymentMethodsConfigurationNeedsCardField(
                 $controller,
                 $viewConfig,
@@ -168,7 +180,6 @@ private function paymentMethodsConfigurationNeedsCardField(
         /** @var AdyenViewConfig $viewConfig */
         return $controller instanceof PaymentController
             && $payment instanceof Payment
-            && $payment->showInPaymentCtrl()
             && $payment->getId() === $viewConfig->getAdyenPaymentCreditCardId();
     }
 }

src/Service/Module.php

@@ -11,6 +11,11 @@ public function isAdyenPayment(string $paymentId): bool
         return (isset(ModuleCore::PAYMENT_DEFINTIONS[$paymentId]));
     }
 
+    public function isAdyenCreditCardPayment(string $paymentId) :bool
+    {
+        return $paymentId === ModuleCore::PAYMENT_CREDITCARD_ID;
+    }
+
     public function showInPaymentCtrl(string $paymentId): bool
     {
         return ($this->isAdyenPayment($paymentId) &&

src/Service/PaymentConfigService.php

@@ -34,6 +34,14 @@ public function isAdyenPayment(string $paymentId): bool
         return $this->moduleService->isAdyenPayment($paymentId);
     }
 
+    /**
+     * Checks if the payment method is an Adyen credit card payment method
+     */
+    public function isAdyenCreditCardPayment(string $paymentId) : bool
+    {
+        return $this->moduleService->isAdyenCreditCardPayment($paymentId);
+    }
+
     /**
      * Checks if the payment allow manual Capture
      */

translations/de/osc_adyen_de_lang.php

@@ -20,4 +20,5 @@
     'OSC_ADYEN_RETURN_NOT_SUCCESSFUL' => 'Die Zahlung war aus folgendem Grund nicht erfolgreich'
         . ', wählen sie ggf. eine andere Zahlart.',
     'OSC_ADYEN_PAYMENT_STATUS_PENDING' => 'Die Zahlung ist derzeit noch schwebend.',
+    'OSC_ADYEN_ORDER_TOOLTIP' => 'Bitte füllen Sie die Kreditkartendaten aus, um die Bestellung abzuschließen zu können.',
 ];

translations/en/osc_adyen_en_lang.php

@@ -20,4 +20,5 @@
     'OSC_ADYEN_RETURN_NOT_SUCCESSFUL' => 'The payment was not successful for the following reason'
         . ', choose another payment method if applicable.',
     'OSC_ADYEN_PAYMENT_STATUS_PENDING' => 'The payment is currently pending.',
+    'OSC_ADYEN_ORDER_TOOLTIP' => 'Please fill out the credit card form to complete the order.',
 ];

views/twig/extensions/themes/apex/page/checkout/order.html.twig

@@ -41,8 +41,31 @@
             {% include sModuleId ~ "/payment/adyen_payment_psp.html.twig" %}
         </div>
 
+        {% if payment.isAdyenCreditCardPayment() %}
+            <h2 class="h4 card-header card-title d-flex justify-content-between align-items-center">
+                {{ payment.oxpayments__oxdesc.value|raw }}
+            </h2>
+            <div id="oscadyencreditcard-container" data-paymentid="payment_oscadyencreditcard" class="card-body">
+            </div>
+
+            <div class="">
+                <button id="submitAdyenCCButton" type="submit" class="adyen-checkout__button adyen-checkout__button--pay btn-lg pull-right largeButton" onclick="submitAdyenCreditCard()">
+                    <i class="fa fa-check"></i> {{ translate({ ident: "SUBMIT_ORDER" }) }}
+                </button>
+            </div>
+        {% endif %}
+
         <script type="text/javascript">
+            {% if payment.isAdyenCreditCardPayment() %}
+                function submitAdyenCreditCard() {
+                    submitForm = document.getElementById('orderConfirmAgbBottom');
+
+                    const event = new Event("submit", { bubbles: true, cancelable: true });
+                    submitForm.dispatchEvent(event);
+                }
+            {% endif %}
+
             document.getElementById('orderConfirmAgbBottom').appendChild(document.getElementById('adyenApexPsp'));
         </script>
     {% endif %}
-{% endblock %}
+{% endblock %}

views/twig/payment/adyen_assets.html.twig

@@ -52,6 +52,7 @@
 
         const adyenAsync = async function () {
             {{ oViewConf.getTemplateConfiguration(oView, payment)|raw }}
+            {% set orderPaymentCreditCard = oViewConf.isOrderPaymentCreditCard(oView, payment) %}
 
             const checkout = await AdyenCheckout(configuration);
             // Access the available payment methods for the session.
@@ -85,22 +86,32 @@
                             }
                         });
                 {% endif %}
-                {% if oView.handleAdyenAssets(adyenCreditCard) %}
+            {% elseif isOrderPage %}
+                {% if orderPaymentCreditCard %}
+                    const submitAdyenCCButton = document.getElementById("submitAdyenCCButton");
+                    submitAdyenCCButton.disabled = true;
+                    submitAdyenCCButton.title = '{{ oViewConf.getAdyenCreditCardTooltipText()|raw }}';
                     const cardComponent = checkout.create(
                         'card',
                         {
                             onFieldValid : function() {
-                                const paymentIdEl = document.getElementById('payment_{{adyenCreditCard}}');
-                                paymentIdEl.checked = true;
-                                nextStepEl.disabled = true;
+                                submitAdyenCCButton.disabled = false;
                             },
-
+                            onLoad: function () {
+                                document.querySelector("#oscadyencreditcard-container button").style.display = 'none';
+                            }
                         }
                     ).mount('#{{adyenCreditCard}}-container');
-                    cardComponent.paymentIdViewEl = document.getElementById('payment_{{adyenCreditCard}}').parentElement;
-                {% endif %}
-            {% elseif isOrderPage %}
-                {% if oViewConf.isApplePay(payment) %}
+
+                    submitForm.addEventListener('submit', function(event) {
+                        event.preventDefault();
+                        this.disabled = true;
+                        {% if isLog %}
+                            console.log("cardComp:", cardComponent)
+                        {% endif %}
+                        cardComponent.submit();
+                    });
+                {% elseif oViewConf.isApplePay(payment) %}
                     const applePayComponent = checkout.create('{{ templateCheckoutCreateId }}', configuration);
                         applePayComponent.isAvailable()
                             .then(() => {
@@ -171,21 +182,6 @@
                 }
                 return result;
             }
-
-            {% if isPaymentPage %}
-                nextStepEl.addEventListener("click", function(e) {
-                    if (this.dataset.adyensubmit !== '') {
-                        e.preventDefault();
-                        this.disabled = true;
-                        if (this.dataset.adyensubmit === '{{ adyenCreditCard }}') {
-                            cardComponent.submit();
-                        }
-                    }
-                }, false);
-                {% if paymentID is same as(adyenCreditCard) %}
-                    nextStepEl.disabled = true;
-                {% endif %}
-            {% endif %}
         }
         // Call adyenAsync
         adyenAsync();

views/twig/payment/adyen_assets_configuration.html.twig

@@ -2,6 +2,7 @@
 const isLog = {% if isLog %}true{% else %}false{% endif %};
 const isPaymentPage = {% if isPaymentPage %}true{% else %}false{% endif %};
 const isOrderPage = {% if isOrderPage %}true{% else %}false{% endif %};
+const isCreditCard = {% if orderPaymentCreditCard %}true{% else %}false{% endif %};
 const configuration = {
     {{ configFields|raw }},
     onError: (error, component) => {
@@ -29,21 +30,17 @@ const configuration = {
             console.log('onSubmit:', state.data);
         }
         component.setStatus('loading');
-        if (isPaymentPage) {
+        if (isPaymentPage || isCreditCard) {
             state.data.deliveryAddress = configuration.deliveryAddress;
             state.data.shopperEmail = configuration.shopperEmail;
             state.data.shopperIP = configuration.shopperIP;
         }
-        makePayment(state.data)
+        makePayment(state.data) //this function is declared in adyen_assets.html.twig
             .then(response => {
                 if (isLog) {
                     console.log('onSubmit-response:', response);
                 }
                 if (response.action) {
-                    // Drop-in handles the action object from the /payments response
-                    if ('paymentIdViewEl' in component) {
-                        component.paymentIdViewEl.scrollIntoView({behavior: "smooth", block: "end", inline: "nearest"});
-                    }
                     component.handleAction(response.action);
                 } else {
                     setPspReference(response);

views/twig/payment/adyen_order_submit.html.twig

@@ -2,8 +2,10 @@
 {% set containerId = oViewConf.getTemplatePayButtonContainerId(payment) %}
 {% set sModuleId = '@' ~ constant('\\OxidSolutionCatalysts\\Adyen\\Core\\Module::MODULE_ID') %}
 <div class="pull-right submitButton nextStep">
-    {{ translate({ ident: "OSC_ADYEN_BUY_NOW_PAY_WITH" }) }}
-    <div id="{{ containerId }}"
-         data-paymentid="payment_{{ sPaymentID }}"
-    ></div>
+    {% if not payment.isAdyenCreditCardPayment() %}
+        {{ translate({ ident: "OSC_ADYEN_BUY_NOW_PAY_WITH" }) }}
+        <div id="{{ containerId }}"
+             data-paymentid="payment_{{ sPaymentID }}"
+        ></div>
+    {% endif %}
 </div>