PW-300 Hosted CSE solution, change from CSE key to library token (#230)

* PW-300 Hosted CSE solution, change from CSE key to library token

* use test or live url depending if running on test or live. adyen is already loaded through adyen_cc payment method so can be ignored for adyen_oneclick methdo

* add storeId into call

Block/Form/Cc.php

@@ -67,7 +67,8 @@ class Cc extends \Magento\Payment\Block\Form\Cc
         \Adyen\Payment\Helper\Data $adyenHelper,
         \Magento\Checkout\Model\Session $checkoutSession,
         array $data = []
-    ) {
+    )
+    {
         parent::__construct($context, $paymentConfig);
         $this->_adyenHelper = $adyenHelper;
         $this->_appState = $context->getAppState();
@@ -79,7 +80,7 @@ class Cc extends \Magento\Payment\Block\Form\Cc
      * @return mixed
      * @throws \Magento\Framework\Exception\LocalizedException
      */
-    public function getCsePublicKey()
+    public function getLibrarySource()
     {
         // get storeId for admin
         if (!$this->_appState->getAreaCode() === \Magento\Backend\App\Area\FrontNameResolver::AREA_CODE) {
@@ -88,15 +89,7 @@ class Cc extends \Magento\Payment\Block\Form\Cc
             $storeId = null;
         }
 
-        $demoMode = $this->_adyenHelper->getAdyenAbstractConfigDataFlag('demo_mode', $storeId);
-
-        if($demoMode) {
-            $cseKey = $this->_adyenHelper->getAdyenCcConfigData('cse_publickey_test', $storeId);
-        } else {
-            $cseKey = $this->_adyenHelper->getAdyenCcConfigData('cse_publickey_live', $storeId);
-        }
-
-        return $cseKey;
+        return $this->_adyenHelper->getLibrarySource($storeId);
     }
 
     /**
@@ -111,7 +104,7 @@ class Cc extends \Magento\Payment\Block\Form\Cc
             $this->getCheckoutSession();
             $store = $this->_checkoutSession->getQuote()->getStore();
             $enableMoto = $this->_adyenHelper->getAdyenCcConfigDataFlag('enable_moto', $store->getId());
-            if($enableMoto) {
+            if ($enableMoto) {
                 return false;
             }
         }

Gateway/Request/CcAuthorizationDataBuilder.php

@@ -47,7 +47,8 @@ class CcAuthorizationDataBuilder implements BuilderInterface
     public function __construct(
         \Adyen\Payment\Helper\Data $adyenHelper,
         \Magento\Framework\Model\Context $context
-    ) {
+    )
+    {
         $this->adyenHelper = $adyenHelper;
         $this->appState = $context->getAppState();
     }
@@ -65,35 +66,27 @@ class CcAuthorizationDataBuilder implements BuilderInterface
         $storeId = $order->getStoreId();
         $request = [];
 
-        if ($this->adyenHelper->getAdyenCcConfigDataFlag('cse_enabled', $storeId)) {
+
         $request['additionalData']['card.encrypted.json'] =
             $payment->getAdditionalInformation(AdyenCcDataAssignObserver::ENCRYPTED_DATA);
 
         // Remove from additional data
         $payment->unsAdditionalInformation(AdyenCcDataAssignObserver::ENCRYPTED_DATA);
-        } else {
-            $requestCreditCardDetails = [
-                "expiryMonth" => $payment->getCcExpMonth(),
-                "expiryYear" => $payment->getCcExpYear(),
-                "holderName" => $payment->getCcOwner(),
-                "number" => $payment->getCcNumber(),
-                "cvc" => $payment->getCcCid(),
-            ];
-            $cardDetails['card'] = $requestCreditCardDetails;
-            $request = array_merge($request, $cardDetails);
-        }
+
 
         /**
          * if MOTO for backend is enabled use MOTO as shopper interaction type
          */
         $enableMoto = $this->adyenHelper->getAdyenCcConfigDataFlag('enable_moto', $storeId);
         if ($this->appState->getAreaCode() === \Magento\Backend\App\Area\FrontNameResolver::AREA_CODE &&
-            $enableMoto) {
+            $enableMoto
+        ) {
             $request['shopperInteraction'] = "Moto";
         }
         // if installments is set add it into the request
         if ($payment->getAdditionalInformation('number_of_installments') &&
-            $payment->getAdditionalInformation('number_of_installments')  > 0) {
+            $payment->getAdditionalInformation('number_of_installments') > 0
+        ) {
             $request['installments']['value'] = $payment->getAdditionalInformation('number_of_installments');
         }
 

Helper/Data.php

@@ -31,6 +31,9 @@ use Magento\Framework\App\Helper\AbstractHelper;
 class Data extends AbstractHelper
 {
 
+    const TEST = 'test';
+    const LIVE = 'live';
+
     /**
      * @var \Magento\Framework\Encryption\EncryptorInterface
      */
@@ -88,7 +91,8 @@ class Data extends AbstractHelper
         \Magento\Framework\View\Asset\Repository $assetRepo,
         \Magento\Framework\View\Asset\Source $assetSource,
         \Adyen\Payment\Model\Resource\Notification\CollectionFactory $notificationFactory
-    ) {
+    )
+    {
         parent::__construct($context);
         $this->_encryptor = $encryptor;
         $this->_dataStorage = $dataStorage;
@@ -873,4 +877,33 @@ class Data extends AbstractHelper
         return count($notifications);
     }
 
+    /**
+     * @param $storeId
+     * @return mixed
+     */
+    public function getLibraryToken($storeId = null)
+    {
+        if ($this->isDemoMode($storeId)) {
+            $libraryToken = $this->getAdyenCcConfigData('cse_library_token_test', $storeId);
+        } else {
+            $libraryToken = $this->getAdyenCcConfigData('cse_library_token_live', $storeId);
+        }
+        return $libraryToken;
+    }
+
+    /**
+     * Returns the hosted location of the client side encryption file
+     *
+     * @param null $storeId
+     * @return string
+     */
+    public function getLibrarySource($storeId = null)
+    {
+        $environment = self::LIVE;
+        if ($this->isDemoMode($storeId)) {
+            $environment = self::TEST;
+        }
+
+        return "https://" . $environment . ".adyen.com/hpp/cse/js/" . $this->getLibraryToken($storeId) . ".shtml";
+    }
 }
