if (typeof PEPPER !== 'object') { var PEPPER = {} } (function(namespace){ var disabledClass = 'pepper-disabled'; var hideClass = 'pepper-hide'; var popUpInfoIdentifier = '#btnPopupPepper'; var plusBtnClass = 'pepper-plus-btn'; var minusBtnClass = 'pepper-minus-btn'; var defaultBackground = ''; var defaultButtonColor = 'green'; var defaultBackgroundButtonColor = 'light'; var stdWidget = '
Simula tus pagos
$dom_lbl_payment$€/mes en

$dom_lbl_term$

cuotas
'; var dvnWidget = '
Paga en

$dom_lbl_term$

cuotas de

$dom_lbl_payment$€

'; var noWidget = '
Date un capricho
Tus compras de $min_amount$€ a $max_amount$€ financiadas con Pepper.
'; var pepperModal = '
'; function isPepperWidgetEnabled(section, widget) { return section.enabled && widget.enabled; } function createCustomConfigObj(section, amount, term, mode, widgetInfo, parent, term_dvn) { var customConfig = { config: section, amount: amount, term: term, mode: mode, widgetInfo: widgetInfo, parent: parent.firstChild, term_dvn: term_dvn } return customConfig; } function createProductObserver(amountFunction, sFrame, printAmountWidget, qtyElem, execNow){ var amount = amountFunction(); function cambiar(){ var newAmount = amountFunction(); if (amount != newAmount && newAmount >= 0){ disconnect(); printAmountWidget(); connect(sFrame); amount = newAmount; } } var vTimeOut; var observer = new MutationObserver(function(mutation) { clearTimeout(vTimeOut); cambiar(); }); function disconnect(){ observer.disconnect(); } function connect(sFrame){ var config = { childList: true, subtree: true, characterData: true }; var elmFrame = findPepperElement(sFrame, null); if (elmFrame) observer.observe(elmFrame, config); } if (execNow) { printAmountWidget(); } connect(sFrame); if (findPepperElement(qtyElem, null) && findPepperElement(qtyElem, null).tagName && findPepperElement(qtyElem, null).type) { if (findPepperElement(qtyElem, null).tagName.toLowerCase() == "input" && (findPepperElement(qtyElem, null).type.toLowerCase() == 'text' || findPepperElement(qtyElem, null).type.toLowerCase() == 'number')) { findPepperElement(qtyElem, null).addEventListener('change', function (){ vTimeOut = setTimeout(function(){cambiar();}, 100); }); } } } function createListObserver(sFrame, sWidget, printListWidget, execNow){ var observer = new MutationObserver(function(mutation) { disconnect(); var lElem = findAllPepperElements(sWidget, findPepperElement(sFrame, null)); Array.prototype.forEach.call(lElem, printListWidget); connect(sFrame); }); function disconnect(){ observer.disconnect(); } function connect(sFrame){ var config = { childList: true, subtree: true }; var elmFrame = findPepperElement(sFrame, null); if (elmFrame) observer.observe(elmFrame, config); } if (execNow) { var lElem = findAllPepperElements(sWidget, findPepperElement(sFrame, null)); Array.prototype.forEach.call(lElem, printListWidget); } connect(sFrame); } function createCheckoutObserver(section, printCheckOutWidget, execNow){ var observer = new MutationObserver(function(mutation) { disconnect(); printCheckOutWidget(); connect(section.dom); }); function disconnect(){ observer.disconnect(); } function connect(sFrame){ var config = { childList: true, subtree: true, attributes: true }; var elmFrame = findPepperElement(sFrame, null); if (elmFrame) observer.observe(elmFrame, config); } if (execNow) { printCheckOutWidget(); } connect(section.dom); } function findPepperElement(what, where) { var doc = document; if (where !== null) doc = where; var selected = null; if (what) { var whats = what.split(','); for(var i = 0; i < whats.length; i++){ if (doc.querySelector(whats[i])){ selected = doc.querySelector(whats[i]); break; } } } return selected; } function findAllPepperElements(what, where) { if (where !== null) return where.querySelectorAll(what); else return document.querySelectorAll(what); } //Apoyo para trabajo con clases en IE: function hasClassPepper (ele, cls) { return ele.getAttribute('class').indexOf(cls) > -1; } function addClassPepper(ele, cls) { if (ele.classList) { ele.classList.add(cls); } else if (!hasClassPepper(ele, cls)) { ele.setAttribute('class', ele.getAttribute('class') + ' ' + cls); } } function removeClassPepper(ele, cls) { if (ele.classList) { ele.classList.remove(cls); } else if (hasClassPepper(ele, cls)) { ele.setAttribute('class', ele.getAttribute('class').replace(cls, ' ')); } } //Apoyo para trabajo sessionStorage function setSessionStoragePepper(key, value) { if(typeof(Storage) !== "undefined") { sessionStorage.setItem(key, value); } } function getSessionStoragePepper (key) { if(typeof(Storage) !== "undefined") { return sessionStorage.getItem(key); } else { return null; } } //Apoyo para DOM function creaDOMElementPepper(HTML){ return document.createRange().createContextualFragment(HTML); } //Apoyo en cantidades function parseAmountPepper(amount) { var splitAmount = getInnerTextNumberPepper(amount, "0").replace(/[^0-9.,]+/gm, '').split(','); var finalAmount = null; if (splitAmount[splitAmount.length - 1].indexOf('.') > -1) { var decimalAmount = splitAmount[splitAmount.length - 1].split('.'); splitAmount[splitAmount.length - 1] = decimalAmount[0]; finalAmount = splitAmount.join(''); if (decimalAmount.length === 2 && decimalAmount[decimalAmount.length -1].length === 3) { finalAmount = decimalAmount.join('') } else if (decimalAmount.length === 2) { finalAmount += '.' + decimalAmount[1]; } } else { finalAmount = splitAmount[0].replace('.', '') + '.' + splitAmount[1]; } return parseFloat(finalAmount); } function parseQtyPepper(qty) { return parseInt(getInnerTextNumberPepper(qty, 1)); } function getInnerTextNumberPepper(elem, defaultValue){ var result = defaultValue; if (elem!==null){ try { if (elem.value){ result = elem.value; } else if (elem.innerText){ result = elem.innerText } else { result = defaultValue; } } catch (err) { result = defaultValue; } } return result; } //apoyo en cookies function addTermCookiePepper(term, transactionId, cookieName, term_dvn) { if (getCookiePepper(cookieName)) { setCookiePepper(cookieName, null); } setCookiePepper( cookieName, JSON.stringify({ term: term, transactionId: transactionId, term_dvn: term_dvn }) ); } function getCookiePepper (cname) { var name = cname + "="; var cArr = window.document.cookie.split(';'); for (var i = 0; i < cArr.length; i++) { var c = cArr[i].trim(); if (c.indexOf(name) == 0) return c.substring(name.length, c.length); } return false; } function setCookiePepper (cookieName, value) { var expireDate = new Date(1983,6,22); document.cookie = [ encodeURIComponent(cookieName), '=', encodeURIComponent(value), '; path=/', (value === null || value === undefined) ? '; expires=' + expireDate.toUTCString() : '' ].join(''); } namespace.widgets = { config: null, cookieName: 'pepper_config', calculator: null, pepperScript: null, termCookieName: 'term_selected', domain: null, publicKey: null, apiKey: null, init: function (config, domain, publicKey, apiKey, currency) { this.config = config; this.calculator = JSON.stringify({ 'calculator': {'commercial_offers' : config.commercial_offers, 'eco_texts': this.getEcoTexts(config.widget_texts)}, 'domain' : domain, 'publicKey' : publicKey, 'apiKey' : apiKey, 'currency' : currency }); this.pepperScript = new pepper(this.calculator); try { if (this.isProductPage()){ this.initProductPage(); } if (this.isCatalogPage()){ this.initCatalogPage(); } if (this.isCheckoutPage()){ this.initCheckoutPage(); } var elem = creaDOMElementPepper(pepperModal); this.printWidget(findPepperElement('body', null), elem.firstChild, 'in'); } catch (err) { throw err; } window.addEventListener("message", (event) => {if (event.data == "close widget pepperiframe") this.destroyModalIframeIfExists();}); }, isCatalogPage: function() { return this.isPage('catalog'); }, isProductPage: function() { return this.isPage('product'); }, isCheckoutPage: function() { return this.isPage('checkout'); }, isPage: function (sectionName){ var section = this.findSection(sectionName)[0]; if (section === null || section === undefined){ return false; } return (findPepperElement(section.dom_page_identification, null)) ? true : false; }, initCatalogPage: function (){ var that = this; var section = this.findSection('catalog')[0]; function onChangeList (elem) { function getAmount(elem){ return parseAmountPepper(findPepperElement(section.dom_var_price, elem)); } var amount = getAmount(elem); for(var i = 0; i < section.widgets.length;i++) { var widgetInfo = section.widgets[i]; that.destroyWidgetIfExists(elem, widgetInfo.type); if (that.pepperScript.availableFinance(amount, '*') && isPepperWidgetEnabled(section, widgetInfo)) { that.printListWidget(section, amount, elem, widgetInfo); } } } createListObserver(section.dom, section.dom_list_item, onChangeList, true); }, initProductPage: function (){ var that = this; var section = this.findSection('product')[0]; function getAmount(){ return parseAmountPepper(findPepperElement(section.dom_var_price, null)) * parseQtyPepper(findPepperElement(section.dom_qty, null)); } function shouldPrintAmountWidget(amount, type) { return that.pepperScript.availableFinance(amount, type); } function onChangePrice () { var amount = getAmount(); for(var i = 0; i < section.widgets.length; i++) { var widgetInfo = section.widgets[i]; that.destroyWidgetIfExists(null, widgetInfo.type); var enabled = true; if (typeof pepper_calc_max_amount == 'number' && typeof pepper_calc_min_amount == 'number') { if (pepper_calc_max_amount > 0 && pepper_calc_min_amount > 0) { enabled = (amount >= pepper_calc_min_amount && amount <= pepper_calc_max_amount); } } if (enabled) { if (shouldPrintAmountWidget(amount, widgetInfo.type) && isPepperWidgetEnabled(section, widgetInfo)) { that.printProductWidget(section, amount, 'parcial', widgetInfo); } else { if (isPepperWidgetEnabled(section, widgetInfo)) that.printNoWidget(section, widgetInfo); } } } } createProductObserver(getAmount, section.dom, onChangePrice, section.dom_qty, true); }, initCheckoutPage: function (){ var that = this; var section = this.findSection('checkout')[0]; setSessionStoragePepper('mostrarWidget', 0); function getAmount(){ var price = 0; if (findPepperElement(section.dom_var_price, null)) price = parseAmountPepper(findPepperElement(section.dom_var_price, null)); else if (typeof quoteBaseGrandTotal !== 'undefined') price = quoteBaseGrandTotal; return price; } function onChangePrice () { for(var i = 0; i < section.widgets.length; i++) { var widgetInfo = section.widgets[i]; if (that.exitsPayment(widgetInfo, null)){ var amount = getAmount(); that.destroyWidgetIfExists(null, widgetInfo.type); if (!that.pepperScript.availableFinance(amount, widgetInfo.type) || !isPepperWidgetEnabled(section, widgetInfo)) { that.destroyPayment(widgetInfo, null, section); } else { that.printPayment(widgetInfo, null); if (widgetInfo.dom_widget !== null && that.selectedPayment(section, widgetInfo) && isPepperWidgetEnabled(section, widgetInfo)){ that.printProductWidget(section, amount, 'api', widgetInfo); } } } } } createCheckoutObserver(section, onChangePrice, true); }, printWidget: function (elmt, DOMContent, position) { if (elmt!== null && elmt!== undefined) { switch (position) { case "before": elmt.insertAdjacentElement('beforebegin', DOMContent); break; case "after": elmt.insertAdjacentElement('afterend', DOMContent); break; default: elmt.appendChild(DOMContent); break; } } }, printProductWidget: function (section, amount, mode, widgetInfo){ var newContent = null; var term = null; var term_dvn = 0; var data_dvn = this.getFinancialInfo(amount, null, mode, 'DVN'); if (data_dvn.payment && data_dvn.term > 0) { term_dvn = data_dvn.term; } if (sessionStorage.getItem(this.termCookieName) !== null && widgetInfo.type !== 'DVN') { term = parseInt(sessionStorage.getItem(this.termCookieName)); } try { var data = this.getFinancialInfo(amount, term, mode, widgetInfo.type); if (data.payment && data.term > 0) { newContent = this.updateInitialContent(widgetInfo.content, data, section, widgetInfo.background_color, widgetInfo.buttons_color, widgetInfo.background_buttons_color); term = data.term; if (section.section == 'checkout' || section.section == 'paymenthelper') { addTermCookiePepper(data.term, this.config.transaction_id, 'send_pepper_info', term_dvn); } } var widget = this.addProductFunctionalities(newContent, section, amount, term, mode, widgetInfo, data, term_dvn); this.printWidget(findPepperElement(widgetInfo.dom_widget, null), widget.firstChild, widgetInfo.position); } catch (err) { throw err; } }, printNoWidget: function (section, widgetInfo){ try{ var data = this.getMaxMinAmount(); var newContent = this.updateNoWidgetContent(noWidget, data, widgetInfo.type, widgetInfo.background_color); var widget = this.addNoWidgetFunctionalities(newContent); this.printWidget(findPepperElement(widgetInfo.dom_widget, null), widget.firstChild, widgetInfo.position); } catch (err) { throw err; } }, printListWidget: function (section, amount, elem, widgetInfo){ var term = null; try { var data = this.getFinancialInfo(amount, null, 'parcial', '*'); if (data.payment && data.term > 0) { newContent = this.updateInitialContent(widgetInfo.content, data, section, null, null, null); term = data.term; } } catch (err) { throw err; } var widget = this.addListFunctionalities(newContent, section, amount, term, widgetInfo); this.printWidget(findPepperElement(widgetInfo.dom_widget, elem), widget.firstChild, widgetInfo.position); }, destroyWidgetIfExists: function (elem, type){ if (this.exitsWidget(elem, type)) { var widget = findPepperElement(`*[data-pepper-widget='${type}']`, elem); widget.parentElement.removeChild(widget); } }, destroyModalIframeIfExists: function (){ var iframe = findPepperElement('#pepperModalIframe', null); if (iframe) { addClassPepper(iframe, hideClass); } }, exitsWidget: function (elem, type){ var widget = findPepperElement(`*[data-pepper-widget='${type}']`, elem); return (widget!==null); }, destroyPayment: function (info, elem, section){ var payment = findPepperElement(info.dom_payment, elem); if (payment!==null){ this.uncheckPayment(section, info); addClassPepper(payment, hideClass); } }, printPayment: function (info, elem){ var payment = findPepperElement(info.dom_payment, elem); if (payment!==null) removeClassPepper(payment, hideClass); }, exitsPayment: function (info, elem){ var payment = findPepperElement(info.dom_payment, elem); return (payment!==null); }, updateDomContent: function (config, data, widgetElmt) { var dom_lbl_payment = findPepperElement('#lblPaymentPepper', widgetElmt); var dom_btn_dec = findPepperElement('#btnDecPepper', widgetElmt); var dom_btn_inc = findPepperElement('#btnIncPepper', widgetElmt); var dom_lbl_term = findPepperElement('#lblTermPepper', widgetElmt); if(!!dom_lbl_payment) dom_lbl_payment.innerHTML = data.payment; if(!!dom_lbl_term) dom_lbl_term.innerHTML = data.term; if (data.btnDecreaseTermEnabled) { removeClassPepper(dom_btn_dec, disabledClass) } else { addClassPepper(dom_btn_dec, disabledClass); } if (data.btnIncreaseTermEnabled) { removeClassPepper(dom_btn_inc, disabledClass); } else { addClassPepper(dom_btn_inc, disabledClass); } }, updateInitialContent: function (content, data, config, backgroundColor, buttonColor, backgroundButtonColor) { function keysFunction(key, value) { if (content.indexOf(key) >= 0) { content = content.replace(key, data[value[key]]); } } var labelsToFind = {'$dom_lbl_payment$': 'payment', '$dom_lbl_term$': 'term'}; for (var i = 0; i= 0) { content = content.replace(key, data[value[key]]); } } var labelsToFind = {'$min_amount$': 'minAmount', '$max_amount$': 'maxAmount'}; for (var i = 0; i'}; if (parentRef) { var data = this.getFinancialInfo(parentRef.amount, parentRef.term, 'total', parentRef.widgetInfo.type); message.information = data.Information; } var win = document.getElementById("pepperWidgetIframe").contentWindow; win.postMessage(JSON.stringify(message), '*'); var element = document.getElementById("pepperModalIframe"); removeClassPepper(element, hideClass); element.scrollIntoView({behavior: "smooth"}); }, getFinancialInfo: function (amount, term, type, widgetType) { try { return data = this.pepperScript.getCommercialOfferTerm(amount, term, type, widgetType); } catch (err) { var error = {}; error['error'] = []; for (var i = 0; i 0) { term_dvn = data_dvn.term; } if (type == 'DVN') newContent = dvnContent; else newContent = stdContent; var data = this.getFinancialInfo(amount, term, mode, type); if (data.payment && data.term > 0) { newContent = this.updateInitialContent(newContent, data, null, defaultBackground, defaultButtonColor, defaultBackgroundButtonColor); term = data.term; addTermCookiePepper(data.term, this.config.transaction_id, 'send_pepper_info', term_dvn); var widget = this.addProductFunctionalities(newContent, 'default', amount, term, mode, '', data, term_dvn); this.printWidget(findPepperElement(where, null), widget.firstChild, position); } else { var data = this.getMaxMinAmount(); var newContent = this.updateNoWidgetContent(noWidget, data, (type) ? type : 'STD', defaultBackground); var widget = this.addNoWidgetFunctionalities(newContent); this.printWidget(findPepperElement(where, null), widget.firstChild, position); } } catch (err) { throw err; } } }; })(PEPPER);