├── .babelrc ├── README.md ├── webpack.config.js ├── .gitignore ├── app ├── index.html └── index.js ├── package.json └── LICENSE /.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": ["es2015"] 3 | } 4 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # payment-request 2 | :money_with_wings: Implementation of Payment Request Api using pagarme 3 | -------------------------------------------------------------------------------- /webpack.config.js: -------------------------------------------------------------------------------- 1 | const path = require('path') 2 | const webpack = require('webpack') 3 | 4 | module.exports = { 5 | context: path.join(__dirname, './app'), 6 | entry: { 7 | js: './index.js', 8 | html: './index.html' 9 | }, 10 | output: { 11 | path: path.join(__dirname, './build'), 12 | filename: 'bundle.js' 13 | }, 14 | 15 | module: { 16 | loaders: [{ 17 | test: /\.js$/, 18 | loaders: ['babel-loader'], 19 | exclude: /node_modules/ 20 | }, { 21 | test: /\.html$/, 22 | loaders: ['file?name=[name].[ext]'] 23 | }] 24 | } 25 | } 26 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | # Project 2 | build 3 | 4 | # Logs 5 | logs 6 | *.log 7 | npm-debug.log* 8 | 9 | # Runtime data 10 | pids 11 | *.pid 12 | *.seed 13 | 14 | # Directory for instrumented libs generated by jscoverage/JSCover 15 | lib-cov 16 | 17 | # Coverage directory used by tools like istanbul 18 | coverage 19 | 20 | # nyc test coverage 21 | .nyc_output 22 | 23 | # Grunt intermediate storage (http://gruntjs.com/creating-plugins#storing-task-files) 24 | .grunt 25 | 26 | # node-waf configuration 27 | .lock-wscript 28 | 29 | # Compiled binary addons (http://nodejs.org/api/addons.html) 30 | build/Release 31 | 32 | # Dependency directories 33 | node_modules 34 | jspm_packages 35 | 36 | # Optional npm cache directory 37 | .npm 38 | 39 | # Optional REPL history 40 | .node_repl_history 41 | -------------------------------------------------------------------------------- /app/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Aerospacial and Thermonuclear Club 8 | 9 | 10 |
11 |

Aerospacial and Thermonuclear Club

12 | 13 | A huge spaceship cuts throught the air 14 | 15 |

Welcome to Aerospacial and Thermonuclear Club (c) 2020

16 |

Here you can have access to rocket engines, uranium, hyperfuel and also orange juice.

17 | 18 | 19 | 20 | 

21 |   

22 | 
23 |   
24 |   
25 | 
26 | 
27 | 


--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
 1 | {
 2 |   "name": "payment-request",
 3 |   "version": "0.1.0",
 4 |   "description": "Implementation of Payment Request Api with pagarme",
 5 |   "main": "app/index.js",
 6 |   "scripts": {
 7 |     "build": "webpack",
 8 |     "start": "webpack-dev-server --inline --hot --progress --colors --https --host 0.0.0.0 --port 3000"
 9 |   },
10 |   "repository": {
11 |     "type": "git",
12 |     "url": "git+https://github.com/grvcoelho/payment-request.git"
13 |   },
14 |   "keywords": [
15 |     "payment",
16 |     "api",
17 |     "payment-request",
18 |     "pagarme"
19 |   ],
20 |   "author": "Guilherme Rv Coelho <@grvcoelho>",
21 |   "license": "MIT",
22 |   "bugs": {
23 |     "url": "https://github.com/grvcoelho/payment-request/issues"
24 |   },
25 |   "homepage": "https://github.com/grvcoelho/payment-request#readme",
26 |   "devDependencies": {
27 |     "babel-core": "^6.17.0",
28 |     "babel-loader": "^6.2.5",
29 |     "babel-preset-es2015": "^6.16.0",
30 |     "file-loader": "^0.9.0",
31 |     "webpack": "^1.13.2",
32 |     "webpack-dev-server": "^1.16.2"
33 |   }
34 | }
35 | 


--------------------------------------------------------------------------------
/LICENSE:
--------------------------------------------------------------------------------
 1 | MIT License
 2 | 
 3 | Copyright (c) 2016 Guilherme Rv Coelho
 4 | 
 5 | Permission is hereby granted, free of charge, to any person obtaining a copy
 6 | of this software and associated documentation files (the "Software"), to deal
 7 | in the Software without restriction, including without limitation the rights
 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
 9 | copies of the Software, and to permit persons to whom the Software is
10 | furnished to do so, subject to the following conditions:
11 | 
12 | The above copyright notice and this permission notice shall be included in all
13 | copies or substantial portions of the Software.
14 | 
15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21 | SOFTWARE.
22 | 


--------------------------------------------------------------------------------
/app/index.js:
--------------------------------------------------------------------------------
 1 | const PAGARME_ENCRYPTION_KEY = 'ek_test_AbngIR4MNh9AWQVAJg8qmBs627sPC1'
 2 | 
 3 | let pay = document
 4 |   .querySelector('#pay')
 5 |   .addEventListener('click', onPayClicked)
 6 | 
 7 | const errorHandler = err => console.error('Uh oh, something bad happened.', err)
 8 | 
 9 | function onPayClicked () {
10 |   let supportedInstruments = [{
11 |     supportedMethods: ['visa', 'mastercard']
12 |   }]
13 | 
14 |   let details = {
15 |     displayItems: [
16 |       {
17 |         label: 'Original subscription amount',
18 |         amount: { currency: 'BRL', value : '65.00' }
19 |       },
20 |       {
21 |         label: 'Friends and family discount',
22 |         amount: { currency: 'BRL', value : '-10.00' }
23 |       }
24 |     ],
25 |     total:  {
26 |       label: 'Total',
27 |       amount: { currency: 'BRL', value : '55.00' }
28 |     }
29 |   }
30 | 
31 |   new PaymentRequest(supportedInstruments, details)
32 |     .show()
33 |     .then(sendPaymentToServer)
34 |     .then(finishPayment)
35 |     .catch(errorHandler)
36 | }
37 | 
38 | function sendPaymentToServer (payment) {
39 |   let payload = {
40 |     amount: 5500,
41 |     encryption_key: PAGARME_ENCRYPTION_KEY,
42 |     card_number: payment.details.cardNumber,
43 |     card_holder_name: payment.details.cardholderName,
44 |     card_cvv: payment.details.cardSecurityCode,
45 |     card_expiration_date: payment.details.expiryMonth + payment.details.expiryYear.substr(2, 2),
46 |   }
47 | 
48 |   return fetch('https://api.pagar.me/1/transactions', {
49 |     method: 'POST',
50 |     headers: new Headers({
51 |       'Access-Control-Allow-Origin': '*',
52 |       'Content-Type': 'application/json'
53 |     }),
54 |     body: JSON.stringify(payload)
55 |   })
56 |     .then(res => {
57 |       payment.complete('success')
58 |       return res.json()
59 |     })
60 |     .catch(() => payment.complete('fail'))
61 | }
62 | 
63 | function finishPayment (paymentObject) {
64 |   let pre = document.querySelector('pre')
65 | 
66 |   pre.innerHTML = JSON.stringify(paymentObject)
67 | }
68 | 
69 | 


--------------------------------------------------------------------------------