\ No newline at end of file

Model/Ui/AdyenCcConfigProvider.php

@@ -84,7 +84,8 @@ class AdyenCcConfigProvider implements ConfigProviderInterface
         \Magento\Framework\UrlInterface $urlBuilder,
         Source $assetSource,
         \Magento\Payment\Model\CcConfig $ccConfig
-    ) {
+    )
+    {
         $this->_paymentHelper = $paymentHelper;
         $this->_adyenHelper = $adyenHelper;
         $this->_request = $request;
@@ -123,25 +124,13 @@ class AdyenCcConfigProvider implements ConfigProviderInterface
             ]
         ]);
 
-        $demoMode = $this->_adyenHelper->getAdyenAbstractConfigDataFlag('demo_mode');
-
-        if ($demoMode) {
-            $cseKey = $this->_adyenHelper->getAdyenCcConfigData('cse_publickey_test');
-        } else {
-            $cseKey = $this->_adyenHelper->getAdyenCcConfigData('cse_publickey_live');
-        }
-
-        $cseEnabled = $this->_adyenHelper->getAdyenCcConfigDataFlag('cse_enabled');
-
         $recurringType = $this->_adyenHelper->getAdyenAbstractConfigData('recurring_type');
         $canCreateBillingAgreement = false;
         if ($recurringType == "ONECLICK" || $recurringType == "ONECLICK,RECURRING") {
             $canCreateBillingAgreement = true;
         }
 
-        $config['payment'] ['adyenCc']['cseKey'] = $cseKey;
-        $config['payment'] ['adyenCc']['cseEnabled'] = $cseEnabled;
-        $config['payment'] ['adyenCc']['cseEnabled'] = $cseEnabled;
+        $config['payment'] ['adyenCc']['librarySource'] = $this->_adyenHelper->getLibrarySource();
         $config['payment']['adyenCc']['generationTime'] = date("c");
         $config['payment']['adyenCc']['canCreateBillingAgreement'] = $canCreateBillingAgreement;
         $config['payment']['adyenCc']['icons'] = $this->getIcons();

Model/Ui/AdyenOneclickConfigProvider.php

@@ -90,7 +90,8 @@ class AdyenOneclickConfigProvider implements ConfigProviderInterface
         \Magento\Store\Model\StoreManagerInterface $storeManager,
         \Magento\Framework\UrlInterface $urlBuilder,
         \Magento\Payment\Model\CcConfig $ccConfig
-    ) {
+    )
+    {
         $this->_adyenHelper = $adyenHelper;
         $this->_request = $request;
         $this->_customerSession = $customerSession;
@@ -130,25 +131,13 @@ class AdyenOneclickConfigProvider implements ConfigProviderInterface
             ]
         ]);
 
-        $demoMode = $this->_adyenHelper->getAdyenAbstractConfigDataFlag('demo_mode');
-
-        if ($demoMode) {
-            $cseKey = $this->_adyenHelper->getAdyenCcConfigData('cse_publickey_test');
-        } else {
-            $cseKey = $this->_adyenHelper->getAdyenCcConfigData('cse_publickey_live');
-        }
-
-        $cseEnabled = $this->_adyenHelper->getAdyenCcConfigDataFlag('cse_enabled');
-
         $recurringType = $this->_adyenHelper->getAdyenAbstractConfigData('recurring_type');
         $canCreateBillingAgreement = false;
         if ($recurringType == "ONECLICK" || $recurringType == "ONECLICK,RECURRING") {
             $canCreateBillingAgreement = true;
         }
 
-        $config['payment'] ['adyenOneclick']['cseKey'] = $cseKey;
-        $config['payment'] ['adyenOneclick']['cseEnabled'] = $cseEnabled;
-        $config['payment'] ['adyenOneclick']['cseEnabled'] = $cseEnabled;
+        $config['payment'] ['adyenOneclick']['librarySource'] = $this->_adyenHelper->getLibrarySource();
         $config['payment']['adyenOneclick']['generationTime'] = date("c");
         $config['payment']['adyenOneclick']['canCreateBillingAgreement'] = $canCreateBillingAgreement;
 
