Skip to content
This repository has been archived by the owner on Jun 2, 2022. It is now read-only.

Commit

Permalink
Merge pull request #14 from pmclain/develop
Browse files Browse the repository at this point in the history 
Magento v2.2.x and Stripe v3 Support
  • Loading branch information
@pmclain
pmclain authored Sep 27, 2017
2 parents 6fde9fb + 9c19ff5 commit 81f438e
Show file tree
Hide file tree
Showing 6 changed files with 79 additions and 130 deletions.
27 changes: 12 additions & 15 deletions composer.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,24 +2,21 @@
"name": "pmclain/module-stripe",
"description": "Stripe Payments for Magento 2",
"type": "magento2-module",
"license": [
"OSL-3.0",
"ASL-3.0"
],
"license": "GPL-3.0",
"require": {
"php": "~5.5.0|~5.6.0|~7.0.0|~7.1.0",
"magento/framework": "~100.0.0|~100.1.0",
"magento/module-config": "~100.0.0|~100.1.0",
"magento/module-payment": "~100.0.0|~100.1.0",
"magento/module-checkout": "~100.0.0|~100.1.0",
"magento/module-sales": "~100.0.0|~100.1.0",
"magento/module-backend": "~100.0.0|~100.1.0",
"magento/module-customer": "~100.0.0|~100.1.0",
"magento/framework": "~100.1.0|~100.2.0",
"magento/module-config": "~100.1.0|~100.2.0",
"magento/module-payment": "~100.1.0|~100.2.0",
"magento/module-checkout": "~100.1.0|~100.2.0",
"magento/module-sales": "~100.1.0|~100.2.0",
"magento/module-backend": "~100.1.0|~100.2.0",
"magento/module-customer": "~100.1.0|~100.2.0",
"magento/module-catalog": "~101.0.0|~101.1.0",
"magento/module-quote": "~100.0.0|~100.1.0",
"magento/module-ui": "~100.0.0|~100.1.0",
"magento/module-vault": "100.1.*|100.2.*",
"stripe/stripe-php": "3.7.0"
"magento/module-quote": "~100.1.0|~100.2.0",
"magento/module-ui": "~100.1.0|~100.2.0",
"magento/module-vault": "~100.1.0|~100.2.0",
"stripe/stripe-php": "~5.2.0"
},
"autoload": {
"files": [
Expand Down
73 changes: 6 additions & 67 deletions view/adminhtml/templates/form/cc.phtml
View file
Original file line number Diff line number Diff line change
Expand Up @@ -23,73 +23,9 @@ $ccExpYear = $block->getInfoData('cc_exp_year');
?>
<fieldset class="admin__fieldset payment-method" id="payment_form_<?php /* @noEscape */ echo $code; ?>"
style="display:none">
<div class="field-type admin__field _required">
<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]"
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; ?>>
<?php echo $block->escapeHtml($typeName); ?>
</option>
<?php endforeach; ?>
</select>
</div>
<div id="stripe-card-element">
<!-- a Stripe Element will be inserted here. -->
</div>
<div class="field-number admin__field _required">
<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" name="payment[cc_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">
<span><?php echo $block->escapeHtml(__('Expiration Date')); ?></span>
</label>
<div class="admin__field-control">
<select id="<?php /* @noEscape */ echo $code ?>_expiration" name="payment[cc_exp_month]"
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); ?>"
<?php if ($k == $ccExpMonth): ?>selected="selected"<?php endif ?>>
<?php echo $block->escapeHtml($v); ?>
</option>
<?php endforeach; ?>
</select>
<select id="<?php /* @noEscape */ echo $code ?>_expiration_yr" name="payment[cc_exp_year]"
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) : '' ?>"
<?php if ($k == $ccExpYear): ?>selected="selected"<?php endif ?>>
<?php echo $block->escapeHtml($v); ?>
</option>
<?php endforeach ?>
</select>
</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">
<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"
name="payment[cc_cid]" value="<?php /* @noEscape */ echo $block->getInfoData('cc_cid') ?>"/>
</div>
</div>
<?php endif; ?>

<?php if($block->isVaultEnabled()): ?>
<div class="field-tooltip-content">
<input type="checkbox"
Expand All @@ -101,7 +37,10 @@ $ccExpYear = $block->getInfoData('cc_exp_year');
</label>
</div>
<?php endif; ?>
<input type="hidden" name="payment[cc_last4]" id="<?php echo $code ?>_cc_last4" />
<input type="hidden" name="payment[cc_token]" id="<?php echo $code ?>_cc_token" />
<input type="hidden" name="payment[expiration]" id="<?php echo $code ?>_expiration" />
<input type="hidden" name="payment[expiration_yr]" id="<?php echo $code ?>_expiration_yr" />
<input type="hidden" name="payment[cc_type]" id="<?php echo $code ?>_cc_type" />

