// ============================================= // Julbo Custom Code // ============================================= // ----- Loading overlay to smooth auto-selection steps ----- function julboShowOverlay() { var modal = document.querySelector('#lensadvizor-prescription-modal .la-prescription-modal-content') if (!modal || modal.querySelector('#julbo-loading-overlay')) return modal.style.position = 'relative' var overlay = document.createElement('div') overlay.id = 'julbo-loading-overlay' overlay.innerHTML = '

Loading...' modal.appendChild(overlay) // Safety: auto-remove after 8s to prevent permanent stuck state setTimeout(function() { julboHideOverlay() }, 8000) } function julboHideOverlay() { var overlay = document.querySelector('#julbo-loading-overlay') if (!overlay) return overlay.classList.add('julbo-fade-out') setTimeout(function() { if (overlay.parentElement) overlay.parentElement.removeChild(overlay) }, 200) } // ----- Helper: Read PDP selections ----- // Collects values from all checked radio inputs on the PDP. // Used to auto-select matching options inside the LensAdvisor modal. function getJulboPdpSelections() { var values = [] document.querySelectorAll('input[type="radio"]:checked').forEach(function(inp) { values.push(inp.value.trim()) }) return values } // ----- Helper: Click first radio whose value matches any PDP value ----- function julboClickMatchingRadio(selector, pdpValues) { if (!pdpValues.length) return false var clicked = false document.querySelectorAll(selector).forEach(function(radio) { if (clicked) return var radioVal = radio.value.trim() for (var i = 0; i < pdpValues.length; i++) { if (radioVal === pdpValues[i]) { radio.click() clicked = true return } } }) return clicked } // ----- Show overlay before prescription type step renders ----- document.addEventListener('LensAdvizor:component:WillMount', function(evt) { if (evt.detail.eventType !== 'LensAdvizor:prescriptionTypes:rendered') return var pdpValues = getJulboPdpSelections() if (!pdpValues.length) return julboShowOverlay() }) // ----- Main DidMount handler for all auto-selection and form customization ----- document.addEventListener('LensAdvizor:component:DidMount', function(evt) { var step = evt.detail.eventType switch (step) { // 1. Skip Prescription Type step — auto-select matching type case 'LensAdvizor:prescriptionTypes:rendered': { var pdpValues = getJulboPdpSelections() if (!pdpValues.length) return var matchingType = (LensAdvizor.prescriptionTypes || []).find(function(pt) { return pdpValues.indexOf(pt.title.trim()) !== -1 }) if (matchingType) { LensAdvizor._onPrescriptionTypeChange({ target: { value: matchingType.id } }) } else { // Fallback: click the matching radio by label text document.querySelectorAll('.la-choose-prescription-wrapper .la-tap-select').forEach(function(radio) { var label = radio.nextElementSibling || radio.parentElement var title = label ? label.querySelector('.la-label-title') : null if (title && pdpValues.indexOf(title.textContent.trim()) !== -1) { radio.click() } }) } return } // 2. Auto-select Lens Option 1 case 'LensAdvizor:lensOption1:rendered': { var pdpValues = getJulboPdpSelections() if (!pdpValues.length) return setTimeout(function() { julboClickMatchingRadio('.la-render-options .la-tap-select', pdpValues) }, 150) return } // 3. Auto-select Lens Option 2 + filter invalid combinations case 'LensAdvizor:lensOption2:rendered': { var pdpValues = getJulboPdpSelections() var selectedOption1 = LensAdvizor.response.lensOptionsSelected['option1'] if (!selectedOption1) return // Filter to only lens types valid for the selected option1 var variants = LensAdvizor.response.lens.variants var validTypes = {} variants.forEach(function(v) { if (v.option1 === selectedOption1) { validTypes[v.option2.trim()] = true } }) document.querySelectorAll('.la-render-options .la-label-btn-wrapper').forEach(function(wrapper) { var radio = wrapper.querySelector('.la-tap-select') if (radio && !validTypes[radio.value.trim()]) { wrapper.style.display = 'none' } }) if (pdpValues.length) { setTimeout(function() { julboClickMatchingRadio('.la-render-options .la-tap-select', pdpValues) }, 150) } return } // 4. Manual entry form: hide overlay + back arrow + PD/usage fixes + expiration validation + line item properties case 'LensAdvizor:render:manualEntryForm': { julboHideOverlay() // Hide back arrow — previous steps were auto-skipped document.querySelectorAll('.la-steeper-back').forEach(function(btn) { btn.style.display = 'none' }) // Force single PD and hide the toggle row // var singlePdRadio = document.querySelector('#la-pd-field-single') // if (singlePdRadio) { // var radioRow = singlePdRadio.closest('.la-flex.la-column-gap-1-5') // if (radioRow) radioRow.style.display = 'none' // if (!singlePdRadio.checked) singlePdRadio.click() // } // Prescription Expiration: require future date setTimeout(function() { var expiryInput = document.querySelector('input[data-field="expirationDate"]') if (expiryInput) { var tomorrow = new Date() tomorrow.setDate(tomorrow.getDate() + 1) expiryInput.setAttribute('min', tomorrow.toISOString().split('T')[0]) if (!expiryInput.parentElement.querySelector('.julbo-expiry-error')) { expiryInput.insertAdjacentHTML('afterend', '') } expiryInput.addEventListener('change', function() { var errorMsg = expiryInput.parentElement.querySelector('.julbo-expiry-error') if (expiryInput.value && expiryInput.value < expiryInput.getAttribute('min')) { if (errorMsg) errorMsg.style.display = 'block' expiryInput.value = '' LensAdvizor.response.manually.provider.expirationDate = '' } else { if (errorMsg) errorMsg.style.display = 'none' } }) } }, 100) // Inject hidden la-properties inputs so Customer Name and Prescription Expiration // appear as Shopify line item properties on the order setTimeout(function() { var form = document.querySelector('#la-prescription-form') || document.querySelector('.la-prescription-wrapper') if (!form) return if (!form.querySelector('input[name="la-properties[Customer Name]"]')) { var nameInput = document.createElement('input') nameInput.type = 'hidden' nameInput.name = 'la-properties[Customer Name]' form.appendChild(nameInput) var patientField = document.querySelector('input[data-field="customerName"]') if (patientField) { nameInput.value = patientField.value || '' patientField.addEventListener('input', function() { nameInput.value = patientField.value }) } } if (!form.querySelector('input[name="la-properties[Prescription Expiration]"]')) { var expiryHidden = document.createElement('input') expiryHidden.type = 'hidden' expiryHidden.name = 'la-properties[Prescription Expiration]' form.appendChild(expiryHidden) var expiryField = document.querySelector('input[data-field="expirationDate"]') if (expiryField) { expiryHidden.value = expiryField.value || '' expiryField.addEventListener('change', function() { expiryHidden.value = expiryField.value }) } } }, 150) // Add support link below confirmation checkbox setTimeout(function() { var checkbox = document.querySelector('#la-upload-confirmation') if (!checkbox) return var wrapper = checkbox.closest('.la-prescription-fields-wrapper') if (!wrapper || wrapper.querySelector('.julbo-support-link')) return wrapper.insertAdjacentHTML('beforeend', '

