{"version":3,"sources":["vueBasicProduct.js"],"names":["vueProduct","Vue","name","el","body","document","querySelector","product","properties","vueProduct_DATA","colours","checkedNames","colourMatrixItems","variantData","lastChangedProperty","vm","this","mounted","addRequiredAttributes","setDefaultValues","addColours","mixins","addToCartBarMixin","calcEngineServiceMixin","methods","addQuantity","generalMixin","quantityMixin","onLoadPropertiesMixin","subtractQuantity","productPriceMixin","requestServiceMixin","selectColour","validationMixin","vatMixin","hexadecimalCode","thumbNailImg","changeSlideImgClick","validate","value","colourVariantValue","parentElement","closeColoursModal","getValueByOptionText","colour","selectElement","getElementById","options","mediaId","option","dataset","gslide","$nextTick","updateProductPrice","Colour","allowedProperties","dispatchEvent","Event","updateDropdowns","classList","remove","checkCombinationExists","inStock","showFromPrice","selectId","optionText","Array","from","trim","event","dataType","target","getAttribute","has","removeAttribute","getProductPrice","existingProperties","label","element","values","entries","textContent","key","disabledDropdownOptions","setAttribute","selectedOptions","keys","forEach","includes","replace","selectedOption","split","productProperties","concat","colourName","variant","variantProperty","isValidVariant","Object","map","some","combination","every","find","so","GLOBAL","PRODUCT","getBasicProductPriceApi","response","content","productPrice","priceResponse","_ref","productId","isUpdating","Set","add","addToBasket","isAddingToCart","data","ID","mappedData","quantity","then","addBasicProductApi","vueAddToCartModal","addedProduct","vueShoppingCartCount","total","basketItemsTotal","id","hasCampaign","finally","clearErrors","property","openError","open","catch","dict","isEmpty","isArray","sort","join","push"],"mappings":"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","file":"../vueBasicProduct.js","sourcesContent":["const vueProduct = new Vue({\r\n    name: 'vueBasicProduct',\r\n    el: '#vueProduct',\r\n    data: {\r\n        body: document.querySelector('body'),\r\n        product: {\r\n            properties: vueProduct_DATA.properties,\r\n        },\r\n        checkedNames: [],\r\n        colours: vueProduct_DATA.colours,\r\n        colourMatrixItems: vueProduct_DATA.colourMatrixItems,\r\n        variantData: vueProduct_DATA.variantData,\r\n        lastChangedProperty: null,\r\n    },\r\n    mounted() {\r\n        const vm = this;\r\n        vm.addRequiredAttributes();\r\n        vm.setDefaultValues(vm.product.properties);\r\n        vm.addColours(vm.colourMatrixItems);\r\n        if (typeof precision !== 'undefined') {\r\n            vm.addToCartButtonDisabled = true;\r\n        }\r\n    },\r\n    mixins: [\r\n        addToCartBarMixin,\r\n        calcEngineServiceMixin,\r\n        coloursMixin,\r\n        discountTiersMixin,\r\n        generalMixin,\r\n        holesMixin,\r\n        onLoadPropertiesMixin,\r\n        productMixin,\r\n        productPriceMixin,\r\n        quantityMixin,\r\n        requestServiceMixin,\r\n        shoppingCartServiceMixin,\r\n        validationMixin,\r\n        vatMixin,\r\n        quantityMixin,\r\n        vatMixin,\r\n        generalMixin,\r\n        validationMixin,\r\n        onLoadPropertiesMixin,\r\n    ],\r\n    methods: {\r\n        addQuantity: function () {\r\n            if (!this.validate()) return;\r\n\r\n            quantityMixin.methods.addQuantity();\r\n        },\r\n        subtractQuantity: function () {\r\n            if (!this.validate()) return;\r\n\r\n            quantityMixin.methods.subtractQuantity();\r\n        },\r\n        selectColour: function (colour) {\r\n            const colourVariantValue = this.getValueByOptionText(\"Colour\", colour.name)\r\n\r\n            this.product.properties.Colour = colourVariantValue;\r\n\r\n            this.selected.product.colour = {\r\n                name: colour.name,\r\n                hexadecimalCode: colour.hexadecimalCode,\r\n            };\r\n\r\n            this.product.colour = colour.name;\r\n\r\n            const thumbNailImg = document.querySelector(\r\n                '.slider-nav-thumbnails img[data-media-id=\"' + colour.mediaId + '\"]'\r\n            );\r\n\r\n            if (thumbNailImg) {\r\n                changeSlideImgClick(thumbNailImg.parentElement.dataset.gslide);\r\n            }\r\n\r\n            this.$nextTick(() => {\r\n                this.$refs.Colour.value = colourVariantValue;\r\n                this.$refs.Colour.dispatchEvent(new Event('change'));\r\n            });\r\n\r\n            if (document.querySelector('.colour.is-invalid')) {\r\n                document.querySelector('.colour.is-invalid').classList.remove('is-invalid');\r\n            }\r\n\r\n            this.$refs['selectColor'].classList.remove('is-invalid');\r\n            this.$refs['selectColor'].parentElement.classList.remove('is-invalid');\r\n\r\n            this.closeColoursModal();\r\n        },\r\n        getValueByOptionText: function (selectId, optionText) {\r\n            // Get the select element by its ID\r\n            const selectElement = document.getElementById(selectId);\r\n\r\n            // Check if select element exists\r\n            if (!selectElement) {\r\n                return null;\r\n            }\r\n\r\n            // Convert options NodeList to an array to use array methods\r\n            const options = Array.from(selectElement.options);\r\n\r\n            // Find the option with the specified text and return its value\r\n            const option = options.find(opt => opt.textContent.trim() === optionText);\r\n\r\n            // Return the value if the option is found, otherwise return null\r\n            return option ? option.value : null;\r\n        },\r\n        updateProductPrice: function (event) {\r\n            var allowedProperties = this.allowedProperties(this.product.properties, this.variantData);\r\n            let dataType = event.target.getAttribute('data-type');\r\n            this.lastChangedProperty = dataType;\r\n\r\n            this.updateDropdowns(allowedProperties);\r\n\r\n            this.validate();\r\n\r\n            if (!document.querySelector('.is-invalid')) {\r\n                this.addToCartButtonDisabled = false;\r\n               \r\n                if (this.checkCombinationExists()) {\r\n                    this.inStock = true\r\n                    this.getProductPrice();\r\n                    this.showFromPrice = false;\r\n                } else {\r\n                    this.inStock = false;\r\n                    this.showFromPrice = true;\r\n                }\r\n            }\r\n        },\r\n        /**\r\n        * Update dropdown elements based on the existingProperties object\r\n        * @param {object} existingProperties - An object containing properties and corresponding values\r\n        */\r\n        updateDropdowns: function (existingProperties) {\r\n            // Loop through all keys in the existingProperties object\r\n            for (const [key, values] of Object.entries(existingProperties)) {\r\n                // Find the select element that corresponds to the current key\r\n                const selectElement = document.getElementById(key);\r\n                if (selectElement) {\r\n                    // Loop through all option elements of the select element\r\n                    const options = selectElement.options;\r\n                    for (let option of options) {\r\n                        if (option.value == '0') {\r\n                            // Skip the option if its value is '0'\r\n                            continue;\r\n                        }\r\n                        if (key == this.lastChangedProperty) {\r\n                            // If the key matches lastChangedProperty, remove the data-disabled attribute\r\n                            option.removeAttribute('data-disabled');\r\n                        } else {\r\n                            // If the option's value is not in the existing values array, set the data-disabled attribute\r\n                            if (!values.has(option.value)) {\r\n                                option.setAttribute('data-disabled', 'true');\r\n                            } else {\r\n                                option.removeAttribute('data-disabled');\r\n                            }\r\n                        }\r\n                    }\r\n                }\r\n            }\r\n\r\n            // Call the function to disable options in the Colour modal\r\n            //this.disableColourModalOptions();\r\n        },\r\n        disableColourModalOptions() {\r\n            // First, clear all previous 'not-available' classes from modal elements\r\n            document.querySelectorAll('[data-modal-colour].not-available').forEach(element => {\r\n                element.classList.remove('not-available');\r\n\r\n                // Append \" - unavailable\" to the label text\r\n                const label = element.querySelector('label');\r\n                if (label && label.textContent.includes(' - unavailable')) {\r\n                    label.textContent = label.textContent.replace(' - unavailable', '');\r\n                }\r\n            });\r\n\r\n            // Find all disabled options in the Colour select dropdown\r\n            const disabledDropdownOptions = document.querySelectorAll('#Colour option[data-disabled=\"true\"]');\r\n\r\n            // Iterate over each disabled dropdown option\r\n            disabledDropdownOptions.forEach(option => {\r\n                // Extract the actual colour name (before the '|')\r\n                const colourName = option.value.split('|')[0];\r\n\r\n                // Find all modal elements with the data-modal-colour attribute that match the colour name\r\n                const colourElements = document.querySelectorAll(`[data-modal-colour=\"${colourName}\"]`);\r\n\r\n                // Add the 'not-available' class to each matching modal element\r\n                colourElements.forEach(element => {\r\n                    element.classList.add('not-available');\r\n\r\n                    // Append \" - unavailable\" to the label text\r\n                    const label = element.querySelector('label');\r\n                    if (label && !label.textContent.includes(' - unavailable')) {\r\n                        label.textContent += ' - unavailable';\r\n                    }\r\n                });\r\n            });\r\n        },\r\n        checkCombinationExists() {\r\n            // Convert product properties to an array of objects for easier comparison\r\n            const selectedOptions = Object.keys(this.product.properties).map(key => {\r\n                return { name: key, value: this.product.properties[key] };\r\n            });\r\n\r\n            // Iterate through the variantData to check if the combination exists\r\n            return vueProduct_DATA.variantData.some(combination => {\r\n                return combination.every(option => {\r\n                    const selectedOption = selectedOptions.find(so => so.name === option.name);\r\n                    return selectedOption && selectedOption.value === option.value;\r\n                });\r\n            });\r\n        },\r\n        allowedProperties: function (productProperties, variantData) {\r\n            let existingProperties = {};\r\n            variantData.forEach(variant => {\r\n                let isValidVariant = true;\r\n                Object.entries(productProperties).forEach(([key, value]) => {\r\n                    if (value !== 0 && value !== \"0\" && value !== \"\") {\r\n                        let variantProperty = variant.find(option => option.name === key);\r\n                        if (!variantProperty || variantProperty.value !== value) {\r\n                            isValidVariant = false;\r\n                        }\r\n                    }\r\n                });\r\n\r\n                if (isValidVariant) {\r\n                    variant.forEach(option => {\r\n                        if (!existingProperties[option.name]) {\r\n                            existingProperties[option.name] = new Set();\r\n                        }\r\n                        existingProperties[option.name].add(option.value);\r\n                    });\r\n                }\r\n            });\r\n\r\n            return existingProperties;\r\n        },\r\n        getProductPrice: function () {\r\n            const vm = this;\r\n            vm.isUpdating = true;\r\n\r\n            const data = {\r\n                productId: GLOBAL.PRODUCT.ID,\r\n                properties: vm.mappedData(),\r\n                quantity: this.product.quantity\r\n            };\r\n\r\n            vm.getBasicProductPriceApi(data).then(function (response) {\r\n                if (!response)\r\n                    return;\r\n\r\n                const content = response.data.content;\r\n\r\n                if (content.productPrice == null)\r\n                    return;\r\n\r\n                vm.priceResponse = content.productPrice;\r\n\r\n                if (vm.priceResponse.productId !== 0) {\r\n                    vm.product.id = vm.priceResponse.productId;\r\n                } else {\r\n                    vm.product.id = GLOBAL.PRODUCT.ID;\r\n                }\r\n\r\n                vm.calculateDiscountBarStyle();\r\n\r\n                vm.showFromPrice = false;\r\n\r\n                vm.hasCampaign = false;\r\n            }).finally(function () {\r\n                vm.isUpdating = false;\r\n            });\r\n        },\r\n        validate: function () {\r\n            const vm = this;\r\n            vm.clearErrors();\r\n            if (!vm.requiredFieldsAreValid()) {\r\n                return false;\r\n            }\r\n            return true;\r\n        },\r\n        addToBasket: function () {\r\n            const vm = this;\r\n\r\n            if (vm.isAddingToCart) {\r\n                return;\r\n            }\r\n\r\n            if (!vm.validate()) return;\r\n\r\n            vm.isAddingToCart = true;\r\n\r\n            const data = {\r\n                productId: vm.product.id,\r\n                quantity: vm.product.quantity,\r\n                properties: vm.mappedData(),\r\n            };\r\n\r\n            vm.addBasicProductApi(data)\r\n                .then(function (response) {\r\n                    if (!response) {\r\n                        vm.isAddingToCart = false;\r\n                        vueAddToCartModal.openError();\r\n                        return;\r\n                    }\r\n\r\n                    const content = response.data.content;\r\n\r\n                    vueAddToCartModal.priceResponse = vueProduct.priceResponse\r\n                    vueAddToCartModal.quantity = vueProduct.product.quantity;\r\n                    vueAddToCartModal.addedProduct = content.addedProduct\r\n                    vueShoppingCartCount.total = content.basketItemsTotal;\r\n\r\n                    vueAddToCartModal.open();\r\n                })\r\n                .catch(function () {\r\n                    vueAddToCartModal.openError();\r\n                })\r\n                .finally(() => {\r\n                    vm.isAddingToCart = false;\r\n                });\r\n        },\r\n        /**\r\n         * Change data into a format suitable to sending, specifically for checkboxes\r\n         */\r\n        mappedData: function () {\r\n            const vm = this;\r\n            const properties = vm.product.properties;\r\n\r\n            var dict = []; // create an empty array\r\n\r\n            for (const property in properties) {\r\n                var value = properties[property];\r\n\r\n                if (!vm.isEmpty(value)) {\r\n                    if (Array.isArray(properties[property])) {\r\n                        value = value.sort().join('|');\r\n                    }\r\n\r\n                    dict.push({\r\n                        key: property,\r\n                        value: value,\r\n                    });\r\n                }\r\n            }\r\n\r\n            return dict;\r\n        },\r\n    }\r\n});\r\n"]}