@@ -227,7 +216,6 @@ class AdyenOneclickConfigProvider implements ConfigProviderInterface
     }
 
 
-
     /**
      * Retrieve credit card expire months
      *

etc/adminhtml/system/adyen_cc.xml

@@ -47,20 +47,15 @@
             <source_model>Adyen\Payment\Model\Config\Source\CcType</source_model>
             <config_path>payment/adyen_cc/cctypes</config_path>
         </field>
-        <!--<field id="cse_enabled" translate="label" type="select" sortOrder="40" showInDefault="1" showInWebsite="1" showInStore="1">-->
-            <!--<label>Enable CSE</label>-->
-            <!--<source_model>Magento\Config\Model\Config\Source\Yesno</source_model>-->
-            <!--<config_path>payment/adyen_cc/cse_enabled</config_path>-->
-        <!--</field>-->
-        <field id="cse_publickey_test" translate="label" type="textarea" sortOrder="50" showInDefault="1" showInWebsite="1" showInStore="1">
-            <label>Enter CSE Public Key of Test Adyen Web Service User</label>
-            <depends><field id="cse_enabled">1</field></depends>
-            <config_path>payment/adyen_cc/cse_publickey_test</config_path>
+        <field id="cse_library_token_test" translate="label" type="text" sortOrder="50" showInDefault="1" showInWebsite="1" showInStore="1">
+            <label>Library token of Test Adyen Web Service User</label>
+            <tooltip>Copy this from the Test Adyen Customer Area => Settings => Users => System => [web service user]=> Library token.</tooltip>
+            <config_path>payment/adyen_cc/cse_library_token_test</config_path>
         </field>
-        <field id="cse_publickey_live" translate="label" type="textarea" sortOrder="50" showInDefault="1" showInWebsite="1" showInStore="1">
-            <label>Enter CSE Public Key of Live Adyen Web Service User</label>
-            <depends><field id="cse_enabled">1</field></depends>
-            <config_path>payment/adyen_cc/cse_publickey_live</config_path>
+        <field id="cse_library_token_live" translate="label" type="text" sortOrder="50" showInDefault="1" showInWebsite="1" showInStore="1">
+            <label>Library token of Live Adyen Web Service User</label>
+            <tooltip>Copy this from the Live Adyen Customer Area => Settings => Users => System => [web service user]=> Library token.</tooltip>
+            <config_path>payment/adyen_cc/cse_library_token_live</config_path>
         </field>
 
         <group id="adyen_cc_advanced_settings" translate="label" showInDefault="1" showInWebsite="1" sortOrder="150">

etc/config.xml

@@ -45,7 +45,6 @@
                 <sort_order>2</sort_order>
                 <cctypes>AE,VI,MC,DI</cctypes>
                 <useccv>1</useccv>
-                <cse_enabled>1</cse_enabled>
                 <enable_moto>0</enable_moto>
                 <payment_action>authorize</payment_action>
                 <is_gateway>1</is_gateway>
@@ -71,7 +70,6 @@
                 <recurring_payment_type>ONECLICK</recurring_payment_type>
                 <payment_action>authorize</payment_action>
                 <useccv>1</useccv>
-                <cse_enabled>1</cse_enabled>
                 <enable_moto>0</enable_moto>
                 <payment_action>authorize</payment_action>
                 <is_gateway>1</is_gateway>

view/adminhtml/templates/form/cc.phtml

@@ -31,32 +31,39 @@ $ccExpMonth = $block->getInfoData('cc_exp_month');
 $ccExpYear = $block->getInfoData('cc_exp_year');
 ?>
 
-<fieldset class="admin__fieldset payment-method" id="payment_form_<?php /* @noEscape */ echo $code; ?>"
+<fieldset class="admin__fieldset payment-method" id="payment_form_<?php /* @noEscape */
+echo $code; ?>"
           style="display:none">
 
 
     <div class="field admin__field _required">
-        <label class="admin__field-label" for="<?php /* @noEscape */ echo $code; ?>_cc_owner">
+        <label class="admin__field-label" for="<?php /* @noEscape */
+        echo $code; ?>_cc_owner">
             <span><?php echo $block->escapeHtml(__('Name on Card')); ?></span>
         </label>
         <div class="admin__field-control">
-            <input type="text" id="<?php /* @noEscape */ echo $code; ?>_cc_owner" data-encrypted-name="holderName"
+            <input type="text" id="<?php /* @noEscape */
+            echo $code; ?>_cc_owner" data-encrypted-name="holderName"
                    title="<?php echo $block->escapeHtml(__('Name on Card')); ?>" class="admin__control-text"
-                   value="<?php /* @noEscape */ echo $block->getInfoData('cc_owner'); ?>"/>
+                   value="<?php /* @noEscape */
+                   echo $block->getInfoData('cc_owner'); ?>"/>
         </div>
     </div>
 
 
     <div class="field-type admin__field _required">
