{"version":3,"sources":["archive/product/variant-selector-provider/rel-images-tiles-variant-selector-v1.ts"],"names":["html","repeat","TilesVariantSelectorBaseWithLitHtmlRendering","_","window","RelImagesTilesVariantSelectorV1","constructor","this","template","variantSelectorData","variants","length","labels","select","variantTypeName","variant","id","image","thumbnailUrl","title","thumbnailDisplayWidth","thumbnailDisplayHeight","defaultArchiveImage","thumbnailImage","width","height","name","getDataBeforeRender","self","result","variantType","toLowerCase","sortVariants","selectorContainerElement","product","translations","get","changeSelection","thumbnailImageWidth","thumbnailImageMode","relatedImages","each","variantName","normalize","variantNameRegex","RegExp","variantRelImageMatchRegExp","replace","relatedImage","find","relImg","imageName","test"],"mappings":"OAASA,IAAiE,KAA5C,oDACrBC,MAAmE,KAArD,6DACdC,4CAAsF,KAAlC,mCAG7D,MAAMC,EAAIC,OAAOD,QAEJE,wCAAwCH,6CAArDI,c,oBAEcC,KAAAC,SAAW,IAAMR;;6FAEyG,EAA3CO,KAAKE,oBAAoBC,SAASC,OAAaJ,KAAKE,oBAAoBG,OAAOC,OAAS,MAAON,KAAKE,oBAAoBK;;;UAG3Mb,OAAOM,KAAKE,oBAAoBC,SAAU,GAA8BV;oGACkBe,EAAQC;;kBAE1FD,EAAQE,MACJjB,iBAAiBe,EAAQE,MAAMC,sBAAsBH,EAAQE,MAAME,iBAAiBJ,EAAQC,kDAAkDD,EAAQE,MAAMG,kCAAkCL,EAAQE,MAAMI,4BAC5MrB,iBAAiBO,KAAKE,oBAAoBa,mEAAmEf,KAAKE,oBAAoBc,eAAeC,kBAAkBjB,KAAKE,oBAAoBc,eAAeE;;;;;0DAM3KV,EAAQW;;SAEzD;;KAoCT,CAhCcC,sBACN,MAAMC,EAAOrB,KAEb,IAAMsB,EAAS,CACXf,gBAAiBP,KAAKuB,YAAYJ,KAAKK,YAAW,EAClDrB,SAAUH,KAAKyB,aAAazB,KAAK0B,yBAA0B1B,KAAKuB,YAAYpB,SAAUH,KAAK2B,OAAO,EAClGtB,OAAQ,CAAEC,OAAQN,KAAK4B,aAAaC,IAAI,qBAAqB,EAAGC,gBAAiB9B,KAAK4B,aAAaC,IAAI,8BAA8B,CAAC,EACtId,oBAAqB,oCAAsCf,KAAK2B,QAAQI,oBAAsB,IAAM/B,KAAK2B,QAAQK,mBACjHhB,eAAgB,CACZC,MAAOjB,KAAK2B,QAAQI,oBACpBb,OAAQlB,KAAK2B,QAAQI,mB,GAoB7B,OAhBI/B,KAAK2B,QAAQM,eAAqD,EAApCjC,KAAK2B,QAAQM,cAAc7B,QACzDR,EAAEsC,KAAKZ,EAAOnB,SAAU,SAAUK,GAC9B,IAAM2B,EAAkD,YAApC,OAAQ3B,EAAQW,KAAc,UAAmBX,EAAQW,KAAKiB,UAAS,EAAK5B,EAAQW,KACxG,MAAMkB,EAAmBC,OAAOjB,EAAKM,QAAQY,2BAA2BC,QAAQ,cAAeL,CAAW,EAAG,IAAI,EAE7GM,EAAe7C,EAAE8C,KAAKrB,EAAKM,QAAQM,cAAe,SAAUU,GAC5D,IAAIC,EAAgD,YAApC,OAAQD,EAAO/B,MAAe,UAAmB+B,EAAO/B,MAAMwB,UAAS,EAAKO,EAAO/B,MACnG,OAAOyB,EAAiBQ,KAAKD,CAAS,CAC1C,CAAC,EAEGH,IACAjC,EAAQE,MAAQ+B,EAExB,CAAC,EAGEnB,CACX,C,QAvDSxB,+B","file":"rel-images-tiles-variant-selector-v1.js","sourcesContent":["import { html, nothing } from '../../../node_modules/lit-html/lit-html.js';\nimport { repeat } from '../../../node_modules/lit-html/directives/repeat.js';\nimport { TilesVariantSelectorBaseWithLitHtmlRendering } from \"./tiles-variant-selector-base.js\";\nimport { IVariantProduct } from './variant-selector-base.js';\n\nconst _ = window._;\n\nexport class RelImagesTilesVariantSelectorV1 extends TilesVariantSelectorBaseWithLitHtmlRendering {\n\n    protected template = () => html`\n        <div class=\"c-variant-selector__term-definition\">\n            <label 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-relimgtilesvariant__list\">\n        ${repeat(this.variantSelectorData.variants, (variant: IVariantProduct) => html`\n            <button type=\"button\" class=\"c-relimgtilesvariant__option js-variant\" data-variantid=\"${variant.id}\">\n                <figure class=\"c-relimgtilesvariant__image-container\">\n                ${variant.image\n                    ? html`<img src=\"${variant.image.thumbnailUrl}\" alt=\"${variant.image.title}\" title=\"${variant.id}\" class=\"c-relimgtilesvariant__image\" width=\"${variant.image.thumbnailDisplayWidth}\" height=\"${variant.image.thumbnailDisplayHeight}\"/>`\n                    : html`<img src=\"${this.variantSelectorData.defaultArchiveImage}\" class=\"c-relimgtilesvariant__image\" width=\"${this.variantSelectorData.thumbnailImage.width}\" height=\"${this.variantSelectorData.thumbnailImage.height}\"/>`\n                }\n                    <div class=\"c-relimgtilesvariant__unavailable-text js-unavailable-text-container\" style=\"display:none;\">\n                        <span class=\"c-relimgtilesvariant__unavailable-text-label js-unavailable-text\"></span>\n                    </div>\n                </figure>\n                <div class=\"c-relimgtilesvariant__name\">${variant.name}</div>\n            </button>\n        `)}\n        </div>\n    `;\n\n    protected getDataBeforeRender() {\n        const self = this;\n\n        const result = {\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            defaultArchiveImage: '\\\\viewimage.aspx?imageid=0&width=' + this.product.thumbnailImageWidth + '&' + this.product.thumbnailImageMode,\n            thumbnailImage: {\n                width: this.product.thumbnailImageWidth,\n                height: this.product.thumbnailImageWidth\n            }\n        };\n\n        if (this.product.relatedImages && this.product.relatedImages.length > 0) {\n            _.each(result.variants, function (variant: any) {\n                const variantName = typeof (variant.name.normalize) === 'function' ? variant.name.normalize() : variant.name;\n                const variantNameRegex = RegExp(self.product.variantRelImageMatchRegExp.replace('VARIANTNAME', variantName), 'gi');\n\n                var relatedImage = _.find(self.product.relatedImages, function (relImg) {\n                    var imageName = typeof (relImg.title.normalize) === 'function' ? relImg.title.normalize() : relImg.title;\n                    return variantNameRegex.test(imageName);\n                });\n\n                if (relatedImage) {\n                    variant.image = relatedImage;\n                }\n            });\n        }\n\n        return result;\n    }\n}\n"]}