{% if shop.metafields.lensadvisor.BASE_URL != blank and product.available %}
    {{ 'lensadvizor.scss.css' | asset_url | stylesheet_tag }}
    <style type="text/css" id="la-custom-css-injector"></style>
    <script>
        // Reload the page if back button is pressed.
        window.addEventListener('pageshow', function(event) {
            if (event.persisted || window.performance && window.performance.navigation.type === 2) {
                window.location.reload();
            }
        }, false);

        String.prototype.title = function() {
            try {
                if (this == "None" || this == "") {
                    return "-"
                } 
                var string = this.toLowerCase()
                string = string.replace(/(^|\s)[a-z]/g,function(f){return f.toUpperCase();});
                string = string.replace(/_/g, " ").replace(/-/g, " ")
                let con = ''
                for (let i=0; i< string.split(' ').length; i++) {
                    con += ' ' + string.split(' ')[i].replace(/(^|\s)[a-z]/g,function(f){return f.toUpperCase();})
                }
                return con.trim()
            } catch (error) {
                LensAdvisor.error_loading = true
            }
        }

        {% assign collection_id = "" %}
        {% assign assign_by = "product" %}
        {% for collection in product.collections %}
            {% if collection.metafields.lensadvisor.collection_id  != blank %}
                {% assign assign_by = "collection" %}
                {% assign collection_id = collection.metafields.lensadvisor.collection_id %}
            {% endif %}
        {% endfor %}

        var LensAdvisor = function() {
            this.enable_ajax = {{ settings.enable_ajax | json }}
            this.cart_type = {{ settings.cart_type | json }}
            this.setDefaultResponse()
            LensAdvisor.$(".js-select-pd-left-value, .js-select-pd-left-p").hide()
            LensAdvisor.$(".js-select-pd-right-value, .js-select-pd-right-p").hide()
            LensAdvisor.$(".js-prism-values-od-right-left-wrapper").hide()
            this.collection_id = {{collection_id | json}}
            this.assign_by = {{assign_by | json}}
            this.addEventListener()
        };

        TranslationJSON = {  
            "en": {
                "STATIC": {
                    "_comment1_": "Step - Choose Prescription Type",
                    "#la_prescriptionSelect_title": "Choose Your Prescription Type",

                    "_comment2_": "Step - Prescription Entry Method",
                    "#la_Rx_main_title": "Add Your Prescription",
                    "#la_Rx_main_email_label": "Email Your Prescription Later",
                    "#la_Rx_main_upload_label": "Upload Your Prescription",
                    "#la_Rx_main_manual_label": "{{ shop.metaobjects.rx_insert_form.live.title_1 }}",

                    "_comment3_": "Step - Upload Prescription",
                    "#la_Rx_upload_title": "Upload Prescription",
                    "#la_Rx_upload_fileType_label": "Please upload your prescription as a PNG, JPG or PDF file.",
                    "#la_Rx_upload_chooseFile_label": "{{ shop.metaobjects.rx_insert_form.live.choose_button }}",
                    "#la_Rx_upload_changeFile_label": "{{ shop.metaobjects.rx_insert_form.live.change_button }}",
                    ".error-file" : "Please try to keep your file size under 1 MB (1,000 KB).",
                    "#la_Rx_upload_pdText_label": "Pupillary Distance (PD)",
                    "#la_Rx_upload_singlePD_label": "Single PD",
                    "#la_Rx_upload_dualPD_label": "Dual PD",

                    "_comment4_": "Step - Enter Prescription Manually",
                    "#la_Rx_manual_title": "{{ shop.metaobjects.rx_insert_form.live.title_1 }}",
                    "#la_Rx_upload_PDRight_label": "Right",
                    "#la_Rx_manual_ODright_label": "{{ shop.metaobjects.rx_insert_form.live.right_eye }}",
                    "#la_Rx_manual_SPHright_label": "{{ shop.metaobjects.rx_insert_form.live.sph }}",
                    "#la_Rx_manual_CYLright_label": "{{ shop.metaobjects.rx_insert_form.live.cyl }}",
                    "#la_Rx_manual_axisright_label": "{{ shop.metaobjects.rx_insert_form.live.axis }}",
                    "#la_Rx_manual_ADDright_label": "Add",
                    "#la_Rx_upload_PDLeft_label": "Left",
                    "#la_singlevision_manual_OSleft_label": "{{ shop.metaobjects.rx_insert_form.live.left_eye }}",
                    "#la_Rx_manual_SPHleft_label": "{{ shop.metaobjects.rx_insert_form.live.sph }}",
                    "#la_Rx_manual_CYLleft_label": "{{ shop.metaobjects.rx_insert_form.live.cyl }}",
                    "#la_Rx_manual_axisleft_label": "{{ shop.metaobjects.rx_insert_form.live.axis }}",
                    "#la_Rx_manual_ADDleft_label": "Add",
                    "#la_Rx_manual_pdText_reading": "Pupillary distance (PD)",
                    "#la_Rx_manual_singlePD_label": "Single PD",
                    "#la_Rx_manual_dualPD_label": "Dual PD",
                    "#la_Rx_manual_dualPDright_label": "Right",
                    "#la_Rx_manual_dualPDleft_label": "Left",
                    "#la_Rx_manual_segmentHeight_label": "Segment Height",
                    "#la_Rx_manual_segmentHeightSelect_label": "{{ shop.metaobjects.rx_insert_form.live.select }}",
                    "#la_Rx_manual_prismValues_label": "Prism Values",
                    "#la_Rx_manual_prismNo_label": "No",
                    "#la_Rx_manual_prismYes_label": "Yes",
                    "#la_Rx_manual_prismODright_label": "{{ shop.metaobjects.rx_insert_form.live.right_eye }}",
                    "#la_Rx_manual_prismHorizontalRight_label": "Horizontal",
                    "#la_Rx_manual_BDirectionHorizontalRight_label": "Base Direction",
                    "#la_Rx_manual_prismVerticalRight_label": "Vertical",
                    "#la_Rx_manual_BDirectionVerticalRight_label": "Base Direction",
                    "#la_singlevision_manual_prismOSleft_label": "{{ shop.metaobjects.rx_insert_form.live.left_eye }}",
                    "#la_Rx_manual_prismHorizontalLeft_label": "Horizontal",
                    "#la_Rx_manual_BDirectionHorizontalLeft_label": "Base Direction",
                    "#la_Rx_manual_prismVerticalLeft_label": "Vertical",
                    "#la_Rx_manual_BDirectionVerticalLeft_label": "Base Direction",
                    "#la_Rx_manual_uploadDescription_label": "{{ shop.metaobjects.rx_insert_form.live.upload_msg }}",
                    "#la_Rx_manual_upload_chooseFile_label": "{{ shop.metaobjects.rx_insert_form.live.choose_button }}",
                    "#la_Rx_manual_upload_changeFile_label": "{{ shop.metaobjects.rx_insert_form.live.change_button }}",
                    ".la-save-continue-btn-text": "{{ shop.metaobjects.rx_insert_form.live.continue_button }}",
                    "#la_error_select_prescription": "{{ shop.metaobjects.rx_insert_form.live.error_msg }}",
                    ".la-option-select": "{{ shop.metaobjects.rx_insert_form.live.select }}",

                    "_comment4_": "Step - Readers",
                    "#la_Rx_reading_title": "Select Your Reading Strength Level",
                    "#la_Rx_reading_diopters_label": "Diopters",

                    "_comment5_": "Step - Choose Lenses",
                    "#la_chooseLens_subtotal_label": "{{ shop.metaobjects.rx_insert_form.live.subtotal }}",
                    "#la_choose-options_frame_subtotal_label": "Selected Frame",
                    "#la_choose-options_lenses_label": "Selected Lenses",

                    "_comment6_": "Step - Review Order",
                    "#la_review_title": "{{ shop.metaobjects.rx_insert_form.live.title_2 }}",
                    "#la_review_orderNotes_label": "Order Notes",
                    "#la_review_subtotal_label": "{{ shop.metaobjects.rx_insert_form.live.subtotal }}",
                    "#la_review_addToCart_label": "{{ shop.metaobjects.rx_insert_form.live.add_button }}",
                },
                "DYNAMIC": {
                    "_comment1_": "Step - Choose Lenses",
                    "Review Lenses": "Review Lenses",
                    "Choose Your Lenses": "Choose Your Lenses",

                    "_comment2_": "Step - Add Ons",
                    "Add Ons": "Add Ons",

                    "_comment3_": "Prices and buttons",
                    "Add to Cart": "Add to cart",
                    "Processing": "<i class='fa fa-spinner fa-pulse'></i>  {{ shop.metaobjects.rx_insert_form.live.loading_msg }}",
                    "Options Save and Continue": "Save and Continue",
                    "Starting From": "From ",

                    "_comment4_": "Error messages",
                    "RESOLVE_LENS_ERROR_MESSAGE": "We're sorry, but one or more of the frames or lenses you have selected is not available. If you feel you have reached this message in error, please contact support.",
                    "QUANTITY_REQUIRED": "Please enter quantity",
                    "Prescription file is required": "Prescription file is required",
                    "Change File": "Change File",
                    "Choose File": "Choose File",
                    "Invalid File": "Invalid file uploaded. Please retry with another file.",
                    "File Size Error": "File Size Should be less than 10 MB.",
                    "Quantity Error": "Please enter quantity.",
                    "Out of Stock Error": "We're sorry, but one or more of the lenses you have selected are not available.",
                    "No Lens Options": "No lens options available",
                    "Try Again": "Try Again",
                    "Options Unavailable": "Unavailable",
                    "File Required": "Prescription file is required.",

                    "_comment5_": "Properties",
                    "Email Later": "Email Later",
                    "Uploaded": "Uploaded",
                    "Entered Manually": "{{ shop.metaobjects.rx_insert_form.live.your_info }}",
                    "Single Vision": "Single Vision",
                    "Progressive": "Progressive",
                    "Frame Only": "Frame Only",
                    "Non-Prescription": "Non-Prescription",
                    "Reading": "Reading",
                    "Contact Lenses": "Contact Lenses",
                    
                    "_comment6_": "Contact Lenses",
                    "Contact Lens Title": "Enter Your Prescription Details"
                }
            }
        }

        LensAdvisor.applyTranslation = function(){
            // to support previous translation implementation, we set the 'en' dynamic content to LensAdvisor.Translate if it exists
            if (LensAdvisor.Translate) {
                TranslationJSON["en"]["DYNAMIC"] = LensAdvisor.Translate
            }

            // Set the default locale of "en" if we're not able to retrieve the locale from Shopify
            locale_code = typeof(Shopify) == undefined ? "en" : Shopify.locale

            // test if STATIC translation for the given language exists, if it doesn't, default to "en"
            staticTranslationJSON = TranslationJSON[locale_code] == undefined ? TranslationJSON["en"]["STATIC"] : TranslationJSON[locale_code]["STATIC"]

            // set the DYNAMIC translation to be used by the getTranslatedText function 
            LensAdvisor.dynamicTranslationJSON = TranslationJSON[locale_code] == undefined ? TranslationJSON["en"]["DYNAMIC"] : TranslationJSON[locale_code]["DYNAMIC"]

            // Now we can comfortabley access the dictionary and apply the translation
            for (let key in staticTranslationJSON) {
                if (!key.startsWith("_")) {
                    LensAdvisor.$(key).text(staticTranslationJSON[key]);    
                }
                
            }
        }

        LensAdvisor.getTranslatedText = function (key) {
            return LensAdvisor.dynamicTranslationJSON[key] || key
        }

        // TODO: delete once all stores are migrated to new translation engine
        LensAdvisor.supportLegacyTranslation = function (key) {
            dynamicJSON = TranslationJSON["en"]["DYNAMIC"]

            dynamicJSON["Add to Cart"] = LensAdvisor.$('#la-addToCart-text').html()
            dynamicJSON["Processing"] = LensAdvisor.$('#la-processing-text').html()
            dynamicJSON["Options Save and Continue"] = LensAdvisor.$('#la-lensOptions-saveAndContinue-text').html()            
            dynamicJSON["Options Unavailable"] = LensAdvisor.$('#la-lensOptions-unavailable-text').html()
            dynamicJSON["Starting From"] = LensAdvisor.$('#la-chooseLens-startingFrom-text').html()
            dynamicJSON["File Required"] = LensAdvisor.$('#la-upload-prescriptionFileRequired-text').html()            
            dynamicJSON["File Size Error"] = LensAdvisor.$('#la-upload-fileSizeError-text').html()
            dynamicJSON["Contact Lens Title"] = LensAdvisor.$('#la-contactLensTitle').html()
        }

        LensAdvisor.prototype.addEventListener = function () {
            document.addEventListener('LensAdvisor:init:start', this.initStart)
            document.addEventListener('LensAdvisor:init:complete', this.initCompleted)
            document.addEventListener('LensAdvisor:init:failed', this.initFailed)
            document.addEventListener('LensAdvisor:variant:detected', this.variantDetected)
            document.addEventListener('LensAdvisor:lens:loaded', this.lensLoaded)
            document.addEventListener('LensAdvisor:lensOptions:loaded', this.lensOptionsLoaded)
            document.addEventListener('LensAdvisor:addOns:loaded', this.addOnsLoaded)
            document.addEventListener('LensAdvisor:addToCart:success', this.addToCartSuccess)
            document.addEventListener('LensAdvisor:addToCart:error', this.addToCartError)

            if (document.querySelector('.la-quantity-selector')) {
                document.querySelector('.la-quantity-selector').addEventListener('change', this.handleLensAdvizorQuanityChange)
            }
        }

        LensAdvisor.product_id = {{ product.id | json}}
        LensAdvisor.product_title = {{product.title | json}}

        LensAdvisor.createToolTip = function (config) {
            if (!config.target && !config.htmlOnly) {
                throw TypeError ("Target is required.")
            }
            try {
                const content = `<span class="la-tooltip">
                    ${config.hover_text}
                    <span class="la-tooltiptext">${config.content}</span>
                </span>`
                if (config.htmlOnly) {
                    return content;
                }
                LensAdvisor.$(config.target).append(content)
            } catch (error) {
                LensAdvisor.error_loading = true
            }
        }

        LensAdvisor.createInfoModal = function (config) {
            var required_fields = ["id", "body", "labelledby"]
            if (!config.target && !config.htmlOnly) {
                throw TypeError ("Target is required.")
            }
            required_fields.forEach(function (field) {
                if (!config[field]) {
                    throw TypeError (field + " is required.")
                }
            })
            try {
                const content = `<div id="${config.id}" class="la-custom-modal">
                    <div class="la-custom-modal-content">
                        <div class="la-custom-modal-header">
                            <span class="la-custom-modal-close" data-parent-modal="#${config.id}">&times;</span>
                            ${config.title ? `<h2 class="la-modal-title" id="${config.labelledby}">${config.title}</h2>`: ''}
                        </div>
                        <div class="la-custom-modal-body">
                            ${config.body}
                        </div>
                    </div>
                </div>`
                if (config.htmlOnly) {
                    return content;
                }
                LensAdvisor.$(config.target).append(content)
            } catch (error) {
                LensAdvisor.error_loading = true
            }
        }

        LensAdvisor.initCustomModal = function (modalId) {
            // Get the modal
            var modal = document.querySelector(modalId);
            // Get the button that opens the modal
            var btn = document.querySelector('span[data-target="#'+ modalId + '"]')
            // Get the <span> element that closes the modal
            var spans = document.querySelectorAll(" .la-custom-modal-close")
            // When the user clicks the button, open the modal 
            btn.onclick = function() {
                var modal = LensAdvisor.$(this.dataset.target)
                modal.css({display: 'block'})
            }
            // When the user clicks on <span> (x), close the modal
            spans.forEach(function (span) {
                span.onclick = function() {
                    var modal = LensAdvisor.$(this.dataset.parentModal)
                    modal.css({display: 'none'})
                    modal.removeClass('show')
                }
            })

            // When the user clicks anywhere outside of the modal, close it
            window.onclick = function(event) {
                if (event.target == modal) {
                    modal.style.display = "none";
                }
            }
        }

        LensAdvisor.variantsJSON = {{ product.variants | json }}
        LensAdvisor.variants = {}
        LensAdvisor.Collection_id = {{collection_id | json}}
        LensAdvisor.assign_by = {{assign_by | json}}

        LensAdvisor.BASE_URL = '{{ shop.metafields.lensadvisor.BASE_URL }}/api'

        LensAdvisor.SPH = [-20.00, -19.75, -19.50, -19.25, -19.00, -18.75, -18.50, -18.25, -18.00, -17.75, -17.50, -17.25, -17.00, -16.75, -16.50, -16.25, -16.00, -15.75, -15.50, -15.25, -15.00, -14.75, -14.50, -14.25, -14.00, -13.75, -13.50, -13.25, -13.00, -12.75, -12.50, -12.25, -12.00, -11.75, -11.50, -11.25, -11.00, -10.75, -10.50, -10.25, -10.00, -9.75, -9.50, -9.25, -9.00, -8.75, -8.50, -8.25, -8.00, -7.75, -7.50, -7.25, -7.00, -6.75, -6.50, -6.25, -6.00, -5.75, -5.50, -5.25, -5.00, -4.75, -4.50, -4.25, -4.00, -3.75, -3.50, -3.25, -3.00, -2.75, -2.50, -2.25, -2.00, -1.75, -1.50, -1.25, -1.00, -0.75, -0.50, -0.25, 0.00, 0.25, 0.50, 0.75, 1.00, 1.25, 1.50, 1.75, 2.00, 2.25, 2.50, 2.75, 3.00, 3.25, 3.50, 3.75, 4.00, 4.25, 4.50, 4.75, 5.00, 5.25, 5.50, 5.75, 6.00, 6.25, 6.50, 6.75, 7.00, 7.25, 7.50, 7.75, 8.00, 8.25, 8.50, 8.75, 9.00, 9.25, 9.50, 9.75, 10.00, 10.25, 10.50, 10.75, 11.00, 11.25, 11.50, 11.75, 12.00]
        LensAdvisor.CYL = [-6.00, -5.75, -5.50, -5.25, -5.00, -4.75, -4.50, -4.25, -4.00, -3.75, -3.50, -3.25, -3.00, -2.75, -2.50, -2.25, -2.00, -1.75, -1.50, -1.25, -1.00, -0.75, -0.50, -0.25, 0.00, 0.25, 0.50, 0.75, 1.00, 1.25, 1.50, 1.75, 2.00, 2.25, 2.50, 2.75, 3.00, 3.25, 3.50, 3.75, 4.00, 4.25, 4.50, 4.75, 5.00, 5.25, 5.50, 5.75, 6.00]
        LensAdvisor.AXIS = [0, 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, 59, 60, 61, 62, 63, 64, 65, 66, 67, 68, 69, 70, 71, 72, 73, 74, 75, 76, 77, 78, 79, 80, 81, 82, 83, 84, 85, 86, 87, 88, 89, 90, 91, 92, 93, 94, 95, 96, 97, 98, 99, 100, 101, 102, 103, 104, 105, 106, 107, 108, 109, 110, 111, 112, 113, 114, 115, 116, 117, 118, 119, 120, 121, 122, 123, 124, 125, 126, 127, 128, 129, 130, 131, 132, 133, 134, 135, 136, 137, 138, 139, 140, 141, 142, 143, 144, 145, 146, 147, 148, 149, 150, 151, 152, 153, 154, 155, 156, 157, 158, 159, 160, 161, 162, 163, 164, 165, 166, 167, 168, 169, 170, 171, 172, 173, 174, 175, 176, 177, 178, 179, 180]
        LensAdvisor.ADD = [1.00, 1.25, 1.50, 1.75, 2.00, 2.25, 2.50, 2.75, 3.00, 3.25, 3.50]

        LensAdvisor.SINGLE_PD = [35, 36, 37, 38, 39, 40, 41, 42, 43, 44, 45, 46, 47, 48, 49, 50, 51, 52, 53, 54, 55, 56, 57, 58, 59, 60, 61, 62, 63, 64, 65, 66, 67, 68, 69, 70, 71, 72, 73, 74, 75, 76, 77, 78, 79,]

        LensAdvisor.PDS = [17.5, 18, 18.5, 19, 19.5, 20, 20.5, 21, 21.5, 22, 22.5, 23, 23.5, 24, 24.5, 25, 25.5, 26, 26.5, 27, 27.5, 28, 28.5, 29, 29.5, 30, 30.5, 31, 31.5, 32, 32.5, 33, 33.5, 34, 34.5, 35, 35.5, 36, 36.5, 37, 37.5, 38, 38.5, 39, 39.5, 40]

        LensAdvisor.PRISM_HORIZONTAL = [0, 0.25, 0.5, 0.75, 1, 1.25, 1.5, 1.75, 2, 2.25, 2.5, 2.75, 3, 3.25, 3.5, 3.75, 4, 4.25, 4.5, 4.75, 5]

        LensAdvisor.READING = [0.25,0.5,0.75,1,1.25,1.5,1.75,2,2.25,2.5,2.75,3]

        LensAdvisor.BASE_DIRECTION_HORIZONTAL = ['IN', 'OUT']
        LensAdvisor.BASE_DIRECTION_VERTICAL = ['UP', 'DOWN']

        LensAdvisor.PRESCRIPTION_METHODS = {
            email_later: "Email Later",
            uploaded: "Uploaded",
            entered_manually: "Entered Manually"
        }

        LensAdvisor.DECIMAL_POINTS = 2
        LensAdvisor.HIDE_ADD_TO_CART_BUTTONS = true

        LensAdvisor.custom_base_product_properties = {}
        LensAdvisor.custom_lens_product_properties = {}
        LensAdvisor.custom_add_ons_properties = {}

        LensAdvisor.prototype.setDefaultManualResponse = function () {

            $that = LensAdvisor.advisor || this
            $that.responses.prescription_file = ""
            $that.responses.manually = {
                sph: '',
                od_right: {sph: '0.00', cyl: '0.00', axis: '0', add: null},
                os_left: {sph: '0.00', cyl: '0.00', axis: '0', add: null},
                pd: { type: 'Single PD', value: null, right: null, left: null },
                segment_height: null, prism_value: false,
                prism_fields: {
                    od_right: {sph: null, cyl: null, axis: null, add: null},
                    os_left: {sph: null, cyl: null, axis: null, add: null},
                }
            }

            $that.responses.addOns = {}

            LensAdvisor.resetSelect()
            LensAdvisor.$(".js-select-pd-left-value, .js-select-pd-left-p").hide()
            LensAdvisor.$(".js-select-pd-right-value, .js-select-pd-right-p").hide()
            LensAdvisor.$('input[name="pd"][value="Single PD"]')[0].checked = true
            LensAdvisor.$(".js-pd-value-dropdown").show();
            LensAdvisor.$('.js-manually-selected-file').html('')
            LensAdvisor.$('#prescription-upload-manually').val('')
        }

        LensAdvisor.prototype.setDefaultResponse = function () {
            $that = LensAdvisor.advisor || this
            $that.lens_types = []
            $that.responses = {
                prescription_type: null,
                prescription_file: "",
                lens: '',
                lens_variant: null,
                method: ""
            }

            $that.setDefaultManualResponse()
            $that.lensSubtotal = 0.0
            LensAdvisor.$('#prescription-upload').val('')
            LensAdvisor.$('#prescription-upload-manually').val('')
            // LensAdvisor.$('.choose-file-text').html('Choose File');
            LensAdvisor.$('#la_Rx_upload_chooseFile_label').show()
            LensAdvisor.$('#la_Rx_upload_changeFile_label').hide()
            LensAdvisor.$('#la_Rx_manual_upload_chooseFile_label').show()
            LensAdvisor.$('#la_Rx_manual_upload_changeFile_label').hide()
            LensAdvisor.$('.selected-file').empty().hide()

            LensAdvisor.$(".js-select-pd-left-value, .js-select-pd-left-p").hide()
            LensAdvisor.$(".js-select-pd-right-value, .js-select-pd-right-p").hide()
            LensAdvisor.$(".js-select-pd-on-upload-left-value, .js-select-pd-on-upload-left-p").hide()
            LensAdvisor.$(".js-select-pd-on-upload-right-value, .js-select-pd-on-upload-right-p").hide()

            let prescription_type = LensAdvisor.$('input.radio-prescription-select:checked')
            if (prescription_type.length > 0) {
                LensAdvisor.$('input.radio-prescription-select:checked')[0].checked = false
            }
            LensAdvisor.$('.order-notes').val('')
            LensAdvisor.$('#choose-lens-card').empty()
            LensAdvisor.$('#review-selected-priscription-method').empty()
            if ($that.prescription_types && $that.prescription_types.length === 1 && $that.settings.skipSelectPrescriptions) {
                document.querySelector('.radio-prescription-select').click()
            } else {
                LensAdvisor.$('.prescription-body a[href="#select_prescription"]').tab('show');
                LensAdvisor.$('.js-back-button').hide()
            }
            LensAdvisor.$('.la-nav-pills').children().show()
            LensAdvisor.addCSSToUL()
        }

        LensAdvisor.updateSelect = function (){
            LensAdvisor.updateSPH()
            LensAdvisor.updateCYL()
            LensAdvisor.updateAXIS()
            LensAdvisor.updateADD()
            LensAdvisor.updateSinglePD()
            LensAdvisor.updatePDRight()
            LensAdvisor.updatePrism()
        }

        LensAdvisor.resetSelect = function (){
            LensAdvisor.$(".la-dropdown").prop('selectedIndex', 0)
        }

        LensAdvisor.updatePrism = function () {
            let content = '<option class="la-option-select" value="">Select</option>'
            for (let i=0; i < LensAdvisor.PRISM_HORIZONTAL.length; i++) {
                content += '<option value="' + LensAdvisor.PRISM_HORIZONTAL[i].toFixed(2) + '">' + LensAdvisor.PRISM_HORIZONTAL[i].toFixed(2) + '</option>'
            }
            LensAdvisor.$('select[name="prism_horizontal"]').html(content)
            LensAdvisor.$('select[name="prism_veritical"]').html(content)

            content = '<option class="la-option-select" value="">Select</option>'
            for (let i=0; i < LensAdvisor.BASE_DIRECTION_HORIZONTAL.length; i++) {
                content += '<option value="' + LensAdvisor.BASE_DIRECTION_HORIZONTAL[i] + '">' + LensAdvisor.BASE_DIRECTION_HORIZONTAL[i] + '</option>'
            }

            LensAdvisor.$('select[name="base_direction_horizontal"]').html(content)

            content = '<option class="la-option-select" value="">Select</option>'
            for (let i=0; i < LensAdvisor.BASE_DIRECTION_VERTICAL.length; i++) {
                content += '<option value="' + LensAdvisor.BASE_DIRECTION_VERTICAL[i] + '">' + LensAdvisor.BASE_DIRECTION_VERTICAL[i] + '</option>'
            }

            LensAdvisor.$('select[name="base_direction_veritical"]').html(content)
        }

        LensAdvisor.updateSPH = function () {
            let content = '<option class="la-option-select" value="">Select</option>'
            let sphArray = LensAdvisor.SPH
            if (LensAdvisor.advisor.responses.prescription_type == "reading") {
                sphArray = LensAdvisor.READING
            }
            for (let i=0; i < sphArray.length; i++) {
                content += '<option value="' + (sphArray[i] > 0 ? '+' : '') + sphArray[i].toFixed(2) + '" ' + (sphArray[i] == 0 ? ' selected ': '') +  '>' + (sphArray[i] > 0 ? '+' : '') + sphArray[i].toFixed(2) + '</option>'
            }
            LensAdvisor.$('select[name="sph"]').html(content)
        }

        LensAdvisor.updateCYL = function () {
            let content = '<option class="la-option-select" value="0.00">Select</option>'
            for (let i=0; i < LensAdvisor.CYL.length; i++) {
                content += '<option value="' + (LensAdvisor.CYL[i] > 0 ? '+' : '') + LensAdvisor.CYL[i].toFixed(2) + '" ' + (LensAdvisor.CYL[i] == 0 ? ' selected ': '') +  '>' + (LensAdvisor.CYL[i] > 0 ? '+' : '') + LensAdvisor.CYL[i].toFixed(2) + '</option>'
            }
            LensAdvisor.$('select[name="cyl"]').html(content)
        }

        LensAdvisor.updateAXIS = function () {
            let content = '<option class="la-option-select" value="na">Select</option>'
            for (let i=0; i < LensAdvisor.AXIS.length; i++) {
                content += '<option value="' + LensAdvisor.AXIS[i] + '" ' + (LensAdvisor.AXIS[i] == 0 ? ' selected ': '') +  '>' + LensAdvisor.AXIS[i] + '</option>'
            }
            LensAdvisor.$('select[name="axis"]').html(content)
        }

        LensAdvisor.updateADD = function () {
            try {
                let content = '<option class="la-option-select" value="">Select</option>'
                for (let i=0; i < LensAdvisor.ADD.length; i++) {
                    content += `<option value="${LensAdvisor.ADD[i] > 0 ? '+' : ''}${LensAdvisor.ADD[i].toFixed(2)}" ${LensAdvisor.ADD[i] == 0 ? ' selected ': ''}>
                        ${LensAdvisor.ADD[i] > 0 ? '+' : ''}${LensAdvisor.ADD[i].toFixed(2)}
                    </option>`
                }
                LensAdvisor.$('select[name="add"]').html(content)
            } catch (error) {
                LensAdvisor.error_loading = true
            }
        }

        LensAdvisor.updateSinglePD = function () {
            try {
                let content = '<option class="la-option-select" value="">Select</option>'
                for (let i=0; i < LensAdvisor.SINGLE_PD.length; i++) {
                    content += `<option value="${LensAdvisor.SINGLE_PD[i]}" ${LensAdvisor.SINGLE_PD[i] == 0 ? ' selected ': ''}>${LensAdvisor.SINGLE_PD[i]}</option>`
                }
                LensAdvisor.$('select.pd-value').html(content)
                LensAdvisor.$('select.pd-on-upload-value').html(content)
            } catch (error) {
                LensAdvisor.error_loading = true
            }
        }

        // Pd left and right option values
        LensAdvisor.updatePDRight = function () {
            try {
                let content = '<option class="la-option-select" value="">Select</option>'
                for (let i=0; i < LensAdvisor.PDS.length; i++) {
                    content += `<option value="${LensAdvisor.PDS[i].toFixed(2)}" ${LensAdvisor.PDS[i] == 0 ? ' ${selected} ': ''}>${LensAdvisor.PDS[i].toFixed(2)}</option>`
                }
                LensAdvisor.$('select.js-select-pd-left-value').html(content)
                LensAdvisor.$('select.js-select-pd-right-value').html(content)
                LensAdvisor.$('select.js-select-pd-on-upload-left-value').html(content)
                LensAdvisor.$('select.js-select-pd-on-upload-right-value').html(content)
            } catch (error) {
                LensAdvisor.error_loading = true
            }
        }

        LensAdvisor.render = function () {
            let data = LensAdvisor.get_prescription_types()
            LensAdvisor.advisor.item_groups = data.item_groups
            LensAdvisor.advisor.prescription_types = data.prescription_types.filter(obj => obj.checked)
            LensAdvisor.flow = 'default'
            if (LensAdvisor.advisor.prescription_types.filter(obj => obj.prescription_type === 'contact_lenses').length > 0) {
                LensAdvisor.advisor.appendContactLens()

                LensAdvisor.$('.js-back-button').click( function() {
                    LensAdvisor.$('.prescription-body a[href="#select_prescription"]').tab('show');
                    LensAdvisor.$(".product-title-below-modal-image").show();
                    LensAdvisor.$('.js-back-button').hide()
                    LensAdvisor.addCSSToUL()
                })

            } else {
                const skip = LensAdvisor.advisor.appendPrescriptionTypes()
                LensAdvisor.addEvents()
                if (skip) {
                    document.querySelector('.radio-prescription-select').click()
                }
            }
        }

        LensAdvisor.prototype.appendContactLens = function() {
            try {
                var _this7 = this
                const product = this.getProductDetails()
                const meta_data = product.meta_data

                if (this.settings.showContactLensesReview) {
                    LensAdvisor.$('.la-nav-pills').children().each((index, obj) => {
                        if (LensAdvisor.$(obj).find('a[href="#select_prescription"]').length === 0 && LensAdvisor.$(obj).find('a[href="#review_selection"]').length === 0) {
                            LensAdvisor.$(obj).hide()
                        }
                    })
                } else {
                    LensAdvisor.$('.la-nav-pills').css({visibility: 'hidden'})
                    LensAdvisor.$('.js-back-button').remove()
                }

                LensAdvisor.$('#la_prescriptionSelect_title').html(LensAdvisor.getTranslatedText('Contact Lens Title')).attr('id', 'la-contactLensTitleMain');

                let contact_lenses = `<form class="js-contact-lens-form">
                    <div class="od-right-container od-container--modifier js-od-container manual-option d-block">
                        ${this.prescriptionSkeleton('Right', meta_data)}
                        ${this.prescriptionSkeleton('Left', meta_data)}
                    </div>
                    <div class="od-left-container od-container--modifier" id="prescription_upload_manually_wrapper">
                        <input type="file" id="prescription-upload-contact-lens" accept="image/png, image/jpeg, application/pdf">
                        <p id="la_Rx_manual_uploadDescription_label" class="upload-paragraph">
                            Upload your prescription for cross-reference and confirmation
                        </p>
                        <div class="js-manually-selected-file"></div>
                            <label for="prescription-upload-contact-lens" class="prescription-upload-contact-lens">
                                <img src="https://cdn.shopify.com/s/files/1/0046/7736/9985/files/upload-data-to-cloud.svg?v=1624532915" class="la-choose-file-image">
                                <span id="la-contact-lenses-upload-label" class="choose-file-text la-contact-lenses-choose-file">
                                    Choose File
                                </span>
                            </label>
                            <div class="la-custom-upload-message"></div>
                        </div>
                    <button type="submit" class="la-add-to-cart save-continue save-continue--modifier">
                        ${LensAdvisor.getTranslatedText('Add to Cart')}
                    </button>
                </form>`
                LensAdvisor.$('.prescription-type').html(contact_lenses)

                if (this.settings.showContactLensesReview) {
                    LensAdvisor.$('.js-contact-lens-form').find('button[type="submit"]').html(LensAdvisor.getTranslatedText('Review Lenses'))
                    LensAdvisor.$('.js-contact-lens-form').on('submit', LensAdvisor.showContactLensesReview)
                } else {
                    LensAdvisor.$('.js-contact-lens-form').on('submit', LensAdvisor.addContactLensToCart)
                }

                LensAdvisor.$('#prescription-upload-contact-lens').on('change', this.contact_lenses_upload)

                LensAdvisor.advisor.responses.manually.od_right.axis = null
                LensAdvisor.advisor.responses.manually.os_left.axis = null

                LensAdvisor.$('select.field-od-cyl, select.field-os-cyl').on('change', function() {
                    var className = `.field-${this.name === 'Right-cyl' ? 'od' : 'os'}-axis`

                    if (this.value === '' || parseFloat(this.value) == 0) {
                        LensAdvisor.$(className).removeAttr('required')
                    } else {
                        LensAdvisor.$(className).attr('required', 'required')
                    }
                })

                LensAdvisor.$('.la-lens-quantity-selector').on('change', function () {
                    _this7.handleLensQuantityChange(this)
                })
            } catch (error) {
                LensAdvisor.error_loading = true
            }
        }

        LensAdvisor.showContactLensesReview = function (event) {
            try {
                event.preventDefault()
                // Show's Review's Page
                LensAdvisor.$('.prescription-body a[href="#review_selection"]').tab('show');

                let form_data = LensAdvisor.$(this).serializeArray()
                const reviewDetails = {
                    os_left: Object.assign({}, LensAdvisor.advisor.responses.manually.os_left),
                    od_right: Object.assign({}, LensAdvisor.advisor.responses.manually.od_right)
                }
                for (let i=0; i< form_data.length; i++) {
                    let row = form_data[i]
                    if (row.name.includes('Right')) {
                        reviewDetails.od_right[row.name.replace('Right-', '')] = row.value
                    } else {
                        reviewDetails.os_left[row.name.replace('Left-', '')] = row.value
                    }
                }

                var fields = ["sph", "cyl", "axis", "add", "base_curve", "d/n", "diameter"]
                var types = ['od_right', 'os_left']
                const subtotal = parseFloat(LensAdvisor.advisor.convertCurrency({{product.id | json }}, LensAdvisor.selectedVariant, LensAdvisor.variants[LensAdvisor.selectedVariant].price))
                var totalQuantity = 0

                var description = `<div class="la-contact_lenses_wrapper">
                    ${types.map(function (fieldType, index) {
                        const obj = reviewDetails[fieldType]
                        if (obj.quantity > 0) {
                            totalQuantity += parseInt(obj.quantity)
                            //subtotal += parseFloat(obj.quantity) * parseFloat(LensAdvisor.variants[LensAdvisor.selectedVariant].price)
                            return `<div class="la-contact-lenses-info">
                                <h4>${fieldType === 'os_left' ? 'OS (Left Eye)': '{{ shop.metaobjects.rx_insert_form.live.right_eye }}'}</h4>
                                ${fields.map((fieldName) => {
                                    if (obj[fieldName]) {
                                        let fieldTitle = fieldName.title()
                                        if (fieldName === 'd/n') {
                                            fieldTitle = 'D/N'
                                        }
                                        return `<p class="la-contact-lenses-frames-info"><strong>${fieldTitle}: </strong> ${obj[fieldName]}</p>`
                                    }
                                    return ''
                                }).join("")}
                                <p class="la-contact-lenses-frames-info"><strong>Quantity: </strong> ${obj.quantity}</p>
                            </div>`
                        }
                        return ''
                    }).join("")}
                </div>`

                if (LensAdvisor.advisor.responses.prescription_file != "") {
                    description += `<div class="la_Rx_clear"></div>
                    <hr>
                        <div class="la-contact_lenses_wrapper">
                        <div class="la-contact-lenses-info">
                            Prescription File: <a href="${LensAdvisor.advisor.responses.prescription_file}" target="__newtab">
                            👁 View
                            </a>
                        </div>
                    </div>`
                }

                LensAdvisor.$('#review-selected-priscription').html(description)

                LensAdvisor.$('#review-variant-price').html(LensAdvisor.formatCurrency(parseFloat(LensAdvisor.variants[LensAdvisor.selectedVariant].price)))
                LensAdvisor.$('#reivew-subtotal').html(LensAdvisor.formatCurrency(subtotal * totalQuantity))

                LensAdvisor.addCSSToUL()
                setTimeout(function () {
                    LensAdvisor.$('.js-back-button').show()
                }, 10)
            } catch (error) {
                LensAdvisor.error_loading = true
                LensAdvisor.raiseException(error)
            }
            return false
        }

        LensAdvisor.prototype.contact_lenses_upload = function () {
            try {
                LensAdvisor.$('l.a-custom-upload-message').empty().slideUp()
                $that = this
                if (this.files.length != 0){
                    let file = this.files[0]
                    if (file.size / 1024 > 10024 ) {
                        LensAdvisor.$('.error-file').html(LensAdvisor.getTranslatedText('File Size Error')).show()
                        LensAdvisor.$(this).val("")
                        return false
                    }
                    LensAdvisor.uploadPrescriptionFile(file, function (signedResponse) {
                        LensAdvisor.$('#la-contact-lenses-upload-label').html(LensAdvisor.getTranslatedText('Change File'))
                        LensAdvisor.$('.la-custom-upload-message').html(`&#10003; ${file.name}`).addClass("la-success").removeClass('la-error')
                        LensAdvisor.$('#cover-spin').fadeOut()
                        LensAdvisor.advisor.responses.prescription_file = signedResponse.filename
                        LensAdvisor.advisor.responses.authenticateURL = signedResponse.authenticateURL
                    }, function (error) {
                        LensAdvisor.$('#la-contact-lenses-upload-label').html(LensAdvisor.getTranslatedText('Choose File'))
                        LensAdvisor.$('#cover-spin').fadeOut()
                        LensAdvisor.$($that).val("")
                        LensAdvisor.$('.la-custom-upload-message').html(LensAdvisor.getTranslatedText('Invalid File')).addClass("la-error").removeClass('la-success')
                    })
                }
            } catch (error) {
                LensAdvisor.error_loading = true
                LensAdvisor.raiseException(error)
            }
        }

        LensAdvisor.prototype.prescriptionSkeleton = function (od_title, meta_data) {
            try {
                const fields = {"sph": "SPH", "cyl": "CYL", "axis": "Axis", "add": "ADD", "base_curve": "Base Curve",  "diameter": "Diameter", "d/n": "D/N" }

                let label = od_title == 'Right' ? 'OD' : 'OS'

                let form = `<h6 id="la_Rx_contacts_${od_title}_label" class="text-left">${label} (${od_title} Eye)</h6>
                    <div class="od-right enter-manually-od-right la-justify-content">
                `
                for (let key in fields) {
                    if (!meta_data[key]) { continue }
                    form += `<div class="od-dropdown"><p id="la_Rx_contacts_${key}${od_title}_label" class="od-dropdown-text">${fields[key]}</p>`
                    let values = meta_data[key].split(',')
                    if (values.length > 1) {
                        form += `<select field_name="${key}" class="js-od-right la-dropdown field-${label.toLowerCase()}-${key}" name="${od_title}-${key}" ${key !== 'axis' && 'required'}>
                            <option value="">-</option>`
                        for (let i=0; i < values.length; i++) {
                            let selected = parseFloat(values[i]) == 0 && fields[key] == 'CYL' ? " selected " : ""
                            form += `<option value="${values[i]}" ${selected}>${values[i]}</option>`
                        }
                        form += '</select>'
                    } else {
                        form += `<input type="hidden" value="${values}" name="${od_title}-${key}" />
                        <input type="text" value="${values}" readonly disabled name="${od_title}-${key}" class="field-${label.toLowerCase()}-${key.replace("/", "")}" />`
                    }
                    form += '</div>'
                }
                form += `
                    <div class="od-dropdown">
                        <p id="la_Rx_contacts_QTY${od_title}_label" class="od-dropdown-text">Quantity</p>
                        <input type="number" value="1" min="0" max="10" name="${od_title}-quantity" class="la-lens-quantity-selector" data-name-type="${label.toLowerCase()}" />
                    </div>`
                return form += '</div>'
            } catch (error) {
                LensAdvisor.error_loading = true
            }
        }

        LensAdvisor.prototype.handleLensQuantityChange = function (elem) {
            try {
                const fields = ["sph", "cyl", "axis", "add", "base_curve", "diameter", "d/n" ]
                fields.forEach(function (fieldName, index) {
                    if (elem.value == 0) {
                        LensAdvisor.$(`.field-${elem.dataset.nameType}-${fieldName.replace("/", "")}`).removeAttr("required")
                    } else {
                        LensAdvisor.$(`.field-${elem.dataset.nameType}-${fieldName.replace("/", "")}`).attr("required", "required")
                    }
                })
            } catch (error) {
                LensAdvisor.error_loading = true
            }
        }

        LensAdvisor.prototype.getProductDetails = function () {
            try {
                return LensAdvisor.request("GET", `${LensAdvisor.BASE_URL}/collection/product/${LensAdvisor.product_id}/?variant=${LensAdvisor.selectedVariant}`)
            } catch (error) {
                LensAdvisor.error_loading = true
            }
        }

        LensAdvisor.get_prescription_types = function() {
            try {
                return LensAdvisor.request("GET", `${LensAdvisor.BASE_URL}/collection/${LensAdvisor.variants[LensAdvisor.selectedVariant].collection_id}/prescriptions/`)
            } catch (error) {
                LensAdvisor.error_loading = true
            }
        }

        LensAdvisor.get_lens_types = function() {
            try {
                LensAdvisor.$('#la_chooseLens_title').html(LensAdvisor.getTranslatedText("Choose Your Lenses"))
                var self = LensAdvisor.advisor
                const responses = self.responses
                const prescription_type = LensAdvisor.getPredictedPrescriptionType()

                var url = `${LensAdvisor.BASE_URL}/collection/${LensAdvisor.variants[LensAdvisor.selectedVariant].collection_id}/items/?prescription_type=${prescription_type}&product_id=${LensAdvisor.product_id}&variant=${LensAdvisor.selectedVariant}&method=${responses.method}`
                if (responses.method === 'entered_manually') {
                    url = `${url}&settings=${JSON.stringify(self.get_prescription_request_data().prescription_setting)}`
                }
                LensAdvisor.$('#la-lens-loading').show()
                LensAdvisor.$.getJSON(url, self.updateItemPrices.bind(LensAdvisor.advisor))
            } catch (error) {
                LensAdvisor.error_loading = true
                LensAdvisor.raiseException(error)
            }
        }

        LensAdvisor.prototype.updateItemPrices = function (items) {
            let product_ids = [{{product.id | json }}]
            items.forEach(item => {
                product_ids.push(item.shopify_id)
                item.add_ons_products.forEach(addOn => {
                    addOn.product_ids.forEach(product_id => {
                        product_ids.push(product_id)
                    })
                })
            })

            product_ids = new Set(product_ids)

            // vvv LA code for their deprecated API vvv
            // const url = `${LensAdvisor.BASE_URL}/collection/variants/?shop=${Shopify.shop}&products=${Array.from(product_ids).join(",")}&currencies=${LensAdvisor.advisor.defaultCurrency},${Shopify.currency.active}`

            // LensAdvisor.$.getJSON(url, function (products) {
            //     this.lens_types = items
            //     this.productPresentmentPrices = products
            //     this.renderLensTypes()
            //     LensAdvisor.$('#la-lens-loading').hide()
            //     document.dispatchEvent(new CustomEvent('LensAdvisor:lens:loaded'));
            // }.bind(this))

            // Custom replacement code
            if(typeof dummyList != undefined) {
                delete(dummyList); //formerly "products"
            }
            dummyList = Array.from(product_ids).reduce((rolling, id) => {
              rolling[`${id}`] = [
                {
                  "id": 0,
                  "presentment_prices": {
                    'USD': "0.0",
                    'EUR': "0,0",
                    'GBP': "0,0",
                    'CAD': "0.0",
                    'AUD': "0.0",
                    'NZD': "0.0",
                    'JPY': "0"
                  }
                }
              ];
              return rolling;
            }, {});
            this.lens_types = items;
            this.productPresentmentPrices = dummyList;
            this.renderLensTypes();
            LensAdvisor.$('#la-lens-loading').hide();
            document.dispatchEvent(new CustomEvent('LensAdvisor:lens:loaded'));
        }

        LensAdvisor.prototype.convertCurrency = function (product_id, variant_id, price) {
            const productPresentmentPrice = this.productPresentmentPrices[product_id]
            const variantPresentmentPrice = productPresentmentPrice.find(variant => variant.id.toString() === variant_id.toString())
            if (variantPresentmentPrice) {
                const amount = variantPresentmentPrice.presentment_prices[Shopify.currency.active]
                if (amount) {
                    return parseFloat(variantPresentmentPrice.presentment_prices[Shopify.currency.active])
                }
            }
            return LensAdvisor.Currency.convert(parseFloat(price), LensAdvisor.advisor.defaultCurrency, Shopify.currency.active);
        }

        LensAdvisor.init = function () {
            return new LensAdvisor()
        }

        LensAdvisor.prototype.appendPrescriptionTypes = function() {
            try {
                LensAdvisor.$('.prescription-type').empty()
                this.prescription_types.forEach(function (prescription) {
                    let content = `<div class="select-prescription-container">
                        <input type="radio" id="${prescription.name}" name="prescription_type" value="${prescription.name}" class="radio-prescription-select">
                        <label for="${prescription.name}" class="la-label_button la-prescription-${prescription.name}">
                            <div>${prescription.title}</div>
                            <p class="text-select-prescription">${prescription.description}</p>
                        </label>
                    </div>`
                    LensAdvisor.$('.prescription-type').append(content)
                })
                return this.prescription_types.length === 1 && this.settings.skipSelectPrescriptions
            } catch (error) {
                LensAdvisor.error_loading = true
            }
        }

        LensAdvisor.getPrescriptionTitle = function (prescription_type) {
            if (LensAdvisor.$('input[name="_la-properties[la-custom-prescription-type]"').val()) {
                return LensAdvisor.$('input[name="_la-properties[la-custom-prescription-type]"').val()
            }
            for (var i=0; i < LensAdvisor.advisor.prescription_types.length; i++) {
                if (LensAdvisor.advisor.prescription_types[i].prescription_type == LensAdvisor.advisor.responses.prescription_type) {
                    return LensAdvisor.getTranslatedText(LensAdvisor.advisor.prescription_types[i].title)
                }
            }
        }

        LensAdvisor.handleSubmitButtons = function (show) {
            if (LensAdvisor.variants.hasOwnProperty(LensAdvisor.selectedVariant)) {
                LensAdvisor.$(LensAdvisor.submit_buttons)[(LensAdvisor.advisor.settings.show_add_to_cart_button ? 'show' : 'hide')]()
                if (LensAdvisor.advisor.settings.show_add_to_cart_button) {
                    LensAdvisor.$(`form[action="${Shopify.routes.root}cart/add"] :submit`).not('.la-select-lenses-btn').removeClass("la-visiblity-hidden")
                } else {
                    LensAdvisor.$(`form[action="${Shopify.routes.root}cart/add"] :submit`).not('.la-select-lenses-btn').addClass("la-visiblity-hidden")
                }
            } else {
                LensAdvisor.$(`form[action="${Shopify.routes.root}cart/add"] :submit`).not('.la-select-lenses-btn').removeClass("la-visiblity-hidden")
                LensAdvisor.$(LensAdvisor.submit_buttons)['show']()
            }
        }

        LensAdvisor.getUrlParameter = function (sParam, sdefault) {
            var sPageURL = window.location.search.substring(1),
                sURLVariables = sPageURL.split('&'),
                sParameterName,
                i;
            for (i = 0; i < sURLVariables.length; i++) {
                sParameterName = sURLVariables[i].split('=');
                if (sParameterName[0] === sParam) {
                    return sParameterName[1] === undefined ? true : decodeURIComponent(sParameterName[1]);
                }
            }
            return sdefault
        };

        LensAdvisor.detectVariant = function () {
            if (!LensAdvisor.selectedVariant || (LensAdvisor.getUrlParameter('variant') && LensAdvisor.getUrlParameter('variant') != LensAdvisor.selectedVariant) ) {
                if (LensAdvisor.getUrlParameter('variant')) {
                    LensAdvisor.selectedVariant = LensAdvisor.getUrlParameter('variant')
                } else {
                    LensAdvisor.selectedVariant = {{ product.selected_or_first_available_variant.id | json }}
                }
                if (LensAdvisor.variants.hasOwnProperty(LensAdvisor.selectedVariant)) {
                    if (LensAdvisor.HIDE_ADD_TO_CART_BUTTONS) {
                        LensAdvisor.handleSubmitButtons(false)
                    }
                    LensAdvisor.$('.la-select-lenses-btn').show()
                    LensAdvisor.$('#lensadvisor-fetaured-image').attr('src', LensAdvisor.variants[LensAdvisor.selectedVariant].image)
                    let variant_summary = ''
                    LensAdvisor.variants[LensAdvisor.selectedVariant].json.options.forEach(function (optionName, index) {
                        if (optionName !== "Default Title") {
                            variant_summary += '<div class="review-item-variant">'
                            variant_summary += optionName
                            variant_summary += '</div>'
                        }
                    })
                    let variant_title = LensAdvisor.variants[LensAdvisor.selectedVariant].json.name
                    LensAdvisor.$('#selected_variant_title').html(variant_title)
                    LensAdvisor.$('#selected_variant_summary').html(variant_summary)
                    LensAdvisor.render()
                    document.dispatchEvent(new CustomEvent('LensAdvisor:variant:detected'));
                } else {
                    LensAdvisor.handleSubmitButtons(true)
                    LensAdvisor.$('.la-select-lenses-btn').hide()
                }
            }
        }

        LensAdvisor.getAppStylesheet = function () {
            var stylesheet = document.getElementById('la-custom-css-injector');
            if (!stylesheet) {
                stylesheet = LensAdvisor.$('<style id="la-custom-css-injector">').appendTo('head')[0];
            }
            stylesheet = stylesheet.sheet;
            return stylesheet;
        }

        LensAdvisor.addStyle = function (selector, rulename, value) {
            var stylesheet = LensAdvisor.getAppStylesheet();
            var cssRules = stylesheet.cssRules || stylesheet.rules;
            var rule = stylesheet.insertRule(selector + ' { ' + rulename + ':' + value + ';}', cssRules.length);
        }

        LensAdvisor.addStylesheet = function(styleString) {
            const style = document.createElement('style');
            style.textContent = styleString;
            document.body.append(style);
        }

        LensAdvisor.addStyles = function (selector, rules) {
            var stylesheet = LensAdvisor.getAppStylesheet();
            var cssRules = stylesheet.cssRules || stylesheet.rules;
            for (var prop in rules) {
                LensAdvisor.addStyle(selector, prop, rules[prop]);
            }
        }

        LensAdvisor.addCSSToUL = function () {
            let $selector = LensAdvisor.$('.la-modal-wrapper .prescription-body .la-nav-link')
            $selector.removeClass('complete')
            for (let i=0; i< $selector.length; i++) {
                if ($selector[i].classList.contains('active')) {
                    $selector[i].classList.add('complete')
                    break;
                }
                $selector[i].classList.add('complete')
            }
        }

        LensAdvisor.getSubmitbuttons = function () {
            var submit_buttons = new Set()
            if (LensAdvisor.advisor.settings.unique_css_class != '' && ["default", "custom_css_class"].includes(LensAdvisor.advisor.settings.button_search_rule)) {
                LensAdvisor.$(LensAdvisor.$('.' + LensAdvisor.advisor.settings.unique_css_class)).map(function (index, btn) { submit_buttons.add(btn) })
            }

            if (["default", "product-form"].includes(LensAdvisor.advisor.settings.button_search_rule)) {
                LensAdvisor.$(`form[action="${Shopify.routes.root}cart/add"]`).find(':submit').map(function (index, btn) { submit_buttons.add(btn) })
            }

            LensAdvisor.submit_buttons = Array.from(submit_buttons)

        }

        LensAdvisor.injectButton = function() {
            var submit_buttons = new Set()

            if (LensAdvisor.advisor.settings.unique_css_class != '' && ["default", "custom_css_class"].includes(LensAdvisor.advisor.settings.button_search_rule)) {
                LensAdvisor.$(LensAdvisor.$('.' + LensAdvisor.advisor.settings.unique_css_class)).map(function (index, btn) { submit_buttons.add(btn) })
            }

            if (["default", "product-form"].includes(LensAdvisor.advisor.settings.button_search_rule)) {
                LensAdvisor.$(`form[action="${Shopify.routes.root}cart/add"]`).find(':submit').map(function (index, btn) { submit_buttons.add(btn) })
            }

            LensAdvisor.submit_buttons = Array.from(submit_buttons)

            if (LensAdvisor.submit_buttons.length === 0) {
                return false;
            }

            let insertMethod = "before"
            if (LensAdvisor.advisor.settings.show_add_to_cart_button) {
                insertMethod = LensAdvisor.advisor.settings.lensAdvizorButtonPosition || "before"
            }

            if (LensAdvisor.advisor.settings.inject_to_matching_button) {
                LensAdvisor.$(LensAdvisor.submit_buttons)[insertMethod]('<button type="button" id="la-select-lenses-btn" class="la-select-lenses-btn" data-toggle="la-modal" data-target="#myPrescription" >{{ shop.metaobjects.rx_insert_form.live.upload_button }}</button>')
            } else {
                LensAdvisor.$(LensAdvisor.submit_buttons[0])[insertMethod]('<button type="button" id="la-select-lenses-btn" class="la-select-lenses-btn" data-toggle="la-modal" data-target="#myPrescription" >{{ shop.metaobjects.rx_insert_form.live.upload_button }}</button>')
            }
        }

        LensAdvisor.addQueryParamsToURL = function (url, object) {
            url += '?'
            for (let key in object) {
                url += key + '=' + object[key] + '&'
            }
            return url
        }

        LensAdvisor.updateLensAdvizorVariants = function (assignedVariants) {
            const productDefaultImage = "{{ product.featured_image | img_url: 'master' }}"

            LensAdvisor.variants = {}
            if (LensAdvisor.assign_by !== "collection") {
                Object.keys(assignedVariants).forEach(variantId => {
                    // let variant = LensAdvisor.variantsJSON.find(variant => variant.id == variantId);
                    // console.log('variants DEBUG', LensAdvisor.variantsJSON); //debug
                    let variant = LensAdvisor.variantsJSON[0]; //Bigscreen only has one prescription lens option, so forego the search
                    if (variant.available) {
                        LensAdvisor.variants[variant.id] = {
                            ogId: variantId, //Our LA version is outdated. As such, the variantId in their system is outdated
                            price: variant.price / 100.00,
                            collection_id: assignedVariants[variantId],
                            json: variant,
                            image: variant.featured_image ? variant.featured_image.src : productDefaultImage
                        }
                    }
                })
            } else {
                LensAdvisor.variantsJSON.forEach(variant => {
                    if (variant.available) {
                        LensAdvisor.variants[variant.id] = {
                            price: variant.price / 100.00,
                            collection_id: LensAdvisor.Collection_id,
                            json: variant,
                            image: variant.featured_image ? variant.featured_image.src : productDefaultImage
                        }
                    }
                })
            }

        }

        LensAdvisor.getSettings = function() {
            document.dispatchEvent(new CustomEvent('LensAdvisor:init:start'));
            LensAdvisor.updateSelect()
            LensAdvisor.addStyle('form button, form input[type="submit"]', 'visibility', 'visible !important')

            const settingsUrl = LensAdvisor.addQueryParamsToURL(LensAdvisor.BASE_URL + "/store/settings", {
                store: Shopify.shop,
                product_id: LensAdvisor.product_id,
                collection_id: LensAdvisor.Collection_id
            })

            LensAdvisor.$.getJSON(settingsUrl, function(res){
                LensAdvisor.assign_by = res.assign_by

                if (LensAdvisor.assign_by === null) {
                    LensAdvisor.$('.la-select-lenses-btn').remove()
                    LensAdvisor.$('.la-iso-bootstrap').remove()
                    LensAdvisor.$('form button, form input[type="submit"').css({'visibility': 'visible'})
                    document.dispatchEvent(new CustomEvent('LensAdvisor:init:complete'));
                    return false;
                } else if (res.assigned_variants || LensAdvisor.assign_by) {
                    LensAdvisor.updateLensAdvizorVariants(res.assigned_variants)
                }

                LensAdvisor.advisor.defaultCurrency = res.default_currency
                LensAdvisor.settings = res
                LensAdvisor.advisor.settings = res.settings
                /* [Bigscreen] The store offers one prescription type, one entry
                   method and one lens type, so the app's chooser steps are
                   single-card dead ends (the type card even renders pre-checked,
                   with nothing else to do). The app can skip a chooser whenever
                   its count is 1, but each skip hides behind a dashboard flag
                   this store has off; force the flags so the modal opens on the
                   prescription form itself. Every skip still checks the count,
                   so a second type/method/lens brings its chooser back. */
                LensAdvisor.advisor.settings.skipSelectPrescriptions = true
                LensAdvisor.advisor.settings.skipPrescriptionMethod = true
                LensAdvisor.advisor.settings.skipPrescriptionLenses = true
                /* [Bigscreen] The skip chain counts the entry-method radios in
                   the DOM, but the app only removes the disabled ones further
                   down this callback — after detectVariant() below has already
                   rendered and auto-clicked. Still 3 radios at that moment, so
                   the chain stalled on the type chooser. Remove them before the
                   render; the app's own removals later find nothing, harmlessly. */
                if (!res.settings.can_email_prescription_after_placing_order) {
                    LensAdvisor.$('#can_email_prescription_after_placing_order').remove()
                }
                if (!res.settings.can_upload_their_prescription) {
                    LensAdvisor.$('#can_upload_their_prescription').remove()
                }
                if (res.settings.custom_javascript && res.settings.custom_javascript !== "") {
                    LensAdvisor.$("head").append('<script>' + res.settings.custom_javascript + '</' + 'script>')
                }
                LensAdvisor.injectButton()
                LensAdvisor.applyTranslation()
                LensAdvisor.detectVariant()
                LensAdvisor.interval = setInterval(LensAdvisor.detectVariant)

                let vh = window.innerHeight * 0.01;
                // Then we set the value in the --vh custom property to the root of the document
                document.documentElement.style.setProperty('--vh', `${vh}px`);
                LensAdvisor.$('.prescription-modal').css('height', window.innerHeight)
                LensAdvisor.$('.prescription-modal').css('height', 'calc(var(--vh, 1vh) * 100)')
                window.addEventListener('resize', () => {
                    // We execute the same script as before
                    let vh = window.innerHeight * 0.01;
                    document.documentElement.style.setProperty('--vh', `${vh}px`);
                });

                if (!LensAdvisor.advisor.settings.prism_required) {
                    LensAdvisor.$('#prism_value').remove()
                }

                if (res.billing_plan.code !== 'trial') {
                    LensAdvisor.$('.js-la-trail-logo').remove()
                }

                modal_button_background_color = {

                }

                LensAdvisor.addStyles(".modal-button-background-border", {"border-color": LensAdvisor.advisor.settings.modal_button_background_color})
                LensAdvisor.addStyles(".modal-button-background", {
                    "background-color": LensAdvisor.advisor.settings.modal_button_background_color,
                    "color": LensAdvisor.advisor.settings.modal_button_color
                })

                LensAdvisor.is_multiple_options_allowed = res.billing_plan.is_multiple_options_allowed

                //LensAdvisor.addStyle('.la-modal-wrapper .prescription-upload input[type="radio"]:checked+label', 'border-color', LensAdvisor.advisor.settings.modal_button_background_color)
                LensAdvisor.addStyle('.la-select-lenses-btn', 'color', LensAdvisor.advisor.settings.button_color)
                LensAdvisor.addStyle('.la-select-lenses-btn', 'background-color', LensAdvisor.advisor.settings.button_background_color)
                LensAdvisor.addStyle('.la-select-lenses-btn:hover', 'background-color', LensAdvisor.LightenDarkenColor(LensAdvisor.advisor.settings.button_background_color, -20))

                LensAdvisor.addStyle('.la-modal-primary-button', 'background-color', `${LensAdvisor.advisor.settings.modal_button_background_color} !important`)
                LensAdvisor.addStyle('.la-modal-secondary-button', 'background-color', `${LensAdvisor.advisor.settings.modal_button_color} !important`)
                LensAdvisor.addStyle('.la-modal-primary-button', 'color', `${LensAdvisor.advisor.settings.modal_button_color} !important`)
                LensAdvisor.addStyle('.la-modal-secondary-button', 'color', `${LensAdvisor.advisor.settings.modal_button_background_color} !important`)

                LensAdvisor.addStyle('.la-modal-wrapper .prescription-body .la-nav-link.complete', 'background-color', `${LensAdvisor.advisor.settings.modal_button_background_color} !important`)

                LensAdvisor.addStyle('.la-modal-wrapper .save-continue, .la-modal-wrapper .add-cart', 'background-color', `${LensAdvisor.advisor.settings.modal_button_background_color} !important`)
                LensAdvisor.addStyle('.la-modal-wrapper .la-skip-add-on', 'color', `${LensAdvisor.advisor.settings.modal_button_background_color} !important`)
                LensAdvisor.addStyle('.la-modal-wrapper .save-continue, .la-modal-wrapper .add-cart, .la-modal-wrapper .add-cart > p, .la-modal-wrapper .save-continue > p', 'color', LensAdvisor.advisor.settings.modal_button_color + ' !important ')
                LensAdvisor.addStyle('.la-each-card-carousel input[type="radio"]:checked + label', 'border', `1px solid ${LensAdvisor.advisor.settings.modal_button_background_color} !important`)
                LensAdvisor.addStyle('.la-label_button:hover', 'border', `1px solid ${LensAdvisor.advisor.settings.modal_button_background_color} !important`)
                LensAdvisor.addStyle('.la-each-card-carousel input[type="radio"]:checked + label p', 'color', `${LensAdvisor.advisor.settings.modal_button_background_color} !important`)
                //LensAdvisor.addStyle('.la-each-card-carousel input[type="radio"]:checked + label, .choose-lens-card .form-check input[type="radio"]:checked + label', 'border', `1px solid ${LensAdvisor.advisor.settings.modal_button_background_color} !important`)
                // LensAdvisor.addStyle('.la-each-card-carousel input[type="radio"]:checked + label, .choose-lens-card .form-check input[type="radio"]:checked + label', 'background-color', `#f5f5f5;`)

                if (LensAdvisor.advisor.settings.custom_css) {
                    LensAdvisor.addStylesheet(LensAdvisor.advisor.settings.custom_css)
                }

                LensAdvisor.addCSSToUL()

                LensAdvisor.$('.la-select-lenses-btn').html(LensAdvisor.advisor.settings.button_text)
                LensAdvisor.$("#support_email_modal").html(LensAdvisor.advisor.settings.support_email)

                if (LensAdvisor.advisor.settings.pd_on_upload == "hidden") {
                    LensAdvisor.$('.upload-manual-option').remove()
                }

                if (LensAdvisor.advisor.settings.uploadRequiredOnManualEntry === "hidden") {
                    LensAdvisor.$('#prescription_upload_manually_wrapper').remove()
                }

                if (LensAdvisor.advisor.settings.segment_height == "hidden") {
                    LensAdvisor.$('#segment_height').remove()
                }

                if (LensAdvisor.advisor.settings.segment_height_on_upload == 'hidden') {
                    LensAdvisor.$('.upload-manual-option-segment-height').remove()
                }

                if (!LensAdvisor.advisor.settings.can_email_prescription_after_placing_order) {
                    LensAdvisor.$('#can_email_prescription_after_placing_order').remove()
                }
                if (!LensAdvisor.advisor.settings.can_enter_prescription_manullly) {
                    LensAdvisor.$('#can_enter_prescription_manually').hide()
                }
    
                if (!LensAdvisor.advisor.settings.can_upload_their_prescription) {
                    LensAdvisor.$('#can_upload_their_prescription').remove()
                }

                if (LensAdvisor.advisor.settings.custom_html) {
                    let json = JSON.parse(LensAdvisor.advisor.settings.custom_html)
                    for (let key in json) {
                        LensAdvisor.$(key)[json[key].method](json[key].html)
                    }
                }

                // TODO: delete once all stores are migrated to new translation engine
                LensAdvisor.supportLegacyTranslation()

                if (!LensAdvisor.advisor.settings.showQuantityFieldOnReview) {
                    LensAdvisor.$('.la-quantity-wrapper').remove()
                    LensAdvisor.$('#la-quantity-wrapper-hr').remove()
                }

                document.dispatchEvent(new CustomEvent('LensAdvisor:init:complete'));
            })
            .fail(function(event, jqxhr, exception) {
                LensAdvisor.$('.la-select-lenses-btn').remove()
                LensAdvisor.$('.la-iso-bootstrap').remove()

                LensAdvisor.$('form button, form input[type="submit"').css({'visibility': 'visible'})
                document.dispatchEvent(new CustomEvent('LensAdvisor:init:complete'));
            })
        }

        LensAdvisor.LightenDarkenColor = function (col, amt) {
            col = col.replace(/^#/, '')
            if (col.length === 3) col = col[0] + col[0] + col[1] + col[1] + col[2] + col[2]

            let [r, g, b] = col.match(/.{2}/g);
            ([r, g, b] = [parseInt(r, 16) + amt, parseInt(g, 16) + amt, parseInt(b, 16) + amt])

            r = Math.max(Math.min(255, r), 0).toString(16)
            g = Math.max(Math.min(255, g), 0).toString(16)
            b = Math.max(Math.min(255, b), 0).toString(16)

            const rr = (r.length < 2 ? '0' : '') + r
            const gg = (g.length < 2 ? '0' : '') + g
            const bb = (b.length < 2 ? '0' : '') + b

            return `#${rr}${gg}${bb}`
        }

        LensAdvisor.saveManualPrescription = function () {
            LensAdvisor.$(".la-error-popdown").hide();
            const errors = [];
            const prescription_type = LensAdvisor.getPredictedPrescriptionType(true)

            const validFields = ["sph", "cyl"]
            var validElements = []

            const addValues = {
                left: LensAdvisor.$('select.js-od-left[name="add"]').val(),
                right: LensAdvisor.$('select.js-od-right[name="add"]').val()
            }

            var isFieldsValid = false;
            if (prescription_type != 'reading') {

                LensAdvisor.$(".js-od-right").map( function (index, element) {
                    if (element.name == 'add' || element.attributes.field_name.value === 'intermediate_add') {
                        console.warn("pass")
                    } else if (element.value == '' && !["sph", "cyl", "axis"].includes(element.name)) {
                        errors.push(LensAdvisor.$(element))
                    } else if (element.name == 'cyl' && element.selectedOptions[0].innerText === 'Select') {
                        errors.push(LensAdvisor.$(element))
                    } else if (element.name === 'axis' && (element.value === '' || element.value === 'na')  && LensAdvisor.$('select.js-od-right[name="cyl"]').val() !== '0.00') {
                        errors.push(LensAdvisor.$(element))
                    }
                    if (validFields.includes(element.name)) {
                        if (![""/*, "0.00"*/].includes(element.value)) {
                            isFieldsValid = true
                        }
                        validElements.push(element)
                    }
                })

                LensAdvisor.$(".js-od-left").map( function (index, element) {
                    if (element.name == 'add' || element.attributes.field_name.value === 'intermediate_add') {
                        console.warn("Exeception")
                    } else if (element.value == '' && !["sph", "cyl", "axis"].includes(element.name)) {
                        errors.push(LensAdvisor.$(element))
                    } else if (element.name == 'cyl' && element.selectedOptions[0].innerText === 'Select') {
                        errors.push(LensAdvisor.$(element))
                    } else if (element.name === 'axis' && (element.value === '' || element.value === 'na')  && LensAdvisor.$('select.js-od-left[name="cyl"]').val() !== '0.00') {
                        errors.push(LensAdvisor.$(element))
                    }
                    if (validFields.includes(element.name)) {
                        if (![""/*, "0.00"*/].includes(element.value)) {
                            isFieldsValid = true
                        }
                        validElements.push(element)
                    }
                })
            }

            if (isFieldsValid) {
                validElements.forEach(element => LensAdvisor.$(element).css({"border-color": "#C1C1C1"}))
            } else {
                validElements.forEach(element => errors.push(LensAdvisor.$(element)))
            }

            if (prescription_type === 'reading' && LensAdvisor.advisor.responses.manually.sph == '') {
                errors.push(LensAdvisor.$('.js-od-sph'))
            } else if (prescription_type === 'reading' && LensAdvisor.advisor.responses.manually.sph !== '') {
                validElements = []
                LensAdvisor.advisor.responses.manually.od_right.sph = LensAdvisor.advisor.responses.manually.sph
                LensAdvisor.advisor.responses.manually.os_left.sph = LensAdvisor.advisor.responses.manually.sph
            }

            // ONLY FOR SINGLE VISION AND PROGRESSIVE
            if (LensAdvisor.advisor.responses.manually.prism_value && prescription_type != 'reading' && LensAdvisor.advisor.settings.prism_required) {
                LensAdvisor.$(".js-prism-od-right").each( function (index, element) {
                    if (element.value == '') {
                        errors.push(LensAdvisor.$(element))
                    }
                })
                LensAdvisor.$(".js-prism-od-left").each( function (index, element) {
                    if (element.value == '') {
                        errors.push(LensAdvisor.$(element))
                    }
                })
            }

            let pd_type = LensAdvisor.advisor.responses.manually.pd.type
            let settings = LensAdvisor.advisor.settings
            let pd_right = LensAdvisor.$('.js-select-pd-right-value').val()
            let pd_left = LensAdvisor.$('.js-select-pd-left-value').val()

            if (pd_type == 'Single PD' && ((LensAdvisor.$('.pd-value').val() == '' && prescription_type != 'reading' && settings.pd_required == true) || (LensAdvisor.advisor.settings.pd_on_readers == true && prescription_type == 'reading' && LensAdvisor.$('.pd-value').val() == ''))) {
                errors.push(LensAdvisor.$('.pd-value'))
            }

            if (pd_type == 'Dual PD' && ((prescription_type != 'reading' && settings.pd_required == true) || (prescription_type == 'reading' && settings.pd_on_readers == true )) && (pd_right == '' || pd_left == '')) {
                errors.push(LensAdvisor.$('.js-select-pd-right-value'))
                errors.push(LensAdvisor.$('.js-select-pd-left-value'))
            }

            if (prescription_type === 'progressive' && settings.segment_height == true && LensAdvisor.$('.segment_height').val() == '') {
                errors.push(LensAdvisor.$('.segment_height'))
            }

            if (settings.uploadRequiredOnManualEntry !== "hidden" && settings.uploadRequiredOnManualEntry && !LensAdvisor.advisor.responses.prescription_file && prescription_type !== 'reading' && LensAdvisor.advisor.responses.method === "entered_manually" ) {
                LensAdvisor.$('.error-file-manually').html(LensAdvisor.getTranslatedText("Prescription file is required"))
                errors.push(LensAdvisor.$('#label-prescription-upload-manually'))
            }

            if (errors.length > 0) {
                errors.forEach(obj => obj.css({"border-color": "red"}))
                LensAdvisor.$("#la_error_select_prescription").show()
                setTimeout (function () {
                    LensAdvisor.$("#la_error_select_prescription").hide()
                }, 2000)
                LensAdvisor.addCSSToUL()
                return false;
            }
            LensAdvisor.$('.prescription-body a[href="#choose_lens"]').tab('show')
            LensAdvisor.get_lens_types()
            return true;
        }

        LensAdvisor.saveODRight = function () {
            LensAdvisor.$(this).css({"border-color": "#C1C1C1"})
            LensAdvisor.advisor.responses.manually.od_right[LensAdvisor.$(this).attr('field_name')] = this.value
            if (this.name === 'cyl' && this.value === '0.00') {
                LensAdvisor.$('select.js-od-right[name="axis"]').css({"border-color": "#C1C1C1"})
            }
            if (this.name === 'cyl' && this.value !== '' && this.value !== '0.00') {
                LensAdvisor.$('select.js-od-right[name="axis"]').attr('disabled', false)
            } else if (this.name === 'cyl') {
                LensAdvisor.$('select.js-od-right[name="axis"]').attr('disabled', 'disabled')
            }
        }

        LensAdvisor.saveODLeft = function () {
            LensAdvisor.$(this).css({"border-color": "#C1C1C1"})
            LensAdvisor.advisor.responses.manually.os_left[LensAdvisor.$(this).attr('field_name')] = this.value
            if (this.name === 'cyl' && this.value === '0.00') {
                LensAdvisor.$('select.js-od-left[name="axis"]').css({"border-color": "#C1C1C1"})
            }
            if (this.name === 'cyl' && this.value !== '' && this.value !== '0.00') {
                LensAdvisor.$('select.js-od-left[name="axis"]').attr('disabled', false)
            } else if (this.name === 'cyl') {
                LensAdvisor.$('select.js-od-left[name="axis"]').attr('disabled', 'disabled')
            }
        }

        LensAdvisor.savePrismODRight = function () {
            LensAdvisor.$(this).css({"border-color": "#C1C1C1"})
            LensAdvisor.advisor.responses.manually.prism_fields.od_right[LensAdvisor.$(this).attr('field_name')] = this.value
        }

        LensAdvisor.savePrismODLeft = function () {
            LensAdvisor.$(this).css({"border-color": "#C1C1C1"})
            LensAdvisor.advisor.responses.manually.prism_fields.os_left[LensAdvisor.$(this).attr('field_name')] = this.value
        }

        LensAdvisor.savePDS = function () {
            LensAdvisor.$(this).css({"border-color": "#C1C1C1"})
            LensAdvisor.advisor.responses.manually.pd.value = null
            LensAdvisor.advisor.responses.manually.pd[LensAdvisor.$(this).attr('field')] = this.value
        }

        LensAdvisor.prototype.getGroupName = function(group_type) {
            return {
                'clear_standard': 'Clear Lenses',
                'clear_bluelight_blocking': 'Blue-Light-Blocking Lenses',
                'clear_photochromic': 'Photochromic (Light-Responsive) Lenses',
                'tinted_non_polorised': 'Non-Polarized Sunglasses Lenses',
                'tinted_polorised': 'Polarized Sunglasses Lenses',
            }[group_type]
        }

        LensAdvisor.prototype.renderLensTypes = function () {
            try {
                LensAdvisor.$('#choose-lens-card').empty()
                LensAdvisor.advisor.lensSubtotal = LensAdvisor.advisor.convertCurrency({{product.id | json }}, LensAdvisor.selectedVariant, LensAdvisor.variants[LensAdvisor.selectedVariant].price)

                if (this.lens_types.length == 0) {
                    LensAdvisor.$('#choose-lens-card').append(`
                        <div class="item-not-found">
                            <p class="item-text">No Lenses Found</p>
                            <p><button class="btn save-continue" onclick="LensAdvisor.$('.js-back-button').click()">Try Again</buttom>
                        </div>
                    `)
                    return false;
                }

                const groups = ['clear_standard', 'clear_bluelight_blocking', 'clear_photochromic', 'tinted_polorised', 'tinted_non_polorised']
                this.group_lens = [];

                var addOnPrice = 0.0

                for (let i=0; i < groups.length; i++) {
                    let group_name = groups[i]
                    let group_lens = this.lens_types.filter(function(obj) {
                        return obj.group_type === group_name
                    })

                    if (group_lens.length === 0) {
                        continue
                    }

                    this.group_lens.push(group_name)

                    item_group = this.item_groups[this.responses.prescription_type][group_name]

                    let content = `<div class="choose-lens-card">
                        <h6 ${item_group.description ? 'class="mb-3"' : ''}>${item_group.title}</h6>
                        ${item_group.description ? `<p>${item_group.description}</p>` : ''}
                    <div>`

                    for (let i=0; i < group_lens.length; i++) {
                        let lens = group_lens[i]
                        let lens_variant = lens.variants[0]
                        if (!lens_variant) {
                            continue
                        }

                        if (LensAdvisor.isCurrencyConversionRequired()) {
                            lens.price = this.convertCurrency(lens.shopify_id, lens_variant.variant_id, lens.price)
                            lens.variants.forEach(function (obj, index) {
                                obj.defaultPrice = obj.price
                                obj.price = this.convertCurrency(lens.shopify_id, obj.variant_id, obj.price)
                            }.bind(this))
                        }

                        if (this.responses.lens === lens.id || lens.default ) {
                            this.responses.lens = lens
                            this.responses.lens_variant = lens_variant
                            checked = 'checked'
                            addOnPrice += lens.price
                        } else {
                            checked = ''
                        }

                        // let lens_price = parseFloat(lens_variant.price) == 0 ?  LensAdvisor.$('#la-free-text').html() : LensAdvisor.formatCurrency(parseFloat(lens_variant.price))
                        // Updating above statement to test for if options exist, and if they do, then add "starting from" text to the front of the price
                        let lens_price = parseFloat(lens_variant.price)
                        if (lens_variant.price == 0) {
                            lens_price = LensAdvisor.getTranslatedText("FREE")
                        } else {
                            if (lens.variants.length > 1 && LensAdvisor.is_multiple_options_allowed){
                                lens_price = LensAdvisor.getTranslatedText('Starting From') + LensAdvisor.formatCurrency(parseFloat(lens_variant.price))
                            } else {
                                lens_price = LensAdvisor.formatCurrency(parseFloat(lens_variant.price))
                            }
                        }

                        content += `<div class="form-check">
                            <input class="form-check-input la-radio-lenses mt-3" type="radio" name="lens-${lens.prescription_type}" id="${lens.group_type}-${lens.id}" value="${lens.id}" price="${lens_variant.price}" group_type="${lens.group_type}" checked onclick="LensAdvisor.handleLensChange(this)">
                            <label class="la-label_button form-check-label form-check-label-color" for="${lens.group_type}-${lens.id}">
                                ${lens.name}
                                ${lens.default_image ? `<div class="la-lens-image-container"><img src="${lens.default_image.src}" /></div>`: ''}
                                ${lens.description ? `<div class="la-lens-description">${lens.description}</div>`: ''}
                                <div class="radio-pricing" id="radio_pricing_normal_style">${lens_price}</div>
                            </label>
                        </div>`
                    }

                    content += `</div></div>`

                    LensAdvisor.$('#choose-lens-card').append(content)
                }

                LensAdvisor.advisor.lensSubtotal += addOnPrice

                LensAdvisor.advisor.lensSubtotal = LensAdvisor.advisor.lensSubtotal.toFixed(LensAdvisor.DECIMAL_POINTS)

                LensAdvisor.$('#lens-subtotal').html(LensAdvisor.formatCurrency(parseFloat(LensAdvisor.advisor.lensSubtotal)))

                if (this.lens_types.length === 1 && this.settings.skipPrescriptionLenses) {
                    LensAdvisor.$('.la-radio-lenses').click()
                    setTimeout(function () {
                        LensAdvisor.$('.js-back-button').show()
                    })
                }
                LensAdvisor.addCSSToUL()
            } catch (error) {
                LensAdvisor.error_loading = true
                LensAdvisor.raiseException(error)
            }
        }

        LensAdvisor.isCurrencyConversionRequired = function (){
            return LensAdvisor.advisor.defaultCurrency && LensAdvisor.advisor.defaultCurrency != "" && LensAdvisor.advisor.defaultCurrency != Shopify.currency.active
        }

        LensAdvisor.handleLensChange = function (that) {
            var self = LensAdvisor.advisor
            self.responses.lens = self.lens_types.find(function(lens) {
                return lens.id == parseInt(that.value)
            })

            self.responses.lens_variant = self.responses.lens.variants[0]
            self.lensSubtotal = parseFloat(LensAdvisor.variants[LensAdvisor.selectedVariant].price) + parseFloat(LensAdvisor.$(that).attr('price'))
            LensAdvisor.$('#lens-subtotal').html(LensAdvisor.formatCurrency(parseFloat(LensAdvisor.advisor.lensSubtotal)))
            // Zenos updated to go straight to the next step when the Lens is selected, no need to click Save and Contine
            LensAdvisor.$("#la_choose-options_lens_title").html(self.responses.lens.name)
            LensAdvisor.postChooseLens()
        }

        LensAdvisor.postChooseLens = function () {
            try {
                // Called when lens is selected.
                const prescription_type = LensAdvisor.getPredictedPrescriptionType()
                var self = LensAdvisor.advisor;

                let isOptionsAvailable = Object.keys(self.responses.lens.options).length > 0 && self.responses.lens.variants.length > 1
                let subtotal = self.lensSubtotal

                subtotal += parseFloat(self.responses.lens.price)
                if (LensAdvisor.$(`input[name="lens-${prescription_type}"]:checked`).length === 0) {
                    LensAdvisor.$("#la_error_select_lens").show()
                    setTimeout (function () {
                        LensAdvisor.$("#la_error_select_lens").hide()
                    }, 2000)
                    return false;
                }
                LensAdvisor.$("#la_error_select_lens").hide()

                let func = LensAdvisor.review
                LensAdvisor.advisor.responses.addOns = {}
                LensAdvisor.advisor.responses.addOnsStep = 0

                if (isOptionsAvailable && LensAdvisor.is_multiple_options_allowed) {
                    func = LensAdvisor.renderOptions
                } else if (self.responses.lens.add_ons) {
                    self.responses.addOnsStep = 0
                    self.responses.lens.add_ons_products.forEach((step, index) => {
                        self.responses.addOns[index] = {
                            product: null,
                            variantId: null,
                            canSkip: false
                        }
                    })
                    func = LensAdvisor.renderAddOns
                }

                func()

                const prescriptionMethods = document.querySelectorAll('.radio-prescription-upload-type').length
                if (self.lens_types.length === 1 && self.settings.skipPrescriptionLenses && self.settings.skipPrescriptionMethod && self.settings.skipSelectPrescriptions && self.prescription_types.length === 1 && prescriptionMethods === 1) {
                    setTimeout(function () {LensAdvisor.$('.js-back-button').hide()}, 100)
                }
            } catch (error) {
                LensAdvisor.error_loading = true
                LensAdvisor.raiseException(error)
            }
        }

        LensAdvisor.optionComapre = function (osValue, odValue, min, max) {
            return min && max && (!(osValue >= min && osValue <= max) || !(odValue >= min && odValue <= max))
        }

        LensAdvisor.renderOptions = function () {
            try {
                var self = LensAdvisor.advisor
                LensAdvisor.advisor.responses.addOns = {}
                LensAdvisor.advisor.responses.addOnsStep = 0

                LensAdvisor.$('.prescription-body a[href="#choose_options"]').tab('show');
                LensAdvisor.$('#choose_options-subtotal').html(LensAdvisor.formatCurrency(parseFloat(self.lensSubtotal)))
                LensAdvisor.$('.la-choose_options-lens-price').html(LensAdvisor.formatCurrency(parseFloat(self.responses.lens_variant.price)))
                LensAdvisor.$('.choose_options-frame-price').html(LensAdvisor.formatCurrency(parseFloat(LensAdvisor.variants[LensAdvisor.selectedVariant].price)))
                const options = self.responses.lens.options
                var html = "";

                const optionsSelected = {}

                for (optionKey in options) {
                    const option = options[optionKey]
                    const optionSettings = self.responses.lens.options_settings.find(obj => obj.id === option.id)
                    optionsSelected[optionKey] = false

                    html += `<div class="la-option-carousel-container">
                        <h6 class="la-carousel-heading">${option.name}</h6>
                        <div class="la-option-carousel-${optionKey}">
                            ${option.values.map(function (value, index) {
                                if (optionSettings && LensAdvisor.advisor.responses.method === 'entered_manually') {
                                    let valueConfig = optionSettings.values.find(val => val.name === value)
                                    if (valueConfig && LensAdvisor.optionComapre(parseFloat(LensAdvisor.advisor.responses.manually.os_left.sph), parseFloat(LensAdvisor.advisor.responses.manually.od_right.sph), parseFloat(valueConfig.minSph), parseFloat(valueConfig.maxSph))) {
                                        return ''
                                    }
                                    if (valueConfig && LensAdvisor.optionComapre(parseFloat(LensAdvisor.advisor.responses.manually.os_left.cyl), parseFloat(LensAdvisor.advisor.responses.manually.od_right.cyl), parseFloat(valueConfig.minCyl), parseFloat(valueConfig.maxCyl))) {
                                        return ''
                                    }
                                }
                                let selected = self.responses.lens_variant[optionKey] === value ? "checked" : ""
                                if (selected === "checked") {
                                    optionsSelected[optionKey] = true
                                }
                                return `<div class="la-each-card-carousel">
                                    <input type="radio" id="${optionKey}${value.replaceAll(" ", '-')}" name="radio-carousel-${optionKey}" value="${value}" required class="la-carousel-radio" ${selected} data-option-type="${optionKey}">
                                    <label class="la-label_button" for="${optionKey}${value.replaceAll(" ", "-")}">
                                        <div class="la-title-carousel-items">${value}</div>
                                        <p class="la-title-carousel-items-pricing" id="la-price-${optionKey}${value.replaceAll(" ", '-')}"></p>
                                    </label>
                                </div>`
                            }).join("")}
                        </div>
                    </div>`
                }

                LensAdvisor.$('.la_choose-options-container').html(html)

                for (let optionKey in optionsSelected) {
                    if (!optionsSelected[optionKey]) {
                        let element = document.querySelectorAll(`input[name="radio-carousel-${optionKey}"]`)[0]
                        if (element) {
                            element.checked = true
                        } else {
                            LensAdvisor.$('.la_choose-options-container').html(`<div class="item-not-found">
                                <p class="item-text">${LensAdvisor.getTranslatedText('No Lens Options')}</p>
                                <p><button class="btn save-continue" onclick="LensAdvisor.$('.js-back-button').click()">${LensAdvisor.getTranslatedText('Try Again')}</buttom>
                            </div>`)
                            LensAdvisor.$('.js-options-continue').attr('disabled', 'disabled')
                            return false;
                        }
                    } else {
                        LensAdvisor.$('.js-options-continue').removeAttr('disabled')
                    }
                }

                LensAdvisor.advisor.responses.lens_variant = LensAdvisor.findLensVariant()

                self.responses.addOns = {}
                self.responses.addOnsStep = 0

                if (self.responses.lens.add_ons) {
                    self.responses.addOnsStep = 0
                    self.responses.lens.add_ons_products.forEach((step, index) => {
                        self.responses.addOns[index] = {
                            product: null,
                            variantId: null,
                            canSkip: false
                        }
                    })
                    LensAdvisor.$('.js-options-continue').off('click', LensAdvisor.review)
                    LensAdvisor.$('.js-options-continue').on('click', LensAdvisor.renderAddOns)
                } else {
                    LensAdvisor.$('.js-options-continue').off('click', LensAdvisor.renderAddOns)
                    LensAdvisor.$('.js-options-continue').on('click', LensAdvisor.review)
                }

                LensAdvisor.$('.la-each-card-carousel input[type="radio"]').on('change', LensAdvisor.handleOptionChange)
                LensAdvisor.handleOptionChange()
                document.dispatchEvent(new CustomEvent('LensAdvisor:lensOptions:loaded'));
            } catch (error) {
                LensAdvisor.error_loading = true
                LensAdvisor.raiseException(error)
            }
        }

        LensAdvisor.renderAddOns = function () {
            try {
                var self = LensAdvisor.advisor
                LensAdvisor.$('.prescription-body a[href="#choose_addons"]').tab('show');

                self.responses.addOns[self.responses.addOnsStep] = {
                    product: null,
                    variantId: null,
                    outOfStockSkip: true
                }

                const step = self.responses.lens.add_ons_products[self.responses.addOnsStep]

                const content = `<div class="choose-lens-card">
                    <p>${step.description}</p>
                    ${step.products.map(product => {
                        if (product.variants.length > 1) {
                            return product.variants.map(variant => {
                                if (variant.inventory_policy === "deny" && variant.inventory_management !== null && variant.inventory_quantity === 0) {
                                    return ''
                                }
                                self.responses.addOns[self.responses.addOnsStep].outOfStockSkip = false
                                let image = product.images.find(image => image.variant_ids.includes(variant.id)) || product.image || {src: "https://cdn.shopify.com/s/images/admin/no-image-large.gif?da5ac9ca38617f8fcfb1ee46268f66d451ca66b4"}

                                if (LensAdvisor.isCurrencyConversionRequired()) {
                                    variant.convertedPrice = self.convertCurrency(product.id, variant.id, variant.price)
                                    //variant.convertedPrice = LensAdvisor.Currency.convert(parseFloat(variant.price), LensAdvisor.advisor.defaultCurrency, Shopify.currency.active)
                                } else {
                                    variant.convertedPrice = variant.price
                                }

                                const price = parseFloat(variant.price) == 0 ? LensAdvisor.getTranslatedText('FREE') : LensAdvisor.formatCurrency(parseFloat(variant.convertedPrice))

                                return `<div>
                                    <div class="form-check">
                                        <input class="form-check-input la-radio-add-ons mt-3" type="radio" name="lens-add-on-step" id="lens-add-on-${self.responses.lens.id}-${product.id}-${variant.id}" value="${variant.id}"  data-product-id="${product.id}">
                                        <label class="la-label_button form-check-label form-check-label-color la-add-on-label" for="lens-add-on-${self.responses.lens.id}-${product.id}-${variant.id}">
                                            <div class="la-add-on-image-container">
                                                <img src="${image.src}">
                                            </div>
                                            <div class="la-add-on-title">
                                                <h5 class="la-product-heading">${product.title} - ${variant.title} - <span class="radio-pricing" id="radio_pricing_normal_style">${price}</span></h5>
                                                ${step.show_product_description ? `<div class="la-add-on-description">
                                                    ${product.body_html}
                                                </div>` : ''}
                                            </div>
                                        </label>
                                    </div>
                                </div>`
                            }).join("")
                        } else {
                            let variant = product.variants[0]
                            if (variant.inventory_policy === "deny" && variant.inventory_management !== null && variant.inventory_quantity === 0) {
                                return ''
                            }
                            self.responses.addOns[self.responses.addOnsStep].outOfStockSkip = false

                            const image = product.image || {src: "https://cdn.shopify.com/s/images/admin/no-image-large.gif?da5ac9ca38617f8fcfb1ee46268f66d451ca66b4"}

                            if (LensAdvisor.isCurrencyConversionRequired()) {
                                variant.convertedPrice = self.convertCurrency(product.id, variant.id, variant.price)
                            } else {
                                variant.convertedPrice = variant.price
                            }

                            const price = parseFloat(variant.price) == 0 ? LensAdvisor.getTranslatedText('FREE') : LensAdvisor.formatCurrency(parseFloat(variant.convertedPrice))

                            return `<div>
                                <div class="form-check">
                                    <input class="form-check-input la-radio-add-ons mt-3" type="radio" name="lens-add-on-step" id="lens-${self.responses.lens.id}-${product.id}" value="${product.variants[0].id}" data-product-id="${product.id}">
                                    <label class="la-label_button form-check-label form-check-label-color la-add-on-label" for="lens-${self.responses.lens.id}-${product.id}">
                                        <div class="la-add-on-image-container">
                                            <img src="${image.src}">
                                        </div>
                                        <div class="la-add-on-title">
                                            <h5 class="la-product-heading">${product.title} - <span class="radio-pricing" id="radio_pricing_normal_style">${price}</span></h5>
                                            ${step.show_product_description ? `<div class="la-add-on-description">
                                                ${product.body_html}
                                            </div>` : ''}
                                        </div>
                                    </label>
                                </div>
                            </div>`
                        }
                    }).join('')}
                    <a class="la-skip-add-on js-addon-skip" href="javascript:void(0)" style="display: ${step.can_skip ? '' : 'none'}">
                        ${step.skip_button_text}
                    </a>
                    ${step.can_skip ? `<div class="la-skip-button-description">
                        ${step.skip_button_description}
                    </div>` : ''}
                </div>`

                LensAdvisor.$('#la_assOns-title').html(step.title)

                LensAdvisor.$('.la_choose-addons-container').html(content)
                LensAdvisor.$('.la-radio-add-ons').on('change', LensAdvisor.handleAddOnChoose)
                LensAdvisor.$('.js-addon-skip').on('click', LensAdvisor.handleAddOnChoose)
                if (self.responses.addOns[self.responses.addOnsStep].outOfStockSkip) {
                    LensAdvisor.$('.js-addon-skip').trigger("click")
                }
                document.dispatchEvent(new CustomEvent('LensAdvisor:addOns:loaded'));
            } catch (error) {
                LensAdvisor.error_loading = true
                LensAdvisor.raiseException(error)
            }
        }

        LensAdvisor.handleAddOnChoose = function () {
            var self = LensAdvisor.advisor

            const step = self.responses.lens.add_ons_products[self.responses.addOnsStep]

            if (this.type !== "submit") {
                self.responses.addOns[self.responses.addOnsStep] = {
                    product: step.products.find(product => product.id == this.dataset.productId),
                    variantId: this.value,
                    step: step.title,
                    itemId: step.item,
                    canSkip: step.can_skip,
                    outOfStockSkip: self.responses.addOns[self.responses.addOnsStep]["outOfStockSkip"]
                }
            }

            self.responses.addOnsStep += 1

            if ((self.responses.addOnsStep + 1) > self.responses.lens.add_ons_products.length) {
                return LensAdvisor.review()
            }

            LensAdvisor.renderAddOns()
        }

        LensAdvisor.findLensVariant = function () {
            var selectedValues = [];

            document.querySelectorAll('.la-carousel-radio').forEach(function(option) {
                if (option.checked) {
                    selectedValues.push({
                        value: option.value,
                        index: option.dataset.optionType
                    })
                }
            })

            return LensAdvisor.advisor.responses.lens.variants.find(function(variant) {
                return selectedValues.every(function(values) {
                    return variant[values.index] === values.value;
                });
            });
        }

        LensAdvisor.handleOptionChange = function () {

            var found = LensAdvisor.findLensVariant()

            if (found) {
                LensAdvisor.advisor.lensSubtotal -= LensAdvisor.advisor.responses.lens_variant.price
                LensAdvisor.advisor.responses.lens_variant = found
                LensAdvisor.advisor.lensSubtotal += LensAdvisor.advisor.responses.lens_variant.price
                LensAdvisor.$('.js-options-continue').attr('disabled', false).html(LensAdvisor.getTranslatedText('Options Save and Continue'))
                LensAdvisor.$('.la-choose_options-lens-price').html(LensAdvisor.formatCurrency(parseFloat(LensAdvisor.advisor.responses.lens_variant.price)))
            } else {
                LensAdvisor.$('.js-options-continue').attr('disabled', 'disabled').html(LensAdvisor.getTranslatedText('Options Unavailable'))
                LensAdvisor.$('.la-choose_options-lens-price').html(" --- ")
            }
            LensAdvisor.$('#choose_options-subtotal').html(LensAdvisor.formatCurrency(parseFloat(LensAdvisor.advisor.lensSubtotal)))
            LensAdvisor.updateOptionsPrice()
        }

        LensAdvisor.updateOptionsPrice = function () {
            LensAdvisor.$('.la-title-carousel-items-pricing').html("")
            const options = LensAdvisor.advisor.responses.lens.options
            var optionKeys = Object.keys(LensAdvisor.advisor.responses.lens.options)
            for (optionKey in options) {
                const option = options[optionKey]
                option.values.forEach(function (value, index) {
                    let selectedValues = []
                    optionKeys.forEach(function (key, index) {
                        if (optionKey !== key) {
                            selectedValues.push({
                                value:  LensAdvisor.advisor.responses.lens_variant[key],
                                index: key
                            })
                        } else {
                            selectedValues.push({
                                value:  value,
                                index: optionKey
                            })
                        }
                    })
                    var found = LensAdvisor.advisor.responses.lens.variants.find(function(variant) {
                        return selectedValues.every(function(values) {
                            return variant[values.index] === values.value;
                        });
                    });
                    var optionPriceBox = document.getElementById(`la-price-${optionKey}${value.replaceAll(" ", '-')}`)
                    if (found) {
                        if (found.variant_id !== LensAdvisor.advisor.responses.lens_variant.variant_id) {
                            let currencyPrice = LensAdvisor.formatCurrency(parseFloat(found.price - LensAdvisor.advisor.responses.lens_variant.price))
                            //let currencyFormat = LensAdvisor.Currency.moneyFormats[Shopify.currency.active].money_format
                            //let currencySymbol = currencyFormat.replace(currencyFormat.slice(currencyFormat.indexOf("{"), currencyFormat.indexOf("}") + 2), '').trim()
                            if (!currencyPrice.includes("-")) {
                                currencyPrice = `+${currencyPrice}`
                            } else {
                                currencyPrice = `${currencyPrice}`
                            }
                            if (optionPriceBox) {
                                optionPriceBox.innerHTML = currencyPrice
                            }
                        }
                    } else {
                        optionPriceBox.innerHTML = " --- "
                    }
                })
            }
        }

        LensAdvisor.review = function () {
            try {
                // Show's Review's Page
                LensAdvisor.$('#la-review-error').hide()
                LensAdvisor.$('.prescription-body a[href="#review_selection"]').tab('show');
                LensAdvisor.$('#review-lens-title').html(LensAdvisor.advisor.responses.lens.name)

                var options_text = ""
                for (let optionKey in LensAdvisor.advisor.responses.lens.options) {
                    var option = LensAdvisor.advisor.responses.lens.options[optionKey]
                    if (LensAdvisor.advisor.responses.lens_variant[optionKey] === "Default Title") {
                        continue
                    }
                    options_text += `${option.name}: ${LensAdvisor.advisor.responses.lens_variant[optionKey]} <br/>`
                }

                const properties = LensAdvisor.advisor.get_properties("lens")
                var properties_texts = []
                const properties_keys = Object.keys(properties)
                properties_keys.forEach(function (fieldName, index) {
                    if (!fieldName.startsWith('_') && !["Prescription Type", "Prescription Method", "Product", "Frame"].includes(fieldName)) {
                        properties_texts.push(`${fieldName}: ${properties[fieldName]}`)
                    }
                })

                LensAdvisor.$('#review-lens-options').html(options_text)
                LensAdvisor.$('#review-lens-manual-prescription').html(properties_texts.join(" <br/>"))

                let prescription_method = LensAdvisor.getPrescriptionMethodDisplayName(LensAdvisor.advisor.responses.method)
                if (["uploaded", "entered_manually"].includes(LensAdvisor.advisor.responses.method)) {
                    prescription_method += ' &nbsp;<a href="javascript:void(0)" class="la-edit-prescription">&nbsp;<i class="la-fa-14px">&#9998;</i></a>'
                    LensAdvisor.$('#review-selected-priscription-method').html(prescription_method)
                    LensAdvisor.$('.la-edit-prescription').on('click', function () {
                        var $target = LensAdvisor.$('.radio-type-manual')
                        if (LensAdvisor.advisor.responses.method === "uploaded") {
                            $target = LensAdvisor.$('.radio-type-upload')
                        }
                        $target.click()
                    })
                } else {
                    LensAdvisor.$('#review-selected-priscription-method').html(prescription_method)
                }

                var addOnsPrice = 0
                var isAddOnsSelected = false

                if (LensAdvisor.advisor.responses.lens.add_ons) {
                    LensAdvisor.$('#add-ons-products-info').html(`<div class="review-item-title" id="review-addons-title">${LensAdvisor.getTranslatedText('Add Ons')}</div>
                        ${Object.keys(LensAdvisor.advisor.responses.addOns).map(step => {
                            const stepInfo = LensAdvisor.advisor.responses.addOns[step]

                            if (!stepInfo.variantId && !stepInfo.product) {
                                return ''
                            }

                            const variant = stepInfo.product.variants.find(variant => variant.id == stepInfo.variantId)
                            addOnsPrice += parseFloat(variant.convertedPrice)

                            let productTitle = stepInfo.product.title
                            if (variant.title !== 'Default Title') {
                                productTitle = `${productTitle} - ${variant.title}`
                            }
                            isAddOnsSelected = true
                            return `<div class="row">
                                <div class="review-item-variant col-7">
                                    ${productTitle}
                                </div>
                                <div class="review-item-variant col-5 text-right">
                                    ${LensAdvisor.formatCurrency(variant.convertedPrice)}
                                </div>
                            </div>`
                        }).join('')}
                    `)
                    LensAdvisor.$('#add-ons-review').show()
                } else {
                    LensAdvisor.$('#add-ons-products-info').empty()
                    LensAdvisor.$('#add-ons-review').hide()
                    LensAdvisor.advisor.responses.addOns = {}
                    LensAdvisor.advisor.responses.addOnsStep = 0
                }

                if (addOnsPrice == 0 && !isAddOnsSelected) {
                    LensAdvisor.$('#add-ons-review').hide()
                }

                LensAdvisor.$('#review-lens-price').html(LensAdvisor.formatCurrency(parseFloat(LensAdvisor.advisor.responses.lens_variant.price)))
                LensAdvisor.$('#review-selected-priscription').html(LensAdvisor.getPrescriptionTitle(LensAdvisor.advisor.responses.prescription_type))

                LensAdvisor.$('#review-variant-price').html(LensAdvisor.formatCurrency(parseFloat(LensAdvisor.variants[LensAdvisor.selectedVariant].price)))
                LensAdvisor.$('#reivew-subtotal').html(LensAdvisor.formatCurrency(LensAdvisor.advisor.lensSubtotal + addOnsPrice))
                LensAdvisor.addCSSToUL()
                setTimeout(function () {
                    LensAdvisor.$('.js-back-button').show()
                })
            } catch (error) {
                LensAdvisor.error_loading = true
                LensAdvisor.raiseException(error)
            }
        }

        LensAdvisor.prototype.get_prescription_request_data = function (cart_token) {
            let lens_variant = this.responses.lens_variant || ""
            if (lens_variant) {
                lens_variant.base_product_id = LensAdvisor.product_id
                lens_variant.base_product_title = "{{product.title}}"
                if (this.responses.lens.variants.length > 1) {
                    lens_variant.name = `${LensAdvisor.advisor.responses.lens.name} - ${lens_variant.name}`
                }
            }
            let data = {
                cart_token: cart_token,
                prescription_type: this.responses.prescription_type,
                method: this.responses.method,
                prescription_file: this.responses.prescription_file,
                prescription_setting: {},
                product_id: LensAdvisor.product_id,
                order_note: LensAdvisor.$('.order-notes').val(),
                lens: lens_variant,
                unique_identifier: this.responses.unique_identifier,
                store_settings: this.settings,
                additional_informations: {},
                addons: this.responses.addOns
            }
            if (this.responses.method === 'uploaded') {
                if (this.settings.pd_on_upload) {
                    data.prescription_setting.pd = this.responses.manually.pd
                }
                if (this.settings.segment_height_on_upload !== "hidden" && this.responses.manually.segment_height) {
                    data.prescription_setting.segment_height = this.responses.manually.segment_height
                }
            }
            if (this.responses.method === 'entered_manually') {
                data.prescription_setting = this.responses.manually
            }

            // Picking up all fields which has name format as la-properties selector and sending them as additional information
            const customPropertiesFields = LensAdvisor.$('input[name^="la-properties"], select[name^="la-properties"], input[name^="_la-properties"], select[name^="_la-properties"]');

            [].forEach.call(customPropertiesFields, function (customField) {
                if ((customField.value && !customField.dataset.prescription_type) || (customField.dataset.prescription_type === LensAdvisor.advisor.responses.prescription_type && customField.value)) {
                    fieldName = customField.name.replace('la-properties[', '').replace(']', '')
                    if ((customField.type == 'radio' && customField.checked) || customField.type != 'radio' ) {
                        data.additional_informations[fieldName] = customField.value
                    }
                }
            })

            return data
        }

        LensAdvisor.request = function (method, url, data) {
            var xhttp = new XMLHttpRequest();
            xhttp.open(method, url, false);
            xhttp.send(data);
            return JSON.parse(xhttp.response)
        }

        LensAdvisor.addContactLensToCart = function (event) {
            let form_data = LensAdvisor.$('.js-contact-lens-form').serializeArray()
            let od_right_quantity = 1
            let os_left_quantity = 1
            var od_right = Object.assign({}, LensAdvisor.advisor.responses.manually.od_right)
            var os_left = Object.assign({}, LensAdvisor.advisor.responses.manually.os_left)
            for (let i=0; i< form_data.length; i++) {
                let row = form_data[i]
                if (row.name.includes('Right')) {
                    if (row.name.includes('quantity')) {
                        od_right_quantity = parseInt(row.value)
                    }
                    od_right[row.name.replace('Right-', '')] = row.value
                } else {
                    if (row.name.includes('quantity')) {
                        os_left_quantity = parseInt(row.value)
                    }
                    LensAdvisor.advisor.responses.manually.os_left[row.name.replace('Left-', '')] = row.value
                }
            }

            LensAdvisor.advisor.responses.prescription_type = 'contact_lenses'
            LensAdvisor.advisor.responses.unique_identifier = `${LensAdvisor.advisor.responses.prescription_type}__${LensAdvisor.product_id}__${new Date().toJSON()}`
            LensAdvisor.advisor.responses.method = 'entered_manually'
            LensAdvisor.advisor.responses.manually.contact_lenses = 'left'

            let items = [{
                quantity: os_left_quantity,
                id: LensAdvisor.selectedVariant,
                properties: LensAdvisor.advisor.get_contact_lens_properties('os_left')
            }]

            if (event.preventDefault) {
                event.preventDefault()
                LensAdvisor.$(this).find('button').html(LensAdvisor.getTranslatedText('Processing'))
            }

            LensAdvisor.$.post(`${Shopify.routes.root}cart/add.js`, {items: items}, function (response) {
                LensAdvisor.$.getJSON(`${Shopify.routes.root}cart.json`, function (cart) {
                    let data = LensAdvisor.advisor.get_prescription_request_data(cart.token)
                    LensAdvisor.$.ajax({
                        type: "POST",
                        url: `${LensAdvisor.BASE_URL}/prescriptions/?shop=${Shopify.shop}`,
                        headers: { 'Content-Type': 'application/json' },
                        data: JSON.stringify(data),
                        success: function (response) {
                            LensAdvisor.advisor.responses.manually.os_left = os_left
                            LensAdvisor.advisor.responses.manually.od_right = od_right
                            LensAdvisor.advisor.responses.manually.contact_lenses = 'right'
                            LensAdvisor.advisor.responses.unique_identifier = `${LensAdvisor.advisor.responses.prescription_type}__${LensAdvisor.product_id}__${new Date().toJSON()}`
                            let items = [{
                                quantity: od_right_quantity,
                                id: LensAdvisor.selectedVariant,
                                properties: LensAdvisor.advisor.get_contact_lens_properties('od_right')
                            }]
                            var prescriptions_data = LensAdvisor.advisor.get_prescription_request_data(cart.token)
                            LensAdvisor.$.post(`${Shopify.routes.root}cart/add.js`, {items: items}, function (response) {
                                let data = LensAdvisor.advisor.get_prescription_request_data(cart.token)
                                LensAdvisor.advisor.send_prescription_request(data)
                            })
                        }
                    });
                })
            });
            return false;
        }

        LensAdvisor.prototype.get_contact_lens_properties = function (type, withQuantity) {
            const settings = LensAdvisor.advisor.get_prescription_request_data(undefined).prescription_setting[type]
            const typeKey = type.split("_")[0]
            const properties = {
                "_unique_identifier": LensAdvisor.advisor.responses.unique_identifier,
                "Prescription Type": LensAdvisor.getPrescriptionTitle(LensAdvisor.advisor.responses.prescription_type),
                "Method": LensAdvisor.getPrescriptionMethodDisplayName(LensAdvisor.advisor.responses.method),
                [typeKey.toUpperCase()]: type.replace('os', '').replace('od', '').title(),
            }

            for (let key in settings) {
                if (['d/n', 'sph', 'cyl'].includes(key) && settings[key] ) {
                    properties[key.toUpperCase()] = settings[key]
                } else if (key !== 'quantity' && settings[key]) {
                    properties[key.title()] = settings[key]
                } else if (key === 'quantity' && withQuantity) {
                    properties[key] = settings[key]
                }
            }

            if (LensAdvisor.advisor.responses.prescription_file !== "") {
                properties["_Prescription File"] = LensAdvisor.advisor.responses.authenticateURL
            }

            return properties
        }

        LensAdvisor.prototype.get_properties = function(product_type) {

            if (product_type === "base_product") {
                properties = {
                    "_unique_identifier": this.responses.unique_identifier,
                    "_productType": "frame",
                    "Prescription Type": LensAdvisor.getPrescriptionTitle(this.responses.prescription_type),
                    "Method": LensAdvisor.getPrescriptionMethodDisplayName(this.responses.method)
                }
                // combine in any additional properties that have been added by custom code 
                LensAdvisor.$.extend(properties, LensAdvisor.custom_base_product_properties)
                return properties
            }

            if (product_type === "addOns") {
                properties = {
                    "_productType": "addon",
                    "_unique_identifier": this.responses.unique_identifier,
                    "Paired With": "{{product.title}}"
                }
                // combine in any additional properties that have been added by custom code 
                LensAdvisor.$.extend(properties, LensAdvisor.custom_add_ons_properties)
                return properties
            }

            properties = {
                "_unique_identifier": this.responses.unique_identifier,
                "_productType": product_type,
                "_base_variant_id": LensAdvisor.selectedVariant,
                "Prescription Type": LensAdvisor.getPrescriptionTitle(this.responses.prescription_type),
                "Prescription Method": LensAdvisor.getPrescriptionMethodDisplayName(this.responses.method) || "",
                "Frame": "{{product.title}}",
            }

            function getFieldKeys(obj) {
                return Object.keys(obj)
                .filter((k) => obj != null)
            }

            const prescription_type = LensAdvisor.getPredictedPrescriptionType(true)

            if (this.responses.method === "entered_manually") {
                let manually = this.responses.manually
                let responseKeys = Object.keys(LensAdvisor.advisor.responses.manually)
                responseKeys.forEach(function(key, index) {
                    if (typeof manually[key] === "string" && manually[key] != "") {
                        if ("segment_height" == key) {
                            properties["Segment Height"] = manually[key]
                        } else if (key == "sph" && prescription_type === "reading") {
                            properties["Diopters"] = manually[key]
                        } else {
                            properties[key] = manually[key]
                        }
                    } else if (typeof manually[key] !== "string" && manually[key]) {
                        let values = []
                        getFieldKeys(manually[key]).forEach(function(fieldName, secondaryIndex) {
                            if (typeof manually[key][fieldName] === "string" && manually[key][fieldName] != "") {
                                if (fieldName === "axis") {
                                    let axisVal = manually[key][fieldName] == 'na' ? 0 : manually[key][fieldName];
                                    values.push("x" + axisVal)
                                } else if (fieldName === "add") {
                                    values.push("ADD " + manually[key][fieldName])
                                } else if (key === "pd" && ["left", "right"].includes(fieldName) && manually[key][fieldName] && (manually[key].right || manually[key].left)) {
                                    values.push(`${fieldName === "left" ? "OS - " : "OD - "}${manually[key][fieldName]}`)
                                } else {
                                    if (key === "pd" && manually[key].value && manually[key][fieldName]) {
                                        values.push(manually[key][fieldName])    
                                    } else if (key !== "pd") {
                                        values.push(manually[key][fieldName])
                                    }
                                }
                            } else if (typeof manually[key][fieldName] !== "string" && manually[key][fieldName]) {
                                let nested_values = {key: (fieldName == "od_right" ? "Prism OD" : "Prism OS"), values: []}
                                getFieldKeys(manually[key][fieldName]).forEach(function(SecondaryfieldName, nestedIndex) {
                                    if (manually[key][fieldName][SecondaryfieldName]) {
                                        nested_values.values.push(manually[key][fieldName][SecondaryfieldName])
                                    }
                                })
                                values.push(nested_values)
                            }
                        })
                        if (values.length > 0 && typeof values[0] === "string" && prescription_type !== "reading") {
                            {%- comment -%} Property KEYS are data read back by the cart
                            drawer, cart page, and order emails — they must be locale-
                            invariant. Localized labels belong in the display layers only
                            (each translates via its own strings), never here: rendering
                            the translated metaobject value into the key made JA orders
                            record prescriptions under 右眼（OD）/左眼（OS）, which every
                            EN-keyed reader then showed as blank. {%- endcomment -%}
                            if (key === "od_right") {
                                key = "OD (Right Eye)"
                            } else if (key === "os_left") {
                                key = "OS (Left Eye)"
                            } else {
                                key = key.toUpperCase()
                            }
                            properties[key] = values.join(" | ")
                        } else if (values.length > 0 && typeof values[0] === "string" && prescription_type === "reading" && !["od_right", "os_left"].includes(key)) {
                            properties[key.toUpperCase()] = values.join(" | ")
                        } else if (values.length > 0 && typeof values[0] !== "string") {
                            values.forEach(function (obj, index) {
                                if (obj.values.length > 0) {
                                    properties[obj.key] = obj.values.join(" | ")
                                }
                            })
                        }
                    }
                })
            } else if (this.responses.method === "uploaded" || this.responses.customMethod === "email_later") {
                let values = []
                if (LensAdvisor.advisor.settings.segment_height_on_upload !== "hidden" && LensAdvisor.advisor.responses.manually.segment_height) {
                    properties["Segment Height"] = LensAdvisor.advisor.responses.manually.segment_height
                }
                if (this.responses.manually.pd.type === 'Single PD' && this.responses.manually.pd.value || this.responses.manually.pd.type === 'Dual PD' && this.responses.manually.pd.right && this.responses.manually.pd.left) {
                    getFieldKeys(LensAdvisor.advisor.responses.manually.pd).forEach(function(fieldName, index) {
                        if (LensAdvisor.advisor.responses.manually.pd[fieldName]) {
                            values.push(LensAdvisor.advisor.responses.manually.pd[fieldName])
                        }
                    })
                }
                if (values.length > 0 && typeof values[0] === "string") {
                    properties["PD"] = values.join(" | ")
                }
            }

            if (LensAdvisor.advisor.responses.prescription_file !== "") {
                properties["_Prescription File"] = LensAdvisor.advisor.responses.authenticateURL
            }

            // combine in any additional properties that have been added by custom code 
            LensAdvisor.$.extend(properties, LensAdvisor.custom_lens_product_properties)
            // Picking up all fields which has name format as la-properties selector
            const customPropertiesFields = LensAdvisor.$('input[name^="la-properties"], select[name^="la-properties"], input[name^="_la-properties"], select[name^="_la-properties"]');

            [].forEach.call(customPropertiesFields, function (customField) {
                if ((customField.value && !customField.dataset.prescription_type) || (customField.dataset.prescription_type === LensAdvisor.advisor.responses.prescription_type && customField.value)) {
                    fieldName = customField.name.replace('la-properties[', '').replace(']', '')
                    if ((customField.type == 'radio' && customField.checked) || customField.type != 'radio' ) {
                        properties[fieldName] = customField.value
                    }
                }
            })
            return properties
        }

        LensAdvisor.getPredictedPrescriptionType = function (overide) {
            return LensAdvisor.advisor.responses.prescription_type
        }

        LensAdvisor.prototype.resolveLens = function (that) {
            var self = this
            if (self.adding_to_cart) {
                return false
            } else {
                self.adding_to_cart = true
            }
            LensAdvisor.$(that).css({"opacity": "0.8"})
            LensAdvisor.$('#la-review-error').empty()
            LensAdvisor.$('#la-review-error').slideUp()
            LensAdvisor.$('#la_review_addToCart_label').html(LensAdvisor.getTranslatedText('Processing'))
            const prescriptions_data = this.get_prescription_request_data().prescription_setting
            const url = `${LensAdvisor.BASE_URL}/prescriptions/lens/?settings=${JSON.stringify(prescriptions_data)}&lens_id=${this.responses.lens.id}`

            const isAddOnsAvailable = LensAdvisor.advisor.responses.lens.add_ons;

            LensAdvisor.$.getJSON(url, function (lenses) {

                if (!lenses.od || !lenses.os) {
                    LensAdvisor.$('#la-review-error').html(LensAdvisor.getTranslatedText('RESOLVE_LENS_ERROR_MESSAGE'))
                    LensAdvisor.$('#la-review-error').slideDown()
                    LensAdvisor.advisor.adding_to_cart = false
                    LensAdvisor.$('#la_review_addToCart_label').html(LensAdvisor.getTranslatedText('Add to Cart'))
                    LensAdvisor.$(that).css({"opacity": "1"})
                    return false;
                }

                let lens = self.responses.lens_variant
                const timestamp = new Date().getTime()
                self.responses.unique_identifier = `${self.responses.prescription_type}__${LensAdvisor.product_id}__${timestamp}`

                let lens_properties;

                if (lenses.od.variant_id === lenses.os.variant_id) {
                    lens_properties = self.get_properties("resolved_lens")
                } else {
                    lens_properties = self.get_properties("lens")
                }
                 
                var frame_properties = self.get_properties('base_product')

                od_properties = Object.assign({}, lens_properties)
                os_properties = Object.assign({}, lens_properties)

                delete od_properties.OS
                delete os_properties.OD

                frame_properties['Lens'] = (lens.name == "Default Title" ? self.responses.lens.name : lens.name) + ": " + (parseFloat(lens.price) == 0 ?  LensAdvisor.getTranslatedText('FREE') : LensAdvisor.formatCurrency(parseFloat(lens.price)))
                frame_properties["_lens_variant_ids"] = [lenses.od.variant_id, lenses.os.variant_id]

                items = []

                let quantity = LensAdvisor.$('.la-quantity-selector').val() || 1
                if (quantity === '' || quantity === '0') {
                    LensAdvisor.$('#la-review-error').html(LensAdvisor.getTranslatedText('Quantity Error'))
                    LensAdvisor.$('#la-review-error').slideDown()
                    return false
                }

                const isAddOnsAvailable = LensAdvisor.advisor.responses.lens.add_ons

                if (isAddOnsAvailable) {
                    Object.keys(LensAdvisor.advisor.responses.addOns).forEach(step => {
                        const stepInfo = LensAdvisor.advisor.responses.addOns[step]
                        if (stepInfo.variantId && stepInfo.product) {
                            let properties = self.get_properties("addOns")
                            properties._canSkip = stepInfo.canSkip
                            items.push({
                                quantity: quantity,
                                id: stepInfo.variantId,
                                properties: properties
                            })
                        }
                    })
                }
                
                items.push({quantity: quantity, id: lenses.od.variant_id, properties: od_properties})
                items.push({quantity: quantity, id: lenses.os.variant_id, properties: os_properties})
                items.push({quantity: quantity, id: LensAdvisor.selectedVariant, properties: frame_properties})
                
                LensAdvisor.$('.js-back-button').hide()
                items = self.bundleProducts(timestamp, items, isAddOnsAvailable)

                return self.addToCart({items: items}, function (response) {

                    LensAdvisor.$.getJSON(`${Shopify.routes.root}cart.json`, function (cart) {

                        let data = LensAdvisor.advisor.get_prescription_request_data(cart.token)

                        os_lens_data = Object.assign({}, data.lens)
                        os_lens_data.product_id = lenses.os.shopify_id
                        os_lens_data.variant_id = lenses.os.variant_id
                        os_lens_data.sku = lenses.os.sku
                        os_lens_data.name = lenses.os.title

                        od_lens_data = Object.assign({}, data.lens)
                        od_lens_data.product_id = lenses.od.shopify_id
                        od_lens_data.variant_id = lenses.od.variant_id
                        od_lens_data.name = lenses.od.title
                        od_lens_data.sku = lenses.od.sku

                        data.lens = [os_lens_data, od_lens_data]

                        LensAdvisor.advisor.send_prescription_request(data)

                        self.adding_to_cart = false;
                    })
                }, function (response) {
                    LensAdvisor.$('#la-review-error').html(LensAdvisor.getTranslatedText('RESOLVE_LENS_ERROR_MESSAGE'))
                    LensAdvisor.$('#la-review-error').slideDown()
                    LensAdvisor.advisor.adding_to_cart = false
                    LensAdvisor.$('#la_review_addToCart_label').html(LensAdvisor.getTranslatedText('Add to Cart'))
                })
            })
        }

        LensAdvisor.prototype.addToCart = function (data, successCallback, failureCallback) {
            LensAdvisor.$.ajax({
                type: "POST",
                url: `${Shopify.routes.root}cart/add.js`,
                headers: { 'Content-Type': 'application/json' },
                data: JSON.stringify(data),
                success: function (response) {
                    document.dispatchEvent(new CustomEvent('LensAdvisor:addToCart:success', { detail: data }));
                    if (successCallback){
                        successCallback(response)
                    }
                },
                error: function (response){
                    document.dispatchEvent(new CustomEvent('LensAdvisor:addToCart:error', {
                        detail: {
                            payload: data,
                            response: JSON.parse(response.responseText)
                        }
                    }));
                    if (failureCallback) {
                        failureCallback(response)
                    }
                }
            });
            return true;
        }

        LensAdvisor.prototype.perform_operation = function (that) {
            var self = this

            if (self.adding_to_cart) {
                return false
            }

            const timestamp = new Date().getTime()

            if (LensAdvisor.advisor.prescription_types.filter(obj => obj.prescription_type === 'contact_lenses').length > 0) {
                self.adding_to_cart = true
                LensAdvisor.$(that).css({"opacity": "0.8"})
                LensAdvisor.$('#la_review_addToCart_label').html(LensAdvisor.getTranslatedText('Processing'))
                return LensAdvisor.addContactLensToCart(this)
            }

            let lens = LensAdvisor.advisor.responses.lens_variant
            self.responses.unique_identifier = `${self.responses.prescription_type}__${LensAdvisor.product_id}__${timestamp}`

            items = []

            let quantity = LensAdvisor.$('.la-quantity-selector').val() || 1
            if (quantity === '' || quantity === '0') {
                LensAdvisor.$('#la-review-error').html(LensAdvisor.getTranslatedText('Quantity Error'))
                LensAdvisor.$('#la-review-error').slideDown()
                return false
            }

            const isAddOnsAvailable = LensAdvisor.advisor.responses.lens.add_ons

            if (isAddOnsAvailable) {
                Object.keys(LensAdvisor.advisor.responses.addOns).forEach(step => {
                    const stepInfo = LensAdvisor.advisor.responses.addOns[step]
                    if (stepInfo.variantId && stepInfo.product) {
                        let properties = self.get_properties("addOns")
                        properties._canSkip = stepInfo.canSkip
                        items.push({
                            quantity: quantity,
                            id: stepInfo.variantId,
                            properties: properties
                        })
                    }
                })
            }

            let product_data = {
                quantity: quantity,
                id: LensAdvisor.selectedVariant,
                properties: self.get_properties("base_product")
            }

            if (lens) {
                items.push({
                    quantity: quantity,
                    id: lens.variant_id,
                    properties: self.get_properties("lens")
                })
                let lens_price = parseFloat(lens.price) == 0 ? LensAdvisor.getTranslatedText('FREE') : LensAdvisor.formatCurrency(parseFloat(lens.price))
                product_data.properties["Lens"] = `${LensAdvisor.advisor.responses.lens.name} ${lens.name != 'Default Title' ? `- ${lens.name}` : ''} : ${lens_price}`
                product_data.properties["_lens_variant_id"] = lens.variant_id
            }

            items.push(product_data)

            items = self.bundleProducts(timestamp, items, isAddOnsAvailable)

            self.adding_to_cart = true

            LensAdvisor.$('#la_review_addToCart_label').html(LensAdvisor.getTranslatedText('Processing'))
            LensAdvisor.$('.js-back-button').hide()
            LensAdvisor.$(that).css({"opacity": "0.8"})

            return self.addToCart({items: items}, function (response) {

                LensAdvisor.$.getJSON(`${Shopify.routes.root}cart.json`, function (cart) {
                    let data = LensAdvisor.advisor.get_prescription_request_data(cart.token)
                    LensAdvisor.advisor.send_prescription_request(data)
                    self.adding_to_cart = false;
                })
            }, function (response) {
                LensAdvisor.advisor.adding_to_cart = false
                LensAdvisor.$(that).css({"opacity": "1"})
                const responseJson = JSON.parse(response.responseText)

                if (LensAdvisor.advisor.responses.prescription_type === "frame_only") {
                    LensAdvisor.$('#la-prescription-type-error').html(LensAdvisor.getTranslatedText(responseJson.description))
                    LensAdvisor.$('#cover-spin').hide()
                    LensAdvisor.$('#la-prescription-type-error').slideDown()
                    LensAdvisor.advisor.setDefaultResponse()
                    setTimeout(function() {
                        LensAdvisor.$('#la-prescription-type-error').slideUp()
                    }, 5000)
                } else {
                    LensAdvisor.$('#la-review-error').html(LensAdvisor.getTranslatedText(responseJson.description))
                    LensAdvisor.$('#la-review-error').slideDown()
                    LensAdvisor.$('#la_review_addToCart_label').html(LensAdvisor.getTranslatedText('Add to Cart'))
                    LensAdvisor.$('.js-back-button').fadeIn()
                    LensAdvisor.$('.js-back-button').show()
                }
            })
        }

        LensAdvisor.prototype.bundleProducts = function (bundleId, items, isAddOnsAvailable) {
            return items.map(item => {
                if (item.properties._canSkip) {
                    return item
                }
                item.properties._bundleId = bundleId
                if (item.properties._productType === 'frame' && LensAdvisor.advisor.responses.lens.add_ons_products) {
                    item.properties._addOns = LensAdvisor.advisor.responses.lens.add_ons_products.filter(step => step.can_skip === false).length || 0
                }
                return item
            })
        }

        LensAdvisor.prototype.send_prescription_request = function (data) {
            $that = this
            LensAdvisor.$.ajax({
                type: "POST",
                url: LensAdvisor.BASE_URL + '/prescriptions/?shop=' + Shopify.shop,
                headers: { 'Content-Type': 'application/json' },
                data: JSON.stringify(data),
                success: function (response) {
                    let redirect_to_cart = true
                    if ($that.settings.post_add_to_cart) {
                        if (typeof LensAdvisor.postAddToCart !== 'undefined') {
                            LensAdvisor.postAddToCart()
                            redirect_to_cart = false
                        }
                        $that.adding_to_cart = false;
                        LensAdvisor.$('#la_review_addToCart_label').html(LensAdvisor.getTranslatedText('Add to Cart'))
                        LensAdvisor.$('#la_review_addToCart_label').parent().css({"opacity": "1"})
                        setTimeout(function () {
                            LensAdvisor.$('.js-modal-close').click()
                        }, 200)
                    }
                    if (redirect_to_cart) {
                        //window.location.href = `${Shopify.routes.root}cart` //OG way
                        window.location.href = window.location.href + '#cart-drawer';
                        window.location.reload();
                    } else {
                        LensAdvisor.$('#cover-spin').hide()
                        LensAdvisor.advisor.setDefaultResponse()
                    }
                },
                error: function () {
                    if (LensAdvisor.retry) {
                        window.location.reload()
                    }
                    LensAdvisor.retry = true
                    LensAdvisor.advisor.send_prescription_request(data)
                }
            });
        }

        LensAdvisor.uploadPrescriptionFile = function (file, successCallback, failureCallback) {
            try {
                LensAdvisor.$('.error-file').slideUp()
                LensAdvisor.$('#cover-spin').show(0)
                let formData = new FormData()
                formData.append("filename", file.name)
                formData.append("domain", Shopify.shop)
                formData.append("content_type", file.type)

                LensAdvisor.$.ajax({
                    type: 'POST',
                    url: `${LensAdvisor.BASE_URL}/prescriptions/upload/`,
                    data: formData,
                    processData: false,
                    mimeType: "multipart/form-data",
                    contentType: false,
                    success: function (response) {
                        response = JSON.parse(response)
                        return LensAdvisor.uploadToS3(file, response, successCallback, failureCallback)
                    },
                    error: failureCallback
                })
            } catch (error) {
                LensAdvisor.error_loading = true
            }
        }

        LensAdvisor.uploadToS3 = function(file, signedResponse, successCallback, failureCallback) {
            fetch(signedResponse.uploadUrl, {
                method: 'PUT',
                mode: 'cors',
                body: file
            })
            .then((response) => {
                if (![200, 201].includes(response.status)) {
                    return failureCallback(response)
                }
                return successCallback(signedResponse)
            })
            .catch(failureCallback)
        }

        LensAdvisor.formatCurrency = function (amount) {
            return LensAdvisor.Currency.formatMoney(amount * 100, LensAdvisor.Currency.moneyFormats[Shopify.currency.active].money_format)
        }

        LensAdvisor.getPrescriptionMethodDisplayName = function (method) {
            return LensAdvisor.getTranslatedText(LensAdvisor.PRESCRIPTION_METHODS[method])
        } || ""

        LensAdvisor.handleEmailLater = function () {
            var self = LensAdvisor.advisor

            self.responses.method = "email_later"
            LensAdvisor.$('.prescription-body a[href="#choose_lens"]').tab('show');
            LensAdvisor.$(".prescription-tabs .active").addClass('directlyReview');
            LensAdvisor.get_lens_types()
            if (document.querySelectorAll('.radio-prescription-upload-type').length === 1 && self.settings.skipPrescriptionMethod && self.prescription_types && self.prescription_types.length === 1 && self.settings.skipSelectPrescriptions) {
                LensAdvisor.$('.js-back-button').hide()
            }
        }

        LensAdvisor.addEvents = function () {
            try {
                LensAdvisor.$('.js-back-button').hide();
                LensAdvisor.$('.js-select-pd-left-value, .js-select-pd-right-value, .js-select-pd-on-upload-left-value, .js-select-pd-on-upload-right-value').on('change', LensAdvisor.savePDS)
                LensAdvisor.$('.js-od-sph').on('change', function () {
                    LensAdvisor.advisor.responses.manually.sph = this.value
                })
                // Select Prescription
                LensAdvisor.$('.radio-prescription-select').on("click", LensAdvisor.handlePrescriptionTypeChange)

                LensAdvisor.$('.radio-type-upload').click( function() {
                    var self = LensAdvisor.advisor

                    self.responses.method = "uploaded"
                    LensAdvisor.$('.prescription-body a[href="#add_prescription_method"]').tab('show');
                    LensAdvisor.$('.upload-option').css({"display": "block"});
                    LensAdvisor.$('.manual-option').css({"display": "none"});
                    if (document.querySelectorAll('.radio-prescription-upload-type').length === 1 && self.settings.skipPrescriptionMethod && self.prescription_types && self.prescription_types.length === 1 && self.settings.skipSelectPrescriptions) {
                        LensAdvisor.$('.js-back-button').hide()
                    }
                })

                LensAdvisor.$('.radio-type-manual').click(LensAdvisor.handleManualOptionClick)
                LensAdvisor.$('.radio-type-later').click(LensAdvisor.handleEmailLater)

                LensAdvisor.$('.js-save-continue-upload').on('click', LensAdvisor.handleUploadButton);

                // Choose lens save and continue cta
                LensAdvisor.$(".js-choose-lens-button").click(LensAdvisor.postChooseLens)

                // enter prescription manually save and continue cta 
                LensAdvisor.$(".js-save-and-continue-prescription-manually").click(LensAdvisor.saveManualPrescription)

                LensAdvisor.$('#prescription-upload').on('change', function() {
                    LensAdvisor.$('#label-prescription-upload').css({"border-color": "#dfe3e8"})
                    LensAdvisor.$('.error-file').hide()
                    $that = this
                    if (this.files.length != 0){
                        let file = this.files[0]
                        if (file.size / 1024 > 10024 ) {
                            LensAdvisor.$('.error-file').html(LensAdvisor.getTranslatedText('File Size Error')).show()
                            LensAdvisor.$(this).val("")
                            return false
                        }
                        LensAdvisor.uploadPrescriptionFile(file, function (signedResponse) {
                            LensAdvisor.$('.selected-file').html('<i class="fa fa-check" aria-hidden="true"></i>' + file.name)
                            LensAdvisor.$('.selected-file').show()
                            LensAdvisor.$('.selected-file').css({"border": "unset"});
                            LensAdvisor.$('#la_Rx_upload_chooseFile_label').hide()
                            LensAdvisor.$('#la_Rx_upload_changeFile_label').show()
                            LensAdvisor.$('#cover-spin').hide(0)
                            LensAdvisor.advisor.responses.prescription_file = signedResponse.filename
                            LensAdvisor.advisor.responses.authenticateURL = signedResponse.authenticateURL
                        }, function (error) {
                            LensAdvisor.$('#cover-spin').hide(0)
                            LensAdvisor.$($that).val("")
                            LensAdvisor.$('#label-prescription-upload').css({"border-color": "red"})
                            LensAdvisor.$('.error-file').html(LensAdvisor.getTranslatedText('Invalid File')).slideDown()
                        })
                    }
                });

                LensAdvisor.$('#prescription-upload-manually').on('change', function() {
                    LensAdvisor.$('#label-prescription-upload-manually').css({"border-color": "#dfe3e8"})
                    LensAdvisor.$('.error-file-manually').hide()
                    if (this.files.length != 0){
                        let file = this.files[0]
                        if (file.size / 1024 > 10024 ) {
                            LensAdvisor.$('.error-file-manually').html(LensAdvisor.getTranslatedText('File Size Error')).show()
                            LensAdvisor.$(this).val("")
                            return false
                        }
                        LensAdvisor.uploadPrescriptionFile(file, function (signedResponse) {
                            LensAdvisor.$('.js-manually-selected-file').html('<i class="fa fa-check" aria-hidden="true"></i>' + file.name)
                            LensAdvisor.$('.js-manually-selected-file').show()
                            LensAdvisor.$('#la_Rx_manual_upload_chooseFile_label').hide()
                            LensAdvisor.$('#la_Rx_manual_upload_changeFile_label').show()
                            LensAdvisor.$('#cover-spin').hide(0)
                            LensAdvisor.advisor.responses.prescription_file = signedResponse.filename
                            LensAdvisor.advisor.responses.authenticateURL = signedResponse.authenticateURL
                        }, function (error) {
                            LensAdvisor.$('#cover-spin').hide(0)
                            LensAdvisor.$($that).val("")
                            LensAdvisor.$('#label-prescription-upload-manually').css({"border-color": "red"})
                            LensAdvisor.$('.error-file-manually').html(LensAdvisor.getTranslatedText('Invalid File')).slideDown()
                        })
                    }
                });

                LensAdvisor.$('#myPrescription').on('shown.bs.la-modal', function (e) {
                    LensAdvisor.$('body').addClass('la-modal-open')
                })

                LensAdvisor.$('#myPrescription').on('hidden.bs.la-modal', function (e) {
                    if (e.target.id === 'myPrescription') {
                        LensAdvisor.advisor.setDefaultResponse()
                        LensAdvisor.$('body').removeClass('la-modal-open')
                    }
                })

                LensAdvisor.$(".js-od-right").on('change', LensAdvisor.saveODRight)
                LensAdvisor.$(".js-od-left").on('change', LensAdvisor.saveODLeft)
                LensAdvisor.$(".js-prism-od-right").on('change', LensAdvisor.savePrismODRight)
                LensAdvisor.$(".js-prism-od-left").on('change', LensAdvisor.savePrismODLeft)

                LensAdvisor.$('input[name="pd"]').on('change', function () {
                    LensAdvisor.$('.pd-text').css({"color": "unset"})
                    LensAdvisor.advisor.responses.manually.pd.type = this.value
                    LensAdvisor.$(".js-select-pd-left-value, .js-select-pd-left-p").show();
                    LensAdvisor.$(".js-select-pd-right-value, .js-select-pd-right-p").show();
                    LensAdvisor.$(".js-pd-value-dropdown").show();
                    if (LensAdvisor.advisor.responses.manually.pd.type == "Single PD") {
                        LensAdvisor.$(".js-select-pd-left-value, .js-select-pd-left-p").hide();
                        LensAdvisor.$(".js-select-pd-right-value, .js-select-pd-right-p").hide();
                        LensAdvisor.$(".js-select-pd-left-value, .js-select-pd-left-p select").val("");
                        LensAdvisor.$(".js-select-pd-right-value, .js-select-pd-right-p select").val("");
                        LensAdvisor.advisor.responses.manually.pd.right = null
                        LensAdvisor.advisor.responses.manually.pd.left = null
                    } else {
                        LensAdvisor.$(".js-pd-value-dropdown").hide();
                        LensAdvisor.advisor.responses.manually.pd.value = null
                        LensAdvisor.$('.pd-value, .pd-on-upload-value').val("")
                    }
                })

                LensAdvisor.$('input[name="pd_on_upload"]').on('change', function () {
                    LensAdvisor.$('#pd-on-upload-value').css({"color": "unset"})
                    LensAdvisor.advisor.responses.manually.pd.type = this.value
                    LensAdvisor.$(".js-select-pd-on-upload-left-value, .js-select-pd-on-upload-left-p").show();
                    LensAdvisor.$(".js-select-pd-on-upload-right-value, .js-select-pd-on-upload-right-p").show();
                    LensAdvisor.$(".js-pd-on-upload-value-dropdown").show();
                    if (LensAdvisor.advisor.responses.manually.pd.type == "Single PD") {
                        LensAdvisor.$(".js-select-pd-on-upload-left-value, .js-select-pd-on-upload-left-p").hide();
                        LensAdvisor.$(".js-select-pd-on-upload-right-value, .js-select-pd-on-upload-right-p").hide();
                        LensAdvisor.$(".js-select-pd-on-upload-left-value, .js-select-pd-on-upload-left-p select").val("");
                        LensAdvisor.$(".js-select-pd-on-upload-right-value, .js-select-pd-on-upload-right-p select").val("");
                        LensAdvisor.advisor.responses.manually.pd.right = null
                        LensAdvisor.advisor.responses.manually.pd.left = null
                    } else {
                        LensAdvisor.$(".js-pd-on-upload-value-dropdown").hide();
                        LensAdvisor.advisor.responses.manually.pd.value = null
                        LensAdvisor.$('.pd-value, .pd-on-upload-value').val("")
                    }
                })

                LensAdvisor.$('.pd-value, .pd-on-upload-value').on('change', function() { 
                    LensAdvisor.$(this).css({"border-color": "#C1C1C1"})
                    LensAdvisor.advisor.responses.manually.pd.value = this.value
                })

                LensAdvisor.$('.segment_height, .segment_height_on_upload').on('change', function () {
                    LensAdvisor.$(this).css({"border-color": "#C1C1C1"})
                    LensAdvisor.advisor.responses.manually.segment_height = this.value
                })

                LensAdvisor.$('input[name="prism_value"]').on('change', function () {
                    LensAdvisor.$(this).css({"border-color": "#C1C1C1"})
                    LensAdvisor.advisor.responses.manually.prism_value = this.value == 'No' ? false : true
                    LensAdvisor.$(".js-prism-values-od-right-left-wrapper").hide()
                    if (LensAdvisor.advisor.responses.manually.prism_value == true) {
                        LensAdvisor.$(".js-prism-values-od-right-left-wrapper").show()
                    }
                })

                LensAdvisor.$('a[data-toggle="pill"]').on('shown.bs.tab', function (e) {
                    if (LensAdvisor.featuredImage !== LensAdvisor.$('#lensadvisor-fetaured-image').prop("src")) {
                        LensAdvisor.$('#lensadvisor-fetaured-image').prop("src", LensAdvisor.featuredImage)
                    }
                    LensAdvisor.$('.js-back-button').show()
                    LensAdvisor.addCSSToUL()
                });

                LensAdvisor.$('.js-back-button').on("click", LensAdvisor.handleBackButtonPress);
            } catch (error) {
                LensAdvisor.error_loading = true
            }
        }

        LensAdvisor.handleBackButtonPress = function () {
            var self = LensAdvisor.advisor
            const previousTab = LensAdvisor.$(".prescription-tabs .active").attr('href').replace(/#/g, '');
            const prescription_type = self.responses.prescription_type

            LensAdvisor[`handle${prescription_type.replace(/_/g, '').title()}Back`](self, previousTab)
            if (LensAdvisor.$(".prescription-tabs .active").attr('href') == "#select_prescription" && LensAdvisor.$(window).width() <= 767 ) {
                LensAdvisor.$(".product-title-below-modal-image").show();
            }
            return true;
        }

        LensAdvisor.handlePrescriptionTypeChange = function () {
            var self = LensAdvisor.advisor
            self.responses.prescription_type = this.value
            LensAdvisor.resetPrescriptionFields(self)
            if (self.responses.prescription_type != null && LensAdvisor.$(window).width() <= 1024) {
                LensAdvisor.$(".product-title-below-modal-image").hide();
            }
            if (self.responses.prescription_type == 'single_vision') {
                LensAdvisor.handleSingleVisionPrescriptionType(self)
            }  else if (self.responses.prescription_type == 'reading') {
                LensAdvisor.handleReadingPrescriptionType(self)
            } else if (self.responses.prescription_type == 'frame_only') {
                LensAdvisor.$('#reivew-subtotal').html(LensAdvisor.formatCurrency(parseFloat(LensAdvisor.variants[LensAdvisor.selectedVariant].price)))
                LensAdvisor.$('#review-variant-price').html(LensAdvisor.formatCurrency(parseFloat(LensAdvisor.variants[LensAdvisor.selectedVariant].price)))
                // LensAdvisor.$('.prescription-body a[href="#review_selection"]').tab('show');
                LensAdvisor.$(".js-review-lenses").hide()
                LensAdvisor.$(".js-review-precription-type").hide()
                LensAdvisor.$('#cover-spin').show(0)
                self.responses.method = ""
                self.perform_operation(this)
            } else if (self.responses.prescription_type == 'non_prescription'){
                self.responses.method = ''
                LensAdvisor.get_lens_types()
                LensAdvisor.$('#reivew-subtotal').html(LensAdvisor.formatCurrency(parseFloat(LensAdvisor.variants[LensAdvisor.selectedVariant].price)))
                LensAdvisor.$('#review-variant-price').html(LensAdvisor.formatCurrency(parseFloat(LensAdvisor.variants[LensAdvisor.selectedVariant].price)))
                LensAdvisor.$('.prescription-body a[href="#choose_lens"]').tab('show');
                if (self.prescription_types.length === 1 && self.settings.skipSelectPrescriptions) {
                    setTimeout(function () {$('.js-back-button').hide()})
                }
            } else {
                LensAdvisor.$('select.js-od-left').show()
                LensAdvisor.$('select.js-od-right').show()
                LensAdvisor.$('select.js-od-left').parent().find('p').show()
                LensAdvisor.$('select.js-od-right').parent().find('p').show()
                LensAdvisor.$('.prescription-body a[href="#add_prescription"]').tab('show');
            }
            if (!['reading', 'frame_only', 'non_prescription'].includes(self.responses.prescription_type)) {
                if (document.querySelectorAll('.radio-prescription-upload-type').length === 1 && self.settings.skipPrescriptionMethod) {
                    document.querySelector('.radio-prescription-upload-type').click()
                }
            }
            setTimeout (function () {
                LensAdvisor.$('select.js-od-right[name="axis"]').attr('disabled', 'disabled');
                LensAdvisor.$('select.js-od-left[name="axis"]').attr('disabled', 'disabled');
                if (self.prescription_types && self.prescription_types.length === 1 && self.settings.skipSelectPrescriptions) {
                    LensAdvisor.$('.js-back-button').hide()
                }
            })
        }

        LensAdvisor.resetPrescriptionFields = function (self) {
            LensAdvisor.resetSelect()
            LensAdvisor.updateSPH()
            LensAdvisor.$('.js-back-button').show()
            LensAdvisor.$('#segment_height').show()
            LensAdvisor.$('#segment_height_on_upload').show()
            LensAdvisor.$('#prism_value').show()
            LensAdvisor.$(".js-review-lenses").show()
            LensAdvisor.$(".js-review-precription-type").show()
            LensAdvisor.$('.js-sph-only').hide()
            LensAdvisor.$('.js-od-container').show()
            // LensAdvisor.$('#prescription_upload_manually_wrapper').show()
            LensAdvisor.$('#la_Rx_reading_title').hide()
            LensAdvisor.$('#la_Rx_manual_title').show()
            //uploadRequiredOnManualEntry
            if (self.settings.pd_required == "hidden") {
                LensAdvisor.$('.lensadvizor-manual-pd').hide()
            } else {
                LensAdvisor.$('.lensadvizor-manual-pd').show()
            }
        }

        LensAdvisor.handleSingleVisionPrescriptionType = function (self) {
            LensAdvisor.$('select.js-od-left').show()
            LensAdvisor.$('select.js-od-right').show()
            LensAdvisor.$('select.js-od-left').parent().find('p').show()
            LensAdvisor.$('select.js-od-right').parent().find('p').show()
            LensAdvisor.$('select.js-od-left[name="add"]').hide()
            LensAdvisor.$('select.js-od-right[name="add"]').hide()
            LensAdvisor.$('select.js-od-left[name="add"]').parent().find('p').hide()
            LensAdvisor.$('select.js-od-right[name="add"]').parent().find('p').hide()
            LensAdvisor.$('select.js-od-left[field_name="intermediate_add"]').hide()
            LensAdvisor.$('select.js-od-right[field_name="intermediate_add"]').hide()
            LensAdvisor.$('select.js-od-left[field_name="intermediate_add"]').parent().find('p').hide()
            LensAdvisor.$('select.js-od-right[field_name="intermediate_add"]').parent().find('p').hide()
            LensAdvisor.$('#segment_height').hide()
            LensAdvisor.$('#segment_height_on_upload').hide()
            LensAdvisor.$('.prescription-body a[href="#add_prescription"]').tab('show');
        }

        LensAdvisor.handleReadingPrescriptionType = function (self) {
            LensAdvisor.$('select.js-od-right').parent().find('p').hide()
            LensAdvisor.$('select.js-od-left').parent().find('p').hide()
            LensAdvisor.$('select.js-od-right').hide()
            LensAdvisor.$('select.js-od-left').hide()
            LensAdvisor.$('select.js-od-left[name="sph"]').show()
            LensAdvisor.$('select.js-od-right[name="sph"]').show()
            LensAdvisor.$('select.js-od-left[name="sph"]').parent().find('p').show()
            LensAdvisor.$('select.js-od-right[name="sph"]').parent().find('p').show()
            LensAdvisor.$('select.js-od-left[field_name="intermediate_add"]').show()
            LensAdvisor.$('select.js-od-right[field_name="intermediate_add"]').show()
            LensAdvisor.$('select.js-od-left[field_name="intermediate_add"]').parent().find('p').show()
            LensAdvisor.$('select.js-od-right[field_name="intermediate_add"]').parent().find('p').show()
            LensAdvisor.$('#segment_height').hide()
            LensAdvisor.$('#segment_height_on_upload').hide()
            LensAdvisor.$('#prism_value').hide()
            LensAdvisor.$('.radio-type-manual').click()
            LensAdvisor.$('.js-sph-only').show()
            LensAdvisor.$('.lensadvizor-manual-pd').show()
            if (self.settings.pd_on_readers == 'hidden') {
                LensAdvisor.$('.lensadvizor-manual-pd').hide()
            }
            LensAdvisor.$('.js-od-container').hide()
            // LensAdvisor.$('#prescription_upload_manually_wrapper').hide()
            LensAdvisor.$('#la_Rx_manual_title').hide()
            LensAdvisor.$('#la_Rx_reading_title').show()
        }

        LensAdvisor.handleManualOptionClick = function () {
            var self = LensAdvisor.advisor

            self.responses.method = "entered_manually"
            LensAdvisor.$('.prescription-body a[href="#add_prescription_method"]').tab('show');
            LensAdvisor.$('.upload-option').css({"display": "none"});
            LensAdvisor.$('.manual-option').css({"display": "block"});
            LensAdvisor.$('select[name="cyl"]').val("0.00")
            if (document.querySelectorAll('.radio-prescription-upload-type').length === 1 && self.settings.skipPrescriptionMethod && self.prescription_types && self.prescription_types.length === 1 && self.settings.skipSelectPrescriptions) {
                LensAdvisor.$('.js-back-button').hide()
            }
        }

        LensAdvisor.handleUploadButton = function () {
            const settings = LensAdvisor.advisor.settings
            let error = false;
            if (LensAdvisor.advisor.responses.manually.pd.type == 'Single PD' && LensAdvisor.$('.pd-on-upload-value').val() == '' &&  LensAdvisor.advisor.responses.prescription_type != 'reading' && LensAdvisor.advisor.settings.pd_on_upload == true) {
                error = true
                LensAdvisor.$('.pd-on-upload-value').css({"border-color": "red"})
            }
            if (LensAdvisor.advisor.responses.manually.pd.type == 'Dual PD' &&  LensAdvisor.advisor.responses.prescription_type != 'reading' && settings.pd_on_upload == true && (LensAdvisor.$('.js-select-pd-on-upload-right-value').val() == '' || LensAdvisor.$('.js-select-pd-on-upload-left-value').val() == '') ) {
                error = true
                if (LensAdvisor.$('.js-select-pd-on-upload-right-value').val() == '') {
                    LensAdvisor.$('.js-select-pd-on-upload-right-value').css({"border-color": "red"})
                }
                if (LensAdvisor.$('.js-select-pd-on-upload-left-value').val() == '') {
                    LensAdvisor.$('.js-select-pd-on-upload-left-value').css({"border-color": "red"})
                }
            }

            if (LensAdvisor.advisor.responses.prescription_type === 'progressive' && settings.segment_height_on_upload == true && LensAdvisor.$('.segment_height_on_upload').val() == '') {
                error = true
                LensAdvisor.$('.segment_height_on_upload').css({"border-color": "red"})
            }

            LensAdvisor.$('.selected-file').css({"display": "block"});
            if(LensAdvisor.$("#prescription-upload").get(0).files.length === 0){
                LensAdvisor.$('.error-file').html(LensAdvisor.getTranslatedText('File Required')).show()
                error = true
            }
            if (!error) {
                LensAdvisor.$('.prescription-body a[href="#choose_lens"]').tab('show');
                LensAdvisor.get_lens_types()
            }
            LensAdvisor.addCSSToUL()
        }

        LensAdvisor.navigateToHome = function (self) {
            LensAdvisor.$('.prescription-body a[href="#select_prescription"]').tab('show');
            LensAdvisor.$(".product-title-below-modal-image").show();
            setTimeout(self.setDefaultResponse, 20)
        }

        LensAdvisor.handleSinglevisionBack = function (self, previousTab) {
            // This handles back button press for Single Vision Frames

            const prescriptionMethods = document.querySelectorAll('.radio-prescription-upload-type').length
            const method = self.responses.method
            const settings = self.settings

            if (previousTab === 'add_prescription') {
                LensAdvisor.navigateToHome(self)
            } else if (previousTab === 'add_prescription_method' && settings.skipPrescriptionMethod && prescriptionMethods === 1) {
                LensAdvisor.navigateToHome(self)
            } else if (previousTab === 'add_prescription_method') {
                LensAdvisor.$('.prescription-body a[href="#add_prescription"]').tab('show');
                setTimeout(self.setDefaultManualResponse, 20)
            } else if (previousTab === 'choose_lens' && method === 'email_later') {
                if (settings.skipPrescriptionMethod && prescriptionMethods === 1) {
                    LensAdvisor.navigateToHome(self)
                } else {
                    LensAdvisor.$('.prescription-body a[href="#add_prescription"]').tab('show');
                }
            } else if (previousTab === 'choose_lens') {
                LensAdvisor.$('.prescription-body a[href="#add_prescription_method"]').tab('show');
                if (settings.skipPrescriptionMethod && prescriptionMethods === 1 && settings.skipSelectPrescriptions && self.prescription_types.length === 1) {
                    setTimeout(function () {$('.js-back-button').hide()})
                }
            } else if (previousTab === 'choose_options' && settings.skipPrescriptionLenses && self.lens_types.length === 1) {
                LensAdvisor.$('.prescription-body a[href="#add_prescription_method"]').tab('show');
                if (settings.skipPrescriptionMethod && prescriptionMethods === 1 && settings.skipSelectPrescriptions && self.prescription_types.length === 1) {
                    setTimeout(function () {$('.js-back-button').hide()})
                }
            } else if (previousTab === 'choose_options') {
                LensAdvisor.$('.prescription-body a[href="#choose_lens"]').tab('show');
            } else if (previousTab === 'review_selection' && settings.skipPrescriptionLenses && self.lens_types.length === 1 && self.responses.lens.variants.length === 1 && method === 'email_later' ) {
                if (settings.skipPrescriptionMethod && prescriptionMethods === 1) {
                    LensAdvisor.navigateToHome(self)
                } else {
                    LensAdvisor.$('.prescription-body a[href="#add_prescription"]').tab('show');
                }
            } else if (previousTab === 'review_selection' && settings.skipPrescriptionLenses && self.lens_types.length === 1 && self.responses.lens.variants.length === 1) {
                LensAdvisor.$('.prescription-body a[href="#add_prescription_method"]').tab('show');
                if (settings.skipPrescriptionMethod && prescriptionMethods === 1 && settings.skipSelectPrescriptions && self.prescription_types.length === 1) {
                    setTimeout(function () {$('.js-back-button').hide()})
                }
            } else if (previousTab === 'choose_addons') {
                if (self.responses.lens.add_ons && self.responses.addOnsStep > 0) {
                    self.responses.addOnsStep -= 1
                    if (!self.responses.addOns[self.responses.addOnsStep].outOfStockSkip) {
                        LensAdvisor.renderAddOns()
                    } else {
                        LensAdvisor.handleSinglevisionBack(self, previousTab)
                    }
                } else if (self.responses.lens.variants.length === 1) {
                    LensAdvisor.$('.prescription-body a[href="#choose_lens"]').tab('show');
                } else if (self.responses.lens.variants.length > 1) {
                    LensAdvisor.$('.prescription-body a[href="#choose_options"]').tab('show');
                }
            } else if (previousTab === 'review_selection' && self.responses.lens.add_ons && self.responses.addOnsStep >= 0) {
                self.responses.addOnsStep -= 1
                if (!self.responses.addOns[self.responses.addOnsStep].outOfStockSkip) {
                    LensAdvisor.renderAddOns()
                } else {
                    LensAdvisor.handleSinglevisionBack(self, "choose_addons")
                }
            } else if (previousTab === 'review_selection' && self.responses.lens.variants.length === 1) {
                LensAdvisor.$('.prescription-body a[href="#choose_lens"]').tab('show');
            } else if (previousTab === 'review_selection' && self.responses.lens.variants.length > 1) {
                LensAdvisor.$('.prescription-body a[href="#choose_options"]').tab('show');
            }

            if (self.lens_types.length === 1 && self.settings.skipPrescriptionLenses && self.settings.skipPrescriptionMethod && self.settings.skipSelectPrescriptions && self.prescription_types.length === 1 && prescriptionMethods === 1) {
                setTimeout(function () {LensAdvisor.$('.js-back-button').hide()}, 100)
            }
        }

        LensAdvisor.handleProgressiveBack = function (self, previousTab) {
            // This handles back button press for Progressive Frames

            const prescriptionMethods = document.querySelectorAll('.radio-prescription-upload-type').length
            const method = self.responses.method
            const settings = self.settings

            if (previousTab === 'add_prescription') {
                LensAdvisor.navigateToHome(self)
            } else if (previousTab === 'add_prescription_method' && settings.skipPrescriptionMethod && prescriptionMethods === 1) {
                LensAdvisor.navigateToHome(self)
            } else if (previousTab === 'add_prescription_method') {
                LensAdvisor.$('.prescription-body a[href="#add_prescription"]').tab('show');
                setTimeout(self.setDefaultManualResponse, 20)
            } else if (previousTab === 'choose_lens' && method === 'email_later') {
                if (settings.skipPrescriptionMethod && prescriptionMethods === 1) {
                    LensAdvisor.navigateToHome(self)
                } else {
                    LensAdvisor.$('.prescription-body a[href="#add_prescription"]').tab('show');
                }
            } else if (previousTab === 'choose_lens') {
                LensAdvisor.$('.prescription-body a[href="#add_prescription_method"]').tab('show');
                if (settings.skipPrescriptionMethod && prescriptionMethods === 1 && settings.skipSelectPrescriptions && self.prescription_types.length === 1) {
                    setTimeout(function () {$('.js-back-button').hide()})
                }
            } else if (previousTab === 'choose_options' && settings.skipPrescriptionLenses && self.lens_types.length === 1) {
                LensAdvisor.$('.prescription-body a[href="#add_prescription_method"]').tab('show');
                if (settings.skipPrescriptionMethod && prescriptionMethods === 1 && settings.skipSelectPrescriptions && self.prescription_types.length === 1) {
                    setTimeout(function () {$('.js-back-button').hide()})
                }
            } else if (previousTab === 'choose_options') {
                LensAdvisor.$('.prescription-body a[href="#choose_lens"]').tab('show');
            } else if (previousTab === 'review_selection' && settings.skipPrescriptionLenses && self.lens_types.length === 1 && self.responses.lens.variants.length === 1 && method === 'email_later' ) {
                if (settings.skipPrescriptionMethod && prescriptionMethods === 1) {
                    LensAdvisor.navigateToHome(self)
                } else {
                    LensAdvisor.$('.prescription-body a[href="#add_prescription"]').tab('show');
                }
            } else if (previousTab === 'review_selection' && settings.skipPrescriptionLenses && self.lens_types.length === 1 && self.responses.lens.variants.length === 1) {
                LensAdvisor.$('.prescription-body a[href="#add_prescription_method"]').tab('show');
                if (settings.skipPrescriptionMethod && prescriptionMethods === 1 && settings.skipSelectPrescriptions && self.prescription_types.length === 1) {
                    setTimeout(function () {$('.js-back-button').hide()})
                }
            } else if (previousTab === 'choose_addons') {
                if (self.responses.lens.add_ons && self.responses.addOnsStep > 0) {
                    self.responses.addOnsStep -= 1
                    if (!self.responses.addOns[self.responses.addOnsStep].outOfStockSkip) {
                        LensAdvisor.renderAddOns()
                    } else {
                        LensAdvisor.handleSinglevisionBack(self, previousTab)
                    }
                } else if (self.responses.lens.variants.length === 1) {
                    LensAdvisor.$('.prescription-body a[href="#choose_lens"]').tab('show');
                } else if (self.responses.lens.variants.length > 1) {
                    LensAdvisor.$('.prescription-body a[href="#choose_options"]').tab('show');
                }
            } else if (previousTab === 'review_selection' && self.responses.lens.add_ons && self.responses.addOnsStep >= 0) {
                self.responses.addOnsStep -= 1
                if (!self.responses.addOns[self.responses.addOnsStep].outOfStockSkip) {
                    LensAdvisor.renderAddOns()
                } else {
                    LensAdvisor.handleSinglevisionBack(self, "choose_addons")
                }
            } else if (previousTab === 'review_selection' && self.responses.lens.variants.length === 1) {
                LensAdvisor.$('.prescription-body a[href="#choose_lens"]').tab('show');
            } else if (previousTab === 'review_selection' && self.responses.lens.variants.length > 1) {
                LensAdvisor.$('.prescription-body a[href="#choose_options"]').tab('show');
            }

            if (self.lens_types.length === 1 && self.settings.skipPrescriptionLenses && self.settings.skipPrescriptionMethod && self.settings.skipSelectPrescriptions && self.prescription_types.length === 1 && prescriptionMethods === 1) {
                setTimeout(function () {LensAdvisor.$('.js-back-button').hide()}, 100)
            }
        }

        LensAdvisor.handleReadingBack = function (self, previousTab) {
            // This handles back button press for Reading Frames

            const prescriptionMethods = document.querySelectorAll('.radio-prescription-upload-type').length
            const settings = self.settings

            if (previousTab === 'add_prescription_method') {
                LensAdvisor.navigateToHome(self)
            } else if (previousTab === 'choose_lens') {
                LensAdvisor.$('.prescription-body a[href="#add_prescription_method"]').tab('show');
            } else if (previousTab === 'choose_options' && settings.skipPrescriptionLenses && self.lens_types.length === 1) {
                LensAdvisor.$('.prescription-body a[href="#add_prescription_method"]').tab('show');
                if (settings.skipPrescriptionMethod && prescriptionMethods === 1 && settings.skipSelectPrescriptions && self.prescription_types.length === 1) {
                    setTimeout(function () {$('.js-back-button').hide()})
                }
            } else if (previousTab === 'choose_options') {
                LensAdvisor.$('.prescription-body a[href="#choose_lens"]').tab('show');
            } else if (previousTab === 'review_selection' && settings.skipPrescriptionLenses && self.lens_types.length === 1 && self.responses.lens.variants.length === 1) {
                LensAdvisor.$('.prescription-body a[href="#add_prescription_method"]').tab('show');
                if (settings.skipPrescriptionMethod && prescriptionMethods === 1 && settings.skipSelectPrescriptions && self.prescription_types.length === 1) {
                    setTimeout(function () {$('.js-back-button').hide()})
                }
            } else if (previousTab === 'choose_addons') {
                if (self.responses.lens.add_ons && self.responses.addOnsStep > 0) {
                    self.responses.addOnsStep -= 1
                    if (!self.responses.addOns[self.responses.addOnsStep].outOfStockSkip) {
                        LensAdvisor.renderAddOns()
                    } else {
                        LensAdvisor.handleSinglevisionBack(self, previousTab)
                    }
                } else if (self.responses.lens.variants.length === 1) {
                    LensAdvisor.$('.prescription-body a[href="#choose_lens"]').tab('show');
                } else if (self.responses.lens.variants.length > 1) {
                    LensAdvisor.$('.prescription-body a[href="#choose_options"]').tab('show');
                }
            } else if (previousTab === 'review_selection' && self.responses.lens.add_ons && self.responses.addOnsStep >= 0) {
                self.responses.addOnsStep -= 1
                if (!self.responses.addOns[self.responses.addOnsStep].outOfStockSkip) {
                    LensAdvisor.renderAddOns()
                } else {
                    LensAdvisor.handleSinglevisionBack(self, "choose_addons")
                }
            } else if (previousTab === 'review_selection' && self.responses.lens.variants.length === 1) {
                LensAdvisor.$('.prescription-body a[href="#choose_lens"]').tab('show');
            } else if (previousTab === 'review_selection' && self.responses.lens.variants.length > 1) {
                LensAdvisor.$('.prescription-body a[href="#choose_options"]').tab('show');
            }

            if (self.lens_types.length === 1 && self.settings.skipPrescriptionLenses && self.settings.skipPrescriptionMethod && self.settings.skipSelectPrescriptions && self.prescription_types.length === 1 && prescriptionMethods === 1) {
                setTimeout(function () {LensAdvisor.$('.js-back-button').hide()}, 100)
            }
        }

        LensAdvisor.handleNonprescriptionBack = function (self, previousTab) {
            // This handles back button press for Non-Prescription Frames

            const settings = self.settings

            if (previousTab === 'choose_lens') {
                LensAdvisor.navigateToHome(self)
            } else if (previousTab === 'choose_options' && settings.skipPrescriptionLenses && self.lens_types.length === 1) {
                LensAdvisor.navigateToHome(self)
            } else if (previousTab === 'choose_options') {
                LensAdvisor.$('.prescription-body a[href="#choose_lens"]').tab('show');
            } else if (previousTab === 'choose_addons') {
                if (self.responses.lens.add_ons && self.responses.addOnsStep > 0) {
                    self.responses.addOnsStep -= 1
                    if (!self.responses.addOns[self.responses.addOnsStep].outOfStockSkip) {
                        LensAdvisor.renderAddOns()
                    } else {
                        LensAdvisor.handleSinglevisionBack(self, previousTab)
                    }
                } else if (self.responses.lens.variants.length === 1) {
                    LensAdvisor.$('.prescription-body a[href="#choose_lens"]').tab('show');
                } else if (self.responses.lens.variants.length > 1) {
                    LensAdvisor.$('.prescription-body a[href="#choose_options"]').tab('show');
                }
            } else if (previousTab === 'review_selection' && self.responses.lens.add_ons && self.responses.addOnsStep >= 0) {
                self.responses.addOnsStep -= 1
                if (!self.responses.addOns[self.responses.addOnsStep].outOfStockSkip) {
                    LensAdvisor.renderAddOns()
                } else {
                    LensAdvisor.handleSinglevisionBack(self, "choose_addons")
                }
            } else if (previousTab === 'review_selection' && self.responses.lens.variants.length > 1) {
                LensAdvisor.$('.prescription-body a[href="#choose_options"]').tab('show');
            } else if (previousTab === 'review_selection' && settings.skipPrescriptionLenses && self.lens_types.length === 1) {
                LensAdvisor.navigateToHome(self)
            } else if (previousTab === 'review_selection' && self.responses.lens.variants.length === 1) {
                LensAdvisor.$('.prescription-body a[href="#choose_lens"]').tab('show');
            }

            if (self.lens_types.length === 1 && self.settings.skipPrescriptionLenses && self.settings.skipSelectPrescriptions && self.prescription_types.length === 1) {
                setTimeout(function () {LensAdvisor.$('.js-back-button').hide()}, 100)
            }
        }

        LensAdvisor.prototype.initStart = function (event) {console.warn(event)};
        LensAdvisor.prototype.initCompleted = function (event) {console.warn(event)};
        LensAdvisor.prototype.variantDetected = function (event) {console.warn(event)};
        LensAdvisor.prototype.lensLoaded = function (event) {console.warn(event)};
        LensAdvisor.prototype.lensOptionsLoaded = function (event) {console.warn(event)};
        LensAdvisor.prototype.addOnsLoaded = function (event) {console.warn(event)};
        LensAdvisor.prototype.addToCartSuccess = function (event) {console.warn(event)};
        LensAdvisor.prototype.addToCartError = function (event) {console.warn(event)};

        LensAdvisor.updateCart = function () {
            try {
                LensAdvisor.$('#cover-spin').fadeIn('slow')
                LensAdvisor.cart = LensAdvisor.request('GET', `${Shopify.routes.root}cart.js`)
                const bundleIds = Array.from(new Set(LensAdvisor.cart.items.map(item => item.properties._bundleId)))
                let itemsUpdated = false
                bundleIds.forEach(bundleId => {
                    const items = LensAdvisor.cart.items.filter(item => item.properties._bundleId === bundleId)
                    const frame = items.find(item => item.properties._productType === 'frame')
                    const lens = items.find(item => item.properties._productType === 'lens')
                    const addOns = items.filter(item => item.properties._productType === 'addon')

                    if (bundleId !== undefined && (frame === undefined || frame.properties["Prescription Type"] !== 'Frame Only')) {
                        let isRequiredAddOnRemoved = frame === undefined || frame.properties._addOns !== addOns.length;
                        let quantity = lens && frame && !isRequiredAddOnRemoved ? frame.quantity : 0
                        items.forEach(item => {
                            if (quantity === 0 || item.quantity !== frame.quantity) {
                                LensAdvisor.request('GET', `${Shopify.routes.root}cart/change.js?id=${item.key}&quantity=${quantity}`)
                                itemsUpdated = true
                            }
                        })
                    }
                })

                if (itemsUpdated) {
                    window.location.reload()
                } else {
                    LensAdvisor.$('#cover-spin').fadeOut('slow')
                }
            } catch (error) {
                LensAdvisor.error_loading = true
                LensAdvisor.raiseException(error)
            }
        }

        LensAdvisor.quantityChangesInCart = function (ns, fetch) {
            try {
                if (typeof fetch !== "function") {
                    return
                };

                ns.fetch = function () {
                    const response = fetch.apply(this, arguments);

                    response.then(res => {
                        if (
                            [
                                `${window.location.origin}${Shopify.routes.root}cart/add.js`,
                                `${window.location.origin}${Shopify.routes.root}cart/update.js`,
                                `${window.location.origin}${Shopify.routes.root}cart/change.js`,
                                `${window.location.origin}${Shopify.routes.root}cart/clear.js`,
                            ].includes(res.url)
                        ) {
                            res
                            .clone()
                            .json()
                            .then(data => LensAdvisor.updateCart());
                        }
                    });
                    return response;
                }
            } catch (error) {
                LensAdvisor.error_loading = true
                LensAdvisor.raiseException(error)
            }
        }

        LensAdvisor.prototype.handleLensAdvizorQuanityChange = function () {
            if (this.value === '' || this.value === '0') {
                LensAdvisor.$('#la-review-error').html(LensAdvisor.getTranslatedText("QUANTITY_REQUIRED"))
                LensAdvisor.$('#la-review-error').slideDown()
                return false
            }
            LensAdvisor.$('#la-review-error').slideUp()
            LensAdvisor.$('#reivew-subtotal').html(LensAdvisor.formatCurrency(LensAdvisor.advisor.lensSubtotal * parseInt(this.value)))
        }

        LensAdvisor.raiseException = function (error) {
            console.warn(error)
            return false;
        }
    </script>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
    {{ 'la-iso-bootstrap.js' | asset_url | script_tag }}
    <script type="text/javascript">
        try {
            if (LensAdvisor.error_loading) {
                LensAdvisor.addStyle('form button, form input[type="submit"]', 'visibility', 'visible !important')
                document.dispatchEvent(new CustomEvent('LensAdvisor:init:failed'));
            } else {
                LensAdvisor.$ = $.noConflict(true);
                LensAdvisor.$(document).ready(function() {
                    LensAdvisor.advisor = LensAdvisor.init()
                    LensAdvisor.getSettings()
                })
            }
        } catch (error) {
            var sheet = window.document.styleSheets[0];
            sheetIndex = 0
            while (!sheet.cssRules || !sheet.cssRules.length > 0) {
                sheetIndex += 1
                sheet = window.document.styleSheets[sheetIndex]
            }
            sheet.insertRule('form button, form input[type="submit"]{visibility:visible !important;}', sheet.cssRules.length);
            document.dispatchEvent(new CustomEvent('LensAdvisor:init:failed'));
        }
    </script>
    <div id="LensAdvizorModalWrapper" class="la-modal-wrapper">
    <div class="la-iso-bootstrap">
        <div id="cover-spin"></div>
        <div class="la-modal la-fade" id="myPrescription">
            <div class="la-modal-dialog la-modal-xl prescription-modal">
                <div class="la-modal-content prescription-modal-content">
                    <!-- Modal body -->
                    <div class="row row--modifier">
                        <div class="col-12 col-xl-5 la-modal-columns" id="la-modal-columns-box-shadow">
                            <div class="la-modal-body prescription-body">
                                <div class="header">
                                    <p id="la_error_select_prescription" class="la-error-popdown font-detail">Please enter prescription details</p>
                                    <p id="la_error_select_lens" class="la-error-popdown font-detail">Please select any one lens</p>
                                    <div class="back-button js-back-button">
                                        <img src="https://cdn.shopify.com/s/files/1/0341/4907/3029/files/Back_arrow.svg?v=1592319226" />
                                    </div>
                                    <button type="button" class="close js-modal-close btn-close" id="advisor-close" data-dismiss="la-modal"></button>
                                    <!-- Nav pills -->
                                    <ul class="la-nav la-nav-pills prescription-tabs" role="tablist">
<!--                                         <li class="la-nav-item" style="display: none">
                                            <a class="la-nav-link active" data-toggle="pill" href="#select_prescription"></a>
                                        </li>
                                        <li class="la-nav-item" style="display: none">
                                            <a class="la-nav-link" data-toggle="pill" href="#add_prescription"></a>
                                        </li> -->
                                        <li class="la-nav-item">
                                            <a class="la-nav-link" data-toggle="pill" href="#add_prescription_method"></a>
                                        </li>
<!--                                         <li class="la-nav-item" style="display: none">
                                            <a class="la-nav-link" data-toggle="pill" href="#choose_lens"></a>
                                        </li>
                                        <li class="la-nav-item" style="display: none">
                                            <a class="la-nav-link" data-toggle="pill" href="#choose_options"></a>
                                        </li>
                                        <li class="la-nav-item" style="display: none">
                                            <a class="la-nav-link" data-toggle="pill" href="#choose_addons"></a>
                                        </li> -->
                                        <li class="la-nav-item">
                                            <a class="la-nav-link" data-toggle="pill" href="#review_selection"></a>
                                        </li>
                                    </ul>
                                </div>
                                <!-- Tab panes -->
                                <div class="tab-content prescription-details">
                                    <div id="select_prescription" class="la-tab-pane active">
                                        <h3 id="la_prescriptionSelect_title" class="tab-heading text-center">
                                            Choose Your Prescription Type
                                            <p class="error la-error-popdown la-prescription-error" id="la-prescription-type-error"></p>
                                        </h3>
                                        <div class="prescription-type"></div>
                                    </div>
                                    <div id="add_prescription" class="la-tab-pane la-fade prescription-upload">
                                        <h3 id="la_Rx_main_title" class="tab-heading text-center">Add your prescription</h3>
                                        <div class="add-prescription-container text-center" id="can_upload_their_prescription">
                                            <input type="radio" id="upload" name="prescription_type" value="uploaded" class="radio-prescription-upload-type radio-type-upload">
                                            <label for="upload" class="la-label_button">
                                                <div class="image-container">
                                                    <img src="https://cdn.shopify.com/s/files/1/0413/1160/0808/files/upload_4.png?v=1612756553" />
                                                </div>
                                                <h6 id="la_Rx_main_upload_label" class="text-center">Upload File</h6>
                                            </label>
                                        </div>
                                        <div class="add-prescription-container text-center" id="can_enter_prescription_manually">
                                            <input type="radio" id="manually" name="prescription_type" value="entered_manually" class="radio-prescription-upload-type radio-type-manual">
                                            <label for="manually" class="la-label_button">
                                                <div class="image-container">
                                                    <img src="https://cdn.shopify.com/s/files/1/0413/1160/0808/files/enter_4.png?v=1612756553" />
                                                </div>
                                                <h6 id="la_Rx_main_manual_label" class="text-center">Enter Manually</h6>
                                            </label>
                                        </div>
                                        <div class="add-prescription-container text-center" id="can_email_prescription_after_placing_order">
                                            <input type="radio" id="later" name="prescription_type" value="email_later" class="radio-prescription-upload-type radio-type-later">
                                            <label for="later" class="la-label_button">
                                                <div class="image-container">
                                                    <img src="https://cdn.shopify.com/s/files/1/0413/1160/0808/files/email_4.png?v=1612756553" />
                                                </div>
                                                <h6 id="la_Rx_main_email_label" class="text-center">Email Later</h6>
                                            </label>
                                        </div>
                                    </div>
                                    <div id="add_prescription_method" class="la-tab-pane la-fade">
                                        <div class="upload-option">
                                            <div class="od-right-container od-container--modifier js-od-container">
                                                <h3 id="la_Rx_upload_title" class="tab-heading text-center">Upload Prescription</h3>
                                                <div class="upload-file">
                                                    <p id="la_Rx_upload_fileType_label">Please upload your prescription as a PNG, JPG or PDF file.</p>
                                                  
                                                    <input type="file" id="prescription-upload" accept="image/png, image/jpeg, application/pdf" required>
                                                    <div class="selected-file"></div>
                                                    <label for="prescription-upload" id="label-prescription-upload" class="la-label_button">  
                                                      <div class="choose-file-image-container">
                                                        <img src="https://cdn.shopify.com/s/files/1/0341/4907/3029/files/clip.svg?v=1592302286" class="choose-file-image">
                                                      </div>
                                                        <span id="la_Rx_upload_chooseFile_label" class="choose-file-text">Choose File</span>
                                                        <span id="la_Rx_upload_changeFile_label" class="choose-file-text">Change File</span>
                                                    </label>
                                                    <div class="error-file">Please try to keep your file size under 1 MB (1,000 KB).</div>
                                                </div>
                                            </div>
                                            <div class="upload-manual-option">
                                                <div class="od-left-container od-container--modifier pd-container pd_on_upload" id="pd-container-upload">
                                                    <h6 class="text-left" id="la_Rx_upload_pdText_label">Pupillary Distance (PD)</h6>
                                                    <div class="od-left">
                                                        <div class="la_Rx_od-left">
                                                            <div class="form-check la_Rx_od_upload_single_wrapper">
                                                                <input class="form-check-input" type="radio" name="pd_on_upload" id="pd_on_upload1" value="Single PD" checked>
                                                                <label id="la_Rx_upload_singlePD_label" class="form-check-label form-check-label-color pd-label-text-initial" for="pd_on_upload1">Single PD</label>
                                                            </div>
                                                            <div class="form-check la_Rx_od_upload_dual_wrapper">
                                                                <input class="form-check-input" type="radio" name="pd_on_upload" id="pd_on_upload2" value="Dual PD">
                                                                <label id="la_Rx_upload_dualPD_label" class="form-check-label form-check-label-color pd-label-text-initial" for="pd_on_upload2">Dual PD</label>
                                                            </div>
                                                        </div>
                                                    </div>
                                                    <div class="od-left od-left-pd-on-upload--modifier">
                                                        <div class="od-dropdown js-pd-on-upload-value-dropdown">
                                                            <select class="pd-on-upload-value la-dropdown"></select>
                                                        </div>
                                                        <div class="od-dropdown">
                                                            <p id="la_Rx_upload_PDRight_label" class="od-dropdown-text js-select-pd-on-upload-right-p">Right</p>
                                                            <select class="js-select-pd-on-upload-right-value la-dropdown" field="right"></select>
                                                        </div>
                                                        <div class="od-dropdown">
                                                            <p id="la_Rx_upload_PDLeft_label" class="od-dropdown-text js-select-pd-on-upload-left-p">Left</p>
                                                            <select class="js-select-pd-on-upload-left-value la-dropdown"  field="left"></select>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>

                                            <div class="upload-manual-option-segment-height">
                                                <div class="od-right-container od-container--modifier" id="segment_height_on_upload">
                                                    <h6 id="la_Rx_manual_segmentHeight_label" class="text-left">Segment Height</h6>
                                                    <div class="od-right">
                                                        <div class="od-dropdown w-100">
                                                            <select class="segment_height_on_upload la-dropdown">
                                                                <option id="la_Rx_manual_segmentHeightSelect_label" value="">Select</option>
                                                                <option value="12">12</option>
                                                                <option value="13">13</option>
                                                                <option value="14">14</option>
                                                                <option value="15">15</option>
                                                                <option value="16">16</option>
                                                                <option value="17">17</option>
                                                                <option value="18">18</option>
                                                                <option value="19">19</option>
                                                                <option value="20">20</option>
                                                                <option value="21">21</option>
                                                                <option value="22">22</option>
                                                                <option value="23">23</option>
                                                                <option value="24">24</option>
                                                                <option value="25">25</option>
                                                                <option value="26">26</option>
                                                                <option value="27">27</option>
                                                                <option value="28">28</option>
                                                                <option value="29">29</option>
                                                                <option value="30">30</option>
                                                                <option value="31">31</option>
                                                                <option value="32">32</option>
                                                                <option value="33">33</option>
                                                                <option value="34">34</option>
                                                                <option value="35">35</option>
                                                                <option value="36">36</option>
                                                                <option value="37">37</option>
                                                                <option value="38">38</option>
                                                                <option value="39">39</option>
                                                                <option value="40">40</option>
                                                                <option value="41">41</option>
                                                                <option value="42">42</option>
                                                                <option value="43">43</option>
                                                                <option value="44">44</option>
                                                                <option value="45">45</option>
                                                            </select>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>

                                            <div class="save-continue js-save-continue-upload save-continue--modifier enter-prescription-save-and-continue js-get-cta-styling" id="full-width-cta-modifier-css">
                                                <p class="la-save-continue-btn-text">Save and Continue</p>
                                            </div>
                                        </div>
                                        <div class="manual-option" id="la-reading-prescription-screen">
                                            <div class="spacer-32 tspacer-16 mspacer-16"></div>
                                            <h3 class="tab-heading heading-border-bottom font-body-lg" id="la_Rx_manual_title">{{ shop.metaobjects.rx_insert_form.live.title_1 }}</h3>
                                            <h3 class="tab-heading heading-border-bottom text-center la-d-none" id="la_Rx_reading_title">Select Your Reading Strength Level</h3>
                                            <div class="spacer-56"></div>
                                            <div class="diopters-select od-right-container od-container--modifier js-sph-only la-d-none">
                                                <div class="od-right">
                                                    <div class="od-dropdown">
                                                        <h6 id="la_Rx_reading_diopters_label" class="od-dropdown-text">Diopters</h6>
                                                        <select class="js-od-sph la-dropdown" name="sph"></select>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="od-right-container od-container--modifier js-od-container">
                                                <h6 id="la_Rx_manual_ODright_label" class="text-left font-body-sm font-mob-xsm">{{ shop.metaobjects.rx_insert_form.live.right_eye }}</h6>
                                                <div class="spacer-32 tspacer-16 mspacer-16"></div>
                                                <div class="od-right enter-manually-od-right">
                                                    <div class="od-dropdown font-detail">
                                                        <p id="la_Rx_manual_SPHright_label" class="od-dropdown-text">SPH</p>
                                                        <div class="spacer-16 tspacer-8 mspacer-8"></div>
                                                        <select field_name="sph" class="js-od-right la-dropdown" name="sph"></select>
                                                    </div>
                                                    <div class="od-dropdown font-detail">
                                                        <p id="la_Rx_manual_CYLright_label"class="od-dropdown-text">CYL</p>
                                                        <div class="spacer-16 tspacer-8 mspacer-8"></div>
                                                        <select field_name="cyl" class="js-od-right la-dropdown" name="cyl"></select>
                                                    </div>
                                                    <div class="od-dropdown font-detail">
                                                        <p id="la_Rx_manual_axisright_label"class="od-dropdown-text">Axis</p>
                                                        <div class="spacer-16 tspacer-8 mspacer-8"></div>
                                                        <select field_name="axis" class="js-od-right la-dropdown" name="axis"></select>
                                                    </div>
                                                    <div class="od-dropdown font-detail">
                                                        <p id="la_Rx_manual_ADDright_label" class="od-dropdown-text">Add</p>
                                                        <div class="spacer-16 tspacer-8 mspacer-8"></div>
                                                        <select field_name="add" class="js-od-right la-dropdown" name="add"></select>
                                                    </div>
                                                </div>
                                                <div class="spacer-56 tspacer-40 mspacer-40"></div>
                                                <h6 id="la_singlevision_manual_OSleft_label" class="text-left font-body-sm font-mob-xsm">OS (Left Eye)</h6>
                                                <div class="spacer-32 tspacer-16 mspacer-16"></div>
                                                <div class="od-left enter-manually-os-left">
                                                    <div class="od-dropdown font-detail">
                                                        <p id="la_Rx_manual_SPHleft_label" class="od-dropdown-text">SPH</p>
                                                        <div class="spacer-16 tspacer-8 mspacer-8"></div>
                                                        <select field_name="sph" class="js-od-left la-dropdown" name="sph"></select>
                                                    </div>
                                                    <div class="od-dropdown font-detail">
                                                        <p id="la_Rx_manual_CYLleft_label" class="od-dropdown-text">CYL</p>
                                                        <div class="spacer-16 tspacer-8 mspacer-8"></div>
                                                        <select field_name="cyl" class="js-od-left la-dropdown" name="cyl"></select>
                                                    </div>
                                                    <div class="od-dropdown font-detail">
                                                        <p id="la_Rx_manual_axisleft_label" class="od-dropdown-text">Axis</p>
                                                        <div class="spacer-16 tspacer-8 mspacer-8"></div>
                                                        <select field_name="axis" class="js-od-left la-dropdown" name="axis"></select>
                                                    </div>
                                                    <div class="od-dropdown font-detail">
                                                        <p id="la_Rx_manual_ADDleft_label" class="od-dropdown-text">Add</p>
                                                        <div class="spacer-16 tspacer-8 mspacer-8"></div>
                                                        <select field_name="add" class="js-od-left la-dropdown" name="add"></select>
                                                    </div>
                                                </div>
                                                <div class="spacer-40"></div>
                                            </div>
                                            <div class="od-left-container od-container--modifier pd-container lensadvizor-manual-pd" id="pd-text-reading">
                                                <h6 class="text-left" id="la_Rx_manual_pdText_reading">Pupillary Distance (PD)</h6>
                                                <div class="od-left">
                                                    <div class="la_Rx_od-left">
                                                        <div class="form-check la_Rx_od_upload_single_wrapper">
                                                            <input class="form-check-input" type="radio" name="pd" id="exampleRadios1" value="Single PD" checked>
                                                            <label id="la_Rx_manual_singlePD_label" class="form-check-label form-check-label-color pd-label-text-initial" for="exampleRadios1">Single PD</label>
                                                        </div>
                                                        <div class="form-check la_Rx_od_upload_dual_wrapper">
                                                            <input class="form-check-input" type="radio" name="pd" id="exampleRadios2" value="Dual PD">
                                                            <label id="la_Rx_manual_dualPD_label" class="form-check-label form-check-label-color pd-label-text-initial" for="exampleRadios2">Dual PD</label>
                                                        </div>
                                                    </div>
                                                </div>
                                                <div class="od-left od-left-pd--modifier">
                                                    <div class="od-dropdown js-pd-value-dropdown">
                                                        <select class="pd-value la-dropdown"></select>
                                                    </div>
                                                    <div class="od-dropdown">
                                                        <p id="la_Rx_manual_dualPDright_label" class="od-dropdown-text js-select-pd-right-p">Right</p>
                                                        <select class="js-select-pd-right-value la-dropdown" field="right"></select>
                                                    </div>
                                                    <div class="od-dropdown">
                                                        <p id="la_Rx_manual_dualPDleft_label" class="od-dropdown-text js-select-pd-left-p">Left</p>
                                                        <select class="js-select-pd-left-value la-dropdown"  field="left"></select>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="od-right-container od-container--modifier" id="segment_height">
                                                <h6 id="la_Rx_manual_segmentHeight_label" class="text-left">Segment Height</h6>
                                                <div class="od-right">
                                                    <div class="od-dropdown">
                                                        <select class="segment_height la-dropdown">
                                                            <option id="la_Rx_manual_segmentHeightSelect_label" value="">Select</option>
                                                            <option value="12">12</option>
                                                            <option value="13">13</option>
                                                            <option value="14">14</option>
                                                            <option value="15">15</option>
                                                            <option value="16">16</option>
                                                            <option value="17">17</option>
                                                            <option value="18">18</option>
                                                            <option value="19">19</option>
                                                            <option value="20">20</option>
                                                            <option value="21">21</option>
                                                            <option value="22">22</option>
                                                            <option value="23">23</option>
                                                            <option value="24">24</option>
                                                            <option value="25">25</option>
                                                            <option value="26">26</option>
                                                            <option value="27">27</option>
                                                            <option value="28">28</option>
                                                            <option value="29">29</option>
                                                            <option value="30">30</option>
                                                            <option value="31">31</option>
                                                            <option value="32">32</option>
                                                            <option value="33">33</option>
                                                            <option value="34">34</option>
                                                            <option value="35">35</option>
                                                            <option value="36">36</option>
                                                            <option value="37">37</option>
                                                            <option value="38">38</option>
                                                            <option value="39">39</option>
                                                            <option value="40">40</option>
                                                            <option value="41">41</option>
                                                            <option value="42">42</option>
                                                            <option value="43">43</option>
                                                            <option value="44">44</option>
                                                            <option value="45">45</option>
                                                        </select>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="od-left-container od-container--modifier" id="prism_value">
                                                <h6 id="la_Rx_manual_prismValues_label" class="text-left">Prism Values</h6>
                                                <div class="od-left">
                                                    <div class="la_Rx_od-left">
                                                        <div class="form-check la_Rx_od_upload_single_wrapper">
                                                            <input class="form-check-input" type="radio" name="prism_value" id="primeRadio1" value="No" checked>
                                                            <label id="la_Rx_manual_prismNo_label" class="form-check-label form-check-label-color" for="primeRadio1">No</label>
                                                        </div>
                                                        <div class="form-check la_Rx_od_upload_dual_wrapper">
                                                            <input class="form-check-input" type="radio" name="prism_value" id="primeRadio2" value="Yes">
                                                            <label id="la_Rx_manual_prismYes_label" class="form-check-label form-check-label-color" for="primeRadio2">Yes</label>
                                                        </div>
                                                    </div>
                                                </div>
                                                <div class="js-prism-values-od-right-left-wrapper">
                                                    <h6 id="la_Rx_manual_prismODright_label" class="text-left">{{ shop.metaobjects.rx_insert_form.live.right_eye }}</h6>
                                                    <div class="od-right enter-manually-od-right">
                                                        <div class="od-dropdown">
                                                            <p id="la_Rx_manual_prismHorizontalRight_label" class="od-dropdown-text">Horizontal</p>
                                                            <select field_name="sph" class="js-prism-od-right la-dropdown" name="prism_horizontal"></select>
                                                        </div>
                                                        <div class="od-dropdown">
                                                            <p id="la_Rx_manual_BDirectionHorizontalRight_label" class="od-dropdown-text">B. Direction</p>
                                                            <select field_name="cyl" class="js-prism-od-right la-dropdown" name="base_direction_horizontal"></select>
                                                        </div>
                                                        <div class="od-dropdown">
                                                            <p id="la_Rx_manual_prismVerticalRight_label" class="od-dropdown-text">Vertical</p>
                                                            <select field_name="axis" class="js-prism-od-right la-dropdown" name="prism_veritical"></select>
                                                        </div>
                                                        <div class="od-dropdown b-direction-last">
                                                            <p id="la_Rx_manual_BDirectionVerticalRight_label" class="od-dropdown-text">B. Direction</p>
                                                            <select field_name="add" class="js-prism-od-right la-dropdown" name="base_direction_veritical"></select>
                                                        </div>
                                                    </div>
                                                    <h6 id="la_singlevision_manual_prismOSleft_label" class="text-left">OS (Left Eye)</h6>
                                                    <div class="od-left">
                                                        <div class="od-dropdown">
                                                            <p id="la_Rx_manual_prismHorizontalLeft_label" class="od-dropdown-text">Horizontal</p>
                                                            <select field_name="sph" class="js-prism-od-left la-dropdown" name="prism_horizontal"></select>
                                                        </div>
                                                        <div class="od-dropdown">
                                                            <p id="la_Rx_manual_BDirectionHorizontalLeft_label" class="od-dropdown-text">B. Direction</p>
                                                            <select field_name="cyl" class="js-prism-od-left la-dropdown" name="base_direction_horizontal"></select>
                                                        </div>
                                                        <div class="od-dropdown">
                                                            <p id="la_Rx_manual_prismVerticalLeft_label" class="od-dropdown-text">Vertical</p>
                                                            <select field_name="axis" class="js-prism-od-left la-dropdown" name="prism_veritical"></select>
                                                        </div>
                                                        <div class="od-dropdown b-direction-last">
                                                            <p id="la_Rx_manual_BDirectionVerticalLeft_label" class="od-dropdown-text">B. Direction</p>
                                                            <select field_name="add" class="js-prism-od-left la-dropdown" name="base_direction_veritical"></select>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                            <!-- <div class="od-left-container od-container--modifier" id="prescription_upload_manually_wrapper">
                                                <div class="spacer-24"></div>
                                                <input type="file" id="prescription-upload-manually" accept="image/png, image/jpeg, application/pdf" required>
                                                <p id="la_Rx_manual_uploadDescription_label" class="upload-paragraph font-detail">Upload your prescription for cross-reference and confirmation</p>
                                                <div class="spacer-16"></div>
                                                <div class="js-manually-selected-file font-detail"></div>
                                                <label for="prescription-upload-manually" id="label-prescription-upload-manually" class="la-label_button font-body-sm">
                                                  <div class="choose-file-image-container">
                                                    <img src="https://cdn.shopify.com/s/files/1/0341/4907/3029/files/clip.svg?v=1592302286" class="choose-file-image">
                                                  </div>                                                        
                                                        <span id="la_Rx_manual_upload_chooseFile_label" class="choose-file-text js-choose-file-text-manually">Choose File</span>
                                                        <span id="la_Rx_manual_upload_changeFile_label" class="choose-file-text">Change File</span>                 
                                                </label>
                                                <div class="error-file-manually">File size should be less than 1 MB</div>
                                            </div> -->
                                            <div class="spacer-80 tspacer-64 mspacer-64"></div>
                                            <div class="save-continue save-continue--modifier enter-prescription-save-and-continue js-save-and-continue-prescription-manually js-get-cta-styling" id="full-width-choose-lens-cta-modifier">
                                                    <!-- modal-footer -->
                                                <p class="la-save-continue-btn-text font-body-sm">Save and Continue</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div id="choose_lens" class="la-tab-pane la-fade prescription-choose-lens">
                                        <div class="headings-wrapper-choose-lens heading-border-bottom">
                                            <h3 id="la_chooseLens_title" class="tab-heading text-center">Choose Your Lenses</h3>
                                            <p class="tab-subheading"></p>
                                        </div>
                                        <div id="la-lens-loading">
                                            <div class="d-flex justify-content-center">
                                                <div class="spinner-border" id="lens-loader" role="status">
                                                    <span class="sr-only">Loading...</span>
                                                </div>
                                            </div>
                                        </div>
                                        <div id="choose-lens-card"></div>
                                        {% comment %} Hiding this for now while we work on code changes {% endcomment %}
                                        <div hidden>
                                            <div class="subtotal" id="full-width-choose-lens-cta-modifier">
                                                <div class="row">
                                                    <div id="la_chooseLens_subtotal_label" class="col">Subtotal</div>
                                                    <div class="col col-lens-subtotal text-right">
                                                        <span id="lens-subtotal">0.0</span>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="save-continue js-choose-lens-button save-continue--modifier enter-prescription-save-and-continue js-get-cta-styling" id="full-width-choose-lens-cta-modifier">
                                                <p class="la-save-continue-btn-text">Save and Continue</p>
                                            </div>
                                        </div>
                                        {% comment %} ^ Hiding this for now while we work on code changes {% endcomment %}
                                    </div>
                                    <div id="choose_options" class="la-tab-pane la-fade">
                                      <h3 id="la_choose-options_title" class="tab-heading text-center heading-border-bottom">Select Lens Options for <span id="la_choose-options_lens_title"></span></h3>
                                        {% comment %}<h5 id="la_choose-options_lens_title"></h5>{% endcomment %}
                                        <div class="la_choose-options-container"></div>
                                        {% comment %} Hiding this for now while we work on code changes {% endcomment %}
                                        <div hidden>
                                            <hr/>
                                            <div class="subtotal choose_options_price" id="full-width-cta-modifier-css">
                                                <div class="row">
                                                    <div id="la_review_options_label" class="col">Lens + Options</div>
                                                    <div class="col text-right">
                                                        <span class="la-choose_options-lens-price">0</span>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="subtotal" id="full-width-cta-modifier-css">
                                            <div class="row la-font-weight-100">
                                                <div id="la_choose-options_frame_subtotal_label" class="col">Selected Frame</div>
                                                <div class="col text-right">
                                                    <span class="choose_options-frame-price">0</span>
                                                </div>
                                            </div>
                                            <div class="row la-font-weight-100">
                                                <div id="la_choose-options_lenses_label" class="col">Selected Lenses</div>
                                                <div class="col text-right">
                                                    <span class="la-choose_options-lens-price">0</span>
                                                </div>
                                            </div>
                                            <div class="row">
                                                <div class="col"></div>
                                                <div class="col text-right">----</div>
                                            </div>
                                            <div class="row">
                                                <div id="la_choose-options_subtotal_label" class="col">Subtotal</div>
                                                <div class="col text-right">
                                                    <span id="choose_options-subtotal">0</span>
                                                </div>
                                            </div>
                                        </div>
                                        <button type="submit" class="la-add-to-cart save-continue save-continue--modifier js-options-continue">Save and Continue</button>
                                    </div>
                                    <div id="choose_addons" class="la-tab-pane la-fade prescription-choose-addons">
                                        <div class="headings-wrapper-choose-lens heading-border-bottom">
                                            <h3 id="la_assOns-title" class="tab-heading text-center"></h3>
                                        </div>
                                        <div class="la_choose-addons-container"></div>
                                    </div>
                                    <div id="review_selection" class="la-tab-pane la-fade">
                                        <div class="spacer-32 tspacer-16 mspacer-16"></div>
                                        <h3 id="la_review_title" class="tab-heading text-center heading-border-bottom font-body-lg">Order review</h3>
                                        <div class="spacer-56"></div>
                                        <div class="review-item">
                                            <div class="review-left">
                                                <div class="review-item-title font-body-sm font-mob-xsm">{{product.title}}</div>
                                                <div id="selected_variant_summary"></div>
                                            </div>
                                            <div class="review-right">
                                                <span id="review-variant-price" class="radio-pricing font-body-sm font-mob-xsm"></span>
                                            </div>
                                            <div class="la_Rx_clear"></div>
                                        </div>
                                        <div class="spacer-16"></div>
<!--                                         <hr /> -->
                                        <div class="review-item">
                                            <div class="review-left">
<!--                                                 <div class="review-item-title" id="review-lens-title"></div> -->
<!--                                                 <div class="desktop-nix review-item-variant js-review-precription-type font-body-sm" id="review-selected-priscription"></div> -->
                                                <div class="review-item-variant js-review-precription-type font-body-sm font-mob-xsm" id="review-selected-priscription-method"></div>
                                                <div class="review-item-variant font-body-sm font-mob-xsm" id="review-lens-manual-prescription"></div>
                                                <div class="review-item-variant" id="review-lens-options"></div>
                                                <p id="la_review_orderNotes_label" class="text-left review-text desktop-nix tablet-nix mobile-nix" style="margin-top: 20px;">Order Notes</p>
                                            </div>
<!--                                             <div class="review-right radio-pricing" id="review-lens-price"></div> -->
                                            <div class="la_Rx_clear"></div>
                                        </div>
                                        <div class="review-item" id="add-ons-review">
                                            <hr />
                                            <div id="add-ons-products-info"></div>
                                            <div class="la_Rx_clear"></div>
                                        </div>
                                        <hr id="la-quantity-wrapper-hr" />
                                        <div class="align-items-center d-flex la-quantity-wrapper">
                                            <div class="col-9">
                                                <div>
                                                    <div class="review-item-variant">Quantity</div>
                                                </div>
                                            </div>
                                            <div class="col-3 text-right">
                                                <input type="number" name="la-quantity" value="1" required min="0" class="la-quantity-selector">
                                            </div>
                                        </div>
                                        <div class="spacer-40"></div>
                                        <hr class="desktop-nix tablet-nix mobile-nix"/>
                                        <textarea class="order-notes desktop-nix tablet-nix mobile-nix"></textarea>
                                        <hr/>
                                        <div class="spacer-16"></div>
                                        <div class="subtotal" id="full-width-cta-modifier-css">
                                            <div class="row">
                                                <div id="la_review_subtotal_label" class="col font-label">Subtotal</div>
                                                <div class="col text-right font-body-sm">
                                                    <span id="reivew-subtotal">0</span>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="spacer-80 tspacer-64 mspacer-64"></div>
                                        <p class="error la-error-popdown" id="la-review-error"></p>
                                        <div class="save-continue save-continue--modifier enter-prescription-save-and-continue js-get-cta-styling" onclick="LensAdvisor.advisor.perform_operation(this)" id="full-width-cta-modifier-css">
                                            <p id="la_review_addToCart_label" class="font-body-sm">Add to cart</p>
                                        </div>
                                    </div>
                                    <div id="text_definitions" class="la-tab-pane la-fade">
                                        <span id="la-free-text">FREE</span>
                                        <span id="la-addToCart-text">Add to Cart</span>
                                        <span id="la-processing-text"><i class="fa fa-spinner fa-pulse"></i>  Processing...</span>
                                        <span id="la-lensOptions-saveAndContinue-text">Save and Continue</span>
                                        <span id="la-lensOptions-unavailable-text">Unavailable</span>
                                        <span id="la-chooseLens-startingFrom-text">From </span>
                                        <span id="la-upload-prescriptionFileRequired-text">Prescription file is required.</span>
                                        <span id="la-upload-fileSizeError-text">File Size Should be less than 1 MB.</span>
                                        <span id="la-contactLensTitle">Enter Your Prescription Details</span>
                                    </div>
                                </div>
                                <div style="margin-top: auto;">
                                  <div class="spacer-56 tspacer-56 mspacer-56"></div>
                                  <div class="text-center js-la-trail-logo la_Rx_trail_logo" style="margin-top: 0;">
                                    Powered By <img src="https://d15as34r88kmuk.cloudfront.net/media/lenzadvizor+500x500.png"> <strong>LensAdvizor</strong>
                                  </div>
                                  <div class="spacer-16 tspacer-12 mspacer-12"></div>
                                </div>
                            </div>   
                        </div>    
                    </div>
                </div>
            </div>
        </div>
    </div>
    </div>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css" async>
    {{ 'la-iso-bootstrap.css' | asset_url | stylesheet_tag | async }}
    {{ 'lensadvizor-currencies.js' | asset_url | script_tag | async }}
{% endif %}