-        <label class="admin__field-label" for="<?php /* @noEscape */ echo $code; ?>_cc_type">
+        <label class="admin__field-label" for="<?php /* @noEscape */
+        echo $code; ?>_cc_type">
             <span><?php echo $block->escapeHtml(__('Credit Card Type')); ?></span>
         </label>
         <div class="admin__field-control">
-            <select id="<?php /* @noEscape */ echo $code; ?>_cc_type" name="payment[cc_type]"
+            <select id="<?php /* @noEscape */
+            echo $code; ?>_cc_type" name="payment[cc_type]"
                     class="required-entry validate-cc-type-select admin__control-select">
                 <option value=""></option>
                 <?php foreach ($block->getCcAvailableTypes() as $typeCode => $typeName): ?>
-                    <option value="<?php echo $block->escapeHtml($typeCode); ?>" <?php if ($typeCode == $ccType): ?>selected="selected"<?php endif ?>>
+                    <option value="<?php echo $block->escapeHtml($typeCode); ?>"
+                            <?php if ($typeCode == $ccType): ?>selected="selected"<?php endif ?>>
                         <?php echo $block->escapeHtml($typeName); ?>
                     </option>
                 <?php endforeach ?>
@@ -64,21 +71,27 @@ $ccExpYear = $block->getInfoData('cc_exp_year');
         </div>
     </div>
     <div class="field-number admin__field _required">
-        <label class="admin__field-label" for="<?php /* @noEscape */ echo $code; ?>_cc_number">
+        <label class="admin__field-label" for="<?php /* @noEscape */
+        echo $code; ?>_cc_number">
             <span><?php echo $block->escapeHtml(__('Credit Card Number')); ?></span>
         </label>
         <div class="admin__field-control">
-            <input type="text" id="<?php /* @noEscape */ echo $code; ?>_cc_number" data-encrypted-name="number"
-                   title="<?php echo $block->escapeHtml(__('Credit Card Number')); ?>" class="admin__control-text validate-cc-number"
-                   value="<?php /* @noEscape */ echo $block->getInfoData('cc_number'); ?>"/>
+            <input type="text" id="<?php /* @noEscape */
+            echo $code; ?>_cc_number" data-encrypted-name="number"
+                   title="<?php echo $block->escapeHtml(__('Credit Card Number')); ?>"
+                   class="admin__control-text validate-cc-number"
+                   value="<?php /* @noEscape */
+                   echo $block->getInfoData('cc_number'); ?>"/>
         </div>
     </div>
     <div class="field-date admin__field _required">
-        <label class="admin__field-label" for="<?php /* @noEscape */ echo $code; ?>_expiration">
+        <label class="admin__field-label" for="<?php /* @noEscape */
+        echo $code; ?>_expiration">
             <span><?php echo $block->escapeHtml(__('Expiration Date')); ?></span>
         </label>
         <div class="admin__field-control">
-            <select id="<?php /* @noEscape */ echo $code ?>_expiration" data-encrypted-name="expiryMonth"
+            <select id="<?php /* @noEscape */
+            echo $code ?>_expiration" data-encrypted-name="expiryMonth"
                     class="admin__control-select admin__control-select-month validate-cc-exp required-entry">
                 <?php foreach ($block->getCcMonths() as $k => $v): ?>
                     <option value="<?php echo $block->escapeHtml($k); ?>"
@@ -87,10 +100,12 @@ $ccExpYear = $block->getInfoData('cc_exp_year');
                     </option>
                 <?php endforeach; ?>
             </select>
-            <select id="<?php /* @noEscape */ echo $code ?>_expiration_yr" data-encrypted-name="expiryYear"
+            <select id="<?php /* @noEscape */
+            echo $code ?>_expiration_yr" data-encrypted-name="expiryYear"
                     class="admin__control-select admin__control-select-year required-entry">
                 <?php foreach ($block->getCcYears() as $k => $v): ?>
-                    <option value="<?php /* @noEscape */ echo $k ? $block->escapeHtml($k) : '' ?>"
+                    <option value="<?php /* @noEscape */
+                    echo $k ? $block->escapeHtml($k) : '' ?>"
                             <?php if ($k == $ccExpYear): ?>selected="selected"<?php endif ?>>
                         <?php echo $block->escapeHtml($v); ?>
                     </option>
@@ -98,41 +113,50 @@ $ccExpYear = $block->getInfoData('cc_exp_year');
             </select>
 
 
-            <input type="hidden" id="<?php echo $code ?>_encrypted_form_expiry_generationtime" value="<?php echo date("c"); ?>" data-encrypted-name="generationtime" />
+            <input type="hidden" id="<?php echo $code ?>_encrypted_form_expiry_generationtime"
+                   value="<?php echo date("c"); ?>" data-encrypted-name="generationtime"/>
 
         </div>
     </div>
 
     <?php if ($block->hasVerification()): ?>
         <div class="field-number required admin__field _required">