<input type="submit" name="Submit" style="display: none;">
</fieldset>
59 changes: 27 additions & 32 deletions view/adminhtml/web/js/stripe.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,9 @@ define([
active: false,
scriptLoaded: false,
stripe: null,
selectedCardType: null,
stripeCardElement: null,
stripeCard: null,
token: null,
imports: {
onActiveChange: 'active'
}
Expand All @@ -35,8 +37,7 @@ define([
this._super()
.observe([
'active',
'scriptLoaded',
'selectedCardType'
'scriptLoaded'
]);

// re-init payment method events
Expand All @@ -47,7 +48,6 @@ define([
domObserver.get('#' + self.container, function () {
if (self.scriptLoaded()) {
self.$selector.off('submit');
self.initStripe();
}
});

Expand Down Expand Up @@ -97,29 +97,22 @@ define([
var state = self.scriptLoaded;

$('body').trigger('processStart');
require(['https://js.stripe.com/v2/'], function () {
require(['https://js.stripe.com/v3/'], function () {
state(true);
self.stripe = window.Stripe;
self.initStripe();
self.stripe = window.Stripe(self.publishableKey);
self.stripeCardElement = self.stripe.elements();
self.stripeCard = self.stripeCardElement.create('card', {
style: {
base: {
fontSize: '20px'
}
}
});
self.stripeCard.mount('#stripe-card-element');
$('body').trigger('processStop');
});
},

initStripe: function() {
var self = this;

try {
$('body').trigger('processStart');

self.stripe.setPublishableKey(this.publishableKey);

$('body').trigger('processStop');
}catch(e) {
$('body').trigger('processStop');
self.error(e.message);
}
},

/**
* Show alert message
* @param {String} message
Expand Down Expand Up @@ -178,22 +171,24 @@ define([
var container = $('#' + this.container);

var cardInfo = {
number: container.find('#' + this.code + '_cc_number').val(),
exp_month: container.find('#' + this.code + '_expiration').val(),
exp_year: container.find('#' + this.code + '_expiration_yr').val(),
cvc: container.find('#' + this.code + '_cc_cid').val()
number: container.find('#' + self.code + '_cc_number').val(),

exp_month: container.find('#' + self.code + '_expiration').val(),
exp_year: container.find('#' + self.code + '_expiration_yr').val(),
cvc: container.find('#' + self.code + '_cc_cid').val()
};

var defer = $.Deferred();

this.stripe.card.createToken(cardInfo, function(status, response) {
self.stripe.createToken(self.stripeCard).then(function(response) {
if (response.error) {
defer.reject(response.error.message);
deffer.reject(response.error.message);
}else {
container.find('#' + self.code + '_cc_number').val('');
container.find('#' + self.code + '_cc_last4').val(cardInfo.number.slice(-4));
delete cardInfo.number;
$('#' + self.container).find('#' + self.code + '_cc_token').val(response.id);
var card = response.token.card;
container.find('#' + self.code + '_expiration').val(card.exp_month);
container.find('#' + self.code + '_expiration_yr').val(card.exp_year);
container.find('#' + self.code + '_cc_type').val(card.brand);
container.find('#' + self.code + '_cc_token').val(response.token.id);
defer.resolve();
}
});
Expand Down
2 changes: 1 addition & 1 deletion view/frontend/requirejs-config.js
View file
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
var config = {
map: {
'*': {
stripejs: 'https://js.stripe.com/v2/'
stripejs: 'https://js.stripe.com/v3/'
}
}
};
44 changes: 30 additions & 14 deletions view/frontend/web/js/view/payment/method-renderer/pmclain_stripe.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -15,16 +15,33 @@ define(

return Component.extend({
defaults: {
template: 'Pmclain_Stripe/payment/form'
template: 'Pmclain_Stripe/payment/form',
stripe: null,
stripeCardElement: null,
stripeCard: null,
token: null
},

initialize: function() {
this._super();
Stripe.setPublishableKey(this.getPublishableKey());
this.stripe = Stripe(this.getPublishableKey());
this.vaultEnabler = new VaultEnabler();
this.vaultEnabler.setPaymentCode(this.getVaultCode());
},

initStripeElement: function() {
var self = this;
self.stripeCardElement = self.stripe.elements();
self.stripeCard = self.stripeCardElement.create('card', {
style: {
base: {
fontSize: '20px'
}
}
});
self.stripeCard.mount('#stripe-card-element');
},

placeOrder: function(data, event) {
var self = this,
placeOrder;
Expand Down Expand Up @@ -64,20 +81,13 @@ define(
createToken: function() {
var self = this;

var cardInfo = {
number: this.creditCardNumber(),
exp_month: this.creditCardExpMonth(),
exp_year: this.creditCardExpYear(),
cvc: this.creditCardVerificationNumber()
};

var deffer = $.Deferred();

Stripe.card.createToken(cardInfo, function(status, response) {
self.stripe.createToken(self.stripeCard).then(function(response) {
if (response.error) {
deffer.reject(response.error.message);
}else {
self.token = response.id;
self.token = response.token;
deffer.resolve();
}
});
Expand All @@ -96,9 +106,15 @@ define(
getData: function() {
var data = this._super();

data.additional_data.cc_last4 = this.creditCardNumber().slice(-4);
delete data.additional_data.cc_number;
data.additional_data.cc_token = this.token;
if (this.token) {
var card = this.token.card;

data.additional_data.cc_exp_month = card.exp_month;
data.additional_data.cc_exp_year = card.exp_year;
data.additional_data.cc_last4 = card.last4;
data.additional_data.cc_type = card.brand;
data.additional_data.cc_token = this.token.id;
}

this.vaultEnabler.visitAdditionalData(data);

Expand Down
4 changes: 3 additions & 1 deletion view/frontend/web/template/payment/form.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,9 @@
</div>

<form class="form" data-bind="attr: {'id': getCode() + '-form'}">
<!-- ko template: 'Magento_Payment/payment/cc-form' --><!-- /ko -->
<div id="stripe-card-element" afterRender="initStripeElement">
<!-- a Stripe Element will be inserted here. -->
</div>
<!-- ko if: (isVaultEnabled())-->
<div class="field choice">
<input type="checkbox"
Expand Down

0 comments on commit 81f438e

Please sign in to comment.