Itinerary Attempt TWONEW
by George Obregon
HTML
<form>
<input id="carrierCode" value="AV">
<input id="flightNumber" value="521">
<button id="submit" onclick="testdis">RUN!</button>
</form>
<body>
<div id="demoBIG" class='boarding-passsegment1'>
</div>
</body>
CSS
/*--------------------
Body
--------------------*/
*,
*::before,
*::after {
box-sizing: border-box;
}
body {
height: 100vh;
margin: 0;
background: radial-gradient(ellipse farthest-corner at center top, #ECECEC, #999);
color: #363c44;
font-size: 14px;
font-family: 'Roboto', sans-serif;
}
/*--------------------
Boarding Pass
--------------------*/
.boarding-passsegment1 {
position: relative;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 100%;
height: 100%;
background: #fff;
border-radius: 12px;
box-shadow: 0 5px 30px rgba(0, 0, 0, 0.2);
overflow: hidden;
text-transform: uppercase;
/*--------------------
Header
--------------------*/
/*--------------------
Cities
--------------------*/
/*--------------------
Infos
--------------------*/
/*--------------------
Strap
--------------------*/
}
.boarding-passsegment1 small {
display: block;
font-size: 11px;
color: #A2A9B3;
margin-bottom: 2px;
}
.boarding-passsegment1 strong {
font-size: 15px;
display: block;
}
.boarding-passsegment1 header {
background: linear-gradient(to bottom, #36475f, #2c394f);
padding: 12px 20px;
height: 53px;
}
.boarding-passsegment1 header .logo {
float: left;
width: 104px;
height: 31px;
}
.boarding-passsegment1 header .flight {
float: right;
color: #fff;
text-align: right;
}
.boarding-passsegment1 header .flight small {
font-size: 8px;
margin-bottom: 2px;
opacity: 0.8;
}
.boarding-passsegment1 header .flight strong {
font-size: 18px;
}
.boarding-passsegment1 .cities {
position: relative;
}
.boarding-passsegment1 .cities::after {
content: '';
display: table;
clear: both;
}
.boarding-passsegment1 .cities .city {
padding: 20px 18px;
float: left;
}
.boarding-passsegment1 .cities .city:nth-child(2) {
float: right;
}
.boarding-passsegment1 .cities .city strong {
font-size: 40px;
font-weight: 300;
line-height: 1;
}
.boarding-passsegment1...
JavaScript
//function testdis() {
var AI_carrierCode = "AV";
var AI_flightNumber = "520";
/* var inputURL = 'https://api.myjson.com/bins/pqzwy'; */
var inputURL = 'https://api.myjson.com/bins/6d58a';
const pricelistdata = fetch(inputURL);
pricelistdata
.then(function(response) {
return response.json();
})
.then(function(data) {
/* BEGIN TIME FORMATTER */
var minutes = 1000 * 60;
var hours = minutes * 60;
var days = hours * 24;
var years = days * 365;
var weekday = new Array(7);
weekday[0] = "Sunday";
weekday[1] = "Monday";
weekday[2] = "Tuesday";
weekday[3] = "Wednesday";
weekday[4] = "Thursday";
weekday[5] = "Friday";
weekday[6] = "Saturday";
var monthname = new Array(12);
monthname[0] = "January";
monthname[1] = "February";
monthname[2] = "March";
monthname[3] = "April";
monthname[4] = "May";
monthname[5] = "June";
monthname[6] = "July";
monthname[7] = "August";
monthname[8] = "September";
monthname[9] = "October";
monthname[10] = "November";
monthname[11] = "December";
var currentTime = new Date();
var currentDay = currentTime.getDate();
var currentYear = currentTime.getFullYear();
var currentMonth = currentTime.getMonth() + 1;
var currentHours = currentTime.getHours();
var currentMinutes = currentTime.getMinutes();
var currentSeconds = currentTime.getSeconds();
// Pad the minutes and seconds with leading zeros, if required
currentMinutes = (currentMinutes < 10 ? "0" : "") + currentMinutes;
currentSeconds = (currentSeconds < 10 ? "0" : "") + currentSeconds;
// Choose either "AM" or "PM" as appropriate
var timeOfDay = (currentHours < 12) ? "AM" : "PM";
// Convert the hours component to 12-hour format if needed
currentHours = (currentHours > 12) ? currentHours - 12 : currentHours;
// Convert an hours component of "0" to "12"
currentHours = (currentHours == 0) ? 12 : currentHours;
//...