Untitled
unknown
plain_text
2 years ago
24 kB
7
Indexable
(function() { try { /* main variables */ var debug = 0; var variation_name = ""; var $; /* all Pure helper functions */ function waitForElement(selector, trigger, delayInterval, delayTimeout) { var interval = setInterval(function() { if ( document && document.querySelector(selector) && document.querySelectorAll(selector).length > 0 ) { clearInterval(interval); trigger(); } }, delayInterval); setTimeout(function() { clearInterval(interval); }, delayTimeout); } const egStickyHtml = ` <div class="eg-sticky-wrapper"> <!-- charter name and price --> <div class="eg-info"></div> <!-- cta --> <div class="eg-cta-container"> </div> </div> `; /* Variation Init */ function initStickyMob() { /* start your code here */ if (window.innerWidth < 768) { const egBody = document.querySelector("html body"); egBody.insertAdjacentHTML("beforeend", egStickyHtml); // clearfix const egClearFix = document.querySelector(".booking-flow .sidebar .totalPrice .clearfix"); let egContinueCta = `<button class="btn btn-primary">Continue</button>`; const egSaveQuoteCta = document.querySelector(".booking-flow .sidebar .share-quote"); // insertng these elements inside our sticky wrapper document.querySelector(".eg-sticky-wrapper .eg-info").insertAdjacentElement("afterbegin", egClearFix); // inserting continue button html document.querySelector(".eg-sticky-wrapper .eg-cta-container").insertAdjacentHTML("afterbegin", egContinueCta); // inserting save quote cta document.querySelector(".eg-sticky-wrapper .eg-cta-container").insertAdjacentElement("afterbegin", egSaveQuoteCta); // continue btn click detect and submit form document.querySelector(".eg-cta-container>.btn").addEventListener("click", () => { // if extras form if (document.querySelector(".extras form")) { document.querySelector(".extras form > button[type=submit]").click(); } // if passenger details form else if (document.querySelector("#tm-booking .passenger> form")) { document.querySelector("#tm-booking .passenger> form > .clearfix button[type=submit]").click(); } // if paynow form else if (document.querySelector("#tm-booking #checkoutForm")) { document.querySelector("#tm-booking #checkoutForm input[type=submit]").click(); } }); // changing text document.querySelector(".eg-info label").textContent = `Total Charter Price`; } } listener() function listener() { /* These are the modifications: */ window.addEventListener("locationchange", function() { waitForElement('#booking-flow nav > .step:nth-child(2)', init, 50, 15000); waitForElement('#booking-flow nav > .step > span', progress, 50, 15000); }); history.pushState = ((f) => function pushState() { var ret = f.apply(this, arguments); window.dispatchEvent(new Event("pushstate")); window.dispatchEvent(new Event("locationchange")); return ret; })(history.pushState); history.replaceState = ((f) => function replaceState() { var ret = f.apply(this, arguments); window.dispatchEvent(new Event("replacestate")); window.dispatchEvent(new Event("locationchange")); return ret; })(history.replaceState); window.addEventListener("popstate", () => { window.dispatchEvent(new Event("locationchange")); }); } function progress(){ document.querySelector("#booking-flow nav > .step:nth-child(2)").childNodes[2].textContent = "Contact Details"; setTimeout(()=>{ if (window.location.href.indexOf("https://www.moorings.com/booking/passengers") != -1){ document.querySelector("#booking-flow nav > .step:nth-child(1) > span").classList.add("eg-active"); } else if(window.location.href.indexOf("https://www.moorings.com/booking/payment") != -1){ document.querySelector("#booking-flow nav > .step:nth-child(1) > span").classList.add("eg-active"); document.querySelector("#booking-flow nav > .step:nth-child(2) > span").classList.add("eg-active"); } else{ console.log("there is some error") } }, 500) } // Extras page var eg_images = { insurance: ` <div class="egImg"> <img class="full-2-1-breakpoints-theme-moorings-xsw-1x" src="https://editor-assets.abtasty.com/46121/637c78a6e843c1669101734.png" width="768" height="384" alt=""> </div> `, wifi: ` <div class="egImg"> <img class="full-2-1-breakpoints-theme-moorings-xsw-1x" src='https://editor-assets.abtasty.com/46121/637c78ecd9bc91669101804.png' width="768" height="384" alt=""> </div> `, crew: { cook: ` <div class="egImg"> <img class="full-2-1-breakpoints-theme-moorings-xsw-1x" src='https://editor-assets.abtasty.com/46121/637c785999bca1669101657.png' width="768" height="384" alt=""> </div> `, skipper: ` <div class="egImg"> <img class="full-2-1-breakpoints-theme-moorings-xsw-1x" src='https://editor-assets.abtasty.com/46121/637c78c60d1091669101766.png' width="768" height="384" alt=""> </div> ` } } function initExtras() { document.body.classList.add('egExtras'); let container = document.querySelectorAll("#tm-booking .main .extra-inner .extra-line-item"); let nonCollapsible = document.querySelectorAll("#tm-booking .main .nonCollapsible .extra-inner .extra-line-item"); if (nonCollapsible.length > 0) { // non collapsible for (var i = 0; i < nonCollapsible.length; i++) { let egLabelCheck = nonCollapsible[i].parentElement.parentElement.previousElementSibling.textContent; let egHtml = addingImage(egLabelCheck, nonCollapsible[i]); nonCollapsible[i].insertAdjacentHTML("afterbegin", egHtml); } } else if (container.length > 0) { for (var i = 0; i < container.length; i++) { let egLabelCheck = container[i].parentElement.parentElement.parentElement.parentElement.previousElementSibling.textContent; let egHtml = addingImage(egLabelCheck, container[i]); container[i].insertAdjacentHTML("afterbegin", egHtml); } } movingElements(document.querySelectorAll("#tm-booking .main .extra-inner")); // mutation observer let observer = new MutationObserver(mutations => { // console.log(mutations); // console.log(the changes) for (let mutation of mutations) { for (let node of mutation.addedNodes) { // we track only elements, skip other nodes (e.g. text nodes) if ((node instanceof HTMLElement)) { movingElements([node]); } // console.log('hello',node); } } }); const ele = document.querySelectorAll("#tm-booking .main .extras form"); ele.forEach(ele => { // observe everything except attributes observer.observe(ele, { subtree: true, // observe desendents children childList: true }); }); } function addingImage(egLabelCheck, container) { let egHtml = ''; if (egLabelCheck == 'Insurance') { egHtml = eg_images.insurance; } else if (egLabelCheck == "Wi-Fi Service") { egHtml = eg_images.wifi; } else if (egLabelCheck == "Crew") { if (container.children[0].textContent == 'Hire a Skipper') { egHtml = eg_images.crew.skipper; } else if (container.children[0].textContent == 'Hire a Cook') { egHtml = eg_images.crew.cook; } } return egHtml; } // moving crew message and text note function movingElements(elements) { elements.forEach(ele => { qualifier = ele.querySelector("span.qualifier"); priceQuantity = ele.querySelector(".price-quantity"); notes = ele.querySelector(".extra-description > .notes"); text = ele.querySelector(".extra-description > .text"); if (qualifier) { priceQuantity.insertAdjacentElement("beforeend", qualifier); } if (notes) { text.insertAdjacentElement("afterend", notes); // notes.querySelector(".crew-message").textContent = notes.querySelector(".crew-message").textContent.replace("*","Note") } }) } /* Initialize variation */ if(window.location.pathname == '/booking/extras' ){ waitForElement("#tm-booking .main .extra-inner", initExtras, 50, 15000); } /* Initialize variation */ if(window.screen.width < 768){ waitForElement('.booking-flow .sidebar .totalPrice .clearfix', initStickyMob, 50, 15000); } waitForElement('#booking-flow nav > .step', progress, 50, 15000); } catch (e) { if (debug) console.log(e, "error in Test" + variation_name); } })(); @media(max-width: 767px) { /*hiding default ctas*/ .extras form>button[type=submit], #tm-booking .passenger>form>.clearfix button[type=submit], #tm-booking #checkoutForm input[type=submit] { display: none; } /*hiding defalt ctas*/ body { padding-bottom: 180px; } .eg-body { position: relative; } .eg-sticky-wrapper { position: fixed; bottom: 0; z-index: 999; left: 0; right: 0; background: white; padding: 18px; box-shadow: 0 0 8px rgb(0 0 0 / 25%); } .eg-cta-container>.btn { font-size: 16px; color: #fff; background-color: #b92d32; border: none; border-radius: 3px; } .eg-info { font-size: 19px; line-height: normal; margin-bottom: 16px; font-weight: 600; } .eg-info label { font-weight: 600; padding: 0; margin: 0; padding-right: 10px; font-size: 16px; color: black; } .eg-info .price { margin: 0; padding: 0; text-align: right; color: #b92d32; font-size: 16px; } .eg-info .clearfix { display: flex; justify-content: space-between; padding-top: 9px; padding-bottom:9px; background-color: #F5F4F2; } .eg-info .clearfix>* { width: 100%; } .eg-cta-container { display: flex; gap: 36px; justify-content: space-between; } .eg-cta-container>* { flex: 1; } .eg-cta-container .share-quote { margin-top: 0; } .eg-cta-container .share-quote a.btn { width: 100%; background: white; white-space: unset !important; font-size: 15px; display: inline-flex; align-items: center; justify-content: center; border-radius: 3px; padding-left: 0 !important; padding-right: 0 !important; } .eg-cta-container .share-quote a.btn:hover { color: black; border-color: black; } /*inquiry msg*/ .eg-inquiry-msg { background: #f5f4f2; margin-top: 16px; font-size: 16.8px; padding: 10px; text-align: center; color: #000 !important; border-radius: 6px; display: block !important; text-decoration: none !important; } } /* Checkout progress bar */ @media (min-width: 768px) and (max-width: 1199px) { html body #header-info { top: 9px !important; } } @media(min-width:1200px){ html body #header-info { top: 40px !important; } } @media (min-width: 768px) { html body .navbar-header>.inner { height: auto; } #header { margin-top: 0 !important; } } @media screen and (max-width: 767px) { div#header-info { display: none; } /* #booking-flow nav { width: 90% !important; } */ .steps nav::before { top: 22px; } .row .steps { padding-inline: 0; padding-block: 5px !important; } } .booking-flow .step { flex: 1; } html body .booking-flow .steps .number { margin-right: 0; } .navbar-header { border-bottom: 0; } .navbar-brand { top: 0rem !important; padding-top: 1.6rem !important; } .navbar { box-shadow: none; height: auto; min-height: auto; } nav .step { display: flex !important; flex-direction: column; align-items: center; background: none !important; } .booking-flow .step { padding-left: 0 !important; } #booking-flow nav { display: flex; padding-bottom: 0 !important; margin-bottom: 0 !important; position: relative; justify-content: space-between; width: 100%; margin-inline: auto; max-width: 1040px; } .steps nav::before { content: ""; position: absolute; height: 2px; width: 77%; background-color: rgb(0 0 0 /15%); left: 50%; transform: translateX(-50%); top: 27%; } .steps nav::after { content: ''; position: absolute; height: 2px; width: 26%; background: #122447; left: 14%; top: 27%; } html body .steps > nav:has(.step:nth-child(1).active)::after { width: 0 !important; } html body .steps > nav:has(.step:nth-child(2).active)::after { width: 23% !important; } html body .steps > nav:has(.step:nth-child(3).active)::after { width: 48% !important; } html body .steps > nav:has(.step:nth-child(4).active)::after { width: 73% !important; } .site-header { margin-bottom: 0 !important; } .step.active span.number { background: #122447; color: #fff !important; height: 25px; } .booking-flow .step:not(.active) .number { background: #fff; } .step.active, .step:not(:first-child) { color: #122447 !important; } #booking-flow nav>.step:not(.number) { font-size: 12px; color: #122447; } #booking-flow nav>.step { padding: 0 !important; height: auto !important; min-width: unset !important; } .booking-flow .steps .number { height: 30px !important; width: 30px; text-align: center; line-height: 2.5; font-size: 15px; display: flex; justify-content: center; align-items: center; color: #122447; margin-bottom: 8px; border: 3px solid #122447; } .row .steps { padding-inline: 0; padding-block: 40px; } .eg-active { background-color: #122447 !important; color: #fff !important; } .booking-flow .step { margin-left: 0 !important; margin-top: 0 !important; } /*Extras CSS*/ html body.egExtras .calendar-calendar, html body.egExtras .view .row>.list-group { width: 85%; } html body.egExtras .booking-flow .main .extra .notes { margin-top: 0; } html body.egExtras .booking-flow .main .extra .price-quantity { align-items: flex-start; } /*chevrons*/ html body.egExtras .booking-flow .Collapsible__trigger:after { content: '' !important; background: url('https://editor-assets.abtasty.com/46121/6389f9042cf5f1669986564.svg'); width: 15px; height: 15px; background-repeat: no-repeat; background-position: center; } html body.egExtras .booking-flow .Collapsible__trigger.is-closed:after { transform: rotate(180deg); } /*css for error message*/ html body.egExtras .booking-flow .main .extra.capacity-error { background: transparent !important; } html body.egExtras .booking-flow .main .extra.capacity-error .extra-inner { background: rgba(215, 36, 65, .24); } html body.egExtras .extra-inner-capacity-message { padding: 16px; } /*css for error message*/ html body.egExtras span.qualifier { color: #bdbdbd; font-size: 16px; margin-top: 3px; font-family: "Trade Gothic W01 Roman", Arial, Helvetica, sans-serif; } html body.egExtras .booking-flow .main .extra.child .extra-inner { padding-top: 16px; border-top: none; } html body.egExtras .booking-flow .main .extra:not(.child) { margin-bottom: 0; } html body.egExtras .booking-flow .main .extra label { gap: 10px; } html body.egExtras .booking-flow .main .extra .extra-description .text { padding-inline: 15px; } html body.egExtras .booking-flow .main .extra .extra-description { width: 100%; margin-inline: 0 !important; } html body.egExtras .booking-flow .main .extra .extra-description .text { width: 100%; } html body.egExtras .booking-flow .main .extra.child { background-color: white; padding-top: 0; } html body.egExtras .booking-flow .Collapsible__trigger:after { float: right; font-size: 18px; } html body.egExtras .booking-flow .Collapsible { border-bottom: none; } html body.egExtras .booking-flow .Collapsible + .Collapsible { margin-top: 28px; } html body.egExtras div.price-quantity>span.totalPrice { font-weight: 400; } html body.egExtras .booking-flow .main .extra label, html body.egExtras .booking-flow .main .extra .price-quantity { font-size: 20px; font-weight: 400; font-family: "NewBaskervilleW01-Roman", serif; } html body.egExtras .booking-flow .main .extra .extra-description .text, html body.egExtras .booking-flow .main .extra .extra-description .notes { font-size: 16px; } html body.egExtras .extra-inner { border: 1px solid #d0cdc5; border-radius: 5px; } html body.egExtras .extra-description .text { padding: 5px 25px 10px; } html body.egExtras .booking-flow .Collapsible__trigger { background-color: rgb(204 204 204 /35%); font-size: 20px; font-weight: 400; margin: auto; border-radius: 4px; } html body.egExtras .extra-line-item { background: #fff !important; } html body.egExtras span.totalPrice { color: #1ba9e8; font-weight: 600; } html body.egExtras .booking-flow .main .extra .price-quantity { float: none; grid-row-start: 2; grid-row-end: 3; grid-column-start: 2; grid-column-end: 3; } html body.egExtras .booking-flow .main .extra .extra-line-item { padding: 0; border-radius: 5px; } html body.egExtras .booking-flow .main .extra label { display: flex; align-items: center; justify-content: space-between; max-width: 100%; width: 100%; } html body.egExtras .booking-flow input[type=checkbox] { cursor: pointer; order: 1; min-width: 24px; min-height: 24px; } html body.egExtras .price-quantity { display: flex; gap: 15px; align-items: center; } html body.egExtras .booking-flow .main .extra .notes .crew-message { border: none !important; padding: 0; margin: 0; } @media(min-width: 800px) { html body.egExtras .booking-flow input[type=checkbox] { order: 1; min-width: 24px; min-height: 24px; } html body.egExtras .booking-flow .main .extra label, html body.egExtras .booking-flow .main .extra .price-quantity { padding-left: 4.5%; font-family: "NewBaskervilleW01-Roman", serif; } } html body.egExtras .booking-flow .main .extra.child label, html body.egExtras .booking-flow .main .extra.child .price-quantity { padding-left: 16px; } @media(min-width: 768px) { html body.egExtras .extras form .Collapsible .Collapsible__contentInner>div { padding: 20px 0 0 0; } html body.egExtras .egImg { width: 200px; height: 100px; grid-row-start: 1; grid-row-end: 3; } html body.egExtras .booking-flow .main .extra:not(.child) .extra-line-item { display: grid; grid-template-columns: 202px 1fr; } html body.egExtras .booking-flow .main .extra label, html body.egExtras .booking-flow .main .extra .price-quantity { padding-left: 4%; } } html body.egExtras .booking-flow input[type=checkbox] { position: relative; } html body.egExtras .booking-flow input[type=checkbox]:checked::after { content: ''; position: absolute; width: 24px; height: 24px; background: url('https://editor-assets.abtasty.com/46121/6389f8d421c6b1669986516.svg'); background-repeat: no-repeat; background-position: center; top: 0; left: 0; border: 1px solid; border-radius: 2px; } @media(max-width: 767px) { html body.egExtras .extras form .Collapsible .Collapsible__contentInner>div { padding-top: 10px; } html body #hubspot-messages-iframe-container{ bottom:140px !important; } /* .steps { width: 100%; } */ html body.egExtras .egImg { width: 100% !important; } html body.egExtras #booking-flow>div>div.steps { width: 100%; } html body.egExtras .extra-line-item { display: flex !important; flex-direction: column; } html body.egExtras .booking-flow input[type=checkbox] { order: 1; min-width: 24px; min-height: 24px; accent-color: white; } /* .booking-flow .step { font-size: 1.5rem; } .booking-flow .step { padding-top: 9px; } */ html body.egExtras .booking-flow .booking-details { margin-bottom: 11px; } html body.egExtras .booking-flow .main .extra label { padding: 10px 10px 0 10px; } html body.egExtras .booking-flow .main .extra .price-quantity { padding: 10px; } html body.egExtras .extra-description .text { padding: 0 10px 10px; width: 100%; } html body.egExtras .booking-flow .main .extra { padding: 0; } html body.egExtras .booking-flow .Collapsible__trigger { width: 100%; } } html body.egExtras .booking-flow .main .extra:not(:has( + .extra)) .extra-inner { border-bottom-left-radius: 5px; border-bottom-right-radius: 5px; } html body.egExtras .extra-inner { border: 1px solid #d0cdc5; border-radius: 5px 5px 0 0; } /*setting border-radius for child*/ html body.egExtras .booking-flow .main .extra.child .extra-line-item { border-radius: 0; } html body.egExtras .booking-flow .main .extra.child .extra-inner { padding-top: 16px; border-top: none; border-radius: 0 0 5px 5px; } /* Nav and Footer Hide */ @media only screen and (min-width: 768px) { /* Hide nav and footer */ .navbar-nav { display: none; } footer { display: none; } /* Adjust height of header area */ #navbar-collapse { height: 111px !important; } /* hide hamburger button on smaller screen sizes */ .navbar-mobile { display: none; } /* hide flag dropdown */ #block-menu-menu-locale-menu { display: none; } /* hide manage my booking button */ .payment-button-navbar { display: none; } /* hide COVID banner */ .abtasty-banner-wrapper { display: none !important; } #header-manage-booking { display: none; } #header { margin-top: -58px; } #header-info { position: absolute; text-align: right; width: auto; right: 0; } } @media only screen and (min-width:768px) and (max-width: 1199px) { #header-info { top: 65px; } #header { margin-bottom: 30px; } } @media only screen and (min-width: 1200px) { #header-info { top: 100px; } }
Editor is loading...