`;
var modalClose = modal.querySelector('.evolv-modal-close button');
if(modalClose) modalClose.onclick = () => modal.remove();
document.body.insertAdjacentElement('beforeend', modal);
}
if (!document.querySelector('.evolv-add-devices-button')) addDevicesButton.insertAdjacentElement('afterend', fakeButton);
});
;
};
evolv.javascript.variants["evolv_web_gcr5s1y9z_a8uh75f34"].timing = "immediate";
evolv.javascript.variants["evolv_web_gcr5s1y9z_7dy1d04y8"] = function (resolve, reject) {
};
evolv.javascript.variants["evolv_web_gcr5s1y9z_7dy1d04y8"].timing = "immediate";
evolv.javascript.variants["evolv_web_gcr5s1y9z"] = function (resolve, reject) {
var plansPageScope = '[class*="PlansNewContainer__TopSection-sc"] ~ [class*="PlansLanding__BottomSection"]';
var smartphoneSectionScope = `${plansPageScope} [data-evolv-int-section="smartphones"]`;
var COLLECT_MAP = {
// PSA - please check collectors note in plans+tmp context.
// -----
// Also, a data-attribute has been added via integration to differentiate sections for multiple devices
// -- descriptive section ID's were recently removed in BAU so we needed a way to scope treatments
// --- to the smartphone section exclussively where applicable. See scope varianble.
// 2.1
'appliedToLinesLabel': `${smartphoneSectionScope} [class*="BusinessPlanCard__AppliedToLines"]`,
'selectPlanCta': `${smartphoneSectionScope} [aria-label="Select plan"], ${smartphoneSectionScope} [aria-label="Keep this plan"]`,
'planTitleTopSection': `${smartphoneSectionScope} .top-section`,
'businessPlanCardTileContainer': `${smartphoneSectionScope} [class*="BusinessPlanCard__TileContainer"]`,
// 5.1
'addDevicesButton': `button.add-devices`,
// 1.1
'planIncludesSection': `${smartphoneSectionScope} [class*="BusinessPlanCard__TileContents"] > div:last-of-type`,
'fccLabelWrapper': `${smartphoneSectionScope} [class*="BroadbandPlan__BroadBandWrapper-sc"]`,
'seeAllPlans': '.evolv-seeAllPlans',
'seeLess': '.evolv-seeLess',
// 4.1
'promoBadgeCopy': `${smartphoneSectionScope} [class*="BusinessPlanCard__PromoBadge"] p`,
};
Object.keys(COLLECT_MAP).forEach(mutateKey => {
var selector = COLLECT_MAP[mutateKey];
collect(selector, mutateKey);
});
};
evolv.javascript.variants["evolv_web_gcr5s1y9z"].timing = "immediate";
evolv.javascript.variants["evolv_web_5i383i65u_abqdwdl1a"] = function (resolve, reject) {
window.evolvTrack('opt316_plans_tmp', '06_02');
// should also include cloned copy from 2.1
// mutate('appliedToLinesCopy').text('You selected this plan');
// can't use .text because it sticks even when you change
// a selection and stay on the page - moved to CSS;
};
evolv.javascript.variants["evolv_web_5i383i65u_abqdwdl1a"].timing = "immediate";
evolv.javascript.variants["evolv_web_5i383i65u"] = function (resolve, reject) {
var scope = '[class*="PlansLanding__BottomSection-sc"] [data-evolv-int-section="smartphones"]';
var plansScope = `[class*="PlansNewContainer__TopSection-sc"] ~ ${scope}`;
var COLLECT_MAP = {
// PSA - use a different ID if re-collecting elements from just-plans context
// - During dev, you won't be able to use plans context collectors so will need to re-collect here
// -- custom mutations won't work when you click the back button otherwise
// // 2.1
// 'appliedToLinesLabel': `${scope} [class*="BusinessPlanCard__AppliedToLines"]`,
// 'businessPlanCardTileContainer': `${scope} [class*="BusinessPlanCard__TileContainer"]`,
// 'selectPlanCta': `${scope} [aria-label="Select plan"], ${scope} [aria-label="Keep this plan"]`,
// 'planTitleTopSection': `${scope} .top-section`,
// // 5.1
// 'addDevicesButton': `button.add-devices`,
// // 1.1
// 'planIncludesSection': `${scope} [class*="BusinessPlanCard__TileContents"] > div:last-of-type`,
// 'seeAllPlans': '.evolv-seeAllPlans',
// 'seeLess': '.evolv-seeLess',
// // 4.1
// 'promoBadgeCopy': `${scope} [class*="BusinessPlanCard__PromoBadge"] p`,
// BEWARE of looping collectors since 2.1 duplicates elements
// Unless flagged in comments, the collectors below work for both plans AND tmp
// 6.1 - need to include any elements added in concept 2 variants
'selectCta': `${scope} [aria-label*="Select"][aria-label*="plan"], ${scope} [aria-label*="Keep this"]`,
'selectedCTA': `${scope} [aria-label*="Keep this"]`,
'selectedCTACopy': `${scope} [aria-label*="Keep this"] [class*="StyledChildWrapper-VDS__sc"], ${scope} .evolv-selected-tile .evolv-select-button [class*="StyledChildWrapper-VDS__sc"]:not(.mutate-selectedCTACopy)`,
'appliedToLinesCopy': `${scope} [class*="BusinessPlanCard__AppliedToLines"] p, ${scope} .evolv-selected-tile .evolv-applied-label p:not(.mutate-appliedToLinesCopy)`,
// 6.5
// - similar to ones collected in 1.1 but more scoped
'selectedFCCLabelWrapper': `${plansScope}[data-evolv-section-has-selection-made] [class*="BroadbandPlan__BroadBandWrapper-sc"]`,
'includesSection': `${plansScope}[data-evolv-section-has-selection-made] [class*="BusinessPlanCard__TileContents"] > div:last-of-type`,
'tileContainer': `${plansScope}[data-evolv-section-has-selection-made] [class*="BusinessPlanCard__TileContainer"]`,
'selectedSeeAll': `${plansScope}[data-evolv-section-has-selection-made] .evolv-seeAllPlans`,
'selectedSeeLess': `${plansScope}[data-evolv-section-has-selection-made] .evolv-seeLess`,
};
Object.keys(COLLECT_MAP).forEach(mutateKey => {
var selector = COLLECT_MAP[mutateKey];
if (!document.querySelector(`.mutate-${mutateKey}`)) collect(selector, mutateKey);
});
// some selected state handling for combos with concept 2 - usable for all variants
// on both plans and TMP pages
function updateSelectedState (el) {
var tile = el.closest('[class*="BusinessPlanCard__TileContainer-sc"]');
if (!tile) return;
var aria = el.getAttribute('aria-label');
var isSelected = aria?.indexOf('Keep') > -1;
// mobile has a carousel
var lockupContainer = tile.closest('[class*="TitleLockupContainer-VDS__sc"]');
if (!isSelected && tile.classList.contains('evolv-selected-tile')) {
tile.classList.remove('evolv-selected-tile');
// mobile
if (lockupContainer && lockupContainer.classList.contains('evolv-selected-overflow')) lockupContainer.classList.remove('evolv-selected-overflow');
}
if (isSelected) {
tile.classList.add('evolv-selected-tile');
// mobile
if (lockupContainer) lockupContainer.classList.add('evolv-selected-overflow');
// this does not need to toggle since you cannot clear a selection from here
var tileWrapper = tile.closest('[data-evolv-int-section]');
if (tileWrapper) tileWrapper.setAttribute('data-evolv-section-has-selection-made', true);
}
}
mutate('selectCta').customMutation((state, selectCta) => {
// update on page load
updateSelectedState(selectCta);
// watch for selection changes
var observer = new MutationObserver(mutations => {
for (var mutation of mutations) {
if (mutation.attributeName === 'aria-label') updateSelectedState(mutation.target);
}
});
observer.observe(selectCta, { attributes: true });
});
};
evolv.javascript.variants["evolv_web_5i383i65u"].timing = "immediate";
evolv.javascript.variants["evolv_web_nz98arr5l_hhriu1gtt"] = function (resolve, reject) {
};
evolv.javascript.variants["evolv_web_nz98arr5l_hhriu1gtt"].timing = "immediate";
evolv.javascript.variants["evolv_web_nz98arr5l_m80hylwdz"] = function (resolve, reject) {
};
evolv.javascript.variants["evolv_web_nz98arr5l_m80hylwdz"].timing = "immediate";
evolv.javascript.variants["evolv_web_nz98arr5l_j7qhs85jr"] = function (resolve, reject) {
};
evolv.javascript.variants["evolv_web_nz98arr5l_j7qhs85jr"].timing = "immediate";
evolv.javascript.variants["evolv_web_nz98arr5l_3e663rvnv"] = function (resolve, reject) {
};
evolv.javascript.variants["evolv_web_nz98arr5l_3e663rvnv"].timing = "immediate";
evolv.javascript.variants["evolv_web_nz98arr5l_5gwq0y55r"] = function (resolve, reject) {
};
evolv.javascript.variants["evolv_web_nz98arr5l_5gwq0y55r"].timing = "immediate";
evolv.javascript.variants["evolv_web_nz98arr5l_lqtlkq7yk"] = function (resolve, reject) {
};
evolv.javascript.variants["evolv_web_nz98arr5l_lqtlkq7yk"].timing = "immediate";
evolv.javascript.variants["evolv_web_nz98arr5l_wmms7edei"] = function (resolve, reject) {
};
evolv.javascript.variants["evolv_web_nz98arr5l_wmms7edei"].timing = "immediate";
evolv.javascript.variants["evolv_web_nz98arr5l_vet19oo8l"] = function (resolve, reject) {
};
evolv.javascript.variants["evolv_web_nz98arr5l_vet19oo8l"].timing = "immediate";
evolv.javascript.variants["evolv_web_nz98arr5l_rqie9xgi5"] = function (resolve, reject) {
};
evolv.javascript.variants["evolv_web_nz98arr5l_rqie9xgi5"].timing = "immediate";
evolv.javascript.variants["evolv_web_nz98arr5l"] = function (resolve, reject) {
var scope = '.landing5g';
var COLLECT_MAP = {
// matches both top and inline buttons
'continueButton': `${scope} button[aria-label="Continue"]`,
'disabledContinueButton': `${scope} button[aria-label="Continue"][aria-disabled="true"]`,
'enabledContinueButton': `${scope} button[aria-label="Continue"][aria-disabled="false"]`,
// matches all input buttons - checked or not
'selectionInputLabel': `${scope} [data-loc] input + label`,
// matches all accordions - expanded or not
'accordionButton': `${scope} .accordionButton`,
'collapsedAccordionButton': `${scope} .accordionButton[aria-expanded="false"]`,
// sections - these will all break on accordion interaction, see data-attribute workaround below
'plansSection': `${scope} [class*="PlanSelection__PlansAccordionContainer"]`,
// there are 3 versions of the equipment section depending on reciever/router config, which depends on self/pro install
'equipmentSection': `[id="5gReceiver"], [id="5gEquipmentSectionwithoutstark"], [id="5gEquipmentSectionwithstark"]`,
// there are 2 versions of the payment section depending on self/pro install address
'paymentSection': `[id="5gRouterPayment"], [id="5gReceiverPaymentwithStark"]`,
'section': `.mutate-plansSection, .mutate-equipmentSection, .mutate-paymentSection`,
'desktopPlansSectionHeadlineButtonWrapper': `${scope} [class*="PlanSelection__TitleContainer"]`,
// section headlines - relies on classList bug workaround below
'sectionHeadline': `${scope} [data-evolv-section] button h3, ${scope} [data-evolv-section] button + [data-testid] h3`,
// page header things
'stickySummaryBar': `${scope} [class*="StickyHeader__StickyContainer"]`,
'pageHero': `${scope} [class*="HeroSection__HeroDiv"]`,
'pageHeadline': `${scope} [class*="HeroSection__HeroDiv"] h1`,
'subheadline': `${scope} [class*="SubtitleWrapper"] h2`,
'loopQualEyebrow': `${scope} [class*="HeroSection__TitleLockupLQ-sc"] h2`,
// 'contentSection': '[class*="HeroSection__HeroDiv"] + div:not([class*="ChatDiv"]), [class*="HeroSection__HeroDiv"] + div[class*="ChatDiv"] + div',
'contentSection': '[class*="HeroSection__HeroDiv"] ~ div[style]:not([class*="ChatDiv"]) > div > [class*="RowWrapper-VDS__"] > div',
'faqHeading': '.evolv-faqHeading',
'subheadlineAnchor': '.evolv-subheadlineAnchor',
'faqCaret': '#evolv-faqSection svg',
// 14.1
'planCardsH4': `${scope} [id="5gPlanSelection"] [class*="PlanCard__FourGFiveGPlanBoxWrap-sc"] h4`,
// 12.1
// 'topContinueButton': `${scope} [class*="StickyHeader__FlexContainer-sc"] button[aria-label="Continue"]`,
// 'summaryBarTotals': `${scope} [class*="StickyHeader__TotalsDiv-sc"]`,
'cartIcon': `${scope} [class*="StickyHeader__StickyContainer-sc"] [data-track="Continue"] ~ [class*="ButtonIconContainer-VDS__"]`,
'byorContinueButton': `[class*="IMEICheckModal__SIMModalFooter"] button[aria-label="Continue"]`,
// 16.1
'lastPlanCard': `${scope} [class*="PlanSelection__PlanCardGroup-sc"] > div:last-child:not(.evolv-social-proof)`,
// 17.1
'contentWrapper': `${scope} [class*="HeroSection__HeroDiv"] ~ div:not([class*="LandingPage5G__"]) > [class*="StyledGridContainer-VDS__"] > [class*="RowWrapper-VDS__"] > div`,
'contentInner': `.mutate-contentWrapper > div:not(.evolv-left-rail)`,
'addedLeftRail': `.evolv-left-rail`,
};
Object.keys(COLLECT_MAP).forEach(mutateKey => {
var selector = COLLECT_MAP[mutateKey];
collect(selector, mutateKey);
});
// The section parents for both the equipment and payment sections are affected
// by the Mutate classList bug upon accordion interaction so we need to set
// data attributes that won't disappear on us. Running this at the context
// level in case we need to lean on it outside of concept 6.
var keyIDs = ['plans', 'equipment', 'payment'];
keyIDs.forEach(id => {
mutate(`${id}Section`).customMutation((state, section) => {
section.setAttribute('data-evolv-section', id); // just using 1 attribute for both classes we lose
});
});
// this one is more general as new selectors emerge being affected by classList replacement
// -- just add them to the array as they're found and then adjust code (mostly css)
// -- accordingly
var keyIDs = ['sectionHeadline', 'pageHero'];
keyIDs.forEach(id => {
mutate(id).customMutation((state, section) => {
section.setAttribute('data-evolv-mutate-key', id);
});
});
// placing this out here in case we need it elsewhere
window.evolv_opt302_addSpinnerTransition = () => {
var pageContent = document.querySelector('[class*="HeroSection__HeroDiv"] ~ div:not([class*="LandingPage5G__ChatDiv-sc"]) [class*="StyledGridContainer-VDS"]');
if(!pageContent) return;
var body = document.body;
body.classList.add('evolv-spinner-active'); // not sure if getting replaced
body.setAttribute('evolv-spinner-active', true);
// just cover the section that's changing
// var overlay = document.createElement('div');
// overlay.setAttribute('class', 'evolv-spinner-overlay');
// so we can keep the spinner centered
var spinner = document.createElement('div');
spinner.setAttribute('class', 'evolv-spinner-container');
spinner.innerHTML = '';
pageContent.insertAdjacentElement('afterend', spinner);
setTimeout(() => {
// if(document.querySelector('.evolv-spinner-overlay')) overlay.remove();
if(document.querySelector('.evolv-spinner')) spinner.remove();
if(body.classList.contains('evolv-spinner-active')) body.classList.remove('evolv-spinner-active');
var bodyAttribute = body.getAttribute('evolv-spinner-active');
if(bodyAttribute && bodyAttribute === 'true') {
body.setAttribute('evolv-spinner-active', false);
}
}, 2000);
};
// ===[ Putting 6.2 & 7.1 in the context for complexity + reuse ]=== //
// This was all originally 6.2 but the decision was made to split
// testing out having this in the context vs a complete decoupling
// -- 6.3 has now been added to this
window.evolv_opt302_progression = variant => {
// variant is dormant in the manager but strategy is not ready to disable yet
// -- payment section has been removed from BAU entirely
return;
// setTimeout(() => { // ended up having to add this for 6.3 but not a fan
// var trackedVariants = document.body.getAttribute('evolv-opt302');
// var isConcept6 = trackedVariants.includes('06_');
// var isACombo = trackedVariants.includes('07_0') && trackedVariants.includes('06_0');
// var isAComboWith603 = trackedVariants.includes('07_0') && trackedVariants.includes('06_03');
// var isVar701 = variant === '07_01';
// var isVar602 = variant === '06_02';
// var isVar603 = variant === '06_03';
// if (isACombo || isVar701) {
// // disable all accordions and prevent them collapsing again via css
// mutate('collapsedAccordionButton').customMutation((state, collapsedAccordionButton) => {
// // only works on page load or when the button first appears
// collapsedAccordionButton.click();
// });
// // neither custom mutation or subscriber was consistently working while using preview links
// mutate('accordionButton').customMutation((state, accordionButton) => {
// var observer = new MutationObserver(mutations => {
// for (var mutation of mutations) {
// var attr = mutation.target.getAttribute('aria-expanded');
// if (attr && attr === 'false') {
// // window.evolv_opt302_addSpinnerTransition();
// accordionButton.click();
// }
// }
// });
// observer.observe(accordionButton, { attributes: true });
// });
// }
// // ultimately needed something for pageload to track the last selection made in order to
// // -- deterimine if the continue button should or shouldn't be disabled
// window.evolv_opt302_lastSelectionMade = false;
// // concept 7 only
// function concept7_createFakeButton() {
// // continue button things
// var fakeButton = document.createElement('button');
// fakeButton.innerHTML = 'Continue';
// fakeButton.setAttribute('class', 'evolv-continue-btn');
// fakeButton.onclick = (e) => {
// window.evolv_opt302_addSpinnerTransition();
// updateExistingProgressBar(e);
// };
// return fakeButton;
// }
// function getCheckedInputsLength() {
// var checkedInputs = document.querySelectorAll('[data-loc] input:checked');
// var checkedInputsLength = checkedInputs.length;
// return checkedInputsLength;
// }
// function concept6_removeStaleProgressBar() {
// var progressBar = document.querySelector('.evolv-progressBar');
// if (progressBar) progressBar.remove();
// }
// function scrollToActivateSection(sectionToActivate, scrollToSection = false) {
// sectionToActivate.classList.add('evolv-active-section');
// // scroll to top of page wrapper
// var contentWrapper = sectionToActivate.closest('[class*="StyledGridContainer-VDS"]');
// if(scrollToSection) {
// // 7.1 shouldn't be active so we're scrolling to the section
// contentWrapper = sectionToActivate;
// }
// if (contentWrapper) {
// contentWrapper.scrollIntoView({
// behavior: 'smooth',
// block: 'start'
// });
// }
// }
// // concept 7 only
// function concept7_setActiveSection(section) {
// var safetyNet = 0;
// function pollForSection() {
// var sectionToActivate = document.querySelector(`[data-evolv-section="${section}"]`);
// if (!sectionToActivate) {
// safetyNet++;
// if (safetyNet > 50) return;
// return setTimeout(pollForSection, 50);
// }
// // clear any existing
// var currentActiveSection = document.querySelector('.evolv-active-section');
// if (currentActiveSection) currentActiveSection.classList.remove('evolv-active-section');
// // re-disable the continue button - should exclude the replacement button
// var enabledContinueButton = document.querySelectorAll('.evolv-continue-btn:not(.evolv-disabled):not(.evolv-rpl-button)');
// if (enabledContinueButton.length > 0) {
// var lastSelectionMade = window.evolv_opt302_lastSelectionMade;
// var hasAlreadyHadSelectionMade = sectionToActivate.querySelector('[data-loc] input[aria-checked="true"], [data-loc] input:checked');
// // global exists && is not a change in selection in the same section or
// if (lastSelectionMade && !hasAlreadyHadSelectionMade) {
// enabledContinueButton.forEach(button => button.classList.add('evolv-disabled'));
// }
// }
// scrollToActivateSection(sectionToActivate);
// // sectionToActivate.classList.add('evolv-active-section');
// // // scroll to top of page wrapper
// // var contentWrapper = sectionToActivate.closest('[class*="StyledGridContainer-VDS"]');
// // if (contentWrapper) {
// // contentWrapper.scrollIntoView({
// // behavior: 'smooth',
// // block: 'start'
// // });
// // }
// }
// pollForSection();
// }
// // 6.3 or 7.1 + 6.3 only
// function concept6_setActiveSection(section) {
// if(isACombo || isAComboWith603) {
// // just do concept 7 things
// concept7_setActiveSection(section);
// } else {
// //
// // using a custom here to test the mutate patch for classList instead of polling
// mutate(`${section}Section`).customMutation((state, sectionToActivate) => {
// // clear any existing
// var currentActiveSection = document.querySelector('.evolv-active-section');
// if (currentActiveSection) {
// // can't collapse sections once they're re-opened
// // -- the hidden accordion button no longer works, you must re-make a selection to collapse
// // --- I don't think we want to do that programmatically
// currentActiveSection.classList.remove('evolv-active-section');
// }
// // expand section if
// var collapsedAccordionButton = sectionToActivate.querySelector('.accordionButton[aria-expanded="false"]');
// if (collapsedAccordionButton) collapsedAccordionButton.click();
// // scroll to expanded section
// scrollToActivateSection(sectionToActivate, true);
// });
// }
// }
// function addFreshProgressBar() {
// if (isACombo || isConcept6) concept6_removeStaleProgressBar();
// // update for current selections if any, on page load
// var checkedInputsLength = getCheckedInputsLength();
// // defaults for page load
// var activeSection = 'plans';
// var increment = '16'; // a circle as a starting point
// var unitOfMeasure = '1px';
// var var603EquipClass = 'evolv-incomplete';
// var var603PaymentClass = 'evolv-incomplete';
// switch (checkedInputsLength) {
// case 1: // load state if a plan is already selected
// increment = isACombo ? '55' : '50'; // 55px roughly aligns with the end of the word "Plan"
// if(!isACombo) unitOfMeasure = '1%';
// if (!isAComboWith603 || !isVar701) var603EquipClass = '';
// window.evolv_opt302_lastSelectionMade = activeSection;
// break;
// case 2: // load state if equipment is already selected
// increment = isACombo ? '60' : '95'; // 60 attempts end of "Equipment"
// unitOfMeasure = '1%';
// activeSection = 'equipment';
// var603EquipClass = '';
// if (!isACombo || !isVar701) var603PaymentClass = '';
// window.evolv_opt302_lastSelectionMade = activeSection;
// break;
// case 3: // load state if payment is already selected
// increment = '100'; // complete
// unitOfMeasure = '1%';
// activeSection = 'payment';
// var603EquipClass = '';
// var603PaymentClass = '';
// window.evolv_opt302_lastSelectionMade = activeSection;
// break;
// }
// if (isACombo || isVar701) concept7_setActiveSection(activeSection);
// if (isACombo || isConcept6) {
// var progressBar = document.createElement('div');
// progressBar.classList.add('evolv-progressBar');
// progressBar.innerHTML = `
//
//
//
Plan
//
Equipment
//
Payment
//
//
//
// `;
// // click handling for 6.3
// if(isVar603 || isAComboWith603) {
// var links = progressBar.querySelectorAll('[data-evolv-link]');
// if(links.length > 0) {
// links.forEach(link => {
// link.onclick = e => {
// // hide jerkiness
// window.evolv_opt302_addSpinnerTransition();
// var linkSection = e.target.closest('li').getAttribute('data-evolv-link');
// concept6_setActiveSection(linkSection);
// if (isAComboWith603) {
// updateExistingProgressBar(e);
// // check the activated section for a selection and then enable buttons if necessary
// setTimeout(() => {
// var activatedSection = document.querySelector(`[data-evolv-section="${linkSection}"]`);
// if(activatedSection) {
// var hasSelectionMade = activatedSection.querySelector('[data-loc] input[aria-checked="true"], [data-loc] input:checked');
// var disabledContinueButtons = document.querySelectorAll('.evolv-continue-btn.evolv-disabled');
// if(hasSelectionMade && disabledContinueButtons.length > 0) {
// disabledContinueButtons.forEach(button => button.classList.remove('evolv-disabled'));
// }
// }
// }, 0);
// }
// };
// });
// }
// }
// // add the bar with current progression
// var plansSectionSelector = '[class*="PlanSelection__PlansAccordionContainer"]';
// var stickyHeaderSelector = '[class*="StickyHeader__StickyContainer"]';
// var placementSelector = isVar603 || isAComboWith603 ? stickyHeaderSelector : plansSectionSelector;
// var position = isVar603 || isAComboWith603 ? 'beforeend' : 'beforebegin';
// var placement = document.querySelector(placementSelector);
// if (placement) placement.insertAdjacentElement(position, progressBar);
// }
// }
// // update the existing progress indicator + back button updates
// function concept6_updateIndicator(increment, unitOfMeasure) {
// var progressBar = document.querySelector('.evolv-progress-indicator');
// if (progressBar) {
// progressBar.style.setProperty('--progress', increment);
// progressBar.style.setProperty('--unit', unitOfMeasure);
// }
// }
// // this is only for 6.3 at the moment
// function concept6_activateIndicatorHeaderLinks(section) {
// var progressBar = document.querySelector('.evolv-progress-header');
// if (progressBar) {
// var linkToActivate = progressBar.querySelector(`[data-evolv-link="${section}"]`);
// if(linkToActivate && linkToActivate.classList.contains('evolv-incomplete')) linkToActivate.classList.remove('evolv-incomplete');
// }
// // // 7.3 continue button
// // if(isAComboWith603) {
// // var disabledFakeButtons = document.querySelectorAll('.evolv-continue-btn.evolv-disabled');
// // console.info('hey marcy - disabled button?', disabledFakeButtons);
// // console.info('hey marcy - section', section);
// // if(disabledFakeButtons.length > 0) {
// // var activatedSection = document.querySelector(`[data-evolv-section="${section}"]`);
// // var hasSelectionMade = activatedSection?.querySelector('[data-loc] input:checked');
// // console.info('hey marcy - activated section', activatedSection);
// // console.info('hey marcy - selection made', hasSelectionMade);
// // if (hasSelectionMade) {
// // disabledFakeButtons.forEach(button => {
// // button.classList.remove('evolv-disabled');
// // });
// // }
// // }
// // }
// }
// // transition when there is not a full page load
// // -- fires on continue button and input label clicks
// function updateExistingProgressBar(e) {
// // concept 7 only but null checking target should suffice
// var continueButton = e.target.closest('button'); // won't exist if input label clicked
// // JIC pointer events fail on continue button only
// if (continueButton && continueButton.classList.contains('evolv-disabled')) return;
// //----------------------------------------------
// // 6.3 stuff
// var progressBarLink = e.target.closest('[data-evolv-link]');
// var linkAttribute = progressBarLink ? progressBarLink.getAttribute('data-evolv-link') : false;
// var checkedInputsLength = getCheckedInputsLength();
// // var lastSelectionMade = window.evolv_opt302_lastSelectionMade;
// // defaults
// var increment;
// var unitOfMeasure = '1%';
// // Option selection handling
// var sectionParent = e.target.closest('.mutate-section') || e.target.closest('[data-evolv-section]');
// if (sectionParent || linkAttribute) {
// var sectionName = sectionParent?.getAttribute('data-evolv-section') || linkAttribute;
// switch (sectionName) {
// case 'plans':
// increment = isACombo ? '55' : '50';
// if(isACombo) unitOfMeasure = '1px';
// break;
// case 'equipment':
// increment = isACombo ? '60' : '95';
// if(linkAttribute && isAComboWith603 && checkedInputsLength < 2) increment = '50';
// break;
// case 'payment':
// increment = linkAttribute && isAComboWith603 && checkedInputsLength < 3 ? '95' : '100';
// }
// if (sectionName) {
// if (isACombo || isVar701) {
// concept7_setActiveSection(sectionName);
// window.evolv_opt302_lastSelectionMade = sectionName;
// }
// if (isACombo || isConcept6) {
// if(linkAttribute) {
// // this should only fire on 6.3 combo when you click the link
// concept6_updateIndicator(increment, unitOfMeasure);
// } else {
// // this should only fire on selections
// setTimeout(() => {
// var checkedSelector = '[data-loc] input[aria-checked="true"], [data-loc] input:checked';
// var selectionMadeSuccessfully = sectionParent?.querySelector('[data-loc] input[aria-checked="true"], [data-loc] input:checked');
// if (selectionMadeSuccessfully) {
// if(!isACombo) {
// addFreshProgressBar(); // we don't want the progress bar to move backwards if only 6.2 or 6.3
// } else {
// concept6_updateIndicator(increment, unitOfMeasure);
// }
// }
// }, 100);
// }
// }
// }
// }
// // Continue button handling for concept 7
// if (continueButton) {
// var sectionToAdvanceTo = 'plans';
// var currentActiveSection = document.querySelector('.evolv-active-section');
// var activeSectionName = currentActiveSection.getAttribute('data-evolv-section');
// switch (activeSectionName) {
// case 'plans':
// increment = checkedInputsLength >= 2 ? '60' : '50';
// sectionToAdvanceTo = 'equipment';
// window.evolv_opt302_lastSelectionMade = 'plans';
// break;
// case 'equipment':
// increment = '95';
// if (checkedInputsLength === 3) { // this is the replacement button at this point
// increment = '100';
// var replacementButtons = document.querySelectorAll('.evolv-rpl-button');
// if (replacementButtons.length > 0) {
// replacementButtons.forEach(button => button.remove());
// }
// }
// sectionToAdvanceTo = 'payment';
// window.evolv_opt302_lastSelectionMade = 'equipment';
// break;
// }
// if (activeSectionName) window.evolv_opt302_lastSelectionMade = activeSectionName;
// if (isACombo || isVar701) concept7_setActiveSection(sectionToAdvanceTo);
// if (isACombo || isConcept6) concept6_updateIndicator(increment, unitOfMeasure);
// if (isAComboWith603 || isVar603) concept6_activateIndicatorHeaderLinks(sectionToAdvanceTo);
// }
// }
// if (isACombo || isVar701) {
// // adding a fake button to handle step progression
// mutate('disabledContinueButton').customMutation((state, disabledContinueButton) => {
// var fakeButton = concept7_createFakeButton();
// // if a selection is made and there is a refresh, the continue button shouldn't be disabled
// // -- progress bar code will kick back to the last selected section if you refresh mid-flow
// var checkedInputs = getCheckedInputsLength();
// if (checkedInputs <= 0) fakeButton.classList.add('evolv-disabled');
// var buttonParent = disabledContinueButton.parentNode;
// var staleButton = buttonParent.querySelector('.evolv-continue-btn');
// if(staleButton) staleButton.remove();
// // add the fresh one
// disabledContinueButton.insertAdjacentElement('beforebegin', fakeButton);
// });
// }
// // fresh progress bar on pageload
// mutate('plansSection').customMutation((state, plansSection) => {
// addFreshProgressBar();
// });
// if (isACombo || isVar701) {
// // there's no way to clear selections so once we're all locked in, remove the fake
// mutate('enabledContinueButton').customMutation((state, enabledContinueButton) => {
// var fakeButton = document.querySelector('.evolv-continue-btn');
// if (fakeButton) fakeButton.remove();
// // need to re-set if hitting the back button from the cart
// var activeSection = document.querySelector('.evolv-active-section');
// if (!activeSection) {
// var lastActiveSection = window.evolv_opt302_lastSelectionMade;
// var sectionToSet = 'plans';
// // not sure we actually need this, need to test navigating to and from this page without a payment selected
// // -- mostly needed for backing out of the cart
// if (lastActiveSection) sectionToSet = lastActiveSection;
// concept7_setActiveSection(sectionToSet);
// }
// });
// }
// // enable continue button upon selection + update progress
// mutate('selectionInputLabel').listen('click', (e) => {
// if(isACombo || isConcept6) updateExistingProgressBar(e);
// if (isACombo || isVar701) {
// setTimeout(() => {
// var input = e.target.closest('[data-loc]').querySelector('input');
// if(input && input.checked) { // BYOR no longer is a valid selection without router validation
// window.evolv_opt302_addSpinnerTransition();
// // there are 2 buttons - header + inline
// var disabledFakeButtons = document.querySelectorAll('.evolv-continue-btn.evolv-disabled');
// if (disabledFakeButtons.length > 0) {
// disabledFakeButtons.forEach(button => {
// button.classList.remove('evolv-disabled');
// });
// }
// }
// }, 0);
// }
// });
// if (isACombo || isVar701) {
// // adding a back button since we're disabling the accordion and hiding sections altogether
// mutate('sectionHeadline').customMutation((state, sectionHeadline) => {
// var sectionParent = sectionHeadline.closest('[data-evolv-section]');
// if (!sectionParent) return;
// var sectionName = sectionParent.getAttribute('data-evolv-section');
// if (sectionName && sectionName !== 'plans') { // only equip and payament need a back button
// var arrowSVG = ``;
// var backButtonContainer = document.createElement('div');
// backButtonContainer.classList.add('evolv-back-button-wrapper');
// backButtonContainer.innerHTML = ``;
// var backButton = backButtonContainer.querySelector('button');
// backButton.onclick = () => {
// if (sectionName === 'equipment' || sectionName === 'payment') {
// var increment = '55';
// var unitOfMeasure = '1px';
// var previousSection = 'plans';
// if (sectionName === "payment") {
// increment = '60';
// unitOfMeasure = '1%';
// previousSection = 'equipment';
// }
// window.evolv_opt302_addSpinnerTransition();
// // update things
// concept7_setActiveSection(previousSection);
// if (isACombo) concept6_updateIndicator(increment, unitOfMeasure);
// window.evolv_opt302_lastSelectionMade = sectionName; // regress completion progress
// // re-enable continue button so we don't have to click the selection again
// // -- the selection is remembered in BAU
// var ogFakeButtons = document.querySelectorAll('.evolv-continue-btn');
// if (ogFakeButtons.length > 0) {
// ogFakeButtons.forEach(button => {
// if (button.classList.contains('evolv-disabled')) button.classList.remove('evolv-disabled');
// });
// }
// // if you hit the back button after making a selection on the payment step,
// // -- we need to bring back the fake continue
// var checkedInputsLength = getCheckedInputsLength();
// if (checkedInputsLength <= 2) return;
// // this new button should get removed in the click handler in updateExistingProgressBar
// var checkoutButtons = document.querySelectorAll('.mutate-enabledContinueButton');
// if (checkoutButtons.length > 0) {
// checkoutButtons.forEach(button => {
// var newFakeButton = concept7_createFakeButton();
// newFakeButton.classList.add('evolv-rpl-button');
// button.insertAdjacentElement('beforebegin', newFakeButton);
// });
// }
// }
// };
// var accordionWrapper = sectionHeadline.closest('button');
// if (accordionWrapper && !accordionWrapper.parentNode.querySelector('.evolv-back-button')) accordionWrapper.insertAdjacentElement('beforebegin', backButtonContainer);
// }
// });
// }
// }, 0);
};
;
};
evolv.javascript.variants["evolv_web_nz98arr5l"].timing = "immediate";
evolv.javascript.variants["evolv_web_l682b37zp_bsvh4l7xl"] = function (resolve, reject) {
window.evolvTrack('opt317', '06_02');
function scrollToSection (spinnerInt = 5000) {
window.evolv_opt317_addSpinnerTransition(spinnerInt);
// generous time out needed to wait for BAU scrolling to finish
setTimeout(() => {
var checkedInputs = document.querySelectorAll('input:checked').length;
var nextSection = 'top';
switch (checkedInputs) {
case 1:
nextSection = '#primaryEquipmentSel';
break;
case 2:
nextSection = '#routerPaymentSel';
break;
}
if (nextSection === 'top') {
return document.documentElement.scrollTop = 0;
} else {
var el = document.querySelector(nextSection);
if(el) {
return el.scrollIntoView({ behavior: 'smooth', block: 'center' });
}
}
}, 4000);
}
// sections no longer disappear in BAU on collapse so CSS is being used to force expanded
mutate('paymentSectionAccordionButton', this.key).customMutation((state, paymentSectionAccordionButton) => {
// on page load
scrollToSection();
// on interaction
mutate('inputLabels', this.key).listen('click', (e) => {
// we need a little longer for this treatment since we're chaining clicks below
var int = !e.isTrusted ? 8500 : 5000;
scrollToSection(int);
});
});
mutate('plansTenButton', this.key).customMutation((state, plansTenButton) => {
var plansInputContainer = plansTenButton.closest('[class*="PlanSelection__PlanCardGroup-sc"]');
if(!plansInputContainer) return;
setTimeout(() => {
var existingPlansSelection = plansInputContainer.querySelector('input:checked');
if(!existingPlansSelection) plansTenButton.click();
}, 100);
});
mutate('routerButton', this.key).customMutation((state, routerButton) => {
var routerInputContainer = routerButton.closest('[class*="EquipmentSection__EquipmentCardGroup-sc"]');
if(!routerInputContainer) return;
setTimeout(() => {
var existingRouterSelection = routerInputContainer.querySelector('input:checked');
if(!existingRouterSelection) routerButton.click();
}, 500);
});
mutate('payMonthlyButton', this.key).customMutation((state, payMonthlyButton) => {
var paymentInputContainer = payMonthlyButton.closest('[class*="RouterPayment__PaymentCardGroup-sc"]');
if(!paymentInputContainer) return;
setTimeout(() => {
var existingPaymentSelection = paymentInputContainer.querySelector('input:checked');
if(!existingPaymentSelection) {
payMonthlyButton.click();
}
}, 500);
});;
};
evolv.javascript.variants["evolv_web_l682b37zp_bsvh4l7xl"].timing = "immediate";
evolv.javascript.variants["evolv_web_l682b37zp_rrk569oba"] = function (resolve, reject) {
window.evolvTrack('opt317', '07_01');
// We're taking over the BAU modal that renders at 3 minutes idle
// - we're only firing the first time it shows up since the BAU modal continues
// - to return every 3 minutes if you hit "yes" or reload.
// - hitting "no" redirects to the homepage and may clear the cart
mutate('idleModalYesButton', this.key).customMutation((state, idleModalYesButton) => {
// limit to once per load
if (window.evolv_opt317_modal_shown) return;
var portal = idleModalYesButton.closest('#portal');
var closeButton = portal?.querySelector('#modal-close-button');
if (!closeButton) return;
var takeoverContent = document.createElement('div');
takeoverContent.classList.add('evolv-takeover');
takeoverContent.innerHTML = `
Did you know?
LTE Business Internet is a reliable and affordable plug and play internet solution.
No annual service contracts
30-day satisfaction guarantee
Up to a $1,500 switch allowance
Use as primary or backup connectivity
Connect operations on the go
No early termination fee
It’s fast enough for day to day business needs, especially in remote areas. Learn more.
`;
// odd instance where BAU clicks aren't working for unknown reasons so just adding some fallbacks
var gotItButton = takeoverContent.querySelector('button') || document.querySelector('.evolv-takeover button');
if (gotItButton) gotItButton.onclick = () => {
var close = idleModalYesButton ?? document.querySelector('#modal-close-button');
return close.click();
};
// takeover modal
var dialogParent = idleModalYesButton.closest('[class*="IdleModal__SessionIdleModal"]');
// same selector used in selector so should exist but JIC
if(dialogParent) {
if(!dialogParent.querySelector('.evolv-takeover')) dialogParent.insertAdjacentElement('beforeend', takeoverContent);
portal.classList.add('evolv-modal-active');
portal.setAttribute('data-evolv-modal-active', true); // suspected class overwrite
// so it only shows once until a refresh
window.evolv_opt317_modal_shown = true;
}
});
// SPA handling
window.addEventListener('evolv_opt317_spaChange', () => {
var plansPath = '/business/shop/products/networks/connectivity/lte-business-internet/plans';
var modalShown = window.evolv_opt317_modal_shown;
// reset to bring it back on next page load
if(modalShown && window.location.pathname.indexOf(plansPath) === -1) modalShown = false;
});;
};
evolv.javascript.variants["evolv_web_l682b37zp_rrk569oba"].timing = "immediate";
evolv.javascript.variants["evolv_web_l682b37zp_vo3imuqf8"] = function (resolve, reject) {
window.evolvTrack('opt317', '10_01');
mutate('planCardSpeed', this.key).customMutation((state, planCardSpeed) => {
var planSize = (/\d+/).exec(planCardSpeed.textContent)[0];
var eyebrowCopy = {
'10': 'Fast',
'25': 'Faster',
'50': 'Fastest'
};
if (planSize && eyebrowCopy[planSize]) {
if (!planCardSpeed.parentNode.querySelector('.evolv-eyebrow')) planCardSpeed.insertAdjacentHTML('beforebegin', `
${eyebrowCopy[planSize]}
`);
}
});;
};
evolv.javascript.variants["evolv_web_l682b37zp_vo3imuqf8"].timing = "immediate";
evolv.javascript.variants["evolv_web_l682b37zp_sufh8fjzc"] = function (resolve, reject) {
//#region Generated Code
mutate('fo2zu0nre', this.key).hide();
mutate('lu5ydxslj', this.key).html('1.Select an LTE Business Internet plan');
mutate('hs30nhrcz', this.key).styles({
'paddingTop': '10px'
});
mutate('lqwjhq6bs', this.key).styles({
'maxWidth': '95%'
});
mutate('selected-state-plan-title-wfqfqoc8d', this.key).html('1.Selected LTE Business Internet plan');
//#endregion
window.evolvTrack('opt317', '12_01');
;
};
evolv.javascript.variants["evolv_web_l682b37zp_sufh8fjzc"].timing = "immediate";
evolv.javascript.variants["evolv_web_l682b37zp_hl4mh4v61"] = function (resolve, reject) {
};
evolv.javascript.variants["evolv_web_l682b37zp_hl4mh4v61"].timing = "immediate";
evolv.javascript.variants["evolv_web_l682b37zp"] = function (resolve, reject) {
//#region Generated Code
collect(".PlanSelection__TitleContainer-sc-yfzpoz-3 > .StyledTypography-VDS__sc-5k55co-0,.PlanSelection__GridContainer-sc-yfzpoz-2 > .StyledTypography-VDS__sc-5k55co-0", "lu5ydxslj");
collect(".enWfxA", "hs30nhrcz");
collect("[class*=\"TooltipIconWrapper-VDS__sc\"] [class*=\"DialogWrapper-VDS__sc\"]", "35miw4zop");
collect(".PlanSelection__GridContainer-sc-yfzpoz-2 > .StyledTypography-VDS__sc-5k55co-0", "lqwjhq6bs");
collect("[class*=\"HeroSection__HeroDiv-sc\"],.evolv-right-rail-header", "fo2zu0nre");
collect([".StyledAccordionButton-VDS__sc-19osi3m-2 > .kBGwvz", ".StyledAccordionButton-VDS__sc-19osi3m-2 > .cbwlmO"], "selected-state-plan-title-wfqfqoc8d");
//#endregion
var scope = '.landing4g';
var plansSectionScope = `${scope} #plansContainer`;
var routerSectionScope = `${scope} #primaryEquipmentSel`;
var paymentSectionScope = `${scope} #routerPaymentSel`;
var COLLECT_MAP = {
// easier section identification - see below
'plansSection': plansSectionScope,
'routerSection': routerSectionScope,
'paymentSection': paymentSectionScope,
// general/spinner
'pageContent': `${scope} [class*="HeroSection__HeroDiv"] ~ div[style]:not([class*="LandingPage4G__ChatDiv"])`,
// combo 24 softcode
'headline': `${scope} [class*="HeroSection__HeroDiv-sc"] h1`,
'subHeader': `${scope} [class*="HeroSection__HeroDiv-sc"] [class*="SubtitleWrapper-VDS__sc"] h2, ${scope} .evolv-right-rail-header h1 + h2`,
'loopQualEyebrow': `${scope} [class*="HeroSection__TitleLockupLQ-sc"] h2`,
'contentWrapper': `${scope} [class*="HeroSection__HeroDiv"] ~ div:not([class*="LandingPage4G__"]) > [class*="StyledGridContainer-VDS__"] > [class*="RowWrapper-VDS__"] > div`,
'contentInner': `.mutate-contentWrapper > div:not(.evolv-left-rail)`,
'addedLeftRail': `.evolv-left-rail`,
// 6.1
'plansSectionAccordionButton': `${plansSectionScope} .accordionButton`,
'routerSectionAccordionButton': `${routerSectionScope} .accordionButton`,
'paymentSectionAccordionButton': `${paymentSectionScope} .accordionButton`,
'enabledCheckoutContinueButton': `[class*="LandingPage4G__CheckoutButton"]:not([disabled])`,
// all accordions and input labels
'accordionButton': `${scope} .accordionButton`,
'inputLabels': `${scope} [data-loc] label`,
// 6.2
'plansTenButton': `${plansSectionScope} [data-loc*="10"] button`,
'routerButton': `${routerSectionScope} input[name="router"] + label button`,
'payMonthlyButton': `${paymentSectionScope} [data-loc*="monthly"] button`,
// 7.1
'idleModalYesButton': `#portal [class*="IdleModal__SessionIdleModal"] button[aria-label="Yes"]`,
// 10.1
'planCardSpeed': `${plansSectionScope} [class*="PlanCard__FourGFiveGPlanBoxWrap-sc"] h4`,
//11
'originalPlanCardContent': `${plansSectionScope} [class*="PlanSelection__CardContent"] h4 ~ p`,
};
Object.keys(COLLECT_MAP).forEach(mutateKey => {
var selector = COLLECT_MAP[mutateKey];
collect(selector, mutateKey);
});
// adding some section-level attributes for easier identification in events
mutate('plansSection', this.key).customMutation((state, plansSection) => {
plansSection.setAttribute('data-evolv-section', 'plans');
});
mutate('routerSection', this.key).customMutation((state, routerSection) => {
routerSection.setAttribute('data-evolv-section', 'router');
});
mutate('paymentSection', this.key).customMutation((state, paymentSection) => {
paymentSection.setAttribute('data-evolv-section', 'payment');
});
window.evolv_opt317_addSpinnerTransition = (interval = 2000) => {
// var pageContent = document.querySelector(`${scope} [class*="HeroSection__HeroDiv"] ~ div[style]:not([class*="LandingPage4G__ChatDiv"])`);
// if(!pageContent) return;
mutate('pageContent', this.key).customMutation((state, pageContent) => {
var body = document.body;
body.classList.add('evolv-spinner-active'); // not sure if getting replaced
body.setAttribute('evolv-spinner-active', true);
var cssProp = parseInt(interval); // just in case because we have math in the css
if (typeof cssProp === 'number') body.style.setProperty('--interval', cssProp);
// so we can keep the spinner centered
var spinner = document.createElement('div');
spinner.setAttribute('class', 'evolv-spinner-container');
spinner.innerHTML = '';
var spinnerAlreadyAdded = document.querySelector('.evolv-spinner');
if(!spinnerAlreadyAdded) {
pageContent.insertAdjacentElement('beforeend', spinner);
setTimeout(() => {
if(document.querySelector('.evolv-spinner')) spinner.remove();
if(body.classList.contains('evolv-spinner-active')) body.classList.remove('evolv-spinner-active');
var bodyAttribute = body.getAttribute('evolv-spinner-active');
if(bodyAttribute && bodyAttribute === 'true') {
body.setAttribute('evolv-spinner-active', false);
}
}, interval);
}
});
};
// SPA handling
if (!window.evolv_opt317_spaListener) {
window.evolv_opt317_spaListener = true;
window.history.pushState = (f => function pushState() {
var ret = f.apply(this, arguments);
window.dispatchEvent(new Event('evolv_opt317_spaChange'));
return ret;
})(window.history.pushState);
window.history.replaceState = (f => function replaceState() {
var ret = f.apply(this, arguments);
window.dispatchEvent(new Event('evolv_opt317_spaChange'));
return ret;
})(window.history.replaceState);
window.addEventListener('popstate', () => {
window.dispatchEvent(new Event('evolv_opt317_spaChange'));
});
}
// ===[ Softcode Combo 24 ]=== //
// 2.1 - Mimic PDP Layout (JS is mostly for this variant)
// 3.1 - Sub-header “no annual service contract” (1-liner JS rolled into 2.1)
// 4.1 - Compare CTA as a text link, and moved (css only)
// 8.1 - Remove dynamic IP copy (note this might come back when another router is offered) (css only)
// revision - create a carousel for the thumbnail in the left rail
window.evolvTrack('opt317', 'newControl');
// adding the left rail with the image
mutate('contentWrapper', this.key).customMutation((state, contentWrapper) => {
var arrowSVG = ``;
var currentSlide = 0;
var leftRail = document.createElement('div');
leftRail.classList.add('evolv-left-rail');
leftRail.innerHTML = `
`;
if (!document.querySelector('.evolv-left-rail')) contentWrapper.insertAdjacentElement('afterbegin', leftRail);
var arrows = leftRail.querySelectorAll('.evolv-pagination-arrow button');
if (arrows.length > 0) {
arrows.forEach(arrow => {
arrow.onclick = e => {
var button = e.target.closest('[data-evolv-direction]');
var currentPosition = button?.closest('[data-evolv-position]');
var direction = button?.getAttribute('data-evolv-direction');
if (!(currentPosition && direction)) return;
switch (direction) {
case 'right':
currentSlide++;
break;
case 'left':
currentSlide--
break;
default:
return;
};
currentPosition.setAttribute('data-evolv-position', currentSlide);
};
});
}
});
// Placement is different for mobile so just duplicating for desktop
mutate('contentInner', this.key).customMutation((state, contentInner) => {
var sectionHeader = document.createElement('div');
sectionHeader.classList.add('evolv-right-rail-header');
// mutate classes are not relaible alone
var headline = document.querySelector('.mutate-headline') || document.querySelector('.landing4g [class*="HeroSection__HeroDiv-sc"] h1');
var subheadline = document.querySelector('.mutate-subHeader') || document.querySelector('.landing4g [class*="HeroSection__HeroDiv-sc"] [class*="SubtitleWrapper-VDS__sc"] h2');
var loopQualEyebrow = document.querySelector('.mutate-loopQualEyebrow') || document.querySelector('.landing4g [class*="HeroSection__TitleLockupLQ-sc"] h2');
if (headline) {
// it's only ever going to be one or the other
// 3.1 copy change rolled into this
var newSubCopy = 'No annual service contract. No early termination fees.';
if (subheadline) subheadline.textContent = newSubCopy;
var subCopy = subheadline ? newSubCopy : '';
var loopCopy = loopQualEyebrow ? loopQualEyebrow.textContent : '';
sectionHeader.innerHTML = `
${loopCopy}
${headline.textContent}
${subCopy}
`;
if (subheadline || loopQualEyebrow) {
// sometimes applies twice so might as well leverage in case something changes
var staleHeader = document.querySelector('.evolv-right-rail-header');
if (staleHeader) staleHeader.remove();
contentInner.insertAdjacentElement('afterbegin', sectionHeader);
headline.parentNode.classList.add('evolv-hide');
// don't want to hide the hero if this doesn't work
}
}
});
;
};
evolv.javascript.variants["evolv_web_l682b37zp"].timing = "immediate";
evolv.javascript.variants["evolv_web_wm9xzwisz_k6udwogps"] = function (resolve, reject) {
};
evolv.javascript.variants["evolv_web_wm9xzwisz_k6udwogps"].timing = "immediate";
evolv.javascript.variants["evolv_web_wm9xzwisz_w39gaa6eu"] = function (resolve, reject) {
window.evolvTrack('opt315', '02_01');
// ended up having to refactor the whole approach because moving things
// was breaking things when you had multiple devices and returned to change the plan
mutate('selectPlanCta').customMutation((state, selectPlanCta) => {
var businessPlanCardTileContainer = selectPlanCta.closest('[class*="BusinessPlanCard__TileContainer"]');
var planTitleTopSection = businessPlanCardTileContainer?.querySelector('[class*="BusinessPlanCard__TopSection"]');
var fakeButton = document.createElement('button');
fakeButton.classList.add('evolv-select-button');
fakeButton.innerHTML = selectPlanCta.innerHTML;
fakeButton.onclick = () => {
selectPlanCta.click();
// this is to update the button copy when you stay on the page after a change
var cardGrid = selectPlanCta.closest('[class*="BusinessPlans__PlanGrid"]');
if(cardGrid) {
var allFakeButtons = cardGrid.querySelectorAll('.evolv-select-button');
if(allFakeButtons.length > 0) {
allFakeButtons.forEach(btn => {
var bauButton = btn.parentNode.parentNode.querySelector(':scope > button');
if (bauButton) btn.innerHTML = bauButton.innerHTML;
});
}
}
};
if(planTitleTopSection && !planTitleTopSection.querySelector('.evolv-select-button')) planTitleTopSection.insertAdjacentElement('beforeend', fakeButton);
mutate('appliedToLinesLabel').customMutation((state2, appliedToLinesLabel) => {
var cardGrid = appliedToLinesLabel.closest('[class*="BusinessPlans__PlanGrid"]');
var movedCta = appliedToLinesLabel.parentNode.querySelector('.evolv-select-button');
if(movedCta && cardGrid) {
var labelClone = document.createElement('div');
labelClone.classList.add('evolv-applied-label');
labelClone.innerHTML = appliedToLinesLabel.innerHTML;
// remove stale label from any card, not just current one
var staleLabel = cardGrid.querySelector('.evolv-applied-label');
if(staleLabel) staleLabel.remove();
movedCta.insertAdjacentElement('afterend', labelClone);
// for styling unselected cards
cardGrid.classList.add('evolv-selection-made');
}
});
});
;
};
evolv.javascript.variants["evolv_web_wm9xzwisz_w39gaa6eu"].timing = "immediate";
evolv.javascript.variants["evolv_web_wm9xzwisz_yx4a0tfw4"] = function (resolve, reject) {
window.evolvTrack('opt315', '03_01');;
};
evolv.javascript.variants["evolv_web_wm9xzwisz_yx4a0tfw4"].timing = "immediate";
evolv.javascript.variants["evolv_web_wm9xzwisz_xflfrr0m5"] = function (resolve, reject) {
window.evolvTrack('opt315', '04_02');
mutate('promoBadgeCopy').text('Get a device promo with this plan.');;
};
evolv.javascript.variants["evolv_web_wm9xzwisz_xflfrr0m5"].timing = "immediate";
evolv.javascript.variants["evolv_web_wm9xzwisz_rjuhtnkj9"] = function (resolve, reject) {
window.evolvTrack('opt315', '05_02');
// this is the same as 5.1 but with thumbnails removed and slighly different
// -- style and button copy
mutate('addDevicesButton').listen('click', e => {
var modal = document.createElement('div');
modal.classList.add('evolv-gw-modal');
modal.innerHTML = `