Subversion Repositories SmartDukaan

Rev

Rev 13270 | Blame | Compare with Previous | Last modification | View Log | RSS feed

#set($banners = $action.getActiveBanners("/recharge-result"))
#if($banners)
#set($bannerCount = $banners.size())
#else
#set($bannerCount = 0)
#end
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
        <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />

<!-- Prevent MS Office toolbar from changing layout -->
        <meta name="google-site-verification" content="NPHVASYh9ZsYbjffRuAU4dhEHhx7xSKUj9GycYUMo_o" /> 
        <META name="y_key" content="116f6310a0df3c4f" />
        <meta name="msvalidate.01" content="A9BB200170442859BD6DF681353ACD78" />
        <meta property="fb:admins" content="564777065" />
        <title>Recharge payment details</title>

#include ( "templates/commoncssfiles.vm" )
#include ( "templates/commonjsfiles.vm" )
        <script type="text/javascript" charset="utf-8">
        #if ($bannerCount == 1 )
        jQuery('#banner-menu').slidy({
        animation:  'none',
        children:   'a',
        menu:       false,
        pause:      true,
        speed:      400,
        time:       4000
    });

        #elseif ($bannerCount > 1 && $bannerCount < 3 )
        $(document).ready(function() {
           $('#bannerMenu').DDSlider({
           nextSlide: '.slider_arrow_right',
           prevSlide: '.slider_arrow_left',
           selector: '.slider_selector'
            });
          }); 
        #else
        jQuery('#banner-menu').slidy({
        animation:  'fade',
        children:   'a',
        menu:       true,
        pause:      true,
        speed:      200,
        time:       5000
    });
        #end
        </script>
        <style type="text/css">
                .slider_arrow_left {
         background: url(/images/left_arrow.png) no-repeat top left;
         }
                .slider_arrow_right {
         background: url(/images/right_arrow.png) no-repeat top left;
         }
        </style>
#set($rechargeOrder = $action.getRechargeOrder()) 
#set($status = $action.getOrderStatus())
        <link rel="stylesheet" href="/css/home.css" type="text/css" />
        <style type="text/css">
                #myAccount .status h1 {
    color: #030303;
    font-size: 18px;
    font-weight: bold;
}
#myAccount .status .note {
    font-size: 12px;
    font-weight: normal;
}
#myAccount .status th {
    background: none repeat scroll 0 0 #DAF0F8;
    border-left: 1px solid #CCCCCC;
    border-right: 1px solid #CCCCCC;
    border-top: 1px solid #CCCCCC;
    font-size: 16px;
    text-align: center;
}
#myAccount .status td {
    border-color: #CCCCCC;
    border-style: solid;
    border-width: 1px;
    font-size: 14px;
    text-align: center;
}

#myAccount .status .message > ul {
    color: #0000FF;
    font-size: 14px;
}
a {
    color: #0000FF;
    outline: medium none;
    text-decoration: none;
}
</style>
        <link href="https://plus.google.com/108546508648658526684" rel="publisher" />
        <script language="javascript" type="text/javascript" src="/js/ga-invoker.js"></script>
</head>