-            <label class="admin__field-label" for="<?php /* @noEscape */ echo $code; ?>_cc_cid">
+            <label class="admin__field-label" for="<?php /* @noEscape */
+            echo $code; ?>_cc_cid">
                 <span><?php echo $block->escapeHtml(__('Card Verification Number')); ?></span>
             </label>
             <div class="admin__field-control">
                 <input type="text" title="<?php echo $block->escapeHtml(__('Card Verification Number')); ?>"
                        class="required-entry validate-cc-cvn admin__control-cvn admin__control-text"
-                       id="<?php /* @noEscape */ echo $code; ?>_cc_cid"
-                       data-encrypted-name="cvc" value="<?php /* @noEscape */ echo $block->getInfoData('cc_cid') ?>"/>
+                       id="<?php /* @noEscape */
+                       echo $code; ?>_cc_cid"
+                       data-encrypted-name="cvc" value="<?php /* @noEscape */
+                echo $block->getInfoData('cc_cid') ?>"/>
             </div>
         </div>
     <?php endif; ?>
 
     <script>
-        require(['jquery',
+        require(
+            [
+                'jquery',
                 'Magento_Sales/order/create/scripts',
-            "Magento_Sales/order/create/form",
-            'Adyen_Payment/js/adyen-encrypt'],
-            function(jQuery){
-
+                "Magento_Sales/order/create/form"
+            ],
+            function () {
                 //<![CDATA[
+                var dfScriptTag = document.createElement('script');
+                dfScriptTag.src = "<?php echo $block->getLibrarySource(); ?>";
+                dfScriptTag.type = "text/javascript";
+                document.body.appendChild(dfScriptTag);
+
                 var element = $('payment_form_<?php echo $code ?>');
                 var cse_form = $(element).closest('form');
-                var cse_key = <?php echo json_encode($block->getCsePublicKey()); ?>;
                 var cse_options = {
                     name: 'payment[encrypted_data]'
                 };
 
-                var cse = function() {
+                var cse = function () {
 
                     if (order.paymentMethod && order.paymentMethod == '<?php echo $code ?>') {
                         try {
@@ -140,7 +164,7 @@ $ccExpYear = $block->getInfoData('cc_exp_year');
                             // do not validate because it could be that CVC field does not exists (because MOTO this is not needed)
                             cse_options.enableValidations = false;
 
-                            var cseForm = adyen.encrypt.createEncryptedForm(cse_form, cse_key, cse_options);
+                            var cseForm = adyen.createEncryptedForm(cse_form, cse_options);
                             // encrypt data directly because submit button is not always on the page
                             var test = cseForm.encrypt();
                             cseForm.createEncryptedField(test);
@@ -154,9 +178,9 @@ $ccExpYear = $block->getInfoData('cc_exp_year');
                     }
                 }
 
-                var cse_initialize = function() {
+                var cse_initialize = function () {
 
-                    order.submit = order.submit.wrap(function(originalSaveMethod) {
+                    order.submit = order.submit.wrap(function (originalSaveMethod) {
                         cse.call(this);
                         originalSaveMethod();
                     });
@@ -170,7 +194,6 @@ $ccExpYear = $block->getInfoData('cc_exp_year');
                     Event.observe(window, 'load', cse_initialize);
                 }
                 //]]>
-
             });
     </script>
 

view/frontend/requirejs-config.js

@@ -5,9 +5,6 @@
 /*jshint browser:true jquery:true*/
 /*global alert*/
 var config = {
-    paths: {
-        'adyen/encrypt' : 'Adyen_Payment/js/view/payment/adyen.encrypt.min'
-    },
     config: {
         mixins: {
             'Adyen_Payment/js/action/place-order': {

view/frontend/web/js/view/payment/method-renderer/adyen-cc-method.js

@@ -34,9 +34,8 @@ define(
         'Magento_Checkout/js/model/quote',
         'ko',
         'Adyen_Payment/js/model/installments',
-        'adyen/encrypt'
     ],
-    function (_, $, Component, placeOrderAction, $t, additionalValidators, customer, creditCardData, quote, ko, installments, adyenEncrypt) {
+    function (_, $, Component, placeOrderAction, $t, additionalValidators, customer, creditCardData, quote, ko, installments) {
 
         'use strict';
         var cvcLength = ko.observable(4);
@@ -69,21 +68,27 @@ define(
                 return this;
             },
             getInstallments: installments.getInstallments(),
-            initialize: function() {
+            initialize: function () {
                 var self = this;
                 this._super();
                 
+                // include dynamic cse javascript
+                var dfScriptTag = document.createElement('script');
+                dfScriptTag.src = this.getLibrarySource();
+                dfScriptTag.type = "text/javascript";
+                document.body.appendChild(dfScriptTag);
+
                 //Set credit card number to credit card data object
-                this.creditCardNumber.subscribe(function(value) {
+                this.creditCardNumber.subscribe(function (value) {
 
                     // installments enabled ??
                     var allInstallments = self.getAllInstallments();
 
                     // what card is this ??
                     var creditcardType = creditCardData.creditCard.type;
-                    if(creditcardType) {
+                    if (creditcardType) {
                         cvcLength(4);
-                        if (creditcardType != "AE"){
+                        if (creditcardType != "AE") {
                             cvcLength(3);
                         }
                         if (creditcardType in allInstallments) {
@@ -93,13 +98,13 @@ define(
 
                             var numberOfInstallments = 0;
                             $.each(installmentCreditcard, function (amount, installment) {
-                                if(grandTotal <= amount) {
+                                if (grandTotal <= amount) {
                                     numberOfInstallments = installment;
                                     return false;
                                 }
                             });
 
-                            if(numberOfInstallments > 0) {
+                            if (numberOfInstallments > 0) {
                                 installments.setInstallments(numberOfInstallments);
                             }
                         } else {
@@ -108,16 +113,16 @@ define(
                     }
                 });
             },
-            setPlaceOrderHandler: function(handler) {
+            setPlaceOrderHandler: function (handler) {
                 this.placeOrderHandler = handler;
             },
-            setValidateHandler: function(handler) {
+            setValidateHandler: function (handler) {
                 this.validateHandler = handler;
             },
-            getCode: function() {
+            getCode: function () {
                 return 'adyen_cc';
             },
-            getData: function() {
+            getData: function () {
                 return {
                     'method': this.item.method,
                     additional_data: {
@@ -129,16 +134,16 @@ define(
                     }
                 };
             },
-            getCvcLength: function() {
+            getCvcLength: function () {
                 return cvcLength();
             },
-            isActive: function() {
+            isActive: function () {
                 return true;
             },
             /**
              * @override
              */
-            placeOrder: function(data, event) {
+            placeOrder: function (data, event) {
                 var self = this,
                     placeOrder;
 
@@ -146,19 +151,18 @@ define(
                     event.preventDefault();
                 }
 
-                var cse_key = this.getCSEKey();
-                var options = {};
 
-                var cseInstance = adyenEncrypt.createEncryption(cse_key, options);
+                var options = {};
+                var cseInstance = adyen.createEncryption(options);
                 var generationtime = self.getGenerationTime();
 
                 var cardData = {
-                    number : self.creditCardNumber(),
-                    cvc : self.creditCardVerificationNumber(),
-                    holderName : self.creditCardOwner(),
-                    expiryMonth : self.creditCardExpMonth(),
-                    expiryYear : self.creditCardExpYear(),
-                    generationtime : generationtime
+                    number: self.creditCardNumber(),
+                    cvc: self.creditCardVerificationNumber(),
+                    holderName: self.creditCardOwner(),
+                    expiryMonth: self.creditCardExpMonth(),
+                    expiryYear: self.creditCardExpYear(),
+                    generationtime: generationtime
                 };
 
                 var data = cseInstance.encrypt(cardData);
@@ -168,38 +172,35 @@ define(
                     this.isPlaceOrderActionAllowed(false);
                     placeOrder = placeOrderAction(this.getData(), this.redirectAfterPlaceOrder);
 
-                    $.when(placeOrder).fail(function(response) {
+                    $.when(placeOrder).fail(function (response) {
                         self.isPlaceOrderActionAllowed(true);
                     });
                     return true;
                 }
                 return false;
             },
-            getControllerName: function() {
+            getControllerName: function () {
                 return window.checkoutConfig.payment.iframe.controllerName[this.getCode()];
             },
-            getPlaceOrderUrl: function() {
+            getPlaceOrderUrl: function () {
                 return window.checkoutConfig.payment.iframe.placeOrderUrl[this.getCode()];
             },
-            context: function() {
+            context: function () {
                 return this;
             },
-            isCseEnabled: function() {
-                return window.checkoutConfig.payment.adyenCc.cseEnabled;
-            },
-            getCSEKey: function() {
-                return window.checkoutConfig.payment.adyenCc.cseKey;
+            getLibrarySource: function () {
+                return window.checkoutConfig.payment.adyenCc.librarySource;
             },
-            getGenerationTime: function() {
+            getGenerationTime: function () {
                 return window.checkoutConfig.payment.adyenCc.generationTime;
             },
-            canCreateBillingAgreement: function() {
-                if(customer.isLoggedIn()) {
+            canCreateBillingAgreement: function () {
+                if (customer.isLoggedIn()) {
                     return window.checkoutConfig.payment.adyenCc.canCreateBillingAgreement;
                 }
                 return false;
             },
-            isShowLegend: function() {
+            isShowLegend: function () {
                 return true;
             },
             validate: function () {
@@ -213,13 +214,13 @@ define(
                 var expiration_yr = Boolean($(form + ' #adyen_cc_expiration_yr').valid());
                 var cid = Boolean($(form + ' #adyen_cc_cc_cid').valid());
 
-                if(!validate || !ccNumber || !owner || !expiration || !expiration_yr || !cid) {
+                if (!validate || !ccNumber || !owner || !expiration || !expiration_yr || !cid) {
                     return false;
                 }
 
                 return true;
             },
-            showLogo: function() {
+            showLogo: function () {
                 return window.checkoutConfig.payment.adyen.showLogo;
             },
             getIcons: function (type) {
@@ -227,10 +228,10 @@ define(
                     ? window.checkoutConfig.payment.adyenCc.icons[type]
                     : false
             },
-            hasInstallments: function() {
+            hasInstallments: function () {
                 return window.checkoutConfig.payment.adyenCc.hasInstallments;
             },
-            getAllInstallments: function() {
+            getAllInstallments: function () {
                 return window.checkoutConfig.payment.adyenCc.installments;
             }
         });

view/frontend/web/js/view/payment/method-renderer/adyen-oneclick-method.js

@@ -32,8 +32,7 @@ define(
         'Magento_Checkout/js/model/payment/additional-validators',
         'Magento_Checkout/js/action/select-payment-method',
         'Magento_Checkout/js/model/quote',
-        'Magento_Checkout/js/checkout-data',
-        'Adyen_Payment/js/view/payment/adyen-encrypt'
+        'Magento_Checkout/js/checkout-data'
     ],
     function (ko, _, $, Component, placeOrderAction, $t, additionalValidators, selectPaymentMethodAction, quote, checkoutData) {
         'use strict';
@@ -56,24 +55,28 @@ define(
                     ]);
                 return this;
             },
+            initialize: function () {
+                var self = this;
+                this._super();
+            },
             placeOrderHandler: null,
             validateHandler: null,
-            setPlaceOrderHandler: function(handler) {
+            setPlaceOrderHandler: function (handler) {
                 this.placeOrderHandler = handler;
             },
-            setValidateHandler: function(handler) {
+            setValidateHandler: function (handler) {
                 this.validateHandler = handler;
             },
-            getCode: function() {
+            getCode: function () {
                 return 'adyen_oneclick';
             },
-            isActive: function() {
+            isActive: function () {
                 return true;
             },
             /**
              * @override
              */
-            placeOrder: function(data, event) {
+            placeOrder: function (data, event) {
                 var self = this,
                     placeOrder;
 
@@ -95,17 +98,16 @@ define(
                     var generationtime = self.getGenerationTime();
 
                     var cardData = {
-                        cvc : self.creditCardVerificationNumber,
-                        expiryMonth : self.creditCardExpMonth(),
-                        expiryYear : self.creditCardExpYear(),
-                        generationtime : generationtime
+                        cvc: self.creditCardVerificationNumber,
+                        expiryMonth: self.creditCardExpMonth(),
+                        expiryYear: self.creditCardExpYear(),
+                        generationtime: generationtime
                     };
 
-                    if(updatedExpiryDate || self.hasVerification()){
+                    if (updatedExpiryDate || self.hasVerification()) {
 
-                        var options = { enableValidations: false};
-                        var cse_key = this.getCSEKey();
-                        var cseInstance = adyen.encrypt.createEncryption(cse_key, options);
+                        var options = {enableValidations: false};
+                        var cseInstance = adyen.createEncryption(options);
                         var encryptedData = cseInstance.encrypt(cardData);
                         data.additional_data.encrypted_data = encryptedData;
                     }
@@ -119,42 +121,39 @@ define(
                     //this.isPlaceOrderActionAllowed(false);
                     placeOrder = placeOrderAction(data, this.redirectAfterPlaceOrder);
 
-                    $.when(placeOrder).fail(function(response) {
+                    $.when(placeOrder).fail(function (response) {
                         //self.isPlaceOrderActionAllowed(true);
                     });
                     return true;
                 }
                 return false;
             },
-            getControllerName: function() {
+            getControllerName: function () {
                 return window.checkoutConfig.payment.iframe.controllerName[this.getCode()];
             },
-            context: function() {
+            context: function () {
                 return this;
             },
-            isCseEnabled: function() {
-                return window.checkoutConfig.payment.adyenCc.cseEnabled;
-            },
-            canCreateBillingAgreement: function() {
+            canCreateBillingAgreement: function () {
                 return window.checkoutConfig.payment.adyenCc.canCreateBillingAgreement;
             },
-            isShowLegend: function() {
+            isShowLegend: function () {
                 return true;
             },
-            getAdyenBillingAgreements: function() {
+            getAdyenBillingAgreements: function () {
                 var self = this;
                 // convert to list so you can iterate
-                var paymentList = _.map(window.checkoutConfig.payment.adyenOneclick.billingAgreements, function(value) {
+                var paymentList = _.map(window.checkoutConfig.payment.adyenOneclick.billingAgreements, function (value) {
 
                     var creditCardExpMonth, creditCardExpYear = false;
-                    if(value.agreement_data.card) {
+                    if (value.agreement_data.card) {
                         creditCardExpMonth = value.agreement_data.card.expiryMonth;
                         creditCardExpYear = value.agreement_data.card.expiryYear;
                     }
 
                     // pre-define installments if they are set
                     var i, installments = [];
-                    if(value.number_of_installments > 0) {
+                    if (value.number_of_installments > 0) {
                         for (i = 1; i <= value.number_of_installments; i++) {
                             installments.push({
                                 key: i,
@@ -173,19 +172,16 @@ define(
                         'number_of_installments': value.number_of_installments,
                         getInstallments: ko.observableArray(installments),
                         'method': self.item.method,
-                        getCode: function() {
+                        getCode: function () {
                             return self.item.method;
                         },
                         creditCardVerificationNumber: '',
                         creditCardExpMonth: ko.observable(creditCardExpMonth),
                         creditCardExpYear: ko.observable(creditCardExpYear),
-                        getCSEKey: function() {
-                            return window.checkoutConfig.payment.adyenCc.cseKey;
-                        },
-                        getGenerationTime: function() {
+                        getGenerationTime: function () {
                             return window.checkoutConfig.payment.adyenCc.generationTime;
                         },
-                        hasVerification: function() {
+                        hasVerification: function () {
                             return window.checkoutConfig.payment.adyenOneclick.hasCustomerInteraction;
                         },
                         validate: function () {
@@ -199,14 +195,14 @@ define(
                             var validate = $(form).validation() && $(form).validation('isValid');
 
                             // if oneclick or recurring is a card do validation on expiration date
-                            if(this.agreement_data.card) {
+                            if (this.agreement_data.card) {
                                 // add extra validation because jquery validation will not work on non name attributes
                                 var expiration = Boolean($(form + ' #' + codeValue + '_expiration').valid());
                                 var expiration_yr = Boolean($(form + ' #' + codeValue + '_expiration_yr').valid());
 
                                 // only check if recurring type is set to oneclick
                                 var cid = true;
-                                if(this.hasVerification()) {
+                                if (this.hasVerification()) {
                                     var cid = Boolean($(form + ' #' + codeValue + '_cc_cid').valid());
                                 }
                             } else {
@@ -215,13 +211,13 @@ define(
                                 var cid = true;
                             }
 
-                            if(!validate || !expiration || !expiration_yr || !cid) {
+                            if (!validate || !expiration || !expiration_yr || !cid) {
                                 return false;
                             }
 
                             return true;
                         },
-                        selectExpiry: function() {
+                        selectExpiry: function () {
                             updatedExpiryDate = true;
                             var self = this;
                             self.expiry(true);
@@ -231,7 +227,7 @@ define(
                 });
                 return paymentList;
             },
-            selectBillingAgreement: function() {
+            selectBillingAgreement: function () {
                 var self = this;
                 self.expiry(false);
                 updatedExpiryDate = false;
@@ -258,16 +254,16 @@ define(
             },
             isBillingAgreementChecked: ko.computed(function () {
 
-                if(!quote.paymentMethod()) {
+                if (!quote.paymentMethod()) {
                     return null;
                 }
 
-                if(quote.paymentMethod().method == paymentMethod()) {
+                if (quote.paymentMethod().method == paymentMethod()) {
                     return recurringDetailReference();
                 }
                 return null;
             }),
-            getPlaceOrderUrl: function() {
+            getPlaceOrderUrl: function () {
                 return window.checkoutConfig.payment.iframe.placeOrderUrl[this.getCode()];
             }
         });

view/frontend/web/template/payment/cc-form.html

@@ -45,7 +45,6 @@
         </div>
 
 
-
         <form class="form" id="adyen-cc-form" data-role="adyen-cc-form" action="#" method="post" data-bind="mageInit: {
             'transparent':{
                 'context': context(),
@@ -54,11 +53,13 @@
             }, 'validation':[]}">
 
 
-            <fieldset data-bind="attr: {class: 'fieldset payment items ccard ' + getCode(), id: 'payment_form_' + getCode()}">
+            <fieldset
+                    data-bind="attr: {class: 'fieldset payment items ccard ' + getCode(), id: 'payment_form_' + getCode()}">
                 <!-- ko if: (isShowLegend())-->
                 <legend class="legend">
                     <span><!-- ko text: $t('Credit Card Information')--><!-- /ko --></span>
-                </legend><br />
+                </legend>
+                <br/>
                 <!-- /ko -->
 
                 <div class="field type required">
@@ -187,7 +188,7 @@
                                 oninput:'javascript: if (this.value.length > this.maxLength) this.value = this.value.slice(0, this.maxLength);'
                                 },
                                 enable: isActive($parents),
-                                value: creditCardVerificationNumber",
+                                value: creditCardVerificationNumber" ,
                                data-validate="{required:true}"
                         />
                         <div class="field-tooltip toggle">
@@ -208,7 +209,8 @@
 
                 <!-- ko if: (hasInstallments())-->
 
-                <div class="field required" data-bind="attr: {id: getCode() + '_installments_div'}, visible: getInstallments().length > 0">
+                <div class="field required"
+                     data-bind="attr: {id: getCode() + '_installments_div'}, visible: getInstallments().length > 0">
                     <label data-bind="attr: {for: getCode() + '_installments'}" class="label">
                         <span><!-- ko text: $t('Installments')--><!-- /ko --></span>
                     </label>
@@ -248,19 +250,14 @@
                 <!-- /ko -->
 
 
-                <!-- ko if: (isCseEnabled())-->
-
                 <input type="hidden"
                        name="payment[generationtime]"
                        class="input-text"
                        value=""
                        data-encrypted-name="generationtime"
                        data-bind="attr: {id: getCode() + '_generationtime', 'data-container': getCode() + '-generationtime'},
-                               value: getGenerationTime()
-                               ">
-
-
-                <!-- /ko -->
+                           value: getGenerationTime()"
+                />
             </fieldset>
         </form>