From 8da8bb9b65f1cffa750ee273d342bfec58ea3bdf Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Benjamin=20Beganovi=C4=87?= <k1pstabug@gmail.com>
Date: Fri, 23 Jul 2021 11:38:49 +0200
Subject: [PATCH] wip (#42)

---
 .../gateways/eway/authorize.blade.php         | 110 +++++++++---------
 1 file changed, 52 insertions(+), 58 deletions(-)

diff --git a/resources/views/portal/ninja2020/gateways/eway/authorize.blade.php b/resources/views/portal/ninja2020/gateways/eway/authorize.blade.php
index 55912ed4724f..1730abdf596e 100644
--- a/resources/views/portal/ninja2020/gateways/eway/authorize.blade.php
+++ b/resources/views/portal/ninja2020/gateways/eway/authorize.blade.php
@@ -1,99 +1,93 @@
-@extends('portal.ninja2020.layout.payments', ['gateway_title' => ctrans('texts.credit_card'), 'card_title' => ctrans('texts.credit_card')])
+@extends('portal.ninja2020.layout.payments', ['gateway_title' => ctrans('texts.credit_card'), 'card_title' =>
+ctrans('texts.credit_card')])
 
 @section('gateway_head')
 @endsection
 
 @section('gateway_content')
-    <form action="{{ route('client.payment_methods.store', ['method' => App\Models\GatewayType::CREDIT_CARD]) }}" method="post" id="payment_form">
+    <form action="{{ route('client.payment_methods.store', ['method' => App\Models\GatewayType::CREDIT_CARD]) }}"
+        method="post" id="payment_form">
 
-    <input type="hidden" id="securefieldcode" name="SecuredCardData" value="" />
+        <input type="hidden" id="securefieldcode" name="SecuredCardData" value="" />
 
-    @if(!Request::isSecure())
-        <p class="alert alert-failure">{{ ctrans('texts.https_required') }}</p>
-    @endif
+        @if (!Request::isSecure())
+            <p class="alert alert-failure">{{ ctrans('texts.https_required') }}</p>
+        @endif
 
-    <div class="alert alert-failure mb-4" hidden id="errors"></div>
+        <div class="alert alert-failure mb-4" hidden id="errors"></div>
 
-    <!-- This is a generic credit card component utilizing CardJS -->
-    @component('portal.ninja2020.components.general.card-element', ['title' => ctrans('texts.method')])
-        {{ ctrans('texts.credit_card') }}
-    @endcomponent
+        <!-- This is a generic credit card component utilizing CardJS -->
+        @component('portal.ninja2020.components.general.card-element', ['title' => ctrans('texts.method')])
+            {{ ctrans('texts.credit_card') }}
+        @endcomponent
 
-    @include('portal.ninja2020.gateways.eway.includes.credit_card')
+        @include('portal.ninja2020.gateways.eway.includes.credit_card')
 
-    <div class="bg-white px-4 py-5 flex justify-end">
-        <button
-            type="submit"
-            id="{{ $id ?? 'pay-now' }}"
-            class="button button-primary bg-primary {{ $class ?? '' }}">
-            <span>{{ ctrans('texts.add_payment_method') }}</span>
-        </button>
-    </div>
-
-   </form> 
+        @component('portal.ninja2020.gateways.includes.pay_now', ['id' => 'authorize-card'])
+            {{ ctrans('texts.add_payment_method') }}
+        @endcomponent
+    </form>
 @endsection
 
 @section('gateway_footer')
-<!-- Your JS includes go here -->
-<script src="https://secure.ewaypayments.com/scripts/eWAY.min.js" data-init="false"></script>
+    <!-- Your JS includes go here -->
+    <script src="https://secure.ewaypayments.com/scripts/eWAY.min.js" data-init="false"></script>
 
-<script type="text/javascript">
-    var publicApiKey = "{{ $public_api_key }}";
+    <script type="text/javascript">
+        let publicApiKey = "{{ $public_api_key }}";
+        let fieldStyles = "line-height: 1; height: 28px; border: 1px solid #AAA; color: #000; padding: 2px;";
 
-    var fieldStyles = "line-height: 1; height: 28px; border: 1px solid #AAA; color: #000; padding: 2px;";
-
-    var nameFieldConfig = {
+        let nameFieldConfig = {
             publicApiKey: publicApiKey,
             fieldDivId: "eway-secure-field-name",
             fieldType: "name",
-            styles: fieldStyles 
+            styles: fieldStyles
         };
-    var cardFieldConfig = {
+
+        let cardFieldConfig = {
             publicApiKey: publicApiKey,
             fieldDivId: "eway-secure-field-card",
             fieldType: "card",
             styles: fieldStyles
         };
-    var expiryFieldConfig = {
+
+        let expiryFieldConfig = {
             publicApiKey: publicApiKey,
             fieldDivId: "eway-secure-field-expiry",
             fieldType: "expiry",
             styles: fieldStyles
         };
-    var cvnFieldConfig = {
+
+        let cvnFieldConfig = {
             publicApiKey: publicApiKey,
             fieldDivId: "eway-secure-field-cvn",
             fieldType: "cvn",
             styles: fieldStyles
         };
 
-    function secureFieldCallback(event) {
-        if (!event.fieldValid) {
-            console.log(event.errors);
-        } else {
-            // set the hidden Secure Field Code field
-            var s = document.getElementById("securefieldcode");
-            s.value = event.secureFieldCode
-            console.log(s.value);
+        function secureFieldCallback(event) {
+            if (!event.fieldValid) {
+                console.log(event.errors);
+            } else {
+                // set the hidden Secure Field Code field
+                let s = document.getElementById("securefieldcode");
+                s.value = event.secureFieldCode
+                console.log(s.value);
+            }
         }
-    }
 
-
-    window.onload = function () {
-        eWAY.setupSecureField(nameFieldConfig, secureFieldCallback);
-        eWAY.setupSecureField(cardFieldConfig, secureFieldCallback);
-        eWAY.setupSecureField(expiryFieldConfig, secureFieldCallback);
-        eWAY.setupSecureField(cvnFieldConfig, secureFieldCallback);
-    };
-
-        let payNow = document.getElementById('pay-now');
-
-        payNow.addEventListener('click', () => {
-            console.log("click");
-            document.getElementById('server_response').submit();
+        document.addEventListener('DOMContentLoaded', () => {
+            eWAY.setupSecureField(nameFieldConfig, secureFieldCallback);
+            eWAY.setupSecureField(cardFieldConfig, secureFieldCallback);
+            eWAY.setupSecureField(expiryFieldConfig, secureFieldCallback);
+            eWAY.setupSecureField(cvnFieldConfig, secureFieldCallback);
         });
 
-
-</script>
-
+        document
+            .getElementById('authorize-card')
+            .addEventListener('click', () => {
+                console.log('Clicked..');
+                // document.getElementById('server_response').submit();
+            });
+    </script>
 @endsection