<body>
        <noscript>
                <p id="noScript">Please enable <em>Javascript</em> for this Website to function correctly!</p>
        </noscript>
        $action.getHeaderSnippet()
        <!-- Main -->
        <div id="main">
                <div class="main-content">
                        <div class="main-top"></div>
                        <div class="main-left left">
                                 #if ( $bannerCount == 0 )
                                        <div class="main-left-banner" style="display: none">
                                #elseif ( $bannerCount < 3 )
                                        <div class="main-left-banner"  style="height: 210px;">
                                #else
                                        <div class="main-left-banner"  style="height: 230px;">
                                #end
                                
                                #if($bannerCount > 1 && $bannerCount < 3)
                                        <ul id="bannerMenu">
                                                #foreach($banner in $banners)
                                                        #if($banner.isHasMap())
                                                                <li class="square"><a href="$banner.getLink()" #if($banner.isTarget())target="_blank"#end banner-name='$banner.getBannerName()'><img src='/images/banners/$banner.getImageName()' usemap='#map$velocityCount' height="200" width="710"/></a>
                                                                <map name='map$velocityCount'> 
                                                                        #set($mapdetails = $action.getbannermapdetails("$banner.getBannerName()"))
                                                                        #foreach($mapdetail in $mapdetails)
                                                                                <area shape="rect" coords='$mapdetail.getCoordinates()' href='$mapdetail.getMapLink()' banner-name='$banner.getBannerName()'/>
                                                                        #end
                                                                        </map>
                                                                        </li>
                                                        #else
                                                                <li class="square"><a href="$banner.getLink()" #if($banner.isTarget())target="_blank"#end banner-name='$banner.getBannerName()'><img src='/images/banners/$banner.getImageName()' height="200" width="710" /></a></li>
                                #end
                                                #end
                                        </ul>
                                        <div class="container">
                      <div class="slider_arrow_left"></div>
                      <div class="slider_arrow_right"></div>
                    </div>
                                #else
                                          <div id="banner-menu">
                                                #foreach($banner in $banners)
                                                        #if($banner.isHasMap())
                                                                <a href="$banner.getLink()" #if($banner.isTarget())target="_blank"#end banner-name='$banner.getBannerName()'><img src='/images/banners/$banner.getImageName()' title="$banner.getBannerName()" usemap='#map$velocityCount'/></a>
                                                                <map name='map$velocityCount'> 
                                                                        #set($mapdetails = $action.getbannermapdetails("$banner.getBannerName()"))
                                                                        #foreach($mapdetail in $mapdetails)
                                                                                <area shape="rect" coords='$mapdetail.getCoordinates()' href='$mapdetail.getMapLink()' banner-name='$banner.getBannerName()'/>
                                                                        #end
                                                                        </map>
                                                        #else
                                                                <a href="$banner.getLink()" #if($banner.isTarget())target="_blank"#end banner-name='$banner.getBannerName()'><img src='/images/banners/$banner.getImageName()' title="$banner.getBannerName()"/></a>
                                #end
                                                #end
                       </div>
                                #end
                                </div>
                                <div style='height: 30px;background-color: #2789C1;font-size: 14px;font-weight: bold;color: #FFFFFF;border: solid 1px #2789C1;width: 100%;'>
                                        <div style='margin:0 10px 0 10px;padding-top:7px'>
                                                RECHARGE DETAILS
                                        </div>
                                </div>
                                <div style="width: 100%;border: solid 1px #2789C1;float:left;font-size: 17px;color:#444444;height: 426px;" class="recharge-main-left-container">
                                        #if(!$action.getRechargeOrder())
                                                <div>$action.getMessage()</div>
                                        #else
<div id="myAccount">
<div class="status" style="width: 670px; height: 380px; border-top-width: 15px; padding: 23px 20px;">
<div style="padding-top: 10px; padding-bottom: 20px;font-size:14px;" class="note">Please note the following details about your Online Recharge request.</div>
<table cellspacing="0" cellpadding="0" border="0" width="100%" style="padding-top: 2px; padding-bottom: 2px; border-top-width: 0px; border-left-width: 0px;" id="rechargeData" class="tablesorter">
                                <thead>
                                    <tr>
                                                                                <th width="20%">Order Id</th>
                                        <th width="20%" style="padding-top: 4px; padding-bottom: 4px;">#if ($action.isDTH()) Account Number #else Mobile Number#end</th>
                                                                                <th width="20%">Operator</th>
                                        <th width="20%">Amount</th>
                                        <th width="20%" class="borderRight">Status</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    <tr>
                                                                                <td>$rechargeOrder.getDisplayId()</td>
                                        <td style="padding-top: 5px; padding-bottom: 5px;">$rechargeOrder.getDeviceNumber()</td>
                                        <td>$action.getProvider()</td>
                                        <td>$rechargeOrder.getTotalAmount()</td>
                                        <td class="$status.get(0)">$status.get(1)</td>
                                    </tr>
                                </tbody>
                            </table>
