Adamw has submitted this change and it was merged.
Change subject: Display fixes for Adyen
......................................................................
Display fixes for Adyen
I've attempted to make Adyen not look like comlete ass. I suspect
it didn't work too well though.
Change-Id: Ib3d31f9e63b18aa70cc4fe411165143feeb5623a
---
M adyen_gateway/forms/css/adyen.css
M adyen_gateway/forms/html/adyen.html
M adyen_gateway/forms/js/adyen.js
3 files changed, 12 insertions(+), 72 deletions(-)
Approvals:
Adamw: Verified; Looks good to me, approved
jenkins-bot: Checked
diff --git a/adyen_gateway/forms/css/adyen.css
b/adyen_gateway/forms/css/adyen.css
index 45622ed..dd6ca94 100644
--- a/adyen_gateway/forms/css/adyen.css
+++ b/adyen_gateway/forms/css/adyen.css
@@ -146,12 +146,12 @@
/* NEW STUFF */
#greenBackground{
padding:16px 24px;
- width:300px;
+ width:400px;
background-color:#CCE7CD;
border:1px solid #5EAC58;
}
p#informationsharing, p#monthlycancel {
- width: 318px;
+ width: 400px;
padding: 0 15px;
line-height: 14px;
font-size: 11px;
@@ -173,10 +173,10 @@
/* Form Inputs */
input.halfwidth {
- width: 137px;
+ width: 190px;
}
input.fullwidth {
- width: 285px;
+ width: 392px;
}
input.leftmar {
@@ -184,14 +184,14 @@
}
input#city.halfwidth.state {
- width:134px;
+ width:192px;
}
input#zip.halfwidth.state {
- width:84px;
+ width:94px;
margin-left: 0;
}
select#state.us, select#state.au, select#state.ca {
- width: 50px;
+ width: 90px;
}
@@ -366,7 +366,7 @@
/* NEW STUFF */
#greenBackground{
padding:16px 24px;
- width:300px;
+ width:400px;
background-color:#CCE7CD;
border:1px solid #5EAC58;
}
@@ -388,43 +388,6 @@
table#payflow-table-donor{
/*margin-left: 10px;*/
-}
-
-/* Form Inputs */
-
-input.halfwidth {
- width: 137px;
-}
-input.fullwidth {
- width: 285px;
-}
-
-input.leftmar {
- margin-left: 4px;
-}
-
-input#city.halfwidth.state {
- width:134px;
-}
-input#zip.halfwidth.state {
- width:84px;
- margin-left: 0;
-}
-select#state.us, select#state.au, select#state.ca {
- width: 50px;
-}
-
-
-/* Specific element overrides */
-input#zip.ja {
- width: 268px;
-}
-select#state.ja {
- width:100%;
-}
-
-select#state.it {
- width: auto;
}
/* From Webitects */
diff --git a/adyen_gateway/forms/html/adyen.html
b/adyen_gateway/forms/html/adyen.html
index f0898f3..72366e9 100644
--- a/adyen_gateway/forms/html/adyen.html
+++ b/adyen_gateway/forms/html/adyen.html
@@ -43,14 +43,7 @@
<td>
<dl class="">
<dd class="field" style="margin-bottom: 0;
margin-left: 0;">
- <ul class="options-h" id="cards"
style="margin: 0;">
- <li><input id="cc-visa"
name="cardtype" type="radio" value="visa" class="cardradio" /> <label
for="cc-visa"><img alt="Visa"
src="@script_path/extensions/DonationInterface/gateway_forms/includes/card-visa.png"
/></label></li>
- <li><input id="cc-mc"
name="cardtype" type="radio" value="mc" class="cardradio" /> <label
for="cc-mc"><img alt="MasterCard"
src="@script_path/extensions/DonationInterface/gateway_forms/includes/card-mastercard.png"
/></label></li>
- <li><input id="cc-amex"
name="cardtype" type="radio" value="amex" class="cardradio" /> <label
for="cc-amex"><img alt="American Express"
src="@script_path/extensions/DonationInterface/gateway_forms/includes/card-amex.png"
/></label></li>
- <li><input id="cc-discover"
name="cardtype" type="radio" value="discover" class="cardradio" /> <label
for="cc-discover"><img alt="Discover"
src="@script_path/extensions/DonationInterface/gateway_forms/includes/card-discover.png"
/></label></li>
-
<!--<li><input id="cc-jcb" name="cardtype" type="radio" value="jcb"
class="cardradio" /> <label for="cc-jcb"><img alt="JCB"
src="@script_path/extensions/DonationInterface/gateway_forms/includes/card-jcb.png"
/></label></li>-->
-
</ul>
- <div id="paymentContinue"
style="margin-top: 10px; display: none;"> <input class="btn"
id="paymentContinueBtn" type="button" value="%donate_interface-continue%"
/></div>
+ <div id="paymentContinue"
style="margin-top: 10px;"> <input class="btn" id="paymentContinueBtn"
type="button" value="%donate_interface-continue%" /></div>
</dd>
</dl>
</td>
diff --git a/adyen_gateway/forms/js/adyen.js b/adyen_gateway/forms/js/adyen.js
index 536ed6d..8021771 100644
--- a/adyen_gateway/forms/js/adyen.js
+++ b/adyen_gateway/forms/js/adyen.js
@@ -47,7 +47,6 @@
'country': country,
'payment_method': 'cc',
'language': language,
- 'card_type': $( "input[name='cardtype']:checked"
).val().toLowerCase(),
'contribution_tracking_id': $(
"input[name='contribution_tracking_id']" ).val(),
'numAttempt': $( "input[name='numAttempt']" ).val(),
'utm_source': $( "input[name='utm_source']" ).val(),
@@ -84,14 +83,14 @@
$( '#payment' ).empty();
// Insert the iframe into the
form
$( '#payment' ).append(
- '<iframe width="600"
height="514" frameborder="0" name="adyen-iframe"></iframe>'
+ '<iframe width="400"
height="225" frameborder="0" name="adyen-iframe"></iframe>'
);
var params = new Array();
$.each( data.gateway_params,
function( key, value ) {
params.push('<input
type="hidden" name="'+key+'" value="'+value+'" />');
} );
$( '#payment' ).append(
- '<form method="post"
action="'+data.result.formaction+'" target="adyen-iframe"
id="fetch-iframe-form">'+params.join()+'</form>'
+ '<form method="post"
action="'+data.result.formaction+'" target="adyen-iframe"
id="fetch-iframe-form">'+params.join("")+'</form>'
);
$( '#payment
#fetch-iframe-form' ).submit();
}
@@ -143,25 +142,10 @@
$( "#paymentContinueBtn" ).live( "click", function() {
if ( validate_personal( document.payment ) && validateAmount() ) {
- $( "#payment" ).animate( { height:'314px' }, 1000 );
+ $( "#payment" ).animate( { height:'250px' }, 1000 );
displayCreditCardForm();
// hide the continue button so that people don't get confused with
two of them
$( "#paymentContinue" ).hide();
- }
- } );
-
- // Set the cards to progress to step 3
- $( ".cardradio" ).live( "click", function() {
- if ( validate_personal( document.payment ) && validateAmount() ) {
- $( "#payment" ).animate( { height:'314px' }, 1000 );
- displayCreditCardForm();
- // hide the continue button so that people don't get confused with
two of them
- $( "#paymentContinue" ).hide();
- }
- else {
- // show the continue button to indicate how to get to step 3 since
they
- // have already clicked on a card image
- $( "#paymentContinue" ).show();
}
} );
} );
--
To view, visit https://gerrit.wikimedia.org/r/48755
To unsubscribe, visit https://gerrit.wikimedia.org/r/settings
Gerrit-MessageType: merged
Gerrit-Change-Id: Ib3d31f9e63b18aa70cc4fe411165143feeb5623a
Gerrit-PatchSet: 1
Gerrit-Project: mediawiki/extensions/DonationInterface
Gerrit-Branch: master
Gerrit-Owner: Mwalker <[email protected]>
Gerrit-Reviewer: Adamw <[email protected]>
Gerrit-Reviewer: jenkins-bot
_______________________________________________
MediaWiki-commits mailing list
[email protected]
https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits
