This repository has been archived by the owner on Feb 16, 2024. It is now read-only.
-
Notifications
You must be signed in to change notification settings - Fork 0
/
flightsearch.html
141 lines (126 loc) · 5.03 KB
/
flightsearch.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
<!DOCTYPE html>
<html lang="en">
<head>
<title>sherpa°AIR Flight Search page</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!--Bootstrap, custom CSS, Material Icons-->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" integrity="sha384-TX8t27EcRE3e/ihU7zmQxVncDAy5uIKz4rEkgIXeMed4M0jlfIDPvg6uqKI2xXr2" crossorigin="anonymous">
<link rel="stylesheet" type="text/css" href="css/style.css">
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<!--custom JavaScript file, jQuery-->
<script src="https://code.jquery.com/jquery-3.6.3.js" integrity="sha256-nQLuAZGRRcILA+6dMBOvcRh5Pe310sBpanc6+QBmyVM=" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.min.js" integrity="sha384-w1Q4orYjBQndcko6MimVbzY0tgp4pWB4lZ7lr30WKz0vr/aWKhXdBNmNb5D92v7s" crossorigin="anonymous"></script>
<script src="javascript/main.js"></script>
<script>
//function to redirect to booking page adding all query Params to URL
function goHome() {
window.location.href = `index.html?`;
}
</script>
</head>
<!--custom onLoad function gets today's date and put the dates in the date selector fields-->
<body onload="populateFlightSearchPage()">
<!--navigation bar start-->
<div id="nav-container"></div>
<script>
$(function() {
$("#nav-container").load("navbar.html");
});
</script>
<!--navigation bar end-->
<br>
<div class="container">
<div class="row">
<div class="col">
<h3 id="flightSearchTitle"></h3>
</div>
</div>
</div>
<hr width="85%" color="dimgray">
<div class="container">
<div class="row">
<div class="col flight-options">
<div class="row">
<div class="col">
<h4 class="center" id="departureOrigin"></h4>
<p class="center" id="outboundDepartureDate"><br>12:00:00</p>
</div>
<div class="col">
<p class="center"> to </p>
</div>
<div class="col">
<h4 class="center" id="departureDestination"></h4>
<p class="center" id="outboundArrivalDate"><br>18:00:00</p>
</div>
</div>
<p id="VInotice"onclick="expandVI()" style="text-align: center; display: none">Note: This is a self-transfer itinerary. Additional restrictions may apply. Click for more information.</p>
<div style="display: none" id="moreinfo">
</div>
</div>
<div style="padding: 5px;">
<h3 id="price1">500.00</h3>
<button class="btn" type="button" onclick="goToReturnSearch(document.getElementById('price1').innerHTML)" id="button1"> Book Flight
</div>
</div>
<br>
<div class="row">
<div class="col flight-options">
<div class="row">
<div class="col">
<h4 class="center" id="departureOrigin2"></h4>
<p class="center" id="outboundDepartureDate2"><br>12:00:00</p>
</div>
<div class="col">
<p class="center"> to </p>
</div>
<div class="col">
<h4 class="center" id="departureDestination2"></h4>
<p class="center" id="outboundArrivalDate2"><br>18:00:00</p>
</div>
</div>
</div>
<div style="padding: 5px;">
<h3 id="price2">500.00</h3>
<button class="btn" type="button" onclick="goToReturnSearch(document.getElementById('price2').innerHTML)" id="button2"> Book Flight
</div>
</div>
<br>
<div class="row">
<div class="col flight-options">
<div class="row">
<div class="col">
<h4 class="center" id="departureOrigin3"></h4>
<p class="center" id="outboundDepartureDate3"><br>12:00:00</p>
</div>
<div class="col">
<p class="center"> to </p>
</div>
<div class="col">
<h4 class="center" id="departureDestination3"></h4>
<p class="center" id="outboundArrivalDate3"><br>18:00:00</p>
</div>
</div>
</div>
<div style="padding: 5px;">
<h3 id="price3">500.00</h3>
<button class="btn" type="button" onclick="goToReturnSearch(document.getElementById('price3').innerHTML)" id="button3"> Book Flight
</div>
</div>
<br>
<button class="btn" type="button" onclick="goHome()"> Return to search</button>
<button class="btn" type="button" onclick="goToTravellerInfo()" id="bookFlightVI"> Book Flight</button>
</div>
<br>
</body>
<footer>
<!--footer start-->
<div id="footer-container"></div>
<script>
$(function() {
$("#footer-container").load("footer.html");
});
</script>
<!--footer end-->
</footer>
</html>