| Line 22... |
Line 22... |
| 22 |
color:red;
|
22 |
color:red;
|
| 23 |
float:left;
|
23 |
float:left;
|
| 24 |
font-size:12px;
|
24 |
font-size:12px;
|
| 25 |
padding: 2px 0;
|
25 |
padding: 2px 0;
|
| 26 |
width:500px;
|
26 |
width:500px;
|
| - |
|
27 |
}
|
| - |
|
28 |
div.header-row{
|
| - |
|
29 |
}
|
| - |
|
30 |
div.row{
|
| - |
|
31 |
|
| - |
|
32 |
}
|
| - |
|
33 |
div.icon-row{
|
| - |
|
34 |
height: 50px;
|
| - |
|
35 |
margin-top: 5px;
|
| - |
|
36 |
}
|
| - |
|
37 |
|
| - |
|
38 |
div.recharge-main-left-container div{
|
| - |
|
39 |
height:50px;
|
| - |
|
40 |
margin-top:2px;
|
| - |
|
41 |
}
|
| - |
|
42 |
|
| - |
|
43 |
span.label-text{
|
| - |
|
44 |
padding: 15px;
|
| - |
|
45 |
float: left;
|
| - |
|
46 |
width: 250px;
|
| - |
|
47 |
text-align: right;
|
| - |
|
48 |
}
|
| - |
|
49 |
|
| - |
|
50 |
div.error-msg{
|
| - |
|
51 |
color: red;
|
| - |
|
52 |
font-size:15px;
|
| - |
|
53 |
padding: 5px 5px 10px 5px;
|
| - |
|
54 |
text-align: center;
|
| - |
|
55 |
}
|
| - |
|
56 |
|
| - |
|
57 |
span.inputBox{
|
| - |
|
58 |
padding: 10px 15px 10px 5px;
|
| - |
|
59 |
display: inline-block;
|
| - |
|
60 |
height: 30px;
|
| - |
|
61 |
width: 280px;
|
| - |
|
62 |
float:left;
|
| - |
|
63 |
}
|
| - |
|
64 |
|
| - |
|
65 |
.fullsize{
|
| - |
|
66 |
height:100%;
|
| - |
|
67 |
width:227px;
|
| - |
|
68 |
padding-left: 48px;
|
| - |
|
69 |
font-size: 18px;
|
| - |
|
70 |
border: solid 1px grey;
|
| - |
|
71 |
}
|
| - |
|
72 |
|
| - |
|
73 |
.submit-button{
|
| - |
|
74 |
background: -2px -5px url('/images/confirm.png');
|
| - |
|
75 |
cursor: pointer;
|
| - |
|
76 |
display: inline-block;
|
| - |
|
77 |
font-size: 15px;
|
| - |
|
78 |
font-weight: bold;
|
| - |
|
79 |
text-shadow: 0px 1px 0px #E45000;
|
| - |
|
80 |
outline: medium none;
|
| - |
|
81 |
overflow: visible;
|
| - |
|
82 |
text-align: center;
|
| - |
|
83 |
height: 40px;
|
| - |
|
84 |
color: white;
|
| - |
|
85 |
width: 190px;
|
| - |
|
86 |
}
|
| 27 |
</style>
|
87 |
</style>
|
| - |
|
88 |
|
| 28 |
</head>
|
89 |
</head>
|
| 29 |
|
90 |
|
| 30 |
<body>
|
91 |
<body>
|
| 31 |
<noscript>
|
92 |
<noscript>
|
| 32 |
<p id="noScript">Please enable <em>Javascript</em> for this Website to function correctly!</p>
|
93 |
<p id="noScript">Please enable <em>Javascript</em> for this Website to function correctly!</p>
|
| Line 58... |
Line 119... |
| 58 |
<div style='margin:0 10px 0 10px;padding-top:7px'>
|
119 |
<div style='margin:0 10px 0 10px;padding-top:7px'>
|
| 59 |
ENTER YOUR DETAILS
|
120 |
ENTER YOUR DETAILS
|
| 60 |
</div>
|
121 |
</div>
|
| 61 |
</div>
|
122 |
</div>
|
| 62 |
<div class="recharge-main-left-container">
|
123 |
<div class="recharge-main-left-container">
|
| 63 |
#if($action.getOperatorId()!=0)
|
124 |
#if($action.getOperatorId()!=0)
|
| 64 |
<h1 style="margin-top:5px; text-align:center;">$action.getPageName()</h1>
|
125 |
<h1 style="margin-top:5px; text-align:center;">$action.getPageName()</h1>
|
| 65 |
#end
|
126 |
#end
|
| - |
|
127 |
#set($serviceType=$action.getServiceType())
|
| - |
|
128 |
<div style='height:15px;' class='error-msg'>
|
| - |
|
129 |
#set($errorMsg=$action.getError())
|
| - |
|
130 |
#if($errorMsg.equals(""))
|
| - |
|
131 |
#else
|
| - |
|
132 |
Oops! There seems to be some network issue. Please try later.
|
| - |
|
133 |
#end
|
| 66 |
<!--
|
134 |
</div>
|
| - |
|
135 |
<form id='serviceSelectForm' action='/recharge' method='post'>
|
| - |
|
136 |
<input id='serviceType' type="hidden" name='serviceType' value=''>
|
| - |
|
137 |
<input name='form' type="hidden" value='serviceSelect'>
|
| - |
|
138 |
</form>
|
| - |
|
139 |
|
| - |
|
140 |
<form id='rechargeDetailsForm' action='/confirm' method='post' onsubmit="trackEventWithGA('Recharge', 'Confirm', '')">
|
| - |
|
141 |
<input type='hidden' name='rechargeType' value='$serviceType'>
|
| - |
|
142 |
#set($providerMap = $action.getProviderMap())
|
| - |
|
143 |
|
| 67 |
<div id="rowOne"></div>
|
144 |
#if($serviceType=="1")
|
| 68 |
<div id="rowTwo">
|
145 |
<div class='icon-row'>
|
| 69 |
<span id="spantext">Recharge Your : </span><span id="hello"></span><span id="hellotoo"></span>
|
146 |
<span class='label-text' style='float:left'>Recharge Your :</span>
|
| - |
|
147 |
<span id='phone-image-not-clickable' style="background-image:url('/images/phone_pressed.png'); display:inline-block; height:50px; width:107px;">
|
| - |
|
148 |
</span>
|
| - |
|
149 |
<span id='dth-image' style="background-image:url('/images/dth.png'); display:inline-block; height:50px; width:107px;cursor:pointer">
|
| - |
|
150 |
</span>
|
| 70 |
</div>
|
151 |
</div>
|
| - |
|
152 |
|
| - |
|
153 |
<div id='mobile-number' class='row'>
|
| - |
|
154 |
<span class='label-text'>Mobile Number :</span>
|
| - |
|
155 |
<span class='inputBox'>
|
| - |
|
156 |
<input type='text' name='number' maxlength="10" class='fullsize' style="background: white url('/images/+91.png') no-repeat 2px;">
|
| - |
|
157 |
</span>
|
| - |
|
158 |
</div>
|
| - |
|
159 |
|
| - |
|
160 |
<div id='operator' class='row'>
|
| - |
|
161 |
<span class='label-text'>Operator :</span>
|
| - |
|
162 |
<span class='inputBox' style='width:170px'>
|
| 71 |
<div class="rowWidth"><span id="mobNumberText">Hello World : </span><input id="mobNumberBox" type="text"></div>-->
|
163 |
<select select id='operatorSelector' name='operator' style="height: 30px;font-size: 18px;width: 180px;">
|
| 72 |
<div id="firstCol" style="width:33%; text-align:right; float:left">
|
164 |
<option value='0'>Select Operator</option>
|
| - |
|
165 |
#foreach($providerKey in $providerMap.keySet())
|
| - |
|
166 |
<option value='$providerKey' #if($action.getOperatorId()==$providerKey)selected="true"#end>$providerMap.get($providerKey)</option>
|
| - |
|
167 |
#end
|
| 73 |
<br><br><br>
|
168 |
</select>
|
| 74 |
Recharge Your :
|
169 |
</span>
|
| - |
|
170 |
<span style="font-size: 12px; color: blue;float: left;padding: 15px 0 15px 0;">MNP Users choose operator manually</span>
|
| 75 |
<br><br><br>
|
171 |
</div>
|
| - |
|
172 |
|
| - |
|
173 |
<div id='plan' class='row planSelector'>
|
| 76 |
#if($action.getServiceType() == "2")
|
174 |
<span class='label-text'>Plan :</span>
|
| - |
|
175 |
<span class='inputBox' style='width:90px'>
|
| - |
|
176 |
<select id='planDropDown' name='plan' style="height: 30px;font-size: 18px;width: 95px;">
|
| 77 |
Operator :
|
177 |
</select>
|
| 78 |
<br><br><br>
|
178 |
</span>
|
| - |
|
179 |
<span id="planDescription" style="font-size: 12px; color: blue;float: left;padding: 15px 0 15px 0;display: inline-block;"></span>
|
| - |
|
180 |
</div>
|
| - |
|
181 |
|
| - |
|
182 |
<div id='amount' class='row'>
|
| 79 |
<span id="dthIdAlias">DTH Number</span> :
|
183 |
<span class='label-text'>Amount :</span>
|
| - |
|
184 |
<span class='inputBox'>
|
| - |
|
185 |
<input maxlength="4" name='amount' type='text' class='fullsize' style="background: white url('/images/Rupee.png') no-repeat 2px;">
|
| - |
|
186 |
</span>
|
| - |
|
187 |
</div>
|
| 80 |
#else
|
188 |
#else
|
| - |
|
189 |
|
| - |
|
190 |
<div class='icon-row'>
|
| - |
|
191 |
<span class='label-text' style='float:left'>Recharge Your :</span>
|
| - |
|
192 |
<span id='phone-image' style="background-image:url('/images/phone.png'); display:inline-block; height:50px; width:107px;cursor:pointer">
|
| - |
|
193 |
</span>
|
| - |
|
194 |
<span id='dth-image-not-clickable' style="background-image:url('/images/dth_pressed.png'); display:inline-block; height:50px; width:107px;">
|
| - |
|
195 |
</span>
|
| - |
|
196 |
</div>
|
| - |
|
197 |
|
| - |
|
198 |
<div id='operator' class='row'>
|
| - |
|
199 |
<span class='label-text'>Operator :</span>
|
| - |
|
200 |
<span class='inputBox' style='width:170px'>
|
| - |
|
201 |
<select select id='operatorSelector' name='operator' style="height: 30px;font-size: 18px;width: 180px;">
|
| - |
|
202 |
<option value='0'>Select Operator</option>
|
| - |
|
203 |
#foreach($providerKey in $providerMap.keySet())
|
| - |
|
204 |
<option value='$providerKey' #if($action.getOperatorId()==$providerKey)selected="true"#end>$providerMap.get($providerKey)</option>
|
| - |
|
205 |
#end
|
| 81 |
Mobile Number :
|
206 |
</select>
|
| - |
|
207 |
</span>
|
| - |
|
208 |
<span id="accNumberHelp" style="font-size: 12px; color: blue;padding: 5px 0 5px 0;width: 240px;display: inline-block;"></span>
|
| - |
|
209 |
</div>
|
| - |
|
210 |
|
| - |
|
211 |
<div id='mobile-number' class='row'>
|
| - |
|
212 |
<span id='dthIdAlias' class='label-text'>Account Number :</span>
|
| - |
|
213 |
<span class='inputBox'>
|
| - |
|
214 |
<input type="text" name="dthnumber" class="fullsize" style="width: 265px;padding-left: 10px;">
|
| 82 |
<br><br><br>
|
215 |
</span>
|
| - |
|
216 |
</div>
|
| - |
|
217 |
|
| - |
|
218 |
<div id='amount' class='row'>
|
| - |
|
219 |
<span class='label-text'>Amount :</span>
|
| - |
|
220 |
<span class='inputBox'>
|
| - |
|
221 |
<input maxlength="5" name='dthamount' type='text' class='fullsize' style="background: white url('/images/Rupee.png') no-repeat 2px;">
|
| 83 |
Operator :
|
222 |
</span>
|
| - |
|
223 |
</div>
|
| 84 |
#end
|
224 |
#end
|
| 85 |
<br><br><br>
|
- |
|
| 86 |
<span class='planSelector' style='display:none'>Plan : <br><br><br></span>
|
- |
|
| 87 |
Amount :
|
- |
|
| 88 |
<br><br><br>
|
- |
|
| 89 |
Email :
|
- |
|
| 90 |
<br>
|
225 |
|
| 91 |
</div>
|
- |
|
| 92 |
<div id="secondCol" style="width:3%; float:left"><br></div>
|
- |
|
| 93 |
<div id="thirdCol" style="width:64%; float:left;text-align:left">
|
- |
|
| 94 |
<br>
|
- |
|
| 95 |
#set($errorMsg=$action.getError())
|
- |
|
| 96 |
#if($errorMsg.equals(""))
|
- |
|
| 97 |
<br>
|
- |
|
| 98 |
#else
|
- |
|
| 99 |
<div style="color: red;font-size:15px;">$errorMsg</div>
|
- |
|
| 100 |
#end
|
- |
|
| 101 |
<form id='serviceSelectForm' action='/recharge' method='post'>
|
- |
|
| 102 |
<input id='serviceType' type="hidden" name='serviceType' value=''>
|
- |
|
| 103 |
<input name='form' type="hidden" value='serviceSelect'>
|
- |
|
| 104 |
</form>
|
- |
|
| 105 |
<p style="display:block">
|
226 |
<div id='email' class='row'>
|
| 106 |
#if($action.getServiceType() == "2")
|
- |
|
| 107 |
#set($dthImageSrc = '/images/dth_pressed.png')
|
- |
|
| 108 |
#set($phoneImageSrc = '/images/phone.png')
|
227 |
<span class='label-text'>Email Id :</span>
|
| 109 |
#else
|
- |
|
| 110 |
#set($phoneImageSrc = '/images/phone_pressed.png')
|
- |
|
| 111 |
#set($dthImageSrc = '/images/dth.png')
|
- |
|
| 112 |
#end
|
- |
|
| 113 |
<img id="phone-image" src=$phoneImageSrc style="cursor:pointer"><img id="dth-image" src=$dthImageSrc style="cursor:pointer">
|
- |
|
| 114 |
</p>
|
- |
|
| 115 |
<br>
|
- |
|
| 116 |
#set($providerMap = $action.getProviderMap())
|
- |
|
| 117 |
<form id='rechargeDetailsForm' action='/confirm' method='post'>
|
- |
|
| 118 |
#if($action.getServiceType() == "2")
|
228 |
#if($action.getUserInfo().isLoggedIn())
|
| 119 |
<select id='operatorSelector' name='operator' style="font-size:17px; padding: 5px;">
|
- |
|
| 120 |
<option value='0'>Select Operator</option>
|
- |
|
| 121 |
#foreach($providerKey in $providerMap.keySet())
|
229 |
#set($emailId = $action.getUserInfo().getEmail())
|
| 122 |
<option value='$providerKey' #if($action.getOperatorId()==$providerKey)selected="true"#end>$providerMap.get($providerKey)</option>
|
- |
|
| 123 |
#end
|
230 |
#else
|
| 124 |
</select>
|
231 |
#set($emailId = "")
|
| 125 |
<span style="color: blue; display: inline-block; width: 260px; font-size: 12px; margin-top: -5px;" id="accNumberHelp"></span>
|
- |
|
| 126 |
<br><br>
|
- |
|
| 127 |
<input type="text" name='dthnumber' maxlength="20" class="full-size-input"></input>
|
- |
|
| 128 |
#else
|
- |
|
| 129 |
<input type="text" name='number' maxlength="10" class="regular-size-input"></input>
|
- |
|
| 130 |
<br><br>
|
- |
|
| 131 |
<select id='operatorSelector' name='operator' style="font-size:20px; padding: 5px;">
|
- |
|
| 132 |
<option value='0'>Select Operator</option>
|
- |
|
| 133 |
#foreach($providerKey in $providerMap.keySet())
|
- |
|
| 134 |
<option value='$providerKey' #if($action.getOperatorId()==$providerKey)selected="true"#end>$providerMap.get($providerKey)</option>
|
- |
|
| 135 |
#end
|
232 |
#end
|
| 136 |
</select>
|
- |
|
| 137 |
<span style="font-size: 12px; padding-left: 10px;color: blue;">MNP Users choose operator manually</span>
|
- |
|
| 138 |
#end
|
- |
|
| 139 |
<input type='hidden' name='rechargeType' value='$action.getServiceType()'>
|
- |
|
| 140 |
<br><br>
|
- |
|
| 141 |
<span id='planSelector' class='planSelector'>
|
233 |
<span class='inputBox'>
|
| 142 |
<select id='planDropDown' name='plan' style='font-size: 18px;padding: 5px;'></select>
|
234 |
<input name='email' value ='$emailId' type='text' class='fullsize' style='background-color: white;padding-left:15px;width:260px;'>
|
| 143 |
<span id='planDescription' style='font-size: 13px;padding-left: 10px;color: blue;'></span>
|
235 |
<label for="email" style="color: #555;float: left;font-size: 13px;padding: 2px 0;width: 400px;">We will send confirmation of the recharge on this address.</label>
|
| 144 |
<br><br>
|
- |
|
| 145 |
</span>
|
236 |
</span>
|
| 146 |
#if($action.getServiceType() == "1")
|
- |
|
| 147 |
#set($name='amount')
|
- |
|
| 148 |
#else
|
237 |
</div>
|
| 149 |
#set($name='dthamount')
|
- |
|
| 150 |
#end
|
238 |
|
| 151 |
<input type="text" maxlength="5" name='$name' style="background: white url('/images/Rupee.png') no-repeat 2px;" class='regular-size-input'></input>
|
239 |
<div id="submit-button" style="margin-top: 50px;text-align: center;margin: 50px 0px 25px 0px;">
|
| 152 |
<div style="margin-top:20px">
|
- |
|
| 153 |
#if($action.getUserInfo().isLoggedIn())
|
- |
|
| 154 |
#set($emailId = $action.getUserInfo().getEmail())
|
- |
|
| 155 |
#else
|
- |
|
| 156 |
#set($emailId = "")
|
- |
|
| 157 |
#end
|
- |
|
| 158 |
<input type="text" name='email' class='full-size-input' value ='$emailId'></input>
|
240 |
<input type="submit" value="CONFIRM" class="submit-button">
|
| 159 |
<br>
|
- |
|
| 160 |
<span style="font-size:13px">We will send recharge confirmation on this address.</span>
|
- |
|
| 161 |
</div>
|
241 |
</div>
|
| 162 |
</form>
|
242 |
</form>
|
| 163 |
<br><br>
|
- |
|
| 164 |
<div id="confirm-button" class="submit-button">CONFIRM ></div>
|
- |
|
| 165 |
</div>
|
- |
|
| 166 |
|
243 |
|
| 167 |
</div>
|
244 |
</div>
|
| 168 |
</div>
|
245 |
</div>
|
| 169 |
<div class="widgets right">
|
246 |
<div class="widgets right">
|
| 170 |
<div style="width:258px; margin-left:10px;float:right;height:636px;background-image:url('/images/back1.jpg');border:solid 1px #2789C1"></div>
|
247 |
<div style="width:258px; margin-left:10px;float:right;height:636px;background-image:url('/images/back1.jpg');border:solid 1px #2789C1"></div>
|
| 171 |
</div>
|
248 |
</div>
|
| Line 202... |
Line 279... |
| 202 |
var helpMap = {"1":"Your VC number starts with 0 and is 11 digits long.",
|
279 |
var helpMap = {"1":"Your VC number starts with 0 and is 11 digits long.",
|
| 203 |
"2":"Smart card number starts with 2 and is 12 digits long.",
|
280 |
"2":"Smart card number starts with 2 and is 12 digits long.",
|
| 204 |
"3":"Smart card number starts with 4 and is 11 digits long.",
|
281 |
"3":"Smart card number starts with 4 and is 11 digits long.",
|
| 205 |
"4":"Subscriber ID starts with 1 and is 10 digits long.",
|
282 |
"4":"Subscriber ID starts with 1 and is 10 digits long.",
|
| 206 |
"5":"For customer ID, SMS ID to 9212012299 from your registered mobile no."};
|
283 |
"5":"For customer ID, SMS ID to 9212012299 from your registered mobile no."};
|
| 207 |
var dthIdAliasMap = {"1":"VC Number",
|
284 |
var dthIdAliasMap = {"1":"VC Number :",
|
| 208 |
"2":"Smart Card Number",
|
285 |
"2":"Smart Card Number :",
|
| 209 |
"3":"Smart Card Number",
|
286 |
"3":"Smart Card Number :",
|
| 210 |
"4":"Subscriber Id",
|
287 |
"4":"Subscriber Id :",
|
| 211 |
"5":"Customer Id",
|
288 |
"5":"Customer Id :",
|
| 212 |
"0":"Account Number"};
|
289 |
"0":"Account Number :"};
|
| 213 |
jQuery('#operatorSelector').change(function() {
|
290 |
jQuery('#operatorSelector').change(function() {
|
| 214 |
jQuery('#accNumberHelp').html(helpMap[jQuery('#operatorSelector option:selected').val()]);
|
291 |
jQuery('#accNumberHelp').html(helpMap[jQuery('#operatorSelector option:selected').val()]);
|
| 215 |
jQuery('#dthIdAlias').html(dthIdAliasMap[jQuery('#operatorSelector option:selected').val()]);
|
292 |
jQuery('#dthIdAlias').html(dthIdAliasMap[jQuery('#operatorSelector option:selected').val()]);
|
| 216 |
});
|
293 |
});
|
| 217 |
#end
|
294 |
#end
|