NOTES | book-the-best

<div class="spinner" id="preloader">
<div class="bounce1"></div>
<div class="bounce2"></div>
<div class="bounce3"></div>
</div>
<script type="text/javascript">
(function(){
var preload = document.getElementById("preloader");
var loading = 0;
var id = setInterval(frame, 64);
function frame(){
if(loading == 100){
clearInterval(id);
} else {
loading = loading + 1;
if(loading == 90){
preload.style.opacity = "0";
}
}
}
})();
</script>
<style>
.spinner {
position: absolute;
height: 2em;
width: 2em;
overflow: show;
margin: auto;
top: 0;
left: 0;
bottom: 0;
right: 0;
width: 70px;
text-align: center;
}
.spinner > div {
width: 18px;
height: 18px;
background-color: #36B5CD;
border-radius: 100%;
display: inline-block;
-webkit-animation: sk-bouncedelay 1.4s infinite ease-in-out both;
animation: sk-bouncedelay 1.4s infinite ease-in-out both;
}
.spinner .bounce1 {
-webkit-animation-delay: -0.32s;
animation-delay: -0.32s;
}
.spinner .bounce2 {
-webkit-animation-delay: -0.16s;
animation-delay: -0.16s;
}
@-webkit-keyframes sk-bouncedelay {
0%, 80%, 100% { -webkit-transform: scale(0) }
40% { -webkit-transform: scale(1.0) }
}
@keyframes sk-bouncedelay {
0%, 80%, 100% {
-webkit-transform: scale(0);
transform: scale(0);
} 40% {
-webkit-transform: scale(1.0);
transform: scale(1.0);
}
}
</style>

ALL in dropdown

For the first, just add another value to the list - with label ALL and some value placeholder, for instance '-'

Then in the onChange event do an if, like -

export function dropdown1_onChange(event) {

let value = $w('#dropdown1').value;

if (value === '-') // run query without filter

else // run query with filter

}

import wixWindow from 'wix-window';

import {session} from 'wix-storage';

import {autocomplete} from 'backend/gapi';

import {details} from 'backend/gapi';

import {reverse} from 'backend/gapi';

import {

sendEmail, sendEmailWithRecipient

}

from 'backend/email';

$w.onReady(function () {

$w("#dataset1").onAfterSave(sendFormData);

$w("#repeater1").onItemReady( ($w, itemData) => {

const text1 = $w("#text64");

text1.text = itemData.text1;

const text2 = $w("#text65");

text2.text = itemData.text2;

});

$w("#repeater3").onItemReady( ($w, itemData) => {

const text5 = $w("#text70");

text5.text = itemData.text5;

const text6 = $w("#text69");

text6.text = itemData.text6;

});

$w("#repeater1").collapse(); // hidden on page load

$w("#repeater3").collapse(); // hidden on page load

// handle each location detail line

$w("#repeater2").onItemReady( ($w, itemData) => {

const text3 = $w("#text66");

text3.text = itemData.text3;

const text4 = $w("#text67");

text4.text = itemData.text4;

});

$w("#repeater2").hide(); // hidden on page load

// retrieve saved location (if exists) from local storage

//let id = session.getItem("place_id");

//if(id === undefined || id === null || id.length === 0) {

// if no location saved, find the IP-based geographic location

//geoloc();

//}

//else {

// if a location was saved in local storage, get the details

//set_details(id);

//}

});

export function Destination_keyPress(event, $w) {

// clear the details display of the old location

wixWindow.scrollTo(10, 502);

$w("#repeater2").data = [];

$w("#repeater2").hide();

if ($w('#Destination').value === "")

$w('#repeater1').collapse();

// get the user's latest input

let val = $w("#Destination").value;

let key = event.key;

if(key.length === 1) {

val += key;

}

if(val.length === 0)

return;

// use the current value to get a list of location suggestions

// we call the autocomplete() web module from the backend

autocomplete(val).then(function(resp) {

// create an array of suggestions for the repeater

let predictions = resp.predictions;

let suggestions = [];

predictions.forEach(function(prediction) {

let item = {"_id" : prediction.id, "text1" : prediction.description, "text2" : prediction.place_id};

suggestions.push(item);

});

$w("#repeater1").data = suggestions; // add the suggestions to the repeater

$w("#repeater1").expand(); // we have data so we can expand the repeater

});

}

