{"version":3,"sources":["archive/product/variant-selector-provider/dropdown-variant-selector-v3.ts"],"names":["arraysAreEqual","html","repeat","DropDownVariantSelectorBase","ProductApi","$","window","jQuery","DropDownVariantSelectorV3","constructor","name","selectorContainerElement","product","variantTypeId","translations","showPricesInclVat","loadAdditionalInfo","super","this","_isOneTypeVariant","_productApi","_valuesToFill","Array","template","variantSelectorData","id","variants","length","labels","select","variantTypeName","variant","_variantTypeToCurrentValueMap","Map","variantTypes","map","variantType","document","on","VARIANT_CHANGED_EVENT","_onVariantChanged","bind","getDataBeforeRender","Date","valueOf","toLowerCase","sortVariants","get","changeSelection","processAfterRender","self","getVariantsShortInfo","productId","then","response","_variantsShortInfo","_fillVariantsInfo","_checkValuesToFill","evt","newVariantValue","isSelectedOptionAvailable","has","set","otherVariantTypeToValueMap","entries","filter","x","values","every","variantValue","otherSelectedValues","option","push","querySelector","options","selectedVariantValue","parseInt","value","selectedVariantValues","variantName","variantShortInfo","variantShortInfoList","find","variantValues","getAttribute","text","priceString","discountPercent","isOutlet","forEach","valuesToFill"],"mappings":"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","file":"dropdown-variant-selector-v3.js","sourcesContent":["import { arraysAreEqual } from \"../../../../components-shared/utils/array-utils.js\";\nimport { html } from 'lit-html';\nimport { repeat } from 'lit-html/directives/repeat';\nimport { IProductWithVariants, IVariant, IVariantType } from './variant-selector-base.js';\nimport { DropDownVariantSelectorBase } from \"./dropdown-variant-selector-base.js\";\nimport { ProductApi } from \"../../../api/archive/product/product-api.js\"\nimport { IVariantShortInfoResponse } from '../../../api/archive/product/interfaces/i-variant-short-info-response.js';\n\nconst $ = window.jQuery;\n\nexport class DropDownVariantSelectorV3 extends DropDownVariantSelectorBase {\n    private _variantTypeToCurrentValueMap: Map<number, number>;\n    private _isOneTypeVariant: boolean = false;\n    private _productApi: ProductApi = new ProductApi();\n    private _variantsShortInfo: IVariantShortInfoResponse;\n    private _valuesToFill: Array<Array<number>> = new Array<Array<number>>();\n\n    constructor(name: string, selectorContainerElement: HTMLElement, product: IProductWithVariants, variantTypeId: number, translations: Map<string, string>, showPricesInclVat: boolean, loadAdditionalInfo: boolean) {\n        super(name, 1, selectorContainerElement, product, variantTypeId, translations, showPricesInclVat, loadAdditionalInfo);\n\n        this._variantTypeToCurrentValueMap = new Map(this.product.variantTypes.map((variantType) => [variantType.id, 0]));\n        this._isOneTypeVariant = this.product.variantTypes.length <= 1;\n\n        $(document).on(this.VARIANT_CHANGED_EVENT, this._onVariantChanged.bind(this));\n    }\n\n    protected template = () => html`\n        <div class=\"c-variant-selector__term-definition c-variant-selector__term-definition_drop-down\">\n            <label for=\"${this.variantSelectorData.id}\" class=\"c-variant-selector__label js-select-variant-label control-label\">${this.variantSelectorData.variants.length > 1 ? this.variantSelectorData.labels.select : '' } ${this.variantSelectorData.variantTypeName}</label>\n        </div>\n        <div class=\"c-variant-selector__term-description c-variant-selector__term-description_drop-down\">\n            <select id=\"${this.variantSelectorData.id}\" class=\"c-variant-selector__drop-down form-control\">\n                <option value=\"0\" class=\"c-variant-selector__drop-down-option js-default-value\">${this.variantSelectorData.labels.select}...</option>\n                ${repeat(this.variantSelectorData.variants, (variant:IVariant) => html`\n                    <option value=\"${variant.id}\" data-name=\"${variant.name}\">\n                        ${variant.name}\n                        <div class=\"ts-variant-info\"></div>\n                    </option>`\n                )}\n            </select>\n        </div>`;\n\n    protected getDataBeforeRender() {\n        return {\n            id: new Date().valueOf() + '_vt' + this.variantType.id,\n            variantTypeName: this.variantType.name.toLowerCase(),\n            variants: this.sortVariants(this.selectorContainerElement, this.variantType.variants, this.product),\n            labels: { select: this.translations.get('selectVariantPrefix'), changeSelection: this.translations.get('changeSelectionVariantPrefix') }\n        };\n    }\n\n    protected processAfterRender() {\n        super.processAfterRender();\n        const self = this;\n\n        if(this.loadAdditionalInfo){\n            this._productApi.getVariantsShortInfo(this.product.productId, this.showPricesInclVat).then(response => {\n                self._variantsShortInfo = response;\n                if(self._isOneTypeVariant){\n                    self._fillVariantsInfo();\n                } else {\n                    self._checkValuesToFill();\n                }\n            });\n        } else {\n            if(self._isOneTypeVariant){\n                self._fillVariantsInfo();\n            } else {\n                self._checkValuesToFill();\n            }\n        }\n    }\n\n    private _onVariantChanged(evt: CustomEvent, variantType: IVariantType, newVariantValue: number, isSelectedOptionAvailable: boolean, productId: number){\n        if(this.product.productId !== productId || this._isOneTypeVariant || !this._variantTypeToCurrentValueMap.has(variantType.id)){\n            return;\n        }\n\n        this._variantTypeToCurrentValueMap.set(variantType.id, newVariantValue);\n        const otherVariantTypeToValueMap = new Map([...this._variantTypeToCurrentValueMap.entries()].filter(x => x[0] !== this.variantType.id));\n        const allOtherValuesSelected = [...otherVariantTypeToValueMap.values()].every(variantValue => variantValue > 0);\n\n        if(allOtherValuesSelected){\n            this._fillVariantsInfo([...otherVariantTypeToValueMap.values()]);\n        }\n    }\n\n    private _fillVariantsInfo(otherSelectedValues: Array<number> = null): void {\n        if(this.loadAdditionalInfo && !this._variantsShortInfo){\n            this._valuesToFill.push(otherSelectedValues);\n            return;\n        }\n\n        const select = this.selectorContainerElement.querySelector('select') as HTMLSelectElement;\n        for (var option of select.options) {\n            const selectedVariantValue = parseInt(option.value);\n            if(!selectedVariantValue){\n                continue;\n            }\n\n            const selectedVariantValues = [selectedVariantValue];\n            if(otherSelectedValues !== null) {\n                selectedVariantValues.push(...otherSelectedValues);\n            }\n\n            const variantShortInfo = this._variantsShortInfo?.variantShortInfoList.find(variantShortInfo => arraysAreEqual(variantShortInfo.variantValues, selectedVariantValues));\n            if(variantShortInfo){\n                const variantName = option.getAttribute('data-name');\n                option.text = `${variantName} ${variantShortInfo.priceString} ${variantShortInfo.discountPercent}%${variantShortInfo.isOutlet ? ' outlet' : ''}`;\n            }\n        }\n    }\n\n    private _checkValuesToFill(){\n        const self = this;\n        this._valuesToFill.forEach((valuesToFill: Array<number>) => {\n            self._fillVariantsInfo(valuesToFill);\n        })\n        this._valuesToFill = null;\n    }\n}\n"]}