Committer: ssafronova
LJSUP-8014: Credit card payment process refactoring[tags: pkornilov]
U trunk/cgi-bin/LJ/Pay/Method/CreditCard.pm U trunk/cgi-bin/LJ/Widget/CreditCard.pm U trunk/ssldocs/pay/cc.bml
Modified: trunk/cgi-bin/LJ/Pay/Method/CreditCard.pm
===================================================================
--- trunk/cgi-bin/LJ/Pay/Method/CreditCard.pm 2011-03-05 04:43:25 UTC (rev 10189)
+++ trunk/cgi-bin/LJ/Pay/Method/CreditCard.pm 2011-03-05 04:47:27 UTC (rev 10190)
@@ -19,7 +19,7 @@
my $err = '';
my $html =
- "<form method='post' action='$LJ::SSLROOT/pay/cc.bml?c=$cart_id'>"
+ "<form method='post' action='$LJ::SSLROOT/pay/cc.bml?c=$cart_id' id='ccform'>"
. LJ::html_hidden("amt_charge", $amt_charge)
. LJ::Widget::CreditCard::render(
LJ::Pay::RecBill->valid_countries,
Modified: trunk/cgi-bin/LJ/Widget/CreditCard.pm
===================================================================
--- trunk/cgi-bin/LJ/Widget/CreditCard.pm 2011-03-05 04:43:25 UTC (rev 10189)
+++ trunk/cgi-bin/LJ/Widget/CreditCard.pm 2011-03-05 04:47:27 UTC (rev 10190)
@@ -43,7 +43,6 @@
$ret .= "
</dd></dl>
<span class='b-bubble b-bubble-lite'><i class='i-bubble-arrow-border'></i><i class='i-bubble-arrow'></i>". LJ::Lang::ml('pay.cc.form.cardtype.bubble-lite') ."</span>
- <span class='b-bubble b-bubble-warning'><i class='i-bubble-arrow-border'></i><i class='i-bubble-arrow'></i>". LJ::Lang::ml('pay.cc.form.cardtype.bubble-warning') ."</span>
</li>";
# card #
@@ -61,12 +60,11 @@
);
$ret .= "
</dd></dl>
- <span class='b-bubble b-bubble-lite'><i class='i-bubble-arrow-border'></i><i class='i-bubble-arrow'></i>". LJ::Lang::ml('pay.cc.form.cardnumber.bubble-lite') ."</span>
- <span class='b-bubble b-bubble-lite'><i class='i-bubble-arrow-border'></i><i class='i-bubble-arrow'></i>". LJ::Lang::ml('pay.cc.form.cardnumber.bubble-lite.americanexpress') ."</span>
- <span class='b-bubble b-bubble-warning'><i class='i-bubble-arrow-border'></i><i class='i-bubble-arrow'></i>". LJ::Lang::ml('pay.cc.form.cardnumber.bubble-warning.visa') ."</span>
- <span class='b-bubble b-bubble-warning'><i class='i-bubble-arrow-border'></i><i class='i-bubble-arrow'></i>". LJ::Lang::ml('pay.cc.form.cardnumber.bubble-warning.mastercard') ."</span>
- <span class='b-bubble b-bubble-warning'><i class='i-bubble-arrow-border'></i><i class='i-bubble-arrow'></i>". LJ::Lang::ml('pay.cc.form.cardnumber.bubble-warning.americanexpress') ."</span>
- <span class='b-bubble b-bubble-warning'><i class='i-bubble-arrow-border'></i><i class='i-bubble-arrow'></i>". LJ::Lang::ml('pay.cc.form.cardnumber.bubble-warning.discover') ."</span>
+ <span class='b-bubble b-bubble-lite' id='bubble_cc_num'><i class='i-bubble-arrow-border'></i><i class='i-bubble-arrow'></i><span></span></span>
+ <script type=\"text/javascript\">
+ Shop.ml_cc_num = '". LJ::ejs(LJ::Lang::ml('pay.cc.form.cardnumber.bubble-lite')) ."';
+ Shop.ml_cc_num_americanexpress = '". LJ::ejs(LJ::Lang::ml('pay.cc.form.cardnumber.bubble-lite.americanexpress')) ."';
+ </script>
</li>";
if ($opts->{cvv2}) {
@@ -88,12 +86,11 @@
$ret .= '</span>';
$ret .= "
</dd></dl>
- <span class='b-bubble b-bubble-lite'><i class='i-bubble-arrow-border'></i><i class='i-bubble-arrow'></i>". LJ::Lang::ml('pay.cc.form.cvv2.bubble-lite', {aopts => "href='$LJ::SSLROOT/pay/cvv2.bml'"}) ."</span>
- <span class='b-bubble b-bubble-lite'><i class='i-bubble-arrow-border'></i><i class='i-bubble-arrow'></i>". LJ::Lang::ml('pay.cc.form.cvv2.bubble-lite.americanexpress', {aopts => "href='$LJ::SSLROOT/pay/cvv2.bml'"}) ."</span>
- <span class='b-bubble b-bubble-warning'><i class='i-bubble-arrow-border'></i><i class='i-bubble-arrow'></i>". LJ::Lang::ml('pay.cc.form.cvv2.bubble-warning.visa') ."</span>
- <span class='b-bubble b-bubble-warning'><i class='i-bubble-arrow-border'></i><i class='i-bubble-arrow'></i>". LJ::Lang::ml('pay.cc.form.cvv2.bubble-warning.mastercard') ."</span>
- <span class='b-bubble b-bubble-warning'><i class='i-bubble-arrow-border'></i><i class='i-bubble-arrow'></i>". LJ::Lang::ml('pay.cc.form.cvv2.bubble-warning.americanexpress') ."</span>
- <span class='b-bubble b-bubble-warning'><i class='i-bubble-arrow-border'></i><i class='i-bubble-arrow'></i>". LJ::Lang::ml('pay.cc.form.cvv2.bubble-warning.discover') ."</span>
+ <span class='b-bubble b-bubble-lite' id='bubble_cc_cvv2'><i class='i-bubble-arrow-border'></i><i class='i-bubble-arrow'></i><span></span></span>
+ <script type=\"text/javascript\">
+ Shop.ml_cc_cvv2 = '". LJ::ejs(LJ::Lang::ml('pay.cc.form.cvv2.bubble-lite', {aopts => "href='$LJ::SSLROOT/pay/cvv2.bml'"})) ."';
+ Shop.ml_cc_cvv2_americanexpress = '". LJ::ejs(LJ::Lang::ml('pay.cc.form.cvv2.bubble-lite.americanexpress', {aopts => "href='$LJ::SSLROOT/pay/cvv2.bml'"})) ."';
+ </script>
</li>";
}
@@ -104,7 +101,7 @@
name => 'exp_m',
id => 'exp_m',
selected => $POST->{exp_m},
- class => 'field',
+ class => 'input_field',
tabindex => 4,
style => 'width:60px'
}, map { $_ => sprintf("%02d", $_) } (1..12)
@@ -113,7 +110,7 @@
{
name => 'exp_y',
selected => $POST->{exp_y} || ($LJ::IS_DEV_SERVER && 2015),
- class => 'field',
+ class => 'input_field',
tabindex => 5,
style => 'width:85px'
}, map { $_ => $_ } @exp_yrs
@@ -122,7 +119,6 @@
$ret .= "
</dd></dl>
<span class='b-bubble b-bubble-lite'><i class='i-bubble-arrow-border'></i><i class='i-bubble-arrow'></i>". LJ::Lang::ml('pay.cc.form.cardexpires.bubble-lite') ."</span>
- <span class='b-bubble b-bubble-warning'><i class='i-bubble-arrow-border'></i><i class='i-bubble-arrow'></i>". LJ::Lang::ml('pay.cc.form.cardexpires.bubble-warning') ."</span>
</li>";
# name on card
@@ -141,7 +137,6 @@
$ret .= "
</dd></dl>
<span class='b-bubble b-bubble-lite'><i class='i-bubble-arrow-border'></i><i class='i-bubble-arrow'></i>". LJ::Lang::ml('pay.cc.form.name.bubble-lite') ."</span>
- <span class='b-bubble b-bubble-warning'><i class='i-bubble-arrow-border'></i><i class='i-bubble-arrow'></i>". LJ::Lang::ml('pay.cc.form.name.bubble-warning') ."</span>
<span class='b-bubble b-bubble-alert'><i class='i-bubble-arrow-border'></i><i class='i-bubble-arrow'></i>". LJ::Lang::ml('pay.cc.form.bubble-alert') ."</span>
</li>";
@@ -181,7 +176,6 @@
$ret .= "
</dd></dl>
<span class='b-bubble b-bubble-lite'><i class='i-bubble-arrow-border'></i><i class='i-bubble-arrow'></i>". LJ::Lang::ml('pay.cc.form.address.bubble-lite') ."</span>
- <span class='b-bubble b-bubble-warning'><i class='i-bubble-arrow-border'></i><i class='i-bubble-arrow'></i>". LJ::Lang::ml('pay.cc.form.address.bubble-warning') ."</span>
</li>";
# city
@@ -200,7 +194,6 @@
$ret .= "
</dd></dl>
<span class='b-bubble b-bubble-lite'><i class='i-bubble-arrow-border'></i><i class='i-bubble-arrow'></i>". LJ::Lang::ml('pay.cc.form.city.bubble-lite') ."</span>
- <span class='b-bubble b-bubble-warning'><i class='i-bubble-arrow-border'></i><i class='i-bubble-arrow'></i>". LJ::Lang::ml('pay.cc.form.city.bubble-warning') ."</span>
</li>";
$ret .= "<li><dl><dt><label for='state'>" . LJ::Lang::ml('pay.cc.form.state.label') . "</label></dt><dd class='b-ccform-state'>";
@@ -240,7 +233,6 @@
</dd></dl>
<span class='b-bubble b-bubble-lite'><i class='i-bubble-arrow-border'></i><i class='i-bubble-arrow'></i>". LJ::Lang::ml('pay.cc.form.state.bubble-lite') ."</span>
<span class='b-bubble b-bubble-lite b-bubble-other'><i class='i-bubble-arrow-border'></i><i class='i-bubble-arrow'></i>". LJ::Lang::ml('pay.cc.form.state.bubble-lite.other') ."</span>
- <span class='b-bubble b-bubble-warning'><i class='i-bubble-arrow-border'></i><i class='i-bubble-arrow'></i>". LJ::Lang::ml('pay.cc.form.state.bubble-warning') ."</span>
</li>";
# postal code
@@ -260,7 +252,6 @@
$ret .= "
</dd></dl>
<span class='b-bubble b-bubble-lite'><i class='i-bubble-arrow-border'></i><i class='i-bubble-arrow'></i>". LJ::Lang::ml('pay.cc.form.postalcode.bubble-lite') ."</span>
- <span class='b-bubble b-bubble-warning'><i class='i-bubble-arrow-border'></i><i class='i-bubble-arrow'></i>". LJ::Lang::ml('pay.cc.form.postalcode.bubble-warning') ."</span>
</li>";
# email
@@ -280,7 +271,6 @@
$ret .= "
</dd></dl>
<span class='b-bubble b-bubble-lite'><i class='i-bubble-arrow-border'></i><i class='i-bubble-arrow'></i>". LJ::Lang::ml('pay.cc.form.email.bubble-lite') ."</span>
- <span class='b-bubble b-bubble-warning'><i class='i-bubble-arrow-border'></i><i class='i-bubble-arrow'></i>". LJ::Lang::ml('pay.cc.form.email.bubble-warning') ."</span>
<span class='b-bubble b-bubble-alert'><i class='i-bubble-arrow-border'></i><i class='i-bubble-arrow'></i>". LJ::Lang::ml('pay.cc.form.bubble-alert') ."</span>
</li>";
Modified: trunk/ssldocs/pay/cc.bml
===================================================================
--- trunk/ssldocs/pay/cc.bml 2011-03-05 04:43:25 UTC (rev 10189)
+++ trunk/ssldocs/pay/cc.bml 2011-03-05 04:47:27 UTC (rev 10190)
@@ -49,9 +49,7 @@
#tabindex;
my $tidx = 0;
- $ret .= "<form method='post' action='cc.bml' style='display: inline' id='ccform' name='ccform'";
- $ret .= " onsubmit='return validate_cc_input()'" unless $LJ::DEBUG{'no_cc_needed'};
- $ret .= ">";
+ $ret .= "<form method='post' action='cc.bml' id='ccform' name='ccform'>";
# coppa stuff if cart contains age verification
if ($has_coppa) {
@@ -512,7 +510,11 @@
my ($formerr, $err_field);
unless (LJ::Widget::CreditCard::validate(\%POST, \$formerr, \$err_field) || $LJ::DEBUG{'no_cc_needed'}) {
- $ccform .= "<?errorbar $formerr (field: $err_field) errorbar?>";
+ $ccform .= "<span class='b-bubble b-bubble-warning' id='move_to_$err_field'><i class='i-bubble-arrow-border'></i><i class='i-bubble-arrow'></i>$formerr</span>";
+ $ccform .= "<script type=\"text/javascript\">jQuery(function(){";
+ $ccform .= "jQuery(\"#move_to_$err_field\").appendTo(jQuery(\"#ccform [name=$err_field]\").closest(\"li\")).show();";
+ $ccform .= "});</script>";
+
$ccform .= LJ::Widget::CreditCard::render( LJ::Pay::RecBill->valid_countries, $formerr, \%POST, undef,
{
'cvv2' => 1,