export function Origin_keyPress(event, $w) {

// clear the details display of the old location

wixWindow.scrollTo(10, 385);

$w("#repeater2").data = [];

$w("#repeater2").hide();

if ($w('#Origin').value === "")

$w('#repeater3').collapse();

// get the user's latest input

let val = $w("#Origin").value;

let key = event.key;

if(key.length === 1) {

val += key;

}

if(val.length === 0)

return;

// use the current value to get a list of location suggestions

// we call the autocomplete() web module from the backend

autocomplete(val).then(function(resp) {

// create an array of suggestions for the repeater

let predictions = resp.predictions;

let suggestions = [];

predictions.forEach(function(prediction) {

let item = {"_id" : prediction.id, "text5" : prediction.description, "text6" : prediction.place_id};

suggestions.push(item);

});

$w("#repeater3").data = suggestions; // add the suggestions to the repeater

$w("#repeater3").expand(); // we have data so we can expand the repeater

});

}

// this function is triggered when clicking on a suggestion list repeater item

export function container1_click(event,$w) {

let place_id = $w("#text65").text;

set_details(place_id);

$w("#repeater1").collapse();

}

export function container3_click(event, $w) {

let place_id1 = $w("#text69").text;

set_details1(place_id1);

$w("#repeater3").collapse();

}

function set_details(val) {

details(val).then(function(resp) {

// find the city (locality) and country of the location

let place = resp.result;

var filtered_array = place.address_components.filter(function(address_component){

return address_component.types.includes("country");

});

var country = filtered_array.length ? filtered_array[0].long_name: "";

filtered_array = place.address_components.filter(function(address_component){

return address_component.types.includes("locality");

});

var locality = filtered_array.length ? filtered_array[0].long_name: "";

console.log("details: " + locality);

let name = place.formatted_address;

let id = place.place_id;

let utc = place.utc_offset;

let lat = place.geometry.location.lat;

let lng = place.geometry.location.lng;

// save the details of the location with wix-storage

session.setItem("place_city", name);

session.setItem("place_lat", lat);

session.setItem("place_lng", lng);

session.setItem("place_utc", utc);

session.setItem("place_id", id);

$w("#Destination").value = name; // set input field to location

// array of location detail items for the repeater

let detailsList =

[

{

"_id": "1",

"text3": "place name",

"text4": name

},

{

"_id": "2",

"text3": "latitude",

"text4": "" + lat

},

{

"_id": "3",

"text3": "longitude",

"text4": "" + lng

},

{

"_id": "4",

"text3": "utc",

"text4": "" + utc

},

{

"_id": "5",

"text3": "place id",

"text4": id

}

];

// set the details repeater data and show it

//$w("#repeater2").data = detailsList; // add data to our repeater

//$w("#repeater2").hide();

});

}

function set_details1(val) {

details(val).then(function(resp) {

// find the city (locality) and country of the location

let place = resp.result;

var filtered_array = place.address_components.filter(function(address_component){

return address_component.types.includes("country");

});

var country = filtered_array.length ? filtered_array[0].long_name: "";

filtered_array = place.address_components.filter(function(address_component){

return address_component.types.includes("locality");

});

var locality = filtered_array.length ? filtered_array[0].long_name: "";

console.log("details: " + locality);

let name = place.formatted_address;

let id = place.place_id1;

let utc = place.utc_offset;

let lat = place.geometry.location.lat;

let lng = place.geometry.location.lng;

// save the details of the location with wix-storage

session.setItem("place_city", name);

session.setItem("place_lat", lat);

session.setItem("place_lng", lng);

session.setItem("place_utc", utc);

session.setItem("place_id1", id);

$w("#Origin").value = name; // set input field to location

// array of location detail items for the repeater

let detailsList =

[

{

"_id": "1",

"text3": "place name",

"text4": name

},

{

"_id": "2",

"text3": "latitude",

"text4": "" + lat

},

{

"_id": "3",

"text3": "longitude",

"text4": "" + lng

},

{

"_id": "4",

"text3": "utc",

"text4": "" + utc

},

{

"_id": "5",

"text3": "place id1",

"text4": id

}

];

// set the details repeater data and show it

//$w("#repeater2").data = detailsList; // add data to our repeater

//$w("#repeater2").hide();

});

}