' + 'Having trouble deciding? Learn more about our RX lab and processes HERE.' + '

') }, 100) // Rx Validation: trigger setup from the reliable existing DidMount handler if (typeof julboSetupRxValidation === 'function') { setTimeout(julboSetupRxValidation, 250) } return } // 5. Restore back arrow on steps after manual entry case 'LensAdvizor:lens:rendered': case 'LensAdvizor:lensOptions:rendered': case 'LensAdvizor:addOns:rendered': case 'LensAdvizor:review:rendered': { document.querySelectorAll('.la-steeper-back').forEach(function(btn) { btn.style.display = '' }) return } } }) // ----- Hide overlay on error ----- document.addEventListener('LensAdvizor:action:exception', function() { julboHideOverlay() }) // ----- Add support link on PDP near Select Lenses button ----- document.addEventListener('LensAdvizor:init:complete', function() { setTimeout(function() { document.querySelectorAll('[id="la-select-lenses-btn"]').forEach(function(btn) { var parent = btn.parentElement if (!parent || parent.querySelector('.julbo-pdp-support-link')) return parent.insertAdjacentHTML('beforeend', '

' + 'Having trouble deciding? Learn more about our RX lab and processes HERE.' + '

') }) }, 200) }) // ----- Hide Gorgias chat when LensAdvisor opens, show on close ----- document.addEventListener('LensAdvizor:selectLensModal:open', function() { var chat = document.querySelector('#gorgias-chat-container') if (chat) chat.style.display = 'none' }) document.addEventListener('LensAdvizor:selectLensModal:close', function() { var chat = document.querySelector('#gorgias-chat-container') if (chat) chat.style.display = '' }) // ============================================= // Julbo Rx Validation — Per-Frame Prescription Limits // ============================================= // Reads rxValidation from LensAdvizor._options.rxValidation (per-frame metafield config). // Disables invalid dropdown options and blocks submission on invalid combinations. // All functions prefixed with julboRx to avoid global namespace collisions. // // Validation model (confirmed by Julbo / French RX lab, Jun 2026): // The PD band sets the allowable range for the COMBINED Sphere + Cylinder value // (for progressives, Sphere + Cylinder + ADD). It is NOT a limit on the Sphere // on its own, and there is no separate frame-wide total-power cap. // // 1. Monocular PD (MPD) selects one of the 5 per-frame pdRanges. // 2. Each pdRange carries comboMax / comboMin — the max/min of SPH + CYL (+ ADD): // // comboMin <= SPH + CYL + ADD <= comboMax // // (ADD = 0 for single vision, so the rule degenerates to SPH + CYL.) // // 3. Given the selected SPH (and ADD), the Cylinder options are bounded: // CYL_max = comboMax - SPH - ADD CYL_min = comboMin - SPH - ADD // both clamped to the frame's physical +/- maxCyl cap. // // 4. ADD (progressive) is bounded by the remaining positive budget: // ADD_max = comboMax - SPH - CYL // // Per Julbo (Jun 2026), progressives currently use the SAME per-PD limits as single // vision, with ADD counted inside the combined sum. If that changes later, only the // per-frame data (comboMax/comboMin for the progressive type) needs updating. // // Backward-compat: if a frame's metafield has not yet been migrated to // comboMax/comboMin, the code falls back to that range's existing sphMax/sphMin and // applies them as the combined cap (same numbers, corrected meaning), so the fix is // live on paste even before the metafield data is updated. // ============================================= var julboRxErrorMsg = 'This frame is not available with the prescription entered'; var julboRxPdMsg = 'Please enter your PD to continue'; var julboRxObserver = null; var julboRxPending = false; function julboRxGetRules() { var type = LensAdvizor.response && LensAdvizor.response.prescriptionType; if (!type) return null; // The rxValidation config lives on LensAdvizor._options.rxValidation (verified live on // the Renegade RX product, Jun 2026). Fall back to the prescriptionConfig paths in case // a future build merges it there instead. var rv = (LensAdvizor._options && LensAdvizor._options.rxValidation) || (LensAdvizor.options && LensAdvizor.options.rxValidation) || (LensAdvizor.options && LensAdvizor.options.prescriptionConfig && LensAdvizor.options.prescriptionConfig.rxValidation); if (!rv) return null; return rv[type] || null; } function julboRxParseVal(str) { if (str === null || str === undefined || str === '') return NaN; return parseFloat(String(str).replace('+', '')); } // Resolve the [comboMin, comboMax] combined SPH+CYL(+ADD) limit for a PD range. // Prefers the new comboMax/comboMin metafield fields; falls back to the existing // per-range sphMax/sphMin (now interpreted as the combined cap). function julboRxGetComboLimits(pdRange) { var max = julboRxParseVal(pdRange.comboMax); var min = julboRxParseVal(pdRange.comboMin); if (isNaN(max)) max = julboRxParseVal(pdRange.sphMax); if (isNaN(min)) min = julboRxParseVal(pdRange.sphMin); return { max: max, min: min }; } function julboRxGetMonocularPd() { var form = document.querySelector('#la-prescription-form'); if (!form) return { right: null, left: null }; var singleRadio = form.querySelector('#la-pd-field-single'); var isSinglePd = singleRadio && singleRadio.checked; if (isSinglePd) { var singleSelect = form.querySelector('#la-pd-value'); var val = singleSelect ? julboRxParseVal(singleSelect.value) : NaN; if (isNaN(val)) return { right: null, left: null }; var mpd = val / 2; return { right: mpd, left: mpd }; } var rightSelect = form.querySelector('[name="la-pd-right"]'); var leftSelect = form.querySelector('[name="la-pd-left"]'); return { right: rightSelect ? (julboRxParseVal(rightSelect.value) || null) : null, left: leftSelect ? (julboRxParseVal(leftSelect.value) || null) : null }; } function julboRxFindPdRange(rules, mpd) { if (mpd === null || isNaN(mpd)) return null; var ranges = rules.pdRanges; // Both bounds inclusive, first match wins (so PD=30 hits 27.5-30, not 30-32.5) for (var i = 0; i < ranges.length; i++) { var r = ranges[i]; if (mpd >= r.pdMin && mpd <= r.pdMax) return r; } return null; } function julboRxDisableOptions(selectEl, min, max) { if (!selectEl) return; selectEl.querySelectorAll('option').forEach(function(opt) { if (opt.value === '') return; var val = julboRxParseVal(opt.value); if (isNaN(val)) return; opt.disabled = (val < min || val > max); }); } function julboRxIsInvalid(selectEl) { if (!selectEl || selectEl.value === '') return false; var selected = selectEl.querySelector('option:checked'); return selected && selected.disabled; } function julboRxMarkInvalid(selectEl, invalid) { if (!selectEl) return; if (invalid) { selectEl.classList.add('julbo-rx-invalid'); selectEl.setCustomValidity(julboRxErrorMsg); } else { selectEl.classList.remove('julbo-rx-invalid'); selectEl.setCustomValidity(''); } } function julboRxShowError(form) { var el = form.querySelector('#julbo-rx-error-banner'); if (!el) { el = document.createElement('div'); el.id = 'julbo-rx-error-banner'; el.innerHTML = '

