{"version":3,"file":"ProductView.min.js","sources":["ProductView.js"],"sourcesContent":["(function ($, _, root, undefined) {\r\n 'use strict';\r\n\r\n var assetId = 'uc209-productview';\r\n\r\n // Main product controller\r\n function productViewController($viewContainer, productViewModel) {\r\n var model = productViewModel;\r\n var pubsub = root.PubSub;\r\n var utils = new util();\r\n var say = new notificator(pubsub, utils);\r\n var variantProcessorsMap = {};\r\n var flags = null;\r\n var cart = null;\r\n var rating = null;\r\n var gallery = null;\r\n var priceTotals = null;\r\n var packageComponents = null;\r\n\r\n return {\r\n init: function () {\r\n var quantityDiscounts = new quantityDiscountsProcessor($viewContainer, model);\r\n var externalTracking = new externalTrackingProcessor();\r\n\r\n priceTotals = new priceTotalsProcessor($viewContainer, utils);\r\n priceTotals.init();\r\n\r\n if (model.isProductWithVariants) {\r\n var preselectedVariants = _getPreselectedVariantsFromQueryString();\r\n _initVariantsProcessor($viewContainer, model, priceTotals, quantityDiscounts, externalTracking, preselectedVariants, true);\r\n }\r\n else {\r\n quantityDiscounts.renderQuantityDiscounts();\r\n }\r\n\r\n if (model.packageComponentProducts) {\r\n _.each(model.packageComponentProducts, function (packageComponent) {\r\n if (packageComponent.isMainProductOfProductWithVariants) {\r\n var $componentProductContainer = $viewContainer.find('.js-component-products-list .js-component-product[data-uniqueid=\"' + packageComponent.uniqueId + '\"]');\r\n packageComponent.variantRelImageMatchRegExp = model.variantRelImageMatchRegExp;\r\n _initVariantsProcessor($componentProductContainer, packageComponent, priceTotals);\r\n }\r\n });\r\n packageComponents = new PackageComponentProcessor($viewContainer, model, utils);\r\n }\r\n\r\n if (model.additionalProducts) {\r\n _.each(model.additionalProducts, function (additionalProduct) {\r\n if (additionalProduct.isProductWithVariants) {\r\n var $additionalProductContainer = $viewContainer.find('.js-additional-product[data-uniqueid=\"' + additionalProduct.uniqueId + '\"]');\r\n additionalProduct.variantRelImageMatchRegExp = model.variantRelImageMatchRegExp;\r\n _initVariantsProcessor($additionalProductContainer, additionalProduct, priceTotals);\r\n }\r\n });\r\n }\r\n\r\n cart = new cartProcessor($viewContainer, model, say, pubsub, variantProcessorsMap, utils);\r\n cart.init();\r\n\r\n flags = new flagsProcessor($viewContainer, model);\r\n flags.init();\r\n\r\n rating = new ratingProcessor($viewContainer, model, pubsub);\r\n rating.init();\r\n\r\n var shoppingListHandler = new shoppingListProcessor($viewContainer, model, say, utils, variantProcessorsMap);\r\n shoppingListHandler.init();\r\n\r\n if (model.isPrintEnabled) {\r\n var printHanlder = new printProcessor($viewContainer, model);\r\n printHanlder.init();\r\n }\r\n\r\n var pdfHadnler = new pdfProcessor($viewContainer, model);\r\n pdfHadnler.init();\r\n\r\n if (model.isPriceRequestEnabled) {\r\n var priceRequestHandler = priceRequestProcessor($viewContainer);\r\n priceRequestHandler.init();\r\n }\r\n\r\n gallery = new galleryProcessor($viewContainer, model);\r\n gallery.init();\r\n\r\n externalTracking.reportProductsView($viewContainer, model);\r\n\r\n var enableRelationExtensionDataProcessing = model.isProductRelationsExtensionEnabled && model.isProductWithVariants && model.additionalProducts && model.additionalProducts.length;\r\n if (enableRelationExtensionDataProcessing) {\r\n var relExtDataProcessor = new relationExtensionDataProcessor($viewContainer, model, variantProcessorsMap, priceTotals, pubsub);\r\n relExtDataProcessor.init();\r\n }\r\n\r\n const similarProductsSelect = $viewContainer.find('select.js-similar-products-selector');\r\n if (similarProductsSelect.length) {\r\n similarProductsSelect.on('change', (e) => window.location = e.target.selectedOptions[0].dataset.url);\r\n }\r\n }\r\n };\r\n\r\n function _initVariantsProcessor($productContainer, productModel, priceTotals, quantityDiscountsProcessorInstance, externalTrackingProcessorInstance, preselectedVariants, enableHistoryState) {\r\n var processor = new variantsProcessor($productContainer, productModel, model.metadata, preselectedVariants, say, pubsub, priceTotals, quantityDiscountsProcessorInstance, externalTrackingProcessorInstance, utils, enableHistoryState);\r\n processor.init();\r\n\r\n variantProcessorsMap[productModel.uniqueId] = processor;\r\n }\r\n\r\n function _getPreselectedVariantsFromQueryString() {\r\n var result = {}, queryString = location.search.slice(1), re = /sel(?:\\:|%3a){1}([^&=]+)=([^&]*)/gi, match;\r\n\r\n while ((match = re.exec(queryString))) {\r\n var paramKey = decodeURIComponent(match[1]).toLowerCase();\r\n var paramValue = decodeURIComponent(match[2].replace(/\\+/g, ' ')).toLowerCase();\r\n result[paramKey] = paramValue;\r\n }\r\n\r\n return result;\r\n }\r\n }\r\n\r\n root.productViewController = productViewController;\r\n\r\n $(function () {\r\n if (root.umwAssets && root.umwAssets[assetId]) {\r\n root.umwAssets[assetId].forEach(function (ctx) {\r\n if (ctx) {\r\n var mainPanelId = ctx.uniqueId;\r\n var $mainPanel = $('#' + mainPanelId);\r\n\r\n if ($mainPanel.length === 1) {\r\n var controller = new productViewController($mainPanel, ctx);\r\n controller.init();\r\n } else if ($mainPanel.length === 0) {\r\n console.warn(assetId + ': product view main panel element was not found by id#' + mainPanelId);\r\n } else {\r\n console.warn(assetId + ': found >1 product view main panel elements with id#' + mainPanelId);\r\n }\r\n }\r\n });\r\n }\r\n });\r\n\r\n // Notifications processor\r\n function notificator(pubsub, utils) {\r\n function _notify(message, notificationType, timeout) {\r\n if (typeof message === 'object' && message !== null) {\r\n message = utils.extractErrorMessageFromResponse(message);\r\n }\r\n\r\n if (pubsub) {\r\n pubsub.publish('notification.' + notificationType, { text: message, timeout: timeout });\r\n } else {\r\n var notificationTypeMap = {\r\n 'error': 'error',\r\n 'alert': 'log',\r\n 'success': 'log',\r\n 'warning': 'warn'\r\n };\r\n\r\n root.console[notificationTypeMap[notificationType]].apply(this, [message]);\r\n }\r\n }\r\n\r\n return {\r\n warning: function (message) {\r\n _notify(message, 'warning', false);\r\n },\r\n error: function (message) {\r\n _notify(message, 'error', false);\r\n },\r\n success: function (message) {\r\n _notify(message, 'success', 30000);\r\n }\r\n };\r\n }\r\n\r\n // Variants processor\r\n function variantsProcessor($productContainer, product, metadata, preselectedVariants, say, pubsub, priceTotalsController, quantityDiscounts, externalTracking, utils, enableHistoryState) {\r\n var $container = $productContainer;\r\n var $declaredVariantSelectors = utils.$getProductContainerElements($container, '.js-variant-selector');\r\n\r\n var variantControllers = {};\r\n var isVariantProductShown = false;\r\n var suppressVariantProductDetailsLoading = false;\r\n\r\n var variantsState = { controlId: product.uniqueId, selectedVariantProd: null };\r\n var suppressVariantChangedEvent = false;\r\n\r\n var currentlyUnavailableVariantsMap = {};\r\n\r\n function _onVariantSelectionChanged(changedVariantType, newVariantValue) {\r\n var changedVariantController = _getVariantControllerById(changedVariantType.id);\r\n var prevVariantValue = changedVariantController.selectedValue;\r\n changedVariantController.selectedValue = newVariantValue || 0;\r\n\r\n var selectedVariants = _getSelectedVariants();\r\n\r\n var selectedVariantProduct = null;\r\n\r\n var isSelectionComplete = _.every(selectedVariants, function (x) { return x > 0; });\r\n if (isSelectionComplete) {\r\n var variantProductsForSelection = _getProductsForCurrentSelection();\r\n\r\n if (variantProductsForSelection.length === 0) {\r\n say.warning(metadata['noAvailableVariantProducts']);\r\n } else if (variantProductsForSelection.length === 1) {\r\n selectedVariantProduct = variantProductsForSelection[0];\r\n } else if (variantProductsForSelection.length > 1) {\r\n say.warning(metadata['invalidVariantsConfiguration'] + ' ' + metadata['multipleAvailableVariantProducts']);\r\n }\r\n }\r\n\r\n if (!suppressVariantProductDetailsLoading) {\r\n if (selectedVariantProduct) {\r\n _loadVariantProductDetails(selectedVariantProduct);\r\n } else if (isVariantProductShown) {\r\n // De-selection, or unavailable dimensions combination - load main product and show\r\n _loadVariantProductDetails();\r\n }\r\n }\r\n\r\n if (quantityDiscounts) {\r\n quantityDiscounts.renderQuantityDiscounts(selectedVariants);\r\n }\r\n\r\n pubsub.publish('variantprocessor.variant.changed', [newVariantValue, prevVariantValue, changedVariantController]);\r\n\r\n function _getProductsForCurrentSelection() {\r\n var availableProducts = _.filter(product.variantProducts, function (x) {\r\n return _.every(selectedVariants, function (y) { return _.indexOf(x.variants, y) !== -1; });\r\n });\r\n\r\n return availableProducts;\r\n }\r\n\r\n function _getSelectedVariants() {\r\n return _.map(variantControllers, function (currentController) {\r\n return currentController.selectedValue || 0;\r\n });\r\n }\r\n }\r\n\r\n function _filterUnavailableVariants() {\r\n var selectedVariantTypes = [];\r\n var selectedVariantOptions = [];\r\n _.each(variantControllers, variantController => {\r\n if (variantController.selectedValue > 0) {\r\n selectedVariantTypes.push(variantController.variantType.id);\r\n selectedVariantOptions.push(variantController.selectedValue);\r\n }\r\n });\r\n\r\n const isAnyVariantSelected = selectedVariantOptions.length > 0;\r\n // assuming that all variants unavailable\r\n product.variantProducts.forEach(variantProduct => {\r\n var isProductForCurrentSelection = selectedVariantOptions.every(selectedVariantOption => variantProduct.variants.find(x => x === selectedVariantOption));\r\n if (!isAnyVariantSelected || isProductForCurrentSelection) {\r\n variantProduct.variants.forEach(variantId => {\r\n currentlyUnavailableVariantsMap[variantId] = currentlyUnavailableVariantsMap[variantId] = { message: variantProduct.availabilityMessage || metadata['notAvailableProduct'], disabled: !variantProduct.exists };\r\n });\r\n }\r\n });\r\n // set available\r\n product.variantProducts.forEach(variantProduct => {\r\n var isProductForCurrentSelection = selectedVariantOptions.every(selectedVariantOption => variantProduct.variants.find(x => x === selectedVariantOption));\r\n if ((!isAnyVariantSelected || isProductForCurrentSelection) && variantProduct.isAvailable) {\r\n variantProduct.variants.forEach(variantId => {\r\n delete currentlyUnavailableVariantsMap[variantId];\r\n });\r\n }\r\n });\r\n\r\n _.each(variantControllers, function (variantController) {\r\n var preselectSingleAvailable = (_.isEmpty(preselectedVariants) || !preselectedVariants[variantController.variantType.name.toLowerCase()]) && variantController.variantType.variants.length === 1;\r\n variantController.selector.filterVariants(currentlyUnavailableVariantsMap, preselectSingleAvailable);\r\n });\r\n }\r\n\r\n function _loadVariantProductDetails(variantProduct) {\r\n var beforeLoadEvent = $.Event('variantsprocessor:beforeloadvariantproduct');\r\n $container.trigger(beforeLoadEvent, [variantProduct]);\r\n\r\n if (beforeLoadEvent.isDefaultPrevented()) {\r\n return;\r\n }\r\n\r\n $.blockUI({ message: '' });\r\n\r\n var selectedVariants = variantProduct ? variantProduct.variants : [];\r\n $.ajax({\r\n url: root.R + 'handlers/public/productdata.ashx',\r\n type: 'GET',\r\n data: {\r\n a: 'GetDimDetails',\r\n ItemID: product.itemId,\r\n Dim1: selectedVariants[0] !== undefined ? selectedVariants[0] : 0,\r\n Dim2: selectedVariants[1] !== undefined ? selectedVariants[1] : 0,\r\n Dim3: selectedVariants[2] !== undefined ? selectedVariants[2] : 0,\r\n CanHandleDisallowedBuyDims: true,\r\n ImageWidth: product.previewImageWidth,\r\n ImgMod: product.previewImageMode,\r\n InclVat: product.sellPrice ? product.sellPrice.inclVat : null\r\n }\r\n })\r\n .always($.unblockUI)\r\n .done(function (variantProductDetails) {\r\n _updateViewProductWithNewData(variantProductDetails);\r\n\r\n if (enableHistoryState === true) {\r\n _updateHistory(variantProductDetails);\r\n }\r\n\r\n pubsub.publish('variantprocessor.variantproduct.updated', variantProductDetails);\r\n })\r\n .fail(function (errorResponse) {\r\n say.error(errorResponse);\r\n });\r\n\r\n function _updateViewProductWithNewData(newData) {\r\n // Note: all raw prices, discount percent, price2, price3, ean, measurements, weight and all other dimension-specific possible values are not supported at the moment (20.09.2018)\r\n product.isMainProductOfProductWithVariants = newData.IsMainProd;\r\n product.isVariantProductOfProductWithVariants = isVariantProductShown = !newData.IsMainProd;\r\n var $priceFromText = utils.$getProductContainerElements($container, '.js-price-fromtext');\r\n if ($priceFromText.length > 0) {\r\n $priceFromText.toggle(product.isMainProductOfProductWithVariants);\r\n }\r\n\r\n product.productId = newData.ProductID;\r\n $container.data('productid', product.productId);\r\n\r\n product.prodno = newData.ProdNo;\r\n utils.$getProductContainerElements($container, '.js-product-number').text(product.prodno);\r\n\r\n product.title = newData.FullTitle;\r\n utils.$getProductContainerElements($container, '.js-product-title').text(product.title);\r\n\r\n if (externalTracking) {\r\n externalTracking.reportProductDetailsView(product.productId);\r\n }\r\n\r\n if (newData.ImageURL) {\r\n product.mainImage = {\r\n id: newData.ImageID,\r\n title: newData.ImageText,\r\n description: newData.ImageText,\r\n actualWidth: newData.ImageMaxWidth,\r\n thumbnailUrl: newData.ImageRelURL,\r\n previewUrl: newData.ImageURL,\r\n fullSizeUrl: newData.ImageLBURL,\r\n displayWidth: newData.ImagePreviewDisplayWidth,\r\n displayHeight: newData.ImagePreviewDisplayHeight\r\n };\r\n\r\n var $mainImage = utils.$getProductContainerElements($container, '.js-product-mainimage');\r\n if ($mainImage.length > 0) {\r\n $mainImage.attr('src', product.mainImage.previewUrl);\r\n $mainImage.attr('alt', product.mainImage.title);\r\n\r\n $mainImage.attr('data-imageid', product.mainImage.id);\r\n $mainImage.data('imageid', product.mainImage.id);\r\n\r\n if (product.mainImage.displayWidth && product.mainImage.displayHeight) {\r\n $mainImage.attr('width', product.mainImage.displayWidth);\r\n $mainImage.attr('height', product.mainImage.displayHeight);\r\n }\r\n\r\n if (product.galleryId) {\r\n var $mainImageGalleryLink = $mainImage.closest('[data-fancybox=\"' + product.galleryId + '\"]');\r\n if ($mainImageGalleryLink.length === 1) {\r\n $mainImageGalleryLink.attr('href', product.mainImage.fullSizeUrl);\r\n\r\n $mainImageGalleryLink.attr('data-caption', product.mainImage.description);\r\n $mainImageGalleryLink.data('caption', product.mainImage.description);\r\n\r\n $mainImageGalleryLink.attr('data-width', product.mainImage.actualWidth);\r\n $mainImageGalleryLink.data('width', product.mainImage.actualWidth);\r\n\r\n $mainImageGalleryLink.removeAttr('data-height');\r\n $mainImageGalleryLink.removeData('height');\r\n }\r\n }\r\n }\r\n }\r\n\r\n product.stockText = newData.StockText;\r\n product.stockColor = newData.StockColor;\r\n var $stockText = utils.$getProductContainerElements($container, '.js-stock-text');\r\n if ($stockText.length > 0) {\r\n $stockText.text(product.stockText);\r\n $stockText.css('color', product.stockColor || 'inherit');\r\n }\r\n\r\n if (product.sellPrice) {\r\n product.sellPrice.formatted = newData.Price;\r\n delete product.sellPrice.raw; // not available in the incoming data set\r\n\r\n var $sellPriceFormatted = utils.$getProductContainerElements($container, '.js-sellprice-formatted');\r\n if ($sellPriceFormatted.length > 0) {\r\n $sellPriceFormatted.text(product.sellPrice.formatted);\r\n }\r\n }\r\n\r\n if (product.sellPriceWithVAT) {\r\n product.sellPriceWithVAT.formatted = newData.PriceInclVat;\r\n delete product.sellPriceWithVAT.raw; // not available in the incoming data set\r\n\r\n var $sellPriceWithVatFormatted = utils.$getProductContainerElements($container, '.js-sellprice-withvat-formatted');\r\n if ($sellPriceWithVatFormatted.length > 0) {\r\n $sellPriceWithVatFormatted.text(product.sellPriceWithVAT.formatted);\r\n }\r\n }\r\n\r\n if (product.sellPriceWithoutVAT) {\r\n product.sellPriceWithoutVAT.formatted = newData.PriceExclVat;\r\n delete product.sellPriceWithoutVAT.raw; // not available in the incoming data set\r\n\r\n var $sellPriceWithoutVatFormatted = utils.$getProductContainerElements($container, '.js-sellprice-withoutvat-formatted');\r\n if ($sellPriceWithoutVatFormatted.length > 0) {\r\n $sellPriceWithoutVatFormatted.text(product.sellPriceWithoutVAT.formatted);\r\n }\r\n }\r\n\r\n if (product.beforePrice) {\r\n product.beforePrice.formatted = newData.OriginalPrice;\r\n delete product.beforePrice.raw; // not available in the incoming data set\r\n\r\n var $beforePriceFormatted = utils.$getProductContainerElements($container, '.js-beforeprice-formatted');\r\n if ($beforePriceFormatted.length > 0) {\r\n var $beforePriceElements = utils.$getProductContainerElements($container, '.js-beforeprice-value, .js-beforeprice-label').add($beforePriceFormatted);\r\n if (newData.HasDiscount) {\r\n $beforePriceFormatted.text(product.beforePrice.formatted);\r\n $beforePriceElements.show();\r\n } else {\r\n $beforePriceElements.hide();\r\n }\r\n }\r\n }\r\n\r\n if (product.discountPrice) {\r\n product.discountPrice.formatted = newData.Discount;\r\n delete product.discountPrice.raw; // not available in the incoming data\r\n\r\n var $discountPriceFormatted = utils.$getProductContainerElements($container, '.js-discountprice-formatted');\r\n if ($discountPriceFormatted.length > 0) {\r\n var $discountPriceElements = utils.$getProductContainerElements($container, '.js-discountprice-value, .js-discountprice-label').add($discountPriceFormatted);\r\n\r\n if (newData.HasDiscount && product.discountPrice.formatted) {\r\n $discountPriceFormatted.text(product.discountPrice.formatted);\r\n\r\n $discountPriceElements.show();\r\n } else {\r\n $discountPriceElements.hide();\r\n }\r\n }\r\n }\r\n\r\n if (product.discountPercent) {\r\n product.discountPercent.formatted = newData.DiscountPercent;\r\n delete product.discountPercent.raw; // not available in the incoming data\r\n\r\n var $discountPercentFormatted = utils.$getProductContainerElements($container, '.js-discountpercent-formatted');\r\n if ($discountPercentFormatted.length > 0) {\r\n var $discountPercentElements = utils.$getProductContainerElements($container, '.js-discountpercent-value, .js-discountpercent-label').add($discountPercentFormatted);\r\n\r\n if (newData.HasDiscount && product.discountPercent.formatted) {\r\n $discountPercentFormatted.text('-' + product.discountPercent.formatted + '%');\r\n\r\n $discountPercentElements.show();\r\n } else {\r\n $discountPercentElements.hide();\r\n }\r\n }\r\n }\r\n\r\n if (product.discountToDate) {\r\n product.discountToDate.formatted = newData.DiscountToDate;\r\n delete product.discountToDate.raw; // not available in the incoming data\r\n\r\n var $discountToDateFormatted = utils.$getProductContainerElements($container, '.js-discounttodate-formatted');\r\n if ($discountToDateFormatted.length > 0) {\r\n var $discountToDateElements = utils.$getProductContainerElements($container, '.js-discounttodate-value, .js-discounttodate-label').add($discountToDateFormatted);\r\n\r\n if (newData.HasDiscount && product.discountToDate.formatted) {\r\n $discountToDateFormatted.text(product.discountToDate.formatted);\r\n\r\n $discountToDateElements.show();\r\n } else {\r\n $discountToDateElements.hide();\r\n }\r\n }\r\n }\r\n\r\n if (product.comparablePrice) {\r\n product.comparablePrice.formatted = newData.ComparablePrice;\r\n delete product.comparablePrice.raw; // not available in the incoming data set\r\n\r\n var $comparablePriceFormatted = utils.$getProductContainerElements($container, '.js-comparableprice-formatted');\r\n if ($comparablePriceFormatted.length > 0) {\r\n $comparablePriceFormatted.text(product.comparablePrice.formatted);\r\n }\r\n }\r\n\r\n if (product.factorPrice) {\r\n product.factorPrice.formatted = newData.FactorPrice;\r\n delete product.factorPrice.raw; // not available in the incoming data set\r\n\r\n var $factorPriceFormatted = utils.$getProductContainerElements($container, '.js-factor-price-formatted');\r\n if ($factorPriceFormatted.length > 0) {\r\n $factorPriceFormatted.text(product.factorPrice.formatted);\r\n }\r\n }\r\n\r\n if (product.productInFactorPrice) {\r\n product.productInFactorPrice.formatted = newData.ProductInFactorPrice;\r\n delete product.productInFactorPrice.raw; // not available in the incoming data set\r\n\r\n var $productInFactorPriceFormatted = utils.$getProductContainerElements($container, '.js-product-in-factor-price-formatted');\r\n if ($productInFactorPriceFormatted.length > 0) {\r\n $productInFactorPriceFormatted.text(product.productInFactorPrice.formatted);\r\n }\r\n }\r\n\r\n var $replacementProductContainer = utils.$getProductContainerElements($container, '.js-replacement-product-container');\r\n if ($replacementProductContainer.length > 0) {\r\n if (newData.ReplacementProductInfo) {\r\n $replacementProductContainer.empty().html(newData.ReplacementProductInfo).show();\r\n } else {\r\n $replacementProductContainer.empty().hide();\r\n }\r\n }\r\n\r\n priceTotalsController.updatePriceTotals();\r\n\r\n // Supplier order info\r\n const supplierOrderInfoTooltip = utils.$getProductContainerElements($container, 'cms-tooltip').get(0);\r\n\r\n if (supplierOrderInfoTooltip) {\r\n const supplierOrderInfo = supplierOrderInfoTooltip.shadowRoot.querySelector('supplier-order-info');\r\n const $stockTextInfoIcon = utils.$getProductContainerElements($container, '.js-stock-text-info');\r\n\r\n if (supplierOrderInfo) {\r\n if (newData.InSupplierOrder === true) {\r\n supplierOrderInfoTooltip.visible = true;\r\n supplierOrderInfo.update(newData.ProductID);\r\n $stockTextInfoIcon.css('color', newData.StockColor);\r\n $stockTextInfoIcon.show();\r\n } else {\r\n supplierOrderInfoTooltip.visible = false;\r\n $stockTextInfoIcon.hide();\r\n }\r\n } else {\r\n console.warn('Supplier order info element not found.');\r\n }\r\n } else {\r\n console.warn('Supplier order info tooltip element not found.');\r\n }\r\n\r\n }\r\n\r\n function _updateHistory(variantProductDetails) {\r\n if (root.history && typeof (root.history.pushState) !== 'undefined') {\r\n var urlParts = location.href.split('#', 2);\r\n var resultUrl = variantProductDetails.IsMainProd ? $.removeQueryStringParam(urlParts[0], 'dpid') : $.setQueryStringParam(urlParts[0], 'dpid', variantProductDetails.ProductID);\r\n resultUrl = urlParts.length === 1 ? resultUrl : resultUrl + '#' + urlParts[1];\r\n\r\n if (resultUrl !== location.href) {\r\n variantsState.selectedVariantProd = variantProduct;\r\n root.history.pushState(variantsState, null, resultUrl);\r\n }\r\n }\r\n }\r\n }\r\n\r\n function _selectVariantControllersValues(variants) {\r\n _.each(variantControllers, function (x) {\r\n var preselectVariantTypeValue = _.find(x.variantType.variants, function (y) { return _.indexOf(variants, y.id) !== -1; });\r\n if (preselectVariantTypeValue && preselectVariantTypeValue.id > 0) {\r\n x.selectedValue = preselectVariantTypeValue.id;\r\n x.selector.setSelected(preselectVariantTypeValue.id);\r\n } else {\r\n say.error('Variant type \"' + x.variantType.name + '\" has no corresponding variant value for the shown variant product. Please check variants configuration for the product.');\r\n }\r\n });\r\n }\r\n\r\n function _onHistoryPopState(evt) {\r\n var state = evt.originalEvent.state;\r\n if (state && state.controlId === product.uniqueId) {\r\n variantsState = state;\r\n suppressVariantChangedEvent = true;\r\n\r\n if (state.selectedVariantProd) {\r\n _selectVariantControllersValues(state.selectedVariantProd.variants);\r\n } else {\r\n _.each(variantControllers, function (x) {\r\n x.selectedValue = 0;\r\n x.selector.setSelected(0);\r\n });\r\n }\r\n\r\n suppressVariantChangedEvent = false;\r\n _loadVariantProductDetails(variantsState.selectedVariantProd);\r\n _filterUnavailableVariants();\r\n }\r\n }\r\n\r\n function _getVariantControllerById(variantTypeId) {\r\n return variantControllers['vt' + variantTypeId];\r\n }\r\n\r\n function _getVariantControllerByTypeName(variantTypeName) {\r\n var foundController = _.find(variantControllers, function (controller) {\r\n return utils.caseInsensetiveEquals(controller.variantType.name, variantTypeName);\r\n });\r\n\r\n return foundController;\r\n }\r\n\r\n function _selectVariantByName(variantTypeName, variantValueName) {\r\n if (variantTypeName && variantValueName) {\r\n var variantController = _getVariantControllerByTypeName(variantTypeName);\r\n if (variantController) {\r\n variantController.selector.setSelectedByName(variantValueName);\r\n }\r\n }\r\n }\r\n\r\n return {\r\n init: function () {\r\n $declaredVariantSelectors.each(function () {\r\n var $selector = $(this);\r\n\r\n var viewBuilderName = $selector.data('viewbuilder') || '';\r\n var viewBuilder = root.variantViewBuilders ? root.variantViewBuilders[viewBuilderName] : null;\r\n if (typeof viewBuilder === 'function') {\r\n var variantTypeId = $selector.data('varianttypeid');\r\n\r\n var variantType = _.find(product.variantTypes, function (x) { return x.id === variantTypeId; });\r\n if (variantType) {\r\n var variantSelector = new viewBuilder($selector, variantType, metadata, product);\r\n var key = 'vt' + variantTypeId;\r\n var variantController = {\r\n variantType: variantType,\r\n selectedValue: 0,\r\n selector: variantSelector,\r\n $elem: $selector\r\n };\r\n\r\n variantControllers[key] = variantController;\r\n }\r\n } else {\r\n say.error('Unknown variant selector type: ' + viewBuilderName);\r\n }\r\n });\r\n\r\n $declaredVariantSelectors.on('variantselector:changed', function (evt, changedVariantType, newVariantValue) {\r\n if (!suppressVariantChangedEvent) {\r\n _onVariantSelectionChanged(changedVariantType, newVariantValue);\r\n\r\n // If the single available variant is changing itself, then it is nothing to filter.\r\n if (_.keys(variantControllers).length > 1) {\r\n _filterUnavailableVariants();\r\n }\r\n }\r\n });\r\n\r\n _filterUnavailableVariants(); // Initial filtering of variants that have no available products at all\r\n\r\n var initialVariantProduct = _.find(product.variantProducts, function (x) { return x.productId === product.productId; });\r\n if (initialVariantProduct) {\r\n variantsState.selectedVariantProd = initialVariantProduct;\r\n // Pre-select if variant product is shown initially\r\n suppressVariantProductDetailsLoading = true; // Suppress variant product loading while preselecting variants for already loaded variant products\r\n\r\n _selectVariantControllersValues(initialVariantProduct.variants);\r\n\r\n isVariantProductShown = true;\r\n\r\n suppressVariantProductDetailsLoading = false; // Restore variant product loading on variants change\r\n } else if (!_.isEmpty(preselectedVariants)) {\r\n _.each(preselectedVariants, function (preselectedVariantValue, preselectedVariantType) { _selectVariantByName(preselectedVariantType, preselectedVariantValue); });\r\n }\r\n\r\n if (enableHistoryState === true) {\r\n if (root.history && typeof (root.history.replaceState) !== 'undefined') {\r\n root.history.replaceState(variantsState, null, null);\r\n }\r\n\r\n $(root).on('popstate', _onHistoryPopState);\r\n }\r\n },\r\n getNotSelectedVariants: function () {\r\n var notSelectedVariantControllers = _.filter(variantControllers, function (x) { return !(x.selectedValue > 0); });\r\n\r\n return notSelectedVariantControllers;\r\n },\r\n selectVariantByName: _selectVariantByName,\r\n $selectors: $declaredVariantSelectors\r\n };\r\n }\r\n\r\n // Variant view builders\r\n (function (pubsub) {\r\n if (typeof root.variantViewBuilders === 'undefined') {\r\n root.variantViewBuilders = {};\r\n }\r\n root.variantViewBuilders['dropdownvariant'] = function ($container, variantTypeInfo, metadata, product) {\r\n var viewHtml = _buildViewHtml();\r\n var $dropDownContainer = $(viewHtml);\r\n var $dropDown = $dropDownContainer.find('select');\r\n\r\n $dropDown.on('change', function (evt) {\r\n var newVariantValue = parseInt(evt.target.value) || 0;\r\n\r\n _triggerSelectorChangedEvent(newVariantValue);\r\n });\r\n\r\n $container.append($dropDownContainer);\r\n\r\n return {\r\n setSelected: _setSelected,\r\n setSelectedByName: _setSelectedByName,\r\n getSelected: _getSelected,\r\n filterVariants: function (unavailableVariants, preselectSingleAvailable) {\r\n var $singleAvailableOption;\r\n\r\n var $options = $dropDown.find('option');\r\n $options.each(function () {\r\n var $option = $(this);\r\n var variantId = $option.val();\r\n if (variantId <= 0) {\r\n return; // Default option\r\n }\r\n\r\n var cleanOptionName = $option.data('cleanname');\r\n if (typeof (cleanOptionName) === 'undefined') {\r\n cleanOptionName = $option.text();\r\n\r\n $option.data('cleanname', cleanOptionName);\r\n }\r\n\r\n const unavailableVariant = unavailableVariants[variantId];\r\n if (unavailableVariant) {\r\n $option.text(cleanOptionName + ' (' + unavailableVariant.message + ')');\r\n $option.addClass('disabled');\r\n\r\n if (unavailableVariant.disabled) {\r\n $option.attr('disabled', 'disabled');\r\n }\r\n } else {\r\n $option.text(cleanOptionName);\r\n\r\n $option.removeClass('disabled');\r\n $option.removeAttr('disabled');\r\n\r\n $singleAvailableOption = typeof ($singleAvailableOption) === 'undefined' ? $option : null;\r\n }\r\n });\r\n\r\n if ($singleAvailableOption && preselectSingleAvailable) {\r\n _setSelected($singleAvailableOption.val());\r\n\r\n if ($options.length === 2 && $dropDown.is(':visible')) {\r\n $dropDown.parent().prepend('' + $singleAvailableOption.text() + '');\r\n $dropDown.css('display', 'none');\r\n }\r\n }\r\n }\r\n };\r\n\r\n function _buildViewHtml() {\r\n var templateContent = '
';\r\n var templateData = {\r\n id: new Date().valueOf() + '_vt' + variantTypeInfo.id,\r\n variantTypeName: variantTypeInfo.name,\r\n variants: _sortVariants($container, variantTypeInfo.variants, product),\r\n labels: { select: metadata['selectVariantPrefix'] }\r\n };\r\n\r\n var beforeVariantRenderEvent = $.Event('variantselector:beforevariantrender');\r\n $container.trigger(beforeVariantRenderEvent, [templateData, 'dropdownvariant']);\r\n\r\n return _.template(templateContent, templateData);\r\n }\r\n\r\n function _setSelected(variantId) {\r\n var newVariantValue = parseInt(variantId) || 0;\r\n var currentVariantValue = _getSelected();\r\n var isVariantAlreadySelected = newVariantValue === currentVariantValue;\r\n\r\n if (!isVariantAlreadySelected) {\r\n $dropDown.val(newVariantValue);\r\n\r\n _triggerSelectorChangedEvent(newVariantValue);\r\n }\r\n }\r\n\r\n function _setSelectedByName(variantValueName) {\r\n if (variantValueName) {\r\n var utils = new util();\r\n var foundVariantValue = _.find(variantTypeInfo.variants, function (currentVariant) {\r\n return utils.caseInsensetiveEquals(currentVariant.name, variantValueName);\r\n });\r\n\r\n if (foundVariantValue) {\r\n _setSelected(foundVariantValue.id);\r\n }\r\n }\r\n }\r\n\r\n function _getSelected() {\r\n return parseInt($dropDown.val() || 0);\r\n }\r\n\r\n function _isSelectedAvailable() {\r\n var $selected = $dropDown.find('option:selected');\r\n\r\n // Default option (or unselected state) should be marked as available. Otherwise, unavailable variants filtering will not happen on deselection.\r\n return $selected.length === 0 || $selected.is(':not(.disabled)');\r\n }\r\n\r\n function _triggerSelectorChangedEvent(newVariantValue) {\r\n var isSelectedOptionAvailable = _isSelectedAvailable();\r\n $container.trigger('variantselector:changed', [variantTypeInfo, newVariantValue, isSelectedOptionAvailable]);\r\n }\r\n };\r\n\r\n root.variantViewBuilders['tilesvariant'] = function ($container, variantTypeInfo, metadata, product) {\r\n var templateContent = '<\\% _.each(columns, function(column) { %> | <\\%= column %> | <\\% }); %>
---|---|
<\\%= prod.title %> | <\\% _.each(columns, function(column) { %><\\%= prod.extDataMap[column] ? prod.extDataMap[column].quantityInRelation : \\'-\\' %> | <\\% }); %>