Ssmith has uploaded a new change for review.
https://gerrit.wikimedia.org/r/171022
Change subject: Add dropdown test for WorldPay credit card entry
......................................................................
Add dropdown test for WorldPay credit card entry
More info in Mingle card #2083
Change-Id: I249dbf131caf7558dc4fbd81570615dbf713b3b7
---
M worldpay_gateway/forms/css/worldpay.css
A worldpay_gateway/forms/html/_personal-information/wp-ddcc.html
A worldpay_gateway/forms/html/worldpay-dd-test.html
M worldpay_gateway/forms/js/worldpay.js
4 files changed, 193 insertions(+), 0 deletions(-)
git pull
ssh://gerrit.wikimedia.org:29418/mediawiki/extensions/DonationInterface
refs/changes/22/171022/1
diff --git a/worldpay_gateway/forms/css/worldpay.css
b/worldpay_gateway/forms/css/worldpay.css
index d01b9e3..9ec2a28 100644
--- a/worldpay_gateway/forms/css/worldpay.css
+++ b/worldpay_gateway/forms/css/worldpay.css
@@ -76,6 +76,7 @@
border: none;
margin-bottom: 10px;
padding: 15px;
+ min-height: 200px;
}
#greenBackground input[type="text"] {
margin-bottom: 6px !important;
@@ -126,6 +127,16 @@
background-image: linear-gradient( #ffffff, #cccccc ) !important;
}
+#ddTestOptions label {
+ padding: 0 3px;
+ margin: 0 7px 0 0;
+ overflow: visible;
+}
+
+#ddTestCCArea {
+ margin-top: 7px;
+}
+
/* Legal text and informational links */
p#informationsharing, p#monthlycancel {
width: 100%;
diff --git a/worldpay_gateway/forms/html/_personal-information/wp-ddcc.html
b/worldpay_gateway/forms/html/_personal-information/wp-ddcc.html
new file mode 100644
index 0000000..a74d235
--- /dev/null
+++ b/worldpay_gateway/forms/html/_personal-information/wp-ddcc.html
@@ -0,0 +1,28 @@
+<div class="row-fluid">
+ <div class="col-md-12">
+ <h3 class="cc_header">%donate_interface-amount-legend%: <span
id="selected-amount">{% block donation-amount currency_code %}</span><img
src="@script_path/extensions/DonationInterface/gateway_forms/includes/padlock.gif"
style="vertical-align:baseline;margin-left:8px;"></h3>
+ </div>
+</div>
+<div class="row-fluid">
+ <div class="col-md-6">
+ <label for="fname"
id="fname-label">%donate_interface-donor-fname%</label>
+ <input class="form-control" value="@fname" type="text"
id="fname">
+ </div>
+
+ <div class="col-md-6">
+ <label for="lname"
id="lname-label">%donate_interface-donor-lname%</label>
+ <input class="form-control" value="@lname" type="text"
id="lname">
+ </div>
+</div>
+<div class="row-fluid">
+ <div class="col-md-12"><span class="creditcard-error-msg"></span></div>
+</div>
+<div class="row-fluid">
+ <div class="col-md-12">
+ <label for="emailAdd"
id="emailAdd-label">%donate_interface-donor-email%</label>
+ <input class="form-control" value="@emailAdd" type="text"
title="%donate_interface-donor-email%" id="emailAdd">
+ </div>
+</div>
+<div style="display: none;">
+ <input type="hidden" value="@country" name="country" id="country" />
+</div>
\ No newline at end of file
diff --git a/worldpay_gateway/forms/html/worldpay-dd-test.html
b/worldpay_gateway/forms/html/worldpay-dd-test.html
new file mode 100644
index 0000000..d5262bf
--- /dev/null
+++ b/worldpay_gateway/forms/html/worldpay-dd-test.html
@@ -0,0 +1,150 @@
+<script type="text/javascript">
+ mw.loader.using(
+ [ 'jquery.payment' ],
+ function() {
+ //$( '#adyen-encrypted-form-number' ).payment(
'formatCardNumber' );
+ //$( '#expiry' ).payment( 'formatCardExpiry' );
+ //$( '#adyen-encrypted-form-cvc' ).payment(
'formatCardCVC' );
+ }
+ );
+
+ // these must go through RapidHTML and thus are inline
+ var amountErrors = ['#general|escape', '#retryMsg|escape',
'#amount|escape'];
+ var billingErrors = [
+ '#fname|escape', '#lname|escape', '#city|escape',
'#country|escape', '#street|escape',
+ '#state|escape', '#zip|escape', '#emailAdd|escape'
+ ];
+ var paymentErrors = ['#card_num|escape', '#card_type|escape',
'#cvv|escape'];
+ var actionURL = "@action";
+ var scriptPath = "@script_path";
+</script>
+<div class="container" id="wpContainer">
+ <div class="row-fluid">
+
+ <div class="col-md-6" id="appeal" valign="top">
+ {{LanguageSwitch|2011FR/@appeal/text|@language}}
+ </div>
+
+ <div class="col-md-6">
+ <div class="row-fluid" id="donate">
+ <div class="col-md-12">
+
+ <div class="row-fluid formCol"
id="greenBackground">
+ @noscript
+ <p id="topError"
class="creditcard-error-msg"></p>
+
+ <form name="payment"
method="post" action="@wp_process_url" novalidate>
+ <div
id="payflowpro_gateway_gateway-personal-info">
+ <div
class="row-fluid">
+ <span
class="personalInfo">
+
{% block personal-information country %}
+
<div class="row-fluid">
+
+
<ul class="options-h" id="ddTestOptions">
+
<li><input id="test-cc-visa" type="radio" value="visa"
name="ddTestOption" /> <label for="test-cc-visa"><img alt="Visa"
src="@script_path/extensions/DonationInterface/gateway_forms/includes/card-visa.png"
/></label></li>
+
<li><input id="test-cc-mc" type="radio" value="mc" name="ddTestOption"
/> <label for="test-cc-mc"><img alt="MasterCard"
src="@script_path/extensions/DonationInterface/gateway_forms/includes/card-mastercard.png"
/></label></li>
+
<li><input id="test-cc-cb" type="radio" value="carte bleue"
name="ddTestOption" /> <label for="test-cc-cb"><img alt="Carte Bleue"
src="@script_path/extensions/DonationInterface/gateway_forms/includes/card-cartebleue.png"
/></label></li>
+
</ul>
+
+
</div>
+
<div class="row-fluid hide" id="ddTestCCArea">
+
<div class="col-md-6">
+
<label for="accountNumber"
id="accountNumber-label">%donate_interface-donor-card-num%</label>
+
<input type="text" id="accountNumber" class="form-control"
pattern="\d*"
+
autocomplete="off"
+
placeholder='1111 1111 1111 1111'/>
+
</div>
+
+
<span id="smCC">
+
<div class="col-md-3">
+
<label for="expiry"
id="expiry-label">%donate_interface-donor-expiration%</label>
+
<input type="text" class="form-control" id="expiry"
pattern="\d*" autocomplete="off"
+
placeholder='05/2015'/>
+
</div>
+
<div class="col-md-3">
+
<label for="cvc"
id="cvc-label">%donate_interface-cvv%</label>
+
<input type="text" class="form-control" id="cvc"
pattern="\d*"
+
autocomplete="off"
+
placeholder='123'/>
+
</div>
+
</span>
+
+
<div class="row-fluid">
+
<div class="col-md-12">
+
<input class="btn btn-info btn-large form-control"
id="paymentSubmitBtn" type="button" value="%donate_interface-continue%" />
+
</div>
+
</div>
+
+
<div class="row-fluid mw-donate-submessage"
id="payflowpro_gateway_gateway-donate-submessage">
+
<img
src="@script_path/extensions/DonationInterface/gateway_forms/includes/padlock.gif"
+
style="vertical-align:baseline;margin-right:4px;">
+
%donate_interface-donate-click%
+
</div>
+
</div>
+
+
<div class="row-fluid">
+
<div class="col-md-12">
+
<div class="ccError ccNumberError">•
%donate_interface-error-msg-card-num%</div>
+
<div class="ccError ccExpiryError">•
%donate_interface-error-msg-expiration%</div>
+
<div class="ccError ccCVCError">•
%donate_interface-error-msg-cvv%</div>
+
</div>
+
</div>
+
+ </span>
+ </div>
+
+ <div
id="payment" class="row-fluid gainlayout" style="height: 0;text-align:
center;"></div>
+
+
+
+
+ </div>
+
+
+
+ <!-- This should be
included in the personal_information templates -->
+ <input
class="form-control" type="hidden" value="@utm_source" id="utm_source"/>
+ <input
class="form-control" type="hidden" value="@utm_medium" id="utm_medium"/>
+ <input
class="form-control" type="hidden" value="@utm_campaign" id="utm_campaign"/>
+ <input
class="form-control" type="hidden" value="@language" id="language"/>
+ <input
class="form-control" type="hidden" value="@referrer" id="referrer"/>
+ <input
class="form-control" type="hidden" value="1" id="email-opt"/>
+ <input
class="form-control" type="hidden" value="@token" id="token"/>
+ <input
class="form-control" type="hidden" value="@order_id" id="order_id"/>
+ <input
class="form-control" type="hidden" value="@contribution_tracking_id"
id="contribution_tracking_id"/>
+ <input
class="form-control" type="hidden" value="@data_hash" id="data_hash"/>
+ <input
class="form-control" type="hidden" value="@owa_session" id="owa_session"/>
+ <input
class="form-control" type="hidden" value="@owa_ref" id="owa_ref"/>
+ <input
class="form-control" type="hidden" value="@gateway" id="gateway"/>
+ <input
class="form-control" type="hidden" value="cc" id="payment_method"/>
+
+
+ </form>
+
+
+ </div>
+
+ </div>
+ </div>
+
+ <div class="row-fluid formCol">
+ <div class="col-md-12">
+ <p
id="informationsharing">%donate_interface-informationsharing|url%</p>
+ </div>
+ </div>
+
+ <div class="row-fluid formCol">
+ <div class="col-md-6 pull-left">
+ {% block moreinfolinks %}
+ </div>
+ <div class="col-md-6 formCol">
+ <span class="pull-right">@verisign_logo
</span>
+ </div>
+ </div>
+
+
+
+ </div>
+
+ </div>
+</div>
diff --git a/worldpay_gateway/forms/js/worldpay.js
b/worldpay_gateway/forms/js/worldpay.js
index f52fe91..38c189e 100644
--- a/worldpay_gateway/forms/js/worldpay.js
+++ b/worldpay_gateway/forms/js/worldpay.js
@@ -204,5 +204,9 @@
$( '#paymentSubmitBtn' ).click( function () {
submitForm();
} );
+
+ $( '#ddTestOptions').click( function() {
+ $( '#ddTestCCArea'
).removeClass('hide').addClass('show');
+ });
});
})( jQuery, mediaWiki );
--
To view, visit https://gerrit.wikimedia.org/r/171022
To unsubscribe, visit https://gerrit.wikimedia.org/r/settings
Gerrit-MessageType: newchange
Gerrit-Change-Id: I249dbf131caf7558dc4fbd81570615dbf713b3b7
Gerrit-PatchSet: 1
Gerrit-Project: mediawiki/extensions/DonationInterface
Gerrit-Branch: master
Gerrit-Owner: Ssmith <[email protected]>
_______________________________________________
MediaWiki-commits mailing list
[email protected]
https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits
