• 1
• 2
• 3
• 4
• 5
• 6
• 7
• 8
• 9
• 10
• 11
• 12
• 13
• 14
• 15
• 16
• 17
• 18
• 19
• 20
• 21
• 22
• 23
• 24
• 25
• 26
• 27
• 28
• 29
• 30
• 31
• 32
• 33
• 34
• 35
• 36
• 37
• 38
• 39
• 40
• 41
• 42
• 43
• 44
• 45
• 46
• 47
• 48
• 49
• 50
• 51
• 52
• 53
• 54
• 55
• 56
• 57
• 58

// 3 MONTHS
threeMonthText = "<div class='prod-desc'>Try our fully immersive language curriculum,<br>set to your brain’s natural learning ability.</div><a href='#' id='showlangs'>SELECT A LANGUAGE</a>";

document.querySelector(".product[data-level='3'] .body .pricing").insertAdjacentHTML('afterend', threeMonthText);
$op = document.querySelector(".product[data-level='3'] .body .original-price");
$opElement = document.querySelector(".product[data-level='3'] .body").removeChild($op);
document.querySelector(".product[data-level='3'] .footer").insertAdjacentElement('beforeend',$opElement);

// 12 MONTHS
twelveMonthText = "<div class='prod-desc'>Spend a year working on as many languages as you like with course goals set to your pace.</div>";

document.querySelector(".product[data-level='12-u'] .body .pricing").insertAdjacentHTML('afterend', twelveMonthText);
$op = document.querySelector(".product[data-level='12-u'] .body .original-price");
$opElement = document.querySelector(".product[data-level='12-u'] .body").removeChild($op);
document.querySelector(".product[data-level='12-u'] .footer").insertAdjacentElement('beforeend',$opElement);

// LIFETIME U
lifetimeText = "<div class='prod-desc'>Immerse yourself in all 24 of our languages, and our award-winning auxiliary tools, for as long as you want.</div>";

document.querySelector(".product[data-level='lifetime-u'] .body .pricing").insertAdjacentHTML('afterend', lifetimeText);
$op = document.querySelector(".product[data-level='lifetime-u'] .body .original-price");
$opElement = document.querySelector(".product[data-level='lifetime-u'] .body").removeChild($op);
document.querySelector(".product[data-level='lifetime-u'] .footer").insertAdjacentElement('beforeend',$opElement);

// LIFETIME PLUS
lifetimeplusText = "<div class='prod-desc'>Unlock all 24 languages plus <strong>12 months of Unlimited Live Coaching</strong> with our native-speaking experts to deepen and accelerate your learning.</div>";

document.querySelector(".product[data-level='lifetimeplus-u'] .body .pricing").insertAdjacentHTML('afterend', lifetimeplusText);
$op = document.querySelector(".product[data-level='lifetimeplus-u'] .body .original-price");
$opElement = document.querySelector(".product[data-level='lifetimeplus-u'] .body").removeChild($op);
document.querySelector(".product[data-level='lifetimeplus-u'] .footer").insertAdjacentElement('beforeend',$opElement);

var closeX = "<span style='position:absolute; right: 16px; top: -4px; color: #fff;font-size: 52px;cursor: pointer', id='close-langs'>&times;</span>";
document.querySelector('#langswrap').insertAdjacentHTML('afterbegin', closeX);

// Show lang dialog when 'select a lang' is clicked in 3m
document.querySelector("#showlangs").addEventListener('click', function (e) {
	e.preventDefault()
    $nuxt.$children[1].$children[1].$children[0].abTest = {showlangs: true}
})


// Hide lang dialog when X is clicked
document.querySelector("#close-langs").addEventListener('click', function () {
    $nuxt.$children[1].$children[1].$children[0].abTest = {showlangs: false}
})

// lifetimeplus footer text
document.querySelector('.product[data-level="lifetimeplus-u"] .footer a')
.insertAdjacentHTML('afterend', "<div style='text-align:center;width: 160px; color:#4b4b4b;font-size:10px;line-height:12px; margin: 0 auto'>After that, keep Unlimited Live Coaching for just $129 a year</div>")

// Make 3m disabled
document.querySelector(".product[data-level='3'] .footer a").classList.add("disabled")

// Prevent clicks on 3m cart link if its disabled.
document.querySelector(".product[data-level='3'] .footer a.disabled").addEventListener("click", function(e) {
    return
});