From e78e81227a20344476aa6941e259bb18e024b3a1 Mon Sep 17 00:00:00 2001 From: dinamiko Date: Wed, 22 Sep 2021 15:49:24 +0200 Subject: [PATCH] Add js script for my account payments screen --- modules/ppcp-vaulting/.gitignore | 2 +- modules/ppcp-vaulting/package.json | 2 +- .../resources/js/myaccount-payments.js | 6 ++- modules/ppcp-vaulting/services.php | 17 ++++++- .../Assets/class-myaccountpaymentsassets.php | 46 +++++++++++++++++++ .../src/class-payment-tokens-renderer.php | 4 +- .../src/class-vaultingmodule.php | 7 +++ modules/ppcp-vaulting/webpack.config.js | 18 +------- modules/ppcp-vaulting/yarn.lock | 36 +++++++-------- 9 files changed, 97 insertions(+), 41 deletions(-) create mode 100644 modules/ppcp-vaulting/src/Assets/class-myaccountpaymentsassets.php diff --git a/modules/ppcp-vaulting/.gitignore b/modules/ppcp-vaulting/.gitignore index 265c2208c..f69a89f4b 100644 --- a/modules/ppcp-vaulting/.gitignore +++ b/modules/ppcp-vaulting/.gitignore @@ -1,2 +1,2 @@ node_modules -assets +/assets diff --git a/modules/ppcp-vaulting/package.json b/modules/ppcp-vaulting/package.json index dec722820..0c61107a4 100644 --- a/modules/ppcp-vaulting/package.json +++ b/modules/ppcp-vaulting/package.json @@ -2,7 +2,7 @@ "name": "ppcp-vaulting", "version": "1.0.0", "license": "GPL-3.0-or-later", - "main": "resources/js/status-page.js", + "main": "resources/js/myaccount-payments.js", "devDependencies": { "@babel/core": "^7.9.0", "@babel/preset-env": "^7.9.5", diff --git a/modules/ppcp-vaulting/resources/js/myaccount-payments.js b/modules/ppcp-vaulting/resources/js/myaccount-payments.js index b70622a8a..9fe14c405 100644 --- a/modules/ppcp-vaulting/resources/js/myaccount-payments.js +++ b/modules/ppcp-vaulting/resources/js/myaccount-payments.js @@ -1,5 +1,9 @@ document.addEventListener( 'DOMContentLoaded', () => { - console.log('fooooo') + jQuery('.ppcp-delete-payment-button').click(async (event) => { + event.preventDefault(); + + console.log(event.target.id) + }); }); diff --git a/modules/ppcp-vaulting/services.php b/modules/ppcp-vaulting/services.php index e5eabe247..81b1d13ee 100644 --- a/modules/ppcp-vaulting/services.php +++ b/modules/ppcp-vaulting/services.php @@ -9,11 +9,24 @@ declare(strict_types=1); namespace WooCommerce\PayPalCommerce\Vaulting; +use WooCommerce\PayPalCommerce\Vaulting\Assets\MyAccountPaymentsAssets; + return array( - 'vaulting.payment-tokens-renderer' => static function (): PaymentTokensRendered { + 'vaulting.module-url' => static function ( $container ): string { + return plugins_url( + '/modules/ppcp-vaulting/', + dirname( __FILE__, 3 ) . '/woocommerce-paypal-payments.php' + ); + }, + 'vaulting.assets.myaccount-payments' => function( $container ) : MyAccountPaymentsAssets { + return new MyAccountPaymentsAssets( + $container->get( 'vaulting.module-url' ) + ); + }, + 'vaulting.payment-tokens-renderer' => static function (): PaymentTokensRendered { return new PaymentTokensRendered(); }, - 'vaulting.repository.payment-token' => static function ( $container ): PaymentTokenRepository { + 'vaulting.repository.payment-token' => static function ( $container ): PaymentTokenRepository { $factory = $container->get( 'api.factory.payment-token' ); $endpoint = $container->get( 'api.endpoint.payment-token' ); return new PaymentTokenRepository( $factory, $endpoint ); diff --git a/modules/ppcp-vaulting/src/Assets/class-myaccountpaymentsassets.php b/modules/ppcp-vaulting/src/Assets/class-myaccountpaymentsassets.php new file mode 100644 index 000000000..0f329b743 --- /dev/null +++ b/modules/ppcp-vaulting/src/Assets/class-myaccountpaymentsassets.php @@ -0,0 +1,46 @@ +module_url = untrailingslashit( $module_url ); + } + + /** + * Enqueues the necessary scripts. + * + * @return void + */ + public function enqueue(): void { + wp_enqueue_script( + 'ppcp-vaulting-myaccount-payments', + $this->module_url . '/assets/js/myaccount-payments.js', + array( 'jquery' ), + '1', + true + ); + } +} diff --git a/modules/ppcp-vaulting/src/class-payment-tokens-renderer.php b/modules/ppcp-vaulting/src/class-payment-tokens-renderer.php index 27e2fa679..d27975306 100644 --- a/modules/ppcp-vaulting/src/class-payment-tokens-renderer.php +++ b/modules/ppcp-vaulting/src/class-payment-tokens-renderer.php @@ -25,7 +25,7 @@ class PaymentTokensRendered { card->brand . ' ...' . $source->card->last_digits;?> - Delete + Delete paypal->payer->email_address;?> - Delete + Delete get( 'vaulting.assets.myaccount-payments' ); + add_action( 'wp_enqueue_scripts', function () use ($asset_loader) { + $asset_loader->enqueue(); + } ); } /** diff --git a/modules/ppcp-vaulting/webpack.config.js b/modules/ppcp-vaulting/webpack.config.js index b36d96e62..0d13bf842 100644 --- a/modules/ppcp-vaulting/webpack.config.js +++ b/modules/ppcp-vaulting/webpack.config.js @@ -6,8 +6,7 @@ module.exports = { mode: isProduction ? 'production' : 'development', target: 'web', entry: { - 'status-page': path.resolve('./resources/js/status-page.js'), - 'status-page-style': path.resolve('./resources/css/status-page.scss'), + 'myaccount-payments': path.resolve('./resources/js/myaccount-payments.js'), }, output: { path: path.resolve(__dirname, 'assets/'), @@ -18,19 +17,6 @@ module.exports = { test: /\.js?$/, exclude: /node_modules/, loader: 'babel-loader', - }, - { - test: /\.scss$/, - exclude: /node_modules/, - use: [ - { - loader: 'file-loader', - options: { - name: 'css/[name].css', - } - }, - {loader:'sass-loader'} - ] - }] + }] } }; diff --git a/modules/ppcp-vaulting/yarn.lock b/modules/ppcp-vaulting/yarn.lock index 01c39bb21..94a88776d 100644 --- a/modules/ppcp-vaulting/yarn.lock +++ b/modules/ppcp-vaulting/yarn.lock @@ -1443,15 +1443,15 @@ browserify-zlib@^0.2.0: pako "~1.0.5" browserslist@^4.16.6, browserslist@^4.17.0: - version "4.17.0" - resolved "https://registry.yarnpkg.com/browserslist/-/browserslist-4.17.0.tgz#1fcd81ec75b41d6d4994fb0831b92ac18c01649c" - integrity sha512-g2BJ2a0nEYvEFQC208q8mVAhfNwpZ5Mu8BwgtCdZKO3qx98HChmeg448fPdUzld8aFmfLgVh7yymqV+q1lJZ5g== + version "4.17.1" + resolved "https://registry.yarnpkg.com/browserslist/-/browserslist-4.17.1.tgz#a98d104f54af441290b7d592626dd541fa642eb9" + integrity sha512-aLD0ZMDSnF4lUt4ZDNgqi5BUn9BZ7YdQdI/cYlILrhdSSZJLU9aNZoD5/NBmM4SK34APB2e83MOsRt1EnkuyaQ== dependencies: - caniuse-lite "^1.0.30001254" - colorette "^1.3.0" - electron-to-chromium "^1.3.830" + caniuse-lite "^1.0.30001259" + electron-to-chromium "^1.3.846" escalade "^3.1.1" - node-releases "^1.1.75" + nanocolors "^0.1.5" + node-releases "^1.1.76" buffer-from@^1.0.0: version "1.1.2" @@ -1539,7 +1539,7 @@ camelcase@^5.0.0: resolved "https://registry.yarnpkg.com/camelcase/-/camelcase-5.3.1.tgz#e3c9b31569e106811df242f715725a1f4c494320" integrity sha512-L28STB170nwWS63UjtlEOE3dldQApaJXZkOI1uMFfzf3rRuPegHaHesyee+YxQ+W6SvRDQV6UrdOdRiR153wJg== -caniuse-lite@^1.0.30001254: +caniuse-lite@^1.0.30001259: version "1.0.30001259" resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001259.tgz#ae21691d3da9c4be6144403ac40f71d9f6efd790" integrity sha512-V7mQTFhjITxuk9zBpI6nYsiTXhcPe05l+364nZjK7MFK/E7ibvYBSAXr4YcA6oPR8j3ZLM/LN+lUqUVAQEUZFg== @@ -1674,11 +1674,6 @@ color-name@1.1.3: resolved "https://registry.yarnpkg.com/color-name/-/color-name-1.1.3.tgz#a7d0558bd89c42f795dd42328f740831ca53bc25" integrity sha1-p9BVi9icQveV3UIyj3QIMcpTvCU= -colorette@^1.3.0: - version "1.4.0" - resolved "https://registry.yarnpkg.com/colorette/-/colorette-1.4.0.tgz#5190fbb87276259a86ad700bff2c6d6faa3fca40" - integrity sha512-Y2oEozpomLn7Q3HFP7dpww7AtMJplbM9lGZP6RDfHqmbeRjiwRg4n6VM6j4KLmRke85uWEI7JqF17f3pqdRA0g== - combined-stream@^1.0.6, combined-stream@~1.0.6: version "1.0.8" resolved "https://registry.yarnpkg.com/combined-stream/-/combined-stream-1.0.8.tgz#c3d45a8b34fd730631a110a8a2520682b31d5a7f" @@ -1979,10 +1974,10 @@ ecc-jsbn@~0.1.1: jsbn "~0.1.0" safer-buffer "^2.1.0" -electron-to-chromium@^1.3.830: - version "1.3.845" - resolved "https://registry.yarnpkg.com/electron-to-chromium/-/electron-to-chromium-1.3.845.tgz#326d3be3ee5d2c065f689119d441c997f9fd41d8" - integrity sha512-y0RorqmExFDI4RjLEC6j365bIT5UAXf9WIRcknvSFHVhbC/dRnCgJnPA3DUUW6SCC85QGKEafgqcHJ6uPdEP1Q== +electron-to-chromium@^1.3.846: + version "1.3.846" + resolved "https://registry.yarnpkg.com/electron-to-chromium/-/electron-to-chromium-1.3.846.tgz#a55fd59613dbcaed609e965e3e88f42b08c401d3" + integrity sha512-2jtSwgyiRzybHRxrc2nKI+39wH3AwQgn+sogQ+q814gv8hIFwrcZbV07Ea9f8AmK0ufPVZUvvAG1uZJ+obV4Jw== elliptic@^6.5.3: version "6.5.4" @@ -3221,6 +3216,11 @@ nan@^2.12.1, nan@^2.13.2: resolved "https://registry.yarnpkg.com/nan/-/nan-2.15.0.tgz#3f34a473ff18e15c1b5626b62903b5ad6e665fee" integrity sha512-8ZtvEnA2c5aYCZYd1cvgdnU6cqwixRoYg70xPLWUws5ORTa/lnw+u4amixRS/Ac5U5mQVgp9pnlSUnbNWFaWZQ== +nanocolors@^0.1.5: + version "0.1.6" + resolved "https://registry.yarnpkg.com/nanocolors/-/nanocolors-0.1.6.tgz#bc2350d3edfdbfadd7ac018c855ae7c13905a6ad" + integrity sha512-2pvTw6vYRaBLGir2xR7MxaJtyWkrn+C53EpW8yPotG+pdAwBvt0Xwk4VJ6VHLY0aLthVZPvDfm9TdZvrvAm5UQ== + nanomatch@^1.2.9: version "1.2.13" resolved "https://registry.yarnpkg.com/nanomatch/-/nanomatch-1.2.13.tgz#b87a8aa4fc0de8fe6be88895b38983ff265bd119" @@ -3295,7 +3295,7 @@ node-libs-browser@^2.2.1: util "^0.11.0" vm-browserify "^1.0.1" -node-releases@^1.1.75: +node-releases@^1.1.76: version "1.1.76" resolved "https://registry.yarnpkg.com/node-releases/-/node-releases-1.1.76.tgz#df245b062b0cafbd5282ab6792f7dccc2d97f36e" integrity sha512-9/IECtNr8dXNmPWmFXepT0/7o5eolGesHUa3mtr0KlgnCvnZxwh2qensKL42JJY2vQKC3nIBXetFAqR+PW1CmA==