Build Folder Added
This commit is contained in:
@@ -0,0 +1,161 @@
|
||||
// using window for hide div
|
||||
|
||||
window.addEventListener('mouseup', function (event) {
|
||||
if (!event.target.matches('.TravelDropdown')) {
|
||||
var container = document.getElementById('TravellerCount');
|
||||
if (!container.contains(event.target)) {
|
||||
container.classList.add('travel-content');
|
||||
}
|
||||
};
|
||||
if (!event.target.matches('.dropdown-content')) {
|
||||
var dropdowns = document.getElementsByClassName("dropdown-content");
|
||||
var i;
|
||||
for (i = 0; i < dropdowns.length; i++) {
|
||||
var openDropdown = dropdowns[i];
|
||||
if (openDropdown.classList.contains('show')) {
|
||||
openDropdown.classList.remove('show');
|
||||
}
|
||||
}
|
||||
};
|
||||
if (!event.target.matches('.depart-content')) {
|
||||
var dropdowns = document.getElementsByClassName("depart-content");
|
||||
var i;
|
||||
for (i = 0; i < dropdowns.length; i++) {
|
||||
var openDropdown = dropdowns[i];
|
||||
|
||||
if (openDropdown.classList.contains('showdepart')) {
|
||||
openDropdown.classList.remove('showdepart');
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
if (!event.target.matches('.tawakkal')) {
|
||||
var dropdowns = document.getElementsByClassName("calenderField");
|
||||
var i;
|
||||
for (i = 0; i < dropdowns.length; i++) {
|
||||
var openDropdown = dropdowns[i];
|
||||
if (event.target != dropdowns && event.target.parentNode != dropdowns) {
|
||||
if (openDropdown.classList.contains('showCalender')) {
|
||||
openDropdown.classList.remove('showCalender');
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
if (!event.target.matches('.HotelNationality')) {
|
||||
var dropdowns = document.getElementsByClassName("HotelNationality");
|
||||
var i;
|
||||
for (i = 0; i < dropdowns.length; i++) {
|
||||
var openDropdown = dropdowns[i];
|
||||
if (event.target != dropdowns && event.target.parentNode != dropdowns) {
|
||||
if (!openDropdown.classList.contains('hideInput')) {
|
||||
openDropdown.classList.add('hideInput');
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
if (!event.target.matches('.HotelDestination')) {
|
||||
var dropdowns = document.getElementsByClassName("HotelDestination");
|
||||
var i;
|
||||
for (i = 0; i < dropdowns.length; i++) {
|
||||
var openDropdown = dropdowns[i];
|
||||
if (event.target != dropdowns && event.target.parentNode != dropdowns) {
|
||||
if (!openDropdown.classList.contains('hideInput')) {
|
||||
openDropdown.classList.add('hideInput');
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
if (!event.target.matches('.PrefAirline-two')) {
|
||||
var container = document.getElementsByClassName('SelectList')[0];
|
||||
if (!container.contains(event.target)) {
|
||||
container.classList.remove('ShowAirlineList');
|
||||
container.querySelector('input').value = '';
|
||||
}
|
||||
};
|
||||
if (!event.target.matches('.PrefAirline-one')) {
|
||||
var dropdowns = document.getElementsByClassName("PrefAirline-one")[0].querySelector('.SelectList');
|
||||
if (dropdowns.classList.contains('ShowAirlineList')) {
|
||||
dropdowns.classList.remove('ShowAirlineList');
|
||||
}
|
||||
};
|
||||
if (!event.target.matches('.roomPaxDetails')) {
|
||||
var container = document.getElementsByClassName('roomPaxDetails')[0];
|
||||
if (!container.contains(event.target)) {
|
||||
container.classList.remove('showRoomPax');
|
||||
}
|
||||
};
|
||||
});
|
||||
|
||||
|
||||
// hotel and Flight tabs hide and show
|
||||
|
||||
function openTab(cityName, elmnt) {
|
||||
|
||||
// CallCalendar()
|
||||
var i, tabcontent, tablinks;
|
||||
tabcontent = document.getElementsByClassName("tabcontent");
|
||||
for (i = 0; i < tabcontent.length; i++) {
|
||||
tabcontent[i].style.display = "none";
|
||||
}
|
||||
tablinks = document.getElementsByClassName("tablink");
|
||||
for (i = 0; i < tablinks.length; i++) {
|
||||
tablinks[i].style.backgroundColor = "";
|
||||
}
|
||||
document.getElementById(elmnt).style.display = "block";
|
||||
// elmnt.style.backgroundColor = color;
|
||||
document.getElementById("flight_button").classList.remove('active');
|
||||
document.getElementById("hotel_button").classList.remove('active')
|
||||
document.getElementById(cityName).classList.add('active');
|
||||
document.getElementById('target').classList.remove('d-none');
|
||||
document.getElementById(elmnt).classList.remove('d-none');
|
||||
document.querySelector('.mobileName').innerHTML = elmnt;
|
||||
|
||||
|
||||
}
|
||||
document.getElementById("flight_button").click();
|
||||
|
||||
// flight all tabs hide and show
|
||||
|
||||
(function () {
|
||||
var d = document,
|
||||
tabs = d.querySelector('.SearchTripTypeTabs'),
|
||||
tab = d.querySelectorAll('li'),
|
||||
contents = d.querySelectorAll('.content');
|
||||
tabs.addEventListener('click', function (e) {
|
||||
if (e.target && e.target.nodeName === 'LI') {
|
||||
// change tabs
|
||||
for (var i = 0; i < tab.length; i++) {
|
||||
tab[i].classList.remove('active1');
|
||||
}
|
||||
e.target.classList.toggle('active1');
|
||||
|
||||
|
||||
for (i = 0; i < contents.length; i++) {
|
||||
contents[i].classList.remove('active1');
|
||||
}
|
||||
var tabId = '#' + e.target.dataset.tabId;
|
||||
d.querySelector(tabId).classList.toggle('active1');
|
||||
}
|
||||
});
|
||||
})();
|
||||
|
||||
function closeALLTab(elem) {
|
||||
document.getElementById('target').classList.add('d-none')
|
||||
document.getElementById('hotel_button').classList.remove('active')
|
||||
document.getElementById('flight_button').classList.remove('active')
|
||||
console.log(elem)
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
@@ -0,0 +1,748 @@
|
||||
let airportlist = [];
|
||||
let TravellerDetails = {
|
||||
classType: 'Economy',
|
||||
Adult: 1,
|
||||
child: 0,
|
||||
Infant: 0,
|
||||
};
|
||||
PaxCount('', '');
|
||||
bindMultiCityFrom();
|
||||
bindMultiCityFrom();
|
||||
GetAirportList(undefined, null);
|
||||
let AdvanceShowBtn = false
|
||||
let advancedSerch = true;
|
||||
//
|
||||
|
||||
|
||||
async function GetAirportList(element, check) {
|
||||
let inpVal = check ? element.value ? element.value : 'BOM' : 'BOM';
|
||||
if (inpVal.length >= 3) {
|
||||
const response = await fetch("https://adminapi.uat.futuretravelplatform.com/api/MasterSearch/GetAllMasterSearch/en/" + inpVal, {
|
||||
method: 'GET',
|
||||
headers: { 'Content-Type': 'application/json', 'OrgId': '2206040706597097092' }
|
||||
});
|
||||
if (!response.ok) {
|
||||
throw new Error(`HTTP error! status: ${response.status}`);
|
||||
}
|
||||
const data = await response.json();
|
||||
airportlist = await data;
|
||||
autobind(element, check, airportlist);
|
||||
|
||||
}
|
||||
|
||||
};
|
||||
|
||||
function autobind(element, check, obj) {
|
||||
check ? check == '0' ? element.closest(".searchBox").querySelector(".dropdown-content").classList.add('show') : element.closest(".searchBox").querySelector(".depart-content").classList.add('showdepart') : '';
|
||||
let html = '';
|
||||
let airlist = obj ? obj : airportlist;
|
||||
airlist.map(e => {
|
||||
html += ` <li class="dropdown-item" onclick="ApplyAirport(this)" data-city-name=${e.ct} data-airport-name=${e.an} data-airport-code=${e.ac}
|
||||
data-country-code = ${e.cc}>
|
||||
<div class="autoCompleteIcon">
|
||||
<svg focusable="false" color="inherit" fill="currentcolor" aria-hidden="true"
|
||||
role="presentation" viewBox="0 0 150 150" preserveAspectRatio="xMidYMid meet"
|
||||
width="24px" height="24px" class="sc-bxivhb dttlRz sc-jxGEyO iICATY">
|
||||
<path
|
||||
d="M118.9 15.7L90.7 43.9l-80.9-25c-1.6-.4-3.3 0-4.6 1.1L.7 24.5c-.9.8-.9 2.1-.2 3 .2.2.4.3.6.4l65.2 40.4-24 24c-3.8 3.7-7.2 7.8-10.2 12.2l-18.2-5c-1.6-.4-3.3.1-4.6 1.2l-3.5 3.5c-1 .8-1 2.3-.2 3.3l.4.4 18.6 13.9.6.5-.2.5c-1.8 3.7-1.2 4.3 2.5 2.5l.5-.2c.2.2.3.4.5.6l13.9 18.6c.7 1 2.2 1.3 3.2.6.1-.1.3-.2.4-.3l3.5-3.5c1.1-1.3 1.6-3 1.2-4.6l-5-18.2c4.4-3 8.5-6.4 12.2-10.2l24-24 40.1 64.7c.6 1 1.8 1.4 2.8.8.2-.1.4-.3.6-.4l4.5-4.5c1.1-1.2 1.5-3 1.1-4.6l-24.9-80.3 28.4-28.4C150 15.9 152 4.9 148.7 1.6S134.4.2 118.9 15.7z">
|
||||
</path>
|
||||
</svg>
|
||||
</div>
|
||||
<div class="ListTypeCity">
|
||||
<span> ${e.ct}</span>
|
||||
<span>
|
||||
${e.an}
|
||||
</span>
|
||||
</div>
|
||||
<span class="airportCode">${e.ac}</span>
|
||||
</li>`
|
||||
});
|
||||
element ? element.closest(".searchBox").querySelector(".dropdown-wrapper").innerHTML = html : '';
|
||||
}
|
||||
|
||||
|
||||
function ApplyAirport(element) {
|
||||
let city_name = element.getAttribute("data-city-name");
|
||||
let code = element.getAttribute("data-airport-code");
|
||||
element.closest(".search-border").querySelector('input').value = city_name;
|
||||
element.closest(".search-border").querySelector('input').setAttribute("data-airport-code", code);
|
||||
let container = element.closest(".search-border").querySelector('input')
|
||||
if (!container.classList.contains('Origin')) {
|
||||
let nextform = element.closest('.MultiForm') ? element.closest('.MultiForm').nextElementSibling : '';
|
||||
if (nextform) {
|
||||
if (nextform.querySelector('.Origin')) {
|
||||
nextform.querySelector('.Origin').value = city_name
|
||||
nextform.querySelector('.Origin').setAttribute("data-airport-code", code)
|
||||
};
|
||||
};
|
||||
}
|
||||
};
|
||||
|
||||
//
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
// advancedField()
|
||||
function advancedField(elem) {
|
||||
console.log('asd')
|
||||
console.log(elem)
|
||||
elem.querySelector('.expand-less').classList.add('d-none');
|
||||
elem.querySelector('.expand-more').classList.add('d-none');
|
||||
if (advancedSerch) {
|
||||
advancedSerch = false;
|
||||
elem.closest('div').querySelector(".expander_more").classList.remove('d-none');
|
||||
elem.querySelector('.expand-less').classList.remove('d-none');
|
||||
} else {
|
||||
advancedSerch = true;
|
||||
elem.closest('div').querySelector(".expander_more").classList.add('d-none');
|
||||
elem.querySelector('.expand-more').classList.remove('d-none');
|
||||
}
|
||||
};
|
||||
|
||||
|
||||
|
||||
function PaxCount(pax, btn_name) {
|
||||
let Adul_num = parseInt(document.getElementById("adult").value);
|
||||
let child_Num = parseInt(document.getElementById("child").value);
|
||||
let Infant_child = parseInt(document.getElementById("infant").value);
|
||||
let adult_minus_btn = document.getElementsByClassName("adult_minus_btn")[0];
|
||||
let adult_plus_btn = document.getElementsByClassName("adult_plus_btn")[0];
|
||||
let child_plus_btn = document.getElementsByClassName("child_plus_btn")[0];
|
||||
let child_minus_btn = document.getElementsByClassName("child_minus_btn")[0];
|
||||
let infant_plus_btn = document.getElementsByClassName("infant_plus_btn")[0];
|
||||
let infant_minus_btn = document.getElementsByClassName("infant_minus_btn")[0];
|
||||
if (btn_name == 'add') {
|
||||
if (pax == "adult" || pax == "child") {
|
||||
if (Adul_num + child_Num < 9) {
|
||||
document.getElementById(pax).value = parseInt(document.getElementById(pax).value) + 1
|
||||
Adul_num = parseInt(document.getElementById('adult').value);
|
||||
child_Num = parseInt(document.getElementById('child').value);
|
||||
}
|
||||
}
|
||||
if (pax == "infant") {
|
||||
if (Infant_child < Adul_num) {
|
||||
document.getElementById(pax).value = parseInt(document.getElementById(pax).value) + 1
|
||||
Infant_child = parseInt(document.getElementById(pax).value);
|
||||
}
|
||||
}
|
||||
} else {
|
||||
if (pax == "adult") {
|
||||
if (Adul_num > 1) {
|
||||
document.getElementById(pax).value = parseInt(document.getElementById(pax).value) - 1
|
||||
Adul_num--;
|
||||
}
|
||||
if (Infant_child > Adul_num) {
|
||||
if (btn_name == 'remove') {
|
||||
document.getElementById('infant').value = Infant_child - 1;
|
||||
Infant_child--
|
||||
}
|
||||
}
|
||||
} else if (pax == "child") {
|
||||
if (child_Num > 0) {
|
||||
document.getElementById(pax).value = parseInt(document.getElementById(pax).value) - 1;
|
||||
child_Num--;
|
||||
}
|
||||
} else if (pax == "infant") {
|
||||
if (Infant_child > 0) {
|
||||
document.getElementById(pax).value = parseInt(document.getElementById(pax).value) - 1;
|
||||
Infant_child = parseInt(document.getElementById(pax).value);
|
||||
}
|
||||
}
|
||||
}
|
||||
Adul_num == 1 ? adult_minus_btn.classList.add("disableBtn") : adult_minus_btn.classList.remove("disableBtn");
|
||||
child_Num == 0 ? child_minus_btn.classList.add('disableBtn') : child_minus_btn.classList.remove('disableBtn');
|
||||
Infant_child == 0 ? infant_minus_btn.classList.add("disableBtn") : infant_minus_btn.classList.remove("disableBtn");
|
||||
if (Adul_num + child_Num == 9) {
|
||||
adult_plus_btn.classList.add('disableBtn');
|
||||
child_plus_btn.classList.add("disableBtn");
|
||||
} else {
|
||||
adult_plus_btn.classList.remove('disableBtn');
|
||||
child_plus_btn.classList.remove("disableBtn");
|
||||
}
|
||||
if (Infant_child == Adul_num) infant_plus_btn.classList.add("disableBtn")
|
||||
else infant_plus_btn.classList.remove('disableBtn');
|
||||
|
||||
|
||||
let travel_no1 = Adul_num + (child_Num + Infant_child);
|
||||
let paxSearch = document.getElementsByClassName('TravelerClassCount')
|
||||
for (let i = 0; i < paxSearch.length; i++) {
|
||||
paxSearch[i].innerHTML = `
|
||||
<h4>${travel_no1} Traveller</h4>
|
||||
<h4>${TravellerDetails.classType}</h4>`
|
||||
};
|
||||
TravellerDetails.Adult = Adul_num;
|
||||
TravellerDetails.child = child_Num;
|
||||
TravellerDetails.Infant = Infant_child;
|
||||
|
||||
|
||||
};
|
||||
|
||||
function ClassType(Btn, name) {
|
||||
document.querySelectorAll('.classBtn').forEach(box => box.classList.remove('classTypeBorder'));
|
||||
Btn.classList.add('classTypeBorder');
|
||||
TravellerDetails.classType = name;
|
||||
PaxCount('', '');
|
||||
};
|
||||
|
||||
// traveller div show and hide
|
||||
|
||||
function ShowPaxCounter() {
|
||||
document.getElementById('TravellerCount').classList.remove('travel-content');
|
||||
document.getElementById('TravellerCount').classList.remove('d-none')
|
||||
|
||||
}
|
||||
|
||||
function ApplyTraveller() {
|
||||
document.getElementById('TravellerCount').classList.add('travel-content');
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
/// multi city
|
||||
|
||||
function bindMultiCityFrom() {
|
||||
var searchList = document.querySelectorAll(".MultiForm");
|
||||
let html = ''
|
||||
if (searchList.length < 6) {
|
||||
let RemoveHtml = `<div class="closeMulticityCard" onclick='removeMultiCityForm(this)' >
|
||||
<span class="material-icons" > close </span>
|
||||
</div>
|
||||
</div> `
|
||||
html = `<div class="MCToFromDate MultiForm">
|
||||
<div class="multiCityBody">
|
||||
<div class="multiCityRemove">
|
||||
<div class="multiCityFlightText">Flight 1</div>
|
||||
</div>
|
||||
<div class="order2">
|
||||
<div class="toFromSearchWrapper">
|
||||
<div class="toFromSearchOrigin search-border">
|
||||
<label for="" class="toOrigin">
|
||||
<div class="toOriginIcon">
|
||||
<span class="material-icons">
|
||||
flight</span>
|
||||
</div>
|
||||
<div class="toOriginContent">
|
||||
<h4>From</h4>
|
||||
<div class="searchBox">
|
||||
<input class="Origin " autocomplete="off" onclick="autobind(this , '0' ,null)"
|
||||
onkeyup="GetAirportList(this , '0')" type="text" data-airport-code="" placeholder="Origin"
|
||||
/>
|
||||
<div id="myDropdown" class="dropdown-content">
|
||||
<div>
|
||||
<div class="mobileBack">
|
||||
<div class="mobileHead">
|
||||
<button class="mobileBackButton toggle">
|
||||
<span class="material-icons">
|
||||
arrow_back
|
||||
</span>
|
||||
</button>
|
||||
<div class="mobileTitle">
|
||||
<h4>Search destination</h4>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="mobileSearchInput">
|
||||
<input type="text" autocomplete="off" class="mobileSearch"
|
||||
placeholder="Search Where Are You Flying" />
|
||||
<span class="material-icons">
|
||||
search
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="toOriginPopular">
|
||||
<h4>TOP ORIGINS</h4>
|
||||
</div>
|
||||
<ul class="dropdown-wrapper">
|
||||
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</label>
|
||||
</div>
|
||||
<div class="toFromSearchSweep" onclick="ExchangeValue(this)">
|
||||
<span class="material-icons"> sync_alt </span>
|
||||
</div>
|
||||
<div class="toFromSearchDepart search-border">
|
||||
<label class="toDepart" for="">
|
||||
<div class="toDepartIcon">
|
||||
<span class="material-icons">
|
||||
flight</span>
|
||||
</div>
|
||||
<div class="ToDepartContent searchBox">
|
||||
<h4>To</h4>
|
||||
<div>
|
||||
<input class="depart" autocomplete="off" onclick="autobind(this , '1' ,null)"
|
||||
onkeyup="GetAirportList(this , '1')" data-airport-code="" type="text"
|
||||
placeholder="Destination" />
|
||||
<div id="departDropDown" class="depart-content">
|
||||
<div>
|
||||
<div class="mobileBack">
|
||||
<div class="mobileHead">
|
||||
<button class="mobileBackButton toggle">
|
||||
<span class="material-icons">
|
||||
arrow_back
|
||||
</span>
|
||||
</button>
|
||||
<div class="mobileTitle">
|
||||
<h4>Search destination</h4>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="mobileSearchInput">
|
||||
<input type="text" autocomplete="off" class="mobileSearch"
|
||||
placeholder="Search Where Are You Flying" />
|
||||
<span class="material-icons">
|
||||
search
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="toDepartPopular">
|
||||
<h4>TOP ORIGINS</h4>
|
||||
</div>
|
||||
<ul class="dropdown-wrapper">
|
||||
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="order3">
|
||||
<div class="searchDate">
|
||||
<label for="calenderForm" class="searchDateForm">
|
||||
<div class="searchDateFormIcon">
|
||||
<span class="material-icons">event_note</span>
|
||||
</div>
|
||||
<div class="searchDateFormHead">
|
||||
<h4 class="searchDateFormHeadText">
|
||||
Departure
|
||||
</h4>
|
||||
<input type="text" id="MultiCity-${searchList.length + 1}" />
|
||||
</div>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
${searchList.length >= 2 ? RemoveHtml : ''}
|
||||
`
|
||||
document.getElementById('multiCityForm').insertAdjacentHTML("beforebegin", html);
|
||||
var searchList = document.querySelectorAll(".MultiForm");
|
||||
let index = searchList.length == 2 ? 1 : searchList.length - 1
|
||||
let date = searchList.length == 1 ? new Date : document.getElementById(`MultiCity-${+ (index)}`).value
|
||||
console.log(date)
|
||||
caleran("#MultiCity-" + (searchList.length), {
|
||||
singleDate: true,
|
||||
calendarCount: 1,
|
||||
showHeader: false,
|
||||
showFooter: false,
|
||||
autoCloseOnSelect: true,
|
||||
format: 'DD MMM YYYY',
|
||||
minDate: date,
|
||||
onafterselect: function (instance, start, end) {
|
||||
CheckMultiDate(start, searchList.length)
|
||||
}
|
||||
|
||||
});
|
||||
}
|
||||
if (searchList.length >= 5) document.getElementById("addMultiCityForm").style.visibility = 'hidden';
|
||||
|
||||
};
|
||||
|
||||
function CheckMultiDate(Date, index) {
|
||||
var searchList = document.querySelectorAll(".MultiForm")
|
||||
console.log(searchList)
|
||||
for (let i = index; i < searchList.length; i++) {
|
||||
caleran("#MultiCity-" + (i + 1), {
|
||||
singleDate: true,
|
||||
calendarCount: 1,
|
||||
showHeader: false,
|
||||
showFooter: false,
|
||||
autoCloseOnSelect: true,
|
||||
format: 'DD MMM YYYY',
|
||||
minDate: Date._d,
|
||||
onafterselect: function (instance, start, end) {
|
||||
CheckMultiDate(start, (index + 1))
|
||||
}
|
||||
});
|
||||
|
||||
};
|
||||
};
|
||||
|
||||
|
||||
|
||||
function removeMultiCityForm(elem) {
|
||||
elem.closest(".MultiForm").remove();
|
||||
document.getElementById("addMultiCityForm").style.visibility = 'visible';
|
||||
|
||||
};
|
||||
|
||||
let tripKey = 'IRT';
|
||||
function ChangeTab(type) {
|
||||
tripKey = type;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
function hideToaster(element) {
|
||||
setTimeout(function () {
|
||||
element.classList.add('d-none');
|
||||
element.querySelector('span').innerHTML = '';
|
||||
}, 1500);
|
||||
}
|
||||
|
||||
|
||||
|
||||
/// drop down
|
||||
|
||||
async function GetAirlineList(inp) {
|
||||
console.log(inp.value)
|
||||
let html = ''
|
||||
if (inp.value.length >= 2) {
|
||||
const response = await fetch("https://adminapi.uat.futuretravelplatform.com/api/MasterSearch/GetAllAirline/en/" + inp.value, {
|
||||
method: 'GET',
|
||||
headers: { 'Content-Type': 'application/json', 'OrgId': '2206040706597097092' }
|
||||
});
|
||||
if (!response.ok) {
|
||||
throw new Error(`HTTP error! status: ${response.status}`);
|
||||
}
|
||||
const data = await response.json();
|
||||
// = await data;
|
||||
data.map(e => {
|
||||
html += ` <li class="ListOfAirline" data-airline-code='${e.airline_code}'>${e.airline_name} </li>`
|
||||
})
|
||||
|
||||
console.log(data)
|
||||
inp.closest('div').querySelector('.PrefferedAirline').innerHTML = html;
|
||||
};
|
||||
inp.closest('div').querySelector('.PrefferedAirline').classList.remove('aiplineDropdown');
|
||||
}
|
||||
|
||||
function ExchangeValue(elmnt) {
|
||||
let element = elmnt.closest('.toFromSearchWrapper');
|
||||
let From = element.querySelector('.Origin');
|
||||
let To = element.querySelector('.depart');
|
||||
var from1 = From.value;
|
||||
var form2 = From.getAttribute('data-airport-code');
|
||||
element.querySelector('.Origin').value = To.value;
|
||||
element.querySelector('.Origin').setAttribute('data-airport-code', To.getAttribute('data-airport-code'));
|
||||
element.querySelector('.depart').value = from1;
|
||||
element.querySelector('.depart').setAttribute('data-airport-code', form2);
|
||||
}
|
||||
// caleran js for calender
|
||||
|
||||
caleran("#OW_Calender", {
|
||||
singleDate: true,
|
||||
calendarCount: 1,
|
||||
showHeader: false,
|
||||
showFooter: false,
|
||||
autoCloseOnSelect: true,
|
||||
format: 'DD MMM YYYY',
|
||||
minDate: new Date,
|
||||
|
||||
});
|
||||
|
||||
|
||||
var startDate, endDate, startInstance, endInstance;
|
||||
var fillInputs = function () {
|
||||
startInstance.elem.value = startDate ? startDate.locale(startInstance.config.format).format('DD MMM YYYY') : "";
|
||||
endInstance.elem.value = endDate ? endDate.locale(endInstance.config.format).format('DD MMM YYYY') : "";
|
||||
};
|
||||
document.querySelector("#flightStart").value = moment().format('DD MMM YYYY');
|
||||
document.querySelector("#flightEnd").value = moment().format('DD MMM YYYY');
|
||||
caleran("#flightStart", {
|
||||
startEmpty: document.querySelector("#flightStart").value === "",
|
||||
startDate: document.querySelector("#flightStart").value,
|
||||
endDate: document.querySelector("#flightEnd").value,
|
||||
enableKeyboard: false,
|
||||
minDate: new Date,
|
||||
oninit: function (instance) {
|
||||
startInstance = instance;
|
||||
if (!instance.config.startEmpty && instance.config.startDate) {
|
||||
instance.elem.value = instance.config.startDate.locale(instance.config.format).format('DD MMM YYYY');
|
||||
startDate = instance.config.startDate.clone();
|
||||
}
|
||||
|
||||
},
|
||||
onbeforeshow: function (instance) {
|
||||
if (startDate) {
|
||||
startInstance.config.startDate = startDate;
|
||||
endInstance.config.startDate = startDate;
|
||||
}
|
||||
if (endDate) {
|
||||
startInstance.config.endDate = endDate.clone();
|
||||
endInstance.config.endDate = endDate.clone();
|
||||
}
|
||||
fillInputs();
|
||||
instance.updateHeader();
|
||||
instance.reDrawCells();
|
||||
},
|
||||
onfirstselect: function (instance, start) {
|
||||
startDate = start.clone();
|
||||
startInstance.globals.startSelected = false;
|
||||
startInstance.hideDropdown();
|
||||
endInstance.showDropdown();
|
||||
endInstance.config.minDate = startDate.clone();
|
||||
endInstance.config.startDate = startDate.clone();
|
||||
endInstance.config.endDate = null;
|
||||
endInstance.globals.startSelected = true;
|
||||
endInstance.globals.endSelected = false;
|
||||
endInstance.globals.firstValueSelected = true;
|
||||
endInstance.setDisplayDate(start);
|
||||
if (endDate && startDate.isAfter(endDate)) {
|
||||
endInstance.globals.endDate = endDate.clone();
|
||||
}
|
||||
endInstance.updateHeader();
|
||||
endInstance.reDrawCells();
|
||||
fillInputs();
|
||||
}
|
||||
});
|
||||
caleran("#flightEnd", {
|
||||
startEmpty: document.querySelector("#flightEnd").value === "",
|
||||
startDate: document.querySelector("#flightStart").value,
|
||||
endDate: document.querySelector("#flightEnd").value,
|
||||
enableKeyboard: false,
|
||||
autoCloseOnSelect: true,
|
||||
minDate: new Date,
|
||||
oninit: function (instance) {
|
||||
endInstance = instance;
|
||||
if (!instance.config.startEmpty && instance.config.endDate) {
|
||||
instance.elem.value = (instance.config.endDate.locale(instance.config.format).format('DD MMM YYYY'));
|
||||
endDate = instance.config.endDate.clone();
|
||||
}
|
||||
},
|
||||
onbeforeshow: function (instance) {
|
||||
if (startDate) {
|
||||
startInstance.config.startDate = startDate;
|
||||
endInstance.config.startDate = startDate;
|
||||
}
|
||||
if (endDate) {
|
||||
startInstance.config.endDate = endDate.clone();
|
||||
endInstance.config.endDate = endDate.clone();
|
||||
}
|
||||
fillInputs();
|
||||
instance.updateHeader();
|
||||
instance.reDrawCells();
|
||||
},
|
||||
onafterselect: function (instance, start, end) {
|
||||
startDate = start.clone();
|
||||
endDate = end.clone();
|
||||
endInstance.hideDropdown();
|
||||
startInstance.config.endDate = endDate.clone();
|
||||
startInstance.globals.firstValueSelected = true;
|
||||
fillInputs();
|
||||
endInstance.globals.startSelected = true;
|
||||
endInstance.globals.endSelected = false;
|
||||
|
||||
}
|
||||
});
|
||||
|
||||
// Flight Search query string
|
||||
|
||||
function Searchflight(elem) {
|
||||
let checkValidation = true;
|
||||
|
||||
let main_div = elem.closest('.CommonSearch');
|
||||
let airlinelist = document.querySelectorAll(".airlinelist");
|
||||
let airline_code = [];
|
||||
if (airlinelist.length != 0) {
|
||||
airlinelist.forEach(e => {
|
||||
airline_code.push(e.getAttribute('data-airline-code'));
|
||||
});
|
||||
}
|
||||
var querystring = {
|
||||
"adult": TravellerDetails.Adult,
|
||||
"child": TravellerDetails.child,
|
||||
"infant": TravellerDetails.Infant,
|
||||
"langcode": "EN",
|
||||
"ref": document.getElementById('Refundable').checked,
|
||||
"direct": document.getElementById('DirectFlights').checked,
|
||||
"key": tripKey,
|
||||
"triptype": CheckTriptype(tripKey),
|
||||
'curr': 'AED',
|
||||
"airlines": airline_code.length != 0 ? airline_code.join(',') : '',
|
||||
}
|
||||
|
||||
let cl = checkClassType()
|
||||
let origin = main_div.querySelector('.Origin').getAttribute("data-airport-code");
|
||||
let depart = main_div.querySelector('.depart').getAttribute("data-airport-code");
|
||||
if (tripKey == 'OW' || tripKey == 'IRT') {
|
||||
let list = tripKey == 'OW' ? 1 : 2
|
||||
for (let i = 0; i < list; i++) {
|
||||
let start = tripKey == 'OW' ? document.getElementById('OW_Calender').value : document.getElementById('flightStart').value
|
||||
if (!validator(origin, depart)) {
|
||||
checkValidation = false
|
||||
}
|
||||
let end = document.getElementById('flightEnd').value
|
||||
querystring[`dep${i + 1}`] = i == 0 ? origin : depart;
|
||||
querystring[`ret${i + 1}`] = i == 0 ? depart : origin;
|
||||
querystring[`cl${i + 1}`] = cl;
|
||||
querystring[`dtt${i + 1}`] = tripKey == 'OW' ? moment(start).format('DD-MMM-YYYY') : i == 0 ? moment(start).format('DD-MMM-YYYY') : moment(end).format('DD-MMM-YYYY');
|
||||
}
|
||||
} else if (tripKey == 'NMC') {
|
||||
var searchList = main_div.querySelectorAll(".MultiForm");
|
||||
searchList.forEach((e, i) => {
|
||||
let Origin = e.getElementsByClassName('Origin')[0].getAttribute("data-airport-code");
|
||||
let depart = e.getElementsByClassName('depart')[0].getAttribute("data-airport-code");
|
||||
if (!validator(Origin, depart)) {
|
||||
checkValidation = false
|
||||
}
|
||||
querystring[`dep${i + 1}`] = Origin;
|
||||
querystring[`ret${i + 1}`] = depart;
|
||||
querystring[`dtt${i + 1}`] = moment(e.querySelector(`#MultiCity-${i + 1}`).value).format('DD-MMM-YYYY'); // changes
|
||||
querystring[`cl${i + 1}`] = cl;
|
||||
})
|
||||
}
|
||||
if (!checkValidation) {
|
||||
return
|
||||
}
|
||||
sessionStorage.setItem('SerachReqQueryObj', JSON.stringify(querystring));
|
||||
const urlParams = new URLSearchParams(window.location.search);
|
||||
var query = Object.keys(querystring).map(key => key + '=' + querystring[key]).join('&');
|
||||
window.location.href = 'https://travel.neuholidays.com/Flight/search?' + query;
|
||||
}
|
||||
|
||||
|
||||
// validation
|
||||
|
||||
function validator(origin, depart) {
|
||||
let element = document.getElementsByClassName('toast-warning')[0]
|
||||
if (origin == depart) {
|
||||
element.classList.remove('d-none')
|
||||
element.querySelector('span').innerHTML = 'Departure must be different from arrival'
|
||||
hideToaster(element)
|
||||
return false
|
||||
} if (!origin || !depart) {
|
||||
element.classList.remove('d-none')
|
||||
element.querySelector('span').innerHTML = 'Please enter departure and arrival city or airport'
|
||||
hideToaster(element)
|
||||
return false
|
||||
} else return true
|
||||
};
|
||||
|
||||
// common function
|
||||
|
||||
function CheckTriptype(tripKey) {
|
||||
if (tripKey == 'NMC') {
|
||||
return '3'
|
||||
} else if (tripKey == 'IRT') {
|
||||
return '2'
|
||||
} else if (tripKey == 'OW') {
|
||||
return '1'
|
||||
}
|
||||
};
|
||||
|
||||
function checkClassType() {
|
||||
if (TravellerDetails.classType == 'FirstClass') {
|
||||
return 'F'
|
||||
} else if (TravellerDetails.classType == 'BusinessClass') {
|
||||
return 'C'
|
||||
} else if (TravellerDetails.classType == 'PremiumEconomy') {
|
||||
return 'W'
|
||||
} else if (TravellerDetails.classType == 'Economy') {
|
||||
return 'Y'
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/// multi selector
|
||||
|
||||
function Close(e) {
|
||||
e.closest('.multiSelect').querySelector(".SelectList").classList.remove("ShowAirlineList");
|
||||
e.closest("span").remove();
|
||||
let check = document.querySelectorAll(".airlinelist");
|
||||
if (check.length == 0) {
|
||||
e.closest('.multiSelect').querySelector(".SearchBox").classList.add('multiInp')
|
||||
}
|
||||
}
|
||||
function showAirlineList(elem) {
|
||||
elem.closest('.multiSelect').querySelector(".SelectList").classList.add("ShowAirlineList");
|
||||
elem.closest('.multiSelect').querySelector("input").focus();
|
||||
}
|
||||
function bindAirLine(airlinelist, elem) {
|
||||
let html = "";
|
||||
airlinelist.map((e, i) => {
|
||||
html += ` <li class="option ${i == 0 ? 'selectAirline' : ''}" onclick="AddAirline(this)" data-airline-code='${e.airline_code}' data-airline-name='${e.airline_name}'>(${e.airline_code}) ${e.airline_name} </li>`
|
||||
})
|
||||
elem.closest('.SelectList').querySelector('.ListItem').innerHTML = html;
|
||||
}
|
||||
|
||||
async function GetAirlineDetails(elem) {
|
||||
let key = window.event
|
||||
let list = document.getElementsByClassName('selectAirline') ? document.getElementsByClassName('selectAirline')[0] : '';
|
||||
if (list) {
|
||||
if (key.keyCode == 38) {
|
||||
console.log('low')
|
||||
var prev = list.previousElementSibling;
|
||||
if (prev) {
|
||||
list.classList.remove("selectAirline");
|
||||
prev.classList.add("selectAirline");
|
||||
}
|
||||
} else if (key.keyCode == 40) {
|
||||
console.log('high')
|
||||
var next = list.nextElementSibling;
|
||||
if (next) {
|
||||
list.classList.remove("selectAirline");
|
||||
next.classList.add("selectAirline");
|
||||
};
|
||||
};
|
||||
};
|
||||
let val = elem.value;
|
||||
if (val.length >= 2 && !(key.keyCode == 38) && !(key.keyCode == 40)) {
|
||||
const response = await fetch("https://adminapi.uat.futuretravelplatform.com/api/MasterSearch/GetAllAirline/en/" + val, {
|
||||
method: 'GET',
|
||||
headers: { 'Content-Type': 'application/json', 'OrgId': '2206040706597097092' }
|
||||
});
|
||||
if (!response.ok) {
|
||||
throw new Error(`HTTP error! status: ${response.status}`);
|
||||
}
|
||||
const data = await response.json();
|
||||
let obj = await data;
|
||||
obj ? bindAirLine(obj, elem) : ''
|
||||
}
|
||||
if (key.keyCode == 13) {
|
||||
AddAirline(document.getElementsByClassName('selectAirline')[0])
|
||||
}
|
||||
|
||||
};
|
||||
|
||||
function AddAirline(val) {
|
||||
let check = document.querySelectorAll(".airlinelist");
|
||||
if (check.length <= 2) {
|
||||
let code = val.getAttribute("data-airline-code");
|
||||
let name = val.getAttribute("data-airline-name");
|
||||
let html = ` <span class='airlinelist' data-airline-code="${code}"> (${code}) ${name}
|
||||
<button onclick="Close(this)">x</button>
|
||||
</span>`;
|
||||
val.closest('.multiSelect').querySelector(".SearchBox").insertAdjacentHTML("beforeend", html);
|
||||
let maindiv = val.closest('.multiSelect').querySelector('input')
|
||||
val.closest('.multiSelect').querySelector("input").value = '';
|
||||
val.closest('div').classList.remove("ShowAirlineList");
|
||||
val.closest('.multiSelect').querySelector(".SearchBox").classList.remove('multiInp');
|
||||
val.remove();
|
||||
bindAirLine([], maindiv);
|
||||
}
|
||||
|
||||
};
|
||||
|
||||
|
||||
function resetAllPaxCounter() {
|
||||
document.getElementById("infant").value = 0;
|
||||
document.getElementById("child").value = 0;
|
||||
document.getElementById("adult").value = 1;
|
||||
TravellerDetails.Adult = 1;
|
||||
TravellerDetails.child = 0;
|
||||
TravellerDetails.Infant = 0;
|
||||
ClassType(document.getElementsByClassName('EconomyClass')[0] , 'Economy');
|
||||
|
||||
};
|
||||
@@ -0,0 +1,514 @@
|
||||
|
||||
function roomCount() {
|
||||
document.getElementById("roomPax").classList.add("showRoomPax");
|
||||
}
|
||||
|
||||
function addmore_rooms() {
|
||||
var rooms = document.querySelectorAll(".HotelNoRoomWrapper");
|
||||
html = "";
|
||||
let RemoveHtml = `
|
||||
<div class="closeRoomCard" onclick="RemoveRoom(this)">
|
||||
<span class="material-icons"> close </span>
|
||||
</div> `
|
||||
|
||||
if (rooms.length < 6) {
|
||||
html = `<div class="HotelNoRoomWrapper">
|
||||
<div class="HotelNoRoomTitle">
|
||||
<span class="material-icons"> local_hotel </span>
|
||||
<h4 class="Rooms_no">Room ${rooms.length + 1}</h4>
|
||||
</div>
|
||||
<div class="HotelNoRoomCount AdultPax">
|
||||
<div class="HotelTravelerSteps">
|
||||
<button class="opacity" onclick="AddAdultPax(this , false)">
|
||||
<span class="material-icons"> remove </span>
|
||||
</button>
|
||||
<input type="text" value="1" autocomplete="off" readonly />
|
||||
<button onclick="AddAdultPax(this , true)">
|
||||
<span class="material-icons"> add </span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="HotelNoRoomCount ChildPax">
|
||||
<div class="HotelTravelerSteps">
|
||||
<button class="opacity" onclick="AddChildPax(this , false)">
|
||||
<span class="material-icons"> remove </span>
|
||||
</button>
|
||||
<input type="text" value="0" autocomplete="off" readonly />
|
||||
<button onclick="AddChildPax(this , true)">
|
||||
<span class="material-icons"> add </span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="HotelNoageChild">
|
||||
|
||||
</div>
|
||||
${rooms.length != 0 ? RemoveHtml : ''}
|
||||
</div> `
|
||||
}
|
||||
if (rooms.length >= 5) document.getElementById('MoreOption').querySelector('.addMoreTravller').classList.add("HotelPaxSelectOption");
|
||||
document.getElementById('MoreOption').querySelector('.addMoreTravller').insertAdjacentHTML("beforebegin", html)
|
||||
TravellerCounter('');
|
||||
}
|
||||
addmore_rooms();
|
||||
|
||||
|
||||
function RemoveRoom(elem) {
|
||||
elem.closest(".HotelNoRoomWrapper").remove();
|
||||
let allRoom = document.querySelectorAll(".HotelNoRoomWrapper")
|
||||
allRoom.forEach((e, i) => {
|
||||
e.querySelector('.Rooms_no').innerHTML = `Room ${i + 1} `
|
||||
});
|
||||
TravellerCounter('');
|
||||
document.getElementById('MoreOption').querySelector('.addMoreTravller').classList.remove("HotelPaxSelectOption");
|
||||
};
|
||||
|
||||
|
||||
function AddChildPax(elem, check) {
|
||||
|
||||
if (check) {
|
||||
if (elem.previousElementSibling.value <= 3) {
|
||||
elem.previousElementSibling.value++
|
||||
elem.previousElementSibling.previousElementSibling.disabled = false
|
||||
elem.previousElementSibling.previousElementSibling.style.opacity = '1'
|
||||
children_number(elem, check, elem.previousElementSibling.value)
|
||||
TravellerCounter('');
|
||||
} if (elem.previousElementSibling.value == 4) {
|
||||
elem.disabled = true;
|
||||
elem.style.opacity = '0.6';
|
||||
}
|
||||
} else {
|
||||
if (elem.nextElementSibling.value >= 1) {
|
||||
elem.nextElementSibling.nextElementSibling.disabled = false;
|
||||
elem.nextElementSibling.nextElementSibling.style.opacity = '1';
|
||||
elem.nextElementSibling.value--;
|
||||
children_number(elem, check, elem.nextElementSibling.value);
|
||||
TravellerCounter('');
|
||||
} if (elem.nextElementSibling.value == 0) {
|
||||
elem.disabled = true;
|
||||
elem.style.opacity = '0.6';
|
||||
}
|
||||
}
|
||||
if (true) {
|
||||
if (document.querySelector('.child_1')) {
|
||||
document.querySelector('.Child-one').classList.remove('d-none');;
|
||||
} else document.querySelector('.Child-one').classList.add('d-none');
|
||||
if (document.querySelector('.child_2')) {
|
||||
document.querySelector('.Child-two').classList.remove('d-none');
|
||||
} else document.querySelector('.Child-two').classList.add('d-none');
|
||||
if (document.querySelector('.child_3')) {
|
||||
document.querySelector('.Child-three').classList.remove('d-none');
|
||||
} else document.querySelector('.Child-three').classList.add('d-none');
|
||||
if (document.querySelector('.child_4')) {
|
||||
document.querySelector('.Child-four').classList.remove('d-none');
|
||||
} else document.querySelector('.Child-four').classList.add('d-none');
|
||||
}
|
||||
};
|
||||
function AddAdultPax(elem, check) {
|
||||
|
||||
if (check) {
|
||||
if (elem.previousElementSibling.value <= 5) {
|
||||
elem.previousElementSibling.value++;
|
||||
elem.previousElementSibling.previousElementSibling.disabled = false;
|
||||
elem.previousElementSibling.previousElementSibling.style.opacity = '1';
|
||||
TravellerCounter('');
|
||||
} if (elem.previousElementSibling.value == 6) {
|
||||
|
||||
elem.disabled = true;
|
||||
elem.style.opacity = '0.6';
|
||||
}
|
||||
} else {
|
||||
if (elem.nextElementSibling.value >= 2) {
|
||||
elem.nextElementSibling.value--;
|
||||
elem.nextElementSibling.nextElementSibling.disabled = false;
|
||||
elem.nextElementSibling.nextElementSibling.style.opacity = '1';
|
||||
TravellerCounter('');
|
||||
} if (elem.nextElementSibling.value == 1) {
|
||||
elem.disabled = true;
|
||||
elem.style.opacity = '0.6';
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
|
||||
|
||||
|
||||
function apply_people(elem) {
|
||||
if (elem) {
|
||||
TravellerCounter(elem.getAttribute('data-room'))
|
||||
document.getElementById("roomPax").classList.remove("showRoomPax");
|
||||
if (elem.getAttribute('data-room') == "addmore") {
|
||||
document.getElementById("MoreOption").classList.remove("moreOptionWrapper")
|
||||
} else document.getElementById("MoreOption").classList.add("moreOptionWrapper")
|
||||
}
|
||||
};
|
||||
|
||||
|
||||
var RoomDetails = []
|
||||
function TravellerCounter(optionType) {
|
||||
console.log(RoomDetails)
|
||||
let searchRooms = [];
|
||||
let totalRooms = "";
|
||||
|
||||
if (optionType === "1Room2Adult") {
|
||||
let array_age = [];
|
||||
let data = {
|
||||
"adult": "2",
|
||||
"child": "0",
|
||||
"childAge": array_age
|
||||
}
|
||||
searchRooms.push(data);
|
||||
totalRooms = "1";
|
||||
} else if (optionType === "1Room1Adult") {
|
||||
let array_age = [];
|
||||
let data = {
|
||||
"adult": "1",
|
||||
"child": "0",
|
||||
"childAge": array_age
|
||||
}
|
||||
totalRooms = "1";
|
||||
searchRooms.push(data);
|
||||
} else {
|
||||
let roomElem = [...document.querySelector('#MoreOption').querySelectorAll('.HotelNoRoomWrapper')];
|
||||
let roomData = roomElem.map(e => {
|
||||
let adultVal = e.querySelector('.AdultPax').querySelector('input').value;
|
||||
let childVal = e.querySelector('.ChildPax').querySelector('input').value;
|
||||
let html = e.querySelector('.HotelNoageChild').querySelectorAll('.HotelNoageSelect');
|
||||
let array_age = [...html].map(elem => elem.querySelector('.select_control').value);
|
||||
return {
|
||||
'adult': adultVal,
|
||||
'child': childVal,
|
||||
'childAge': array_age
|
||||
}
|
||||
});
|
||||
searchRooms = [...roomData];
|
||||
totalRooms = searchRooms.length;
|
||||
}
|
||||
RoomDetails = searchRooms;
|
||||
getRoomsInfo(searchRooms);
|
||||
}
|
||||
TravellerCounter('1Room2Adult')
|
||||
|
||||
function getRoomsInfo(rooms) {
|
||||
let roomsInfo = rooms.reduce((acc, elem) =>
|
||||
(
|
||||
{
|
||||
Adult: parseInt(acc.Adult) + parseInt(elem.adult),
|
||||
Child: parseInt(acc.Child) + parseInt(elem.child)
|
||||
})
|
||||
, ({ Adult: 0, Child: 0 }));
|
||||
roomsInfo['Rooms'] = rooms.length;
|
||||
console.log(roomsInfo)
|
||||
document.getElementById('RoomCount').value = `${rooms.length} Room, ${roomsInfo.Adult} Adult ${roomsInfo.Child > 0 ? ', ' + roomsInfo.Child + ' Child' : ''}`;
|
||||
}
|
||||
|
||||
|
||||
// child count
|
||||
|
||||
function children_number(elem, check, index) {
|
||||
let html = "";
|
||||
console.log(index)
|
||||
if (check) {
|
||||
html += ` <div class="HotelNoageSelect child_${index}">
|
||||
<select class="select_control" onchange="TravellerCounter('')">
|
||||
<option value="1">Under 1</option>
|
||||
<option value="2">2 </option>
|
||||
<option value="3">3</option>
|
||||
<option value="4">4</option>
|
||||
<option value="5">5</option>
|
||||
<option value="6">6</option>
|
||||
<option value="7">7</option>
|
||||
<option value="8">8</option>
|
||||
<option value="9">9</option>
|
||||
<option value="10">10</option>
|
||||
<option value="11">11</option>
|
||||
</select>
|
||||
</div>
|
||||
`;
|
||||
elem.closest(".HotelNoRoomWrapper").querySelector(".HotelNoageChild").insertAdjacentHTML("beforeend", html)
|
||||
} else {
|
||||
let elemet = elem.closest(".HotelNoRoomWrapper").querySelectorAll(".HotelNoageSelect");
|
||||
let ind =
|
||||
elemet.length - 1
|
||||
elemet[ind].remove();
|
||||
}
|
||||
TravellerCounter('');
|
||||
};
|
||||
|
||||
|
||||
// hote api
|
||||
|
||||
let HotelList = [];
|
||||
let NationalityList = [];
|
||||
getBindHotelList()
|
||||
async function getBindHotelList(inp) {
|
||||
const response = await fetch("https://adminapi.uat.futuretravelplatform.com/api/CityMaster/GetSelectedCity?cityCode=39942,12568,41325,38997,33324&LangCode=EN", {
|
||||
method: 'GET',
|
||||
headers: { 'Content-Type': 'application/json', 'OrgId': '2206040706597097092' }
|
||||
});
|
||||
if (!response.ok) {
|
||||
throw new Error(`HTTP error! status: ${response.status}`);
|
||||
}
|
||||
const data = await response.json();
|
||||
HotelList = data
|
||||
console.log(data)
|
||||
|
||||
}
|
||||
// onkeyup
|
||||
|
||||
async function GethotelList(Input) {
|
||||
if (Input.value.length >= 2) {
|
||||
const response = await fetch("https://hotelapi.uat.futuretravelplatform.com/api/hotel/location?searchKey=" + Input.value + "&langCode=EN", {
|
||||
method: 'GET',
|
||||
headers: { 'Content-Type': 'application/json', 'OrgId': '2206040706597097092' }
|
||||
});
|
||||
if (!response.ok) {
|
||||
throw new Error(`HTTP error! status: ${response.status}`);
|
||||
}
|
||||
const data = await response.json();
|
||||
HotelList = data
|
||||
autoHotelListbind(Input)
|
||||
console.log(data)
|
||||
}
|
||||
}
|
||||
|
||||
// bind hotel list
|
||||
|
||||
function ShowHotelList(element) {
|
||||
element.closest(".HotelSearchDestination").querySelector(".hideInput") ? element.closest(".HotelSearchDestination").querySelector(".hideInput").classList.remove('hideInput') : ''
|
||||
autoHotelListbind(element)
|
||||
}
|
||||
function autoHotelListbind(element) {
|
||||
let html = '';
|
||||
HotelList.map(e => {
|
||||
html += `
|
||||
<div class="HotelSearchOtionContent" onclick="ApplyHotelCity(this)">
|
||||
<span class="material-icons"> location_on </span>
|
||||
<a data-countryCode="${e.countryCode}" data-cityCode="${e.cityCode}" data-city_Id="${e.city_Id}" data-cityName="${e.cityName}" data-displayName="${e.displayName}"> ${e.displayName}</a>
|
||||
</div>`
|
||||
});
|
||||
element.closest(".HotelSearchDestination").querySelector(".HotelList").innerHTML = html;
|
||||
}
|
||||
|
||||
function ApplyHotelCity(elem) {
|
||||
console.log(elem)
|
||||
let countryCode = elem.querySelector('a').getAttribute('data-countryCode');
|
||||
let cityCode = elem.querySelector('a').getAttribute('data-cityCode');
|
||||
let city_Id = elem.querySelector('a').getAttribute('data-city_Id');
|
||||
let displayName = elem.querySelector('a').getAttribute('data-displayName');
|
||||
|
||||
let input = document.getElementById('FromHotel');
|
||||
input.value = displayName;
|
||||
input.setAttribute("data-countryCode", countryCode);
|
||||
input.setAttribute("data-cityCode", cityCode);
|
||||
input.setAttribute("data-city_Id", city_Id);
|
||||
|
||||
elem.closest('.HotelDestination').classList.add('hideInput');
|
||||
};
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
/// nationality list bind
|
||||
|
||||
function showNationality(elem) {
|
||||
elem.closest('.HotelSearchFormNationality').querySelector('.HotelNationality').classList.remove('hideInput');
|
||||
autonationalityListbind(elem);
|
||||
}
|
||||
|
||||
getBindNationalityList()
|
||||
async function getBindNationalityList() {
|
||||
const response = await fetch("https://adminapi.uat.futuretravelplatform.com/api/CountryMaster/GetSelectedCountry/EN/MA,TN,NG,EG,AE,SA,BH,QA,KW,OM", {
|
||||
method: 'GET',
|
||||
headers: { 'Content-Type': 'application/json', 'OrgId': '2206040706597097092' }
|
||||
});
|
||||
if (!response.ok) {
|
||||
throw new Error(`HTTP error! status: ${response.status}`);
|
||||
}
|
||||
const data = await response.json();
|
||||
NationalityList = data
|
||||
}
|
||||
|
||||
async function GetNationalityList(Input) {
|
||||
if (Input.value) {
|
||||
const response = await fetch("https://adminapi.uat.futuretravelplatform.com/api/MasterSearch/GetAllCountry/EN/" + Input.value, {
|
||||
method: 'GET',
|
||||
headers: { 'Content-Type': 'application/json', 'OrgId': '2206040706597097092' }
|
||||
});
|
||||
if (!response.ok) {
|
||||
throw new Error(`HTTP error! status: ${response.status}`);
|
||||
}
|
||||
const data = await response.json();
|
||||
NationalityList = data
|
||||
autonationalityListbind(Input)
|
||||
}
|
||||
}
|
||||
|
||||
function autonationalityListbind(elem) {
|
||||
let html = '';
|
||||
NationalityList.map(e => {
|
||||
html += `
|
||||
<div class="HotelSearchOtionContent" onclick="ApplyNationality(this)">
|
||||
<span class="material-icons"> location_on </span>
|
||||
<a data-countryCode="${e.country_code}" data-countryName="${e.country_name}" > ${e.country_name}</a>
|
||||
</div>`
|
||||
});
|
||||
elem.closest('.HotelSearchFormNationality').querySelector('.NationalityList').innerHTML = html;
|
||||
}
|
||||
|
||||
function ApplyNationality(elem) {
|
||||
let citycode = elem.querySelector('a').getAttribute('data-countryCode');
|
||||
let countryName = elem.querySelector('a').getAttribute('data-countryName');
|
||||
document.getElementById('FromNationality').value = countryName;
|
||||
document.getElementById('FromNationality').setAttribute('data-countryCode', citycode);
|
||||
elem.closest('.HotelNationality').classList.add('hideInput');
|
||||
}
|
||||
|
||||
// caleran js for calender
|
||||
|
||||
|
||||
var startDate, endDate, HotelStartInstance, HotelEndInstance;
|
||||
var HotelFillInputs = function () {
|
||||
HotelStartInstance.elem.value = startDate ? startDate.locale(HotelStartInstance.config.format).format('DD MMM YYYY') : "";
|
||||
HotelEndInstance.elem.value = endDate ? endDate.locale(HotelEndInstance.config.format).format('DD MMM YYYY') : "";
|
||||
};
|
||||
document.querySelector("#hotelStart").value = moment().format('DD MMM YYYY');
|
||||
document.querySelector("#hotelEnd").value = moment().format('DD MMM YYYY');
|
||||
caleran("#hotelStart", {
|
||||
startEmpty: document.querySelector("#hotelStart").value === "",
|
||||
startDate: document.querySelector("#hotelStart").value,
|
||||
endDate: document.querySelector("#hotelEnd").value,
|
||||
enableKeyboard: false,
|
||||
minDate: new Date,
|
||||
oninit: function (instance) {
|
||||
HotelStartInstance = instance;
|
||||
if (!instance.config.startEmpty && instance.config.startDate) {
|
||||
instance.elem.value = instance.config.startDate.locale(instance.config.format).format('DD MMM YYYY');
|
||||
startDate = instance.config.startDate.clone();
|
||||
}
|
||||
},
|
||||
onbeforeshow: function (instance) {
|
||||
if (startDate) {
|
||||
HotelStartInstance.config.startDate = startDate;
|
||||
HotelEndInstance.config.startDate = startDate;
|
||||
}
|
||||
if (endDate) {
|
||||
HotelStartInstance.config.endDate = endDate.clone();
|
||||
HotelEndInstance.config.endDate = endDate.clone();
|
||||
}
|
||||
HotelFillInputs();
|
||||
instance.updateHeader();
|
||||
instance.reDrawCells();
|
||||
},
|
||||
onfirstselect: function (instance, start) {
|
||||
startDate = start.clone();
|
||||
HotelStartInstance.globals.startSelected = false;
|
||||
HotelStartInstance.hideDropdown();
|
||||
HotelEndInstance.showDropdown();
|
||||
HotelEndInstance.config.minDate = startDate.clone();
|
||||
HotelEndInstance.config.startDate = startDate.clone();
|
||||
HotelEndInstance.config.endDate = null;
|
||||
HotelEndInstance.globals.startSelected = true;
|
||||
HotelEndInstance.globals.endSelected = false;
|
||||
HotelEndInstance.globals.firstValueSelected = true;
|
||||
HotelEndInstance.setDisplayDate(start);
|
||||
if (endDate && startDate.isAfter(endDate)) {
|
||||
HotelEndInstance.globals.endDate = endDate.clone();
|
||||
}
|
||||
HotelEndInstance.updateHeader();
|
||||
HotelEndInstance.reDrawCells();
|
||||
HotelFillInputs();
|
||||
}
|
||||
|
||||
});
|
||||
caleran("#hotelEnd", {
|
||||
startEmpty: document.querySelector("#hotelEnd").value === "",
|
||||
startDate: document.querySelector("#hotelStart").value,
|
||||
endDate: document.querySelector("#hotelEnd").value,
|
||||
enableKeyboard: false,
|
||||
autoCloseOnSelect: true,
|
||||
minDate: new Date,
|
||||
oninit: function (instance) {
|
||||
HotelEndInstance = instance;
|
||||
if (!instance.config.startEmpty && instance.config.endDate) {
|
||||
instance.elem.value = (instance.config.endDate.locale(instance.config.format).format('DD MMM YYYY'));
|
||||
endDate = instance.config.endDate.clone();
|
||||
}
|
||||
calcNumberOfNights(startDate, endDate)
|
||||
},
|
||||
onbeforeshow: function (instance) {
|
||||
if (startDate) {
|
||||
HotelStartInstance.config.startDate = startDate;
|
||||
HotelEndInstance.config.startDate = startDate;
|
||||
}
|
||||
if (endDate) {
|
||||
HotelStartInstance.config.endDate = endDate.clone();
|
||||
HotelEndInstance.config.endDate = endDate.clone();
|
||||
}
|
||||
HotelFillInputs();
|
||||
instance.updateHeader();
|
||||
instance.reDrawCells();
|
||||
},
|
||||
onafterselect: function (instance, start, end) {
|
||||
startDate = start.clone();
|
||||
endDate = end.clone();
|
||||
HotelEndInstance.hideDropdown();
|
||||
HotelStartInstance.config.endDate = endDate.clone();
|
||||
HotelStartInstance.globals.firstValueSelected = true;
|
||||
HotelFillInputs();
|
||||
HotelEndInstance.globals.startSelected = true;
|
||||
HotelEndInstance.globals.endSelected = false;
|
||||
calcNumberOfNights(startDate, endDate)
|
||||
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
// hotel search query string
|
||||
|
||||
function searchHotel() {
|
||||
let hotelDetails = document.getElementById('FromHotel')
|
||||
let Nationality = document.getElementById('FromNationality').getAttribute('data-countryCode')
|
||||
let element = document.getElementsByClassName('toast-warning')[0]
|
||||
if (!hotelDetails) {
|
||||
element.classList.remove('d-none')
|
||||
element.querySelector('span').innerHTML = 'Please enter destination city'
|
||||
hideToaster(element)
|
||||
return
|
||||
}
|
||||
if (!Nationality) {
|
||||
element.classList.remove('d-none')
|
||||
element.querySelector('span').innerHTML = 'Please select nationality'
|
||||
hideToaster(element)
|
||||
return
|
||||
}
|
||||
let queryParams = {};
|
||||
queryParams['CityCode'] = hotelDetails.getAttribute('data-cityCode');
|
||||
queryParams['CityId'] = hotelDetails.getAttribute('data-city_Id');
|
||||
queryParams['Country'] = hotelDetails.getAttribute('data-countryCode');
|
||||
queryParams['nationality'] = Nationality;
|
||||
queryParams['langCode'] = 'EN';
|
||||
queryParams['checkinDate'] = moment(document.getElementById('hotelStart').value).format('DD-MMM-YYYY');
|
||||
queryParams['checkoutDate'] = moment(document.getElementById('hotelEnd').value).format('DD-MMM-YYYY');
|
||||
|
||||
RoomDetails.map((e, i) => {
|
||||
let room = []
|
||||
room.push(parseInt(e.adult))
|
||||
room.push(parseInt(e.child))
|
||||
room.push(...e.childAge.map(no => parseInt(no)))
|
||||
let roomdetails = room.join('-')
|
||||
console.log(roomdetails)
|
||||
queryParams[`room${i + 1}`] = roomdetails
|
||||
})
|
||||
// sessionStorage.setItem('SerachReqQueryObj', JSON.stringify(querystring));
|
||||
const urlParams = new URLSearchParams(window.location.search);
|
||||
var query = Object.keys(queryParams).map(key => key + '=' + queryParams[key]).join('&');
|
||||
window.location.href = 'https://travel.neuholidays.com/hotel/result?' + query;
|
||||
|
||||
};
|
||||
|
||||
function calcNumberOfNights(checkInDate, checkOutDate) {
|
||||
let night = moment(checkOutDate).diff(checkInDate, 'days');
|
||||
document.getElementsByClassName('nightCountgBox')[0].querySelector('.nightNum').innerHTML = night;
|
||||
};
|
||||
File diff suppressed because it is too large
Load Diff
Vendored
+2
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
Vendored
+1216
File diff suppressed because it is too large
Load Diff
Reference in New Issue
Block a user