-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathmvc.html
executable file
·269 lines (239 loc) · 10.4 KB
/
mvc.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
<!DOCTYPE html>
<head>
<META HTTP-EQUIV="Content-type" CONTENT="text/html; charset=UTF-8"></META>
<link rel="stylesheet" href="//mvc.travelaccessbenefits.com/assets/css/bootstrap.min.css">
<!-- Include the above in your HEAD tag ---------->
<link rel="stylesheet" href="//mvc.travelaccessbenefits.com/assets/css/style.css">
<!--
you can substitue the span of reauth email for a input with the email and
include the remember me checkbox
-->
</head>
<style media="screen">
label,h5{
color: #fff;
}
.k-container{
margin: 10px 0;
padding: 0;
}
.k-container h5{
font-size: 1em;
color: #fff;
padding: 8px;
vertical-align: baseline;
text-align: left;
display: table-cell;
}
.k-container h5 span{
color: red;
background-color: #fd0;
padding: 2px 8px;
border-radius: 50%;
margin: 0 10px;
}
.alert-bg{
background-color: #b30000;
border-radius: 5px;
}
</style>
<body class="bg-2">
<div class="container card-container">
<div class="col-lg-12" style="margin: 0 auto; transform: translateY(-5%);">
<div id="contenedor_central">
<div id="top_central">
<a href="http://travelaccessbenefits.com?lang=es"><img src="http://www.travelaccessbenefits.com/assets/images/travel_access_blanco.png" class="img-responsive"></a>
</div>
<div id="medio_central">
<div id="divisor">
</div>
</div>
<div id="bottom_central">
<div class="mb-2">
<h5 class="h3 font-weight-normal text-white text-center">Fill out the form with the customer information</h5>
</div>
<form action="https://webto.salesforce.com/servlet/servlet.WebToLead?encoding=UTF-8" class="px-5 py-5" method="post" accept-charset="utf-8">
<div class="k-container">
<div class="alert-bg">
<h5><span>!</span>i'm an alert</h5>
</div>
</div>
<div class="form-row">
<div class="form-group col-md-12">
<label for="folio">Folio number *</label>
<input type="text" name="00N6100000IG2wg" value="" id="folio" class="form-control" required="" autofocus="" />
</div>
</div>
<div class="form-row">
<div class="form-group col-md-6">
<label for="first_name">First Name *</label>
<input type="text" name="first_name" value="" id="first_name" class="form-control" required="" autofocus="" />
</div>
<div class="form-group col-md-6">
<label for="last_name">Last Name *</label> <input type="text" name="last_name" value="" id="last_name" class="form-control" required="" autofocus="" />
</div>
</div>
<div class="form-row">
<div class="form-group col-md-6">
<label for="level">Travel Access Level</label> <select name="00N6100000IG2x5" id="level" class="form-control">
<option value="" selected="selected">- Select -</option>
<option value="Saphire">Saphire</option>
<option value="Emerald">Emerald</option>
<option value="Diamond">Diamond</option>
</select>
</div>
<div class="form-group col-md-6">
<label for="level">Sales Room *</label> <select name="00N6100000FuHaE" id="sales_rooms" class="form-control">
<option value="" selected="selected">Seleccionar</option>
<option value="Argentina">Argentina</option>
<option value="Barranquila">Barranquila</option>
<option value="Bogota">Bogota</option>
<option value="Cali">Cali</option>
<option value="Cancun">Cancun</option>
<option value="Caracas">Caracas</option>
<option value="Cd. Mexico">Cd. Mexico</option>
<option value="Costa Rica">Costa Rica</option>
<option value="Evento Especial">Special Event</option>
<option value="Guadalajara">Guadalajara</option>
<option value="Guatemala">Guatemala</option>
<option value="Guayaquil">Guayaquil</option>
<option value="Honduras">Honduras</option>
<option value="Lima">Lima</option>
<option value="Medellin">Medellin</option>
<option value="Panama City">Panama City</option>
<option value="Puerto Vallarta">Puerto Vallarta</option>
<option value="Quito">Quito</option>
<option value="Republica Dominicana">Republica Dominicana</option>
<option value="San Jose">San Jose</option>
<option value="Santa Cruz">Santa Cruz</option>
<option value="Santiago">Santiago</option>
<option value="Trinidad &amp; Tobago">Trinidad & Tobago</option>
</select>
</div>
</div>
<div class="form-row">
<div class="form-group col-md-6">
<label for="language">Language</label> <select name="00N6100000DGWEZ" id="language" class="form-control">
<option value="" selected="selected">- Select -</option>
<option value="Inglés">English</option>
<option value="Español">Spanish</option>
<option value="Portugués">Portuguese</option>
<option value="Fancés">French</option>
</select>
</div>
<div class="form-group col-md-6">
<label for="email">Email address *</label> <input type="email" name="email" value="" id="email" class="form-control" required="" autofocus="" />
</div>
</div>
<div class="form-row">
<div class="form-group col-md-6">
<label for="cellphone">Cell phone number *</label> <input type="tel" name="00N6100000DGWES" value="" id="cellphone" class="form-control" required="" autofocus="" />
</div>
<div class="form-group col-md-6">
<label for="altphone">Alternative phone number *</label> <input type="tel" name="00N6100000DGWEf" value="" id="altphone" class="form-control" required="" autofocus="" />
</div>
</div>
<div class="form-row">
<div class="form-group col-12">
<label for="comments">Comments</label> <textarea name="00N6100000DGWEU" cols="40" rows="3" id="comments" type="textarea" class="form-control" ></textarea>
</div>
</div>
<button type="submit" class="btn btn-primary btn-signin float-right p-2 col-3" >Send</button>
<input type="hidden" name="00N6100000IG2wl" value="09/10/2018" />
<input type="hidden" name="oid" value="00D61000000KAuS" />
<input type="hidden" name="retURL" value="mvc.travelaccessbenefits.com/index.php/result" />
<!-- ---------------------------------------------------------------------- -->
<!-- NOTA: Estos campos son elementos de depuración opcionales. Elimine -->
<!-- los comentarios de estas líneas si desea realizar una prueba en el -->
<!-- modo de depuración. -->
<!--
<input type="hidden" name="debug" value="1" />
<input type="hidden" name="debugEmail" value="luis.vazquez@owners-link.com" />
-->
<!-- ---------------------------------------------------------------------- -->
</form> <!-- /form -->
</div>
</div>
</div><!-- /container -->
</body>
<script src="jquery/bootstrap.min.js"></script>
<script src="jquery/jquery-3.3.1.slim.js"></script>
<script type="text/javascript">
$( document ).ready(function() {
// DOM ready
// Test data
/*
* To test the script you should discomment the function
* testLocalStorageData and refresh the page. The function
* will load some test data and the loadProfile
* will do the changes in the UI
*/
// testLocalStorageData();
// Load profile if it exits
loadProfile();
});
/**
* Function that gets the data of the profile in case
* thar it has already saved in localstorage. Only the
* UI will be update in case that all data is available
*
* A not existing key in localstorage return null
*
*/
function getLocalProfile(callback){
var profileImgSrc = localStorage.getItem("PROFILE_IMG_SRC");
var profileName = localStorage.getItem("PROFILE_NAME");
var profileReAuthEmail = localStorage.getItem("PROFILE_REAUTH_EMAIL");
if(profileName !== null
&& profileReAuthEmail !== null
&& profileImgSrc !== null) {
callback(profileImgSrc, profileName, profileReAuthEmail);
}
}
/**
* Main function that load the profile if exists
* in localstorage
*/
function loadProfile() {
if(!supportsHTML5Storage()) { return false; }
// we have to provide to the callback the basic
// information to set the profile
getLocalProfile(function(profileImgSrc, profileName, profileReAuthEmail) {
//changes in the UI
$("#profile-img").attr("src",profileImgSrc);
$("#profile-name").html(profileName);
$("#reauth-email").html(profileReAuthEmail);
$("#inputEmail").hide();
$("#remember").hide();
});
}
/**
* function that checks if the browser supports HTML5
* local storage
*
* @returns {boolean}
*/
function supportsHTML5Storage() {
try {
return 'localStorage' in window && window['localStorage'] !== null;
} catch (e) {
return false;
}
}
/**
* Test data. This data will be safe by the web app
* in the first successful login of a auth user.
* To Test the scripts, delete the localstorage data
* and comment this call.
*
* @returns {boolean}
*/
function testLocalStorageData() {
if(!supportsHTML5Storage()) { return false; }
localStorage.setItem("PROFILE_IMG_SRC", "//lh3.googleusercontent.com/-6V8xOA6M7BA/AAAAAAAAAAI/AAAAAAAAAAA/rzlHcD0KYwo/photo.jpg?sz=120" );
localStorage.setItem("PROFILE_NAME", "César Izquierdo Tello");
localStorage.setItem("PROFILE_REAUTH_EMAIL", "oneaccount@gmail.com");
}
</script>
</body>
</html>