' + julboRxErrorMsg + '

'; var leftContainer = form.querySelector('.la-left-rx-container'); if (leftContainer && leftContainer.parentElement) { leftContainer.parentElement.insertBefore(el, leftContainer.nextSibling); } else { form.appendChild(el); } } el.style.display = 'block'; } function julboRxHideError(form) { var el = form.querySelector('#julbo-rx-error-banner'); if (el) el.style.display = 'none'; } function julboRxShowPdMsg(form) { var el = form.querySelector('#julbo-pd-required-msg'); if (!el) { el = document.createElement('div'); el.id = 'julbo-pd-required-msg'; el.innerHTML = '

' + julboRxPdMsg + '

'; var rightContainer = form.querySelector('.la-right-rx-container'); if (rightContainer) { rightContainer.parentElement.insertBefore(el, rightContainer); } } el.style.display = 'block'; } function julboRxHidePdMsg(form) { var el = form.querySelector('#julbo-pd-required-msg'); if (el) el.style.display = 'none'; } function julboRxValidate() { var rules = julboRxGetRules(); if (!rules) return; var form = document.querySelector('#la-prescription-form'); if (!form) return; var mpd = julboRxGetMonocularPd(); var isProgressive = LensAdvizor.response.prescriptionType === 'progressive'; var maxCyl = julboRxParseVal(rules.maxCyl); if (isNaN(maxCyl)) maxCyl = 4; var maxAdd = julboRxParseVal(rules.maxAdd); if (isNaN(maxAdd)) maxAdd = 3.5; var hasError = false; var anyPdEntered = (mpd.right !== null || mpd.left !== null); if (!anyPdEntered) { julboRxShowPdMsg(form); } else { julboRxHidePdMsg(form); } var eyes = [ { key: 'od_right', mpd: mpd.right }, { key: 'os_left', mpd: mpd.left } ]; eyes.forEach(function(eye) { var sphSelect = form.querySelector('#la-' + eye.key + '-sph'); var cylSelect = form.querySelector('#la-' + eye.key + '-cyl'); var axisSelect = form.querySelector('#la-' + eye.key + '-axis'); var addSelect = form.querySelector('#la-' + eye.key + '-add'); julboRxMarkInvalid(sphSelect, false); julboRxMarkInvalid(cylSelect, false); if (addSelect) julboRxMarkInvalid(addSelect, false); // No PD for this eye yet: lock the row until PD is entered. if (eye.mpd === null) { [sphSelect, cylSelect, axisSelect, addSelect].forEach(function(s) { if (s) { s.disabled = true; s.classList.add('julbo-rx-locked'); } }); return; } var pdRange = julboRxFindPdRange(rules, eye.mpd); if (!pdRange) { // PD outside any configured band — frame not available for this PD. hasError = true; [sphSelect, cylSelect, axisSelect, addSelect].forEach(function(s) { if (s) { s.disabled = true; s.classList.add('julbo-rx-locked'); } }); return; } // Combined SPH+CYL(+ADD) limits for this PD band. var combo = julboRxGetComboLimits(pdRange); if (isNaN(combo.max) || isNaN(combo.min)) { // No usable limits configured: leave the row open rather than blocking. [sphSelect, cylSelect, axisSelect, addSelect].forEach(function(s) { if (s) { s.disabled = false; s.classList.remove('julbo-rx-locked'); } }); return; } // ADD read first (progressive only; treated as 0 otherwise so the math // degenerates to the single-vision SPH+CYL form). var currentAdd = 0; if (isProgressive && addSelect) { var addRead = julboRxParseVal(addSelect.value); if (!isNaN(addRead)) currentAdd = addRead; } // --- Step 1: SPH — enable any value for which SOME valid CYL exists --- // Combined rule: comboMin <= SPH + CYL + ADD <= comboMax, CYL in [-maxCyl, +maxCyl]. // => SPH feasible iff SPH in [comboMin - maxCyl - ADD, comboMax + maxCyl - ADD]. // (SPH is NOT independently capped to the combined range — only the combination is.) if (sphSelect) { sphSelect.disabled = false; sphSelect.classList.remove('julbo-rx-locked'); var sphLo = combo.min - maxCyl - currentAdd; var sphHi = combo.max + maxCyl - currentAdd; julboRxDisableOptions(sphSelect, sphLo, sphHi); if (julboRxIsInvalid(sphSelect)) { julboRxMarkInvalid(sphSelect, true); hasError = true; } } var currentSph = sphSelect ? julboRxParseVal(sphSelect.value) : NaN; // --- Step 2: CYL bounded by the combined rule, given SPH (and ADD) --- // CYL_max = comboMax - SPH - ADD // CYL_min = comboMin - SPH - ADD // clamped to the frame's physical +/- maxCyl cap. if (cylSelect) { cylSelect.classList.remove('julbo-rx-locked'); cylSelect.disabled = false; var cylMin = -maxCyl; var cylMax = maxCyl; if (!isNaN(currentSph)) { cylMax = Math.min(maxCyl, combo.max - currentSph - currentAdd); cylMin = Math.max(-maxCyl, combo.min - currentSph - currentAdd); // Guard: if the derived range collapses (min > max), force CYL = 0 only. if (cylMin > cylMax) { cylMin = 0; cylMax = 0; } } julboRxDisableOptions(cylSelect, cylMin, cylMax); if (julboRxIsInvalid(cylSelect)) { julboRxMarkInvalid(cylSelect, true); hasError = true; } } var currentCyl = cylSelect ? julboRxParseVal(cylSelect.value) : NaN; // --- Step 3: ADD bounded by remaining positive-side budget (progressive only) --- // From SPH + CYL + ADD <= comboMax => ADD <= comboMax - SPH - CYL. if (isProgressive && addSelect) { addSelect.classList.remove('julbo-rx-locked'); addSelect.disabled = false; var maxAddAllowed = maxAdd; if (!isNaN(currentSph) && !isNaN(currentCyl)) { maxAddAllowed = Math.min(maxAdd, Math.max(0, combo.max - currentSph - currentCyl)); } else if (!isNaN(currentSph)) { maxAddAllowed = Math.min(maxAdd, Math.max(0, combo.max - currentSph)); } julboRxDisableOptions(addSelect, 0, maxAddAllowed); if (julboRxIsInvalid(addSelect)) { julboRxMarkInvalid(addSelect, true); hasError = true; } } if (axisSelect) { axisSelect.classList.remove('julbo-rx-locked'); } }); if (hasError) { julboRxShowError(form); } else { julboRxHideError(form); } } function julboSetupRxValidation() { var rules = julboRxGetRules(); if (!rules) return; var form = document.querySelector('#la-prescription-form'); if (!form) return; form.dataset.julboRxValidation = 'active'; julboRxValidate(); var observerConfig = { childList: true, subtree: true, attributes: true, attributeFilter: ['value'] }; if (julboRxObserver) julboRxObserver.disconnect(); julboRxObserver = new MutationObserver(function() { if (!julboRxPending) { julboRxPending = true; requestAnimationFrame(function() { julboRxObserver.disconnect(); julboRxValidate(); julboRxObserver.observe(form, observerConfig); julboRxPending = false; }); } }); julboRxObserver.observe(form, observerConfig); form.addEventListener('submit', function(e) { julboRxValidate(); var banner = form.querySelector('#julbo-rx-error-banner'); if (banner && banner.style.display !== 'none') { e.preventDefault(); e.stopImmediatePropagation(); return false; } }, true); } //# sourceURL=la_julbo_custom.js

Current Openings

SUNGLASSES

GOGGLES

ACCESSORIES

Cart

Select options