<div class="message" style="padding-top: 30px;">
        $status.get(2)
</div>
#if($action.isRechargeModeAsynchronous())
        <div id="countdown" style="margin:10px auto auto;width:125px;display:block;"></div>
        <script src="/js/jquery.countdown360.js" type="text/javascript" charset="utf-8"></script>
    <script type="text/javascript" charset="utf-8">
                var callCounter = 0;
                $("#countdown").countdown360({
                        radius: 50,
                        seconds: 90,
                        fontColor: 'white',
                        fillStyle: '#6699ff',
                        strokeStyle: '#F6F47A',
                        autostart: true,
                        onComplete: function() {
                                hideCountDown()
                        }
                })

                 function hideCountDown() {
                        $('#countdown').hide();
                        jQuery.ajax({
                                type: "GET",
                                url: "/recharge-result!getRechargeStatus?rechargeOrderId=" + $rechargeOrder.getId() + "&isFinal=true",
                                success: function(response) {},
                                error: function() {}
                        });
                        window.setTimeout(reload, 5000);
                }

                function checkUnknownTransactions() {
                        jQuery.ajax({
                                type: "GET",
                                url: "/recharge-result!getRechargeStatus?rechargeOrderId=" + $rechargeOrder.getId() + "&isFinal=false",
                                success: function(response) {
                                        if (response == 'RECHARGE_SUCCESSFUL' || response == 'RECHARGE_FAILED' || response == 'PAYMENT_SUCCESSFUL') {
                                                reload();
                                        }
                                        incrementCounter();
                                        if ($('#countdown').is(':visible')) {
                                                if (callCounter < 5) {
                                                        window.setTimeout(checkUnknownTransactions, 10000);
                                                }
                                        }
                                },
                                error: function() {
                                        incrementCounter();
                                        if ($('#countdown').is(':visible')) {
                                                if (callCounter < 5) {
                                                        window.setTimeout(checkUnknownTransactions, 10000);
                                                }
                                        }
                                }
                        });
                }

                function incrementCounter() {
                        callCounter++;
                }

                function reload() {
                        location.reload();
                }
</script>
<script type="text/javascript">
  $(function(){
        if ($('#countdown').is(':visible')){    
                window.setTimeout(checkUnknownTransactions, 40000);
        }
        });
</script>
#end
</div>
</div>
#end
                                </div>
                        </div>
                        <div class="widgets right">
                                $action.getCartWidgetSnippet()
                        </div>
                </div>
        </div>
        #include("templates/footer.vm")
    <script type="text/javascript" charset="utf-8">
        #set($order = $action.getRechargeOrder())
        
        #if($order.getStatus().name()=="RECHARGE_SUCCESSFUL")
                  ga('ecommerce:addTransaction', {
                  'id': '$order.getDisplayId()',                // order ID - required
                  'affiliation': '${in.shop2020.title}',                       // affiliation or store name
                  'revenue': '$order.getTotalAmount()',      // total - required
                  'shipping': '0',                  // Shipping
                  'tax': '0'                     // Tax
                });
                // addItem should be called for every item in the shopping cart.
                ga('ecommerce:addItem', {
                  'id': '$order.getDisplayId()',            // order ID - required
                  'sku': '$order.getDeviceNumber()',    // SKU/code - required 
                  'name': '$action.getProvider()',                   // product name
                  'category': 'Digital',       // Category or variation
                  'price': '$order.getTotalAmount()', // unit price - required
                  'quantity': '1'                   // Quantity
                });
                ga('ecommerce:send');      // Send transaction and item data to Google Analytics.
        #end
  
          trackEventWithGA('Recharge', 'Recharge Result', '$status.get(1)');
     </script>
        
        
</body>
</html>