export function geoloc() {

wixWindow.getCurrentGeolocation()

.then( (obj) => {

let lat = obj.coords.latitude;

let lng = obj.coords.longitude;

reverse(lat, lng).then(function(resp) {

let status = resp.status;

if(status === "ZERO_RESULTS") {

let name = "Pittsburgh, PA, USA";

session.setItem("place_city", name);

session.setItem("place_lat", "40.44062479999999");

session.setItem("place_lng", "-79.9958864");

session.setItem("place_utc", "-300");

session.setItem("place_id", "ChIJA4UGSG_xNIgRNBuiWqEV-Y0");

$w("#Destination").value = name;

return;

}

let results = resp.results;

var country = null, city = null, place_id = null;

var c, lc, component;

for (var r = 0, rl = results.length; r < rl; r += 1) {

let result = results[r];

// look for city (locality) and country

if (!city && result.types[0] === 'locality') {

for (c = 0, lc = result.address_components.length; c < lc; c += 1) {

component = result.address_components[c];

if (component.types[0] === 'locality') {

city = component.long_name;

continue;

}

if (component.types[0] === 'country') {

country = component.long_name;

if(city && country)

break;

}

else {

continue;

}

if (city && country) {

place_id = result.place_id;

set_details(place_id);

break;

}

});

} )

.catch( (error) => {

let errorMsg = error;

console.log(errorMsg);

});

}

export function radioGroup1_change(event) {

if ($w('#radioGroup1').value === "Return")

$w('#ReturnDate').enable();

else

$w('#ReturnDate').disable();

}

export function button5_click(event, $w) {

$w('#box9').expand();

$w('#button5').hide();

$w('#button6').show();

}

export function Accommodation_change(event, $w) {

if ($w('#Accommodation').checked){

$w('#box10').expand();}

else

{$w('#box10').collapse();}

if ($w('#Accommodation').checked)

{$w('#text62').html = "yes";}

else

{$w('#text62').html = "no";}

}

function sendFormData() {

const subjectAdmin = `New flight booking enquiry from ${$w("#Name").value}}`;

const subjectRecipient = `${$w("#Name").value} Thanks for your flight booking enquiry!`;

const bodyRecipient = `<img src="https://i.imgur.com/zqydNCk.jpg" width = "500" height = "135">

Hello ${$w("#Name").value},

\rThank you for your enquiry for the best value business and first class flights online.

\rWe will get a quote to you as quick as possible - usually well within 24 hours.

\rThanks again for your request!

\rKind regards,

\rBook The Best

\r--------------------

\re:

\rw:

`;

const bodyAdmin = `Hello Book the Best,

\rYou have just received a new booking enquiry. Below are the details:

\rName: ${$w("#Name").value}

\rEmail: ${$w("#Email").value}

\rPhone: ${$w("#Phone").value}

\rAdults: ${$w("#Adults").value}

\rChildren: ${$w("#Children").value}

\rInfants: ${$w("#Infants").value}

\rOrigin: ${$w("#Origin").value}

\rDestination: ${$w("#Destination").value}

\rDeparture Date: ${$w("#DepartureDate").value}

\rReturn Date: ${$w("#ReturnDate").value}

\rFlexible Dates?: ${$w("#text71").text}

\rAccommodation required?: ${$w("#text62").text}

\rCheck In: ${$w("#CheckIn").value}

\rCheck Out: ${$w("#CheckOut").value}

\r----------------------------------------------------------------

\rTo Access All Your Contact Information:

\rStep 1) Sign into your Wix account and select book the best.

\rStep 2) Click the "Wix Database" app.

\rStep 3) Under Collections, Click "Flight Bookings".

\rStep 4) Your Contact information will be collected here.

\r----------------------------------------------------------------

\rIf you have any questions about our lead generation forms please email info@tailoredwebdesign.com.au.`;

const recipient = $w("#Email").value;

sendEmailWithRecipient(subjectRecipient, bodyRecipient, recipient)

.then(() => sendEmail(subjectAdmin, bodyAdmin));

}

let date = new Date();

let day = date.getDate();

let month = date.getMonth()+1;

let year = date.getFullYear();

let dateStr = day + "/" + month + "/" + year;

console.log(dateStr); // show result in the developers console

export function FlexibleDate_change(event, $w) {

if ($w('#FlexibleDate').checked)

$w('#text71').html = "yes";

else

$w('#text71').html = "no";

}

export function button16_click(event, $w) {

$w("#Origin").value = null;

$w("#repeater3").collapse();

}

export function button17_click(event, $w) {

$w("#Destination").value = null;

$w("#repeater1").collapse();

}

QUEENSLAND

QUEENSLAND

QUEENSLAND

Truly amazing water properties, sunsets and experiences.

Truly amazing water properties, sunsets and experiences.

QUEENSLAND

QUEENSLAND

OUR WORK

Site

Destinations

Signup here

Contact Us

Phone

Email

Client Login