Posted on Leave a comment

Prodotti – Alphawax

=0 || bLang.indexOf(“en-us”)>=0) { console.log(“GB/US/CA browser locale detected. Switching to imperial units.”); language = “us”; } else { language = null; } } //Se query-params if(window.location.search) { let queryString = window.location.search.replace(“?”,”); if(queryString && queryString.length) { //Todo matchare valori su dizionario let queryRows = queryString.split(“&”); queryRows.map(param=> { if(param.indexOf(“category”)==0) { let splitted = param.split(“=”); if(splitted && splitted.length && splitted[1]) { // let found = categoryList.find(r=>r.id==splitted[1]); // app_params[“category”].push( found.text.toLowerCase() ); app_params[“category”].push( splitted[1] ); } } else if(param.indexOf(“application”)==0) { let splitted = param.split(“=”); if(splitted && splitted.length && splitted[1]) { // let found = applicationList.find(r=>r.id==splitted[1]); // app_params[“application”].push( found.text.toLowerCase() ); app_params[“application”].push( splitted[1] ); } } else if(param.indexOf(“lang”)==0) { let splitted = param.split(“=”); if(splitted && splitted.length && splitted[1]) { if( langList.indexOf(splitted[1])>=0 ) { //ToDo confronto con array language = splitted[1].toLowerCase() ; } } } else if(param.indexOf(“search”)==0) { let splitted = param.split(“=”); if(splitted && splitted.length && splitted[1]) { app_params[“search”] = splitted[1].toLowerCase(); } } }); } } console.log(“app_params”, app_params); //Init degli event handler per il selettore lingua initFilterDropdown(categoryList, applicationList, app_params); initLanguageSelector(language || app_params.lang); initSearchFilter(app_params.search); //Nasconde valori e traduce, al caricamento renderData(params, language || app_params.lang); //Filtra i prodotti filterProducts(app_params.application, app_params.category, language || app_params.lang, app_params.search); //Visualizza i prodotti showLoader(false); }); function showLoader(visibility) { if(visibility) { jQuery(“#productLoader”).show(); } else { console.log(“FINE LOAD”); jQuery(“#productLoader”).hide(); } } function updateAddressFilters(category, application, currentLanguage, search) { if (“undefined” !== typeof history.pushState) { const url = new URL(window.location); let queryParams = []; if(category && category.length && category.length>1) { queryParams.push( “category[]=”+category.join(“&category[]=”) ); } else if(category.length==1) { queryParams.push( “category=”+category[0] ); } let applicationParams = []; if(application && application.length && application.length>1) { queryParams.push( “application[]=”+application.join(“&application[]=”) ); } else if(application.length==1) { queryParams.push( “application=”+application[0] ); } //Se è stato passata una lingua, non vuota, nell’elenco lingue // if(currentLanguage && currentLanguage.length && currentLanguage.length>1 && langList.indexOf(currentLanguage)) { // if( currentLanguage != startingLanguage ) { // queryParams.push( “lang=”+currentLanguage ); // } // } //se ricerca attiva if(search && search.length && search.trim().length) { queryParams.push( “search=”+search ); } url.search = queryParams.join(“&”); window.history.pushState({}, document.title, url); } else { console.error(“Can’t change browser URL without reloading the page. Please update your ancient browser.”); } } function initFilterDropdown(categories, applications, app_params) { let categoryWrapperName = ‘#categoryFilterWrapper’; let categorySelect = jQuery(categoryWrapperName+’ select’); let applicationWrapperName = “#applicationFilterWrapper”; let applicationSelect = jQuery(applicationWrapperName+’ select’); categorySelect.select2({ // data: categories, dropdownParent: jQuery(categoryWrapperName), closeOnSelect: true, placeholder: “Select one or more categories”, // width: “100%” }); applicationSelect.select2({ // data: applications, dropdownParent: jQuery(applicationWrapperName), closeOnSelect: true, placeholder: “Select one or more applications”, // width: “100%” }); categorySelect.val(app_params.category).trigger(‘change.select2’); applicationSelect.val(app_params.application).trigger(‘change.select2’); categorySelect.on(‘change’, function (e) { let selection = jQuery(this).select2(‘data’); app_params.category = selection.map(x => x.id ); filterProducts(app_params.application, app_params.category, app_params.lang, app_params.search); }); applicationSelect.on(‘change’, function (e) { let selection = jQuery(this).select2(‘data’); app_params.application = selection.map(x => x.id ); filterProducts(app_params.application, app_params.category, app_params.lang, app_params.search); }); } /********** Handler dell’input di search ***********/ function initSearchFilter(search) { var _searchFieldSelector = “.sitesearch input”; var searchField = jQuery(_searchFieldSelector); searchField.val(search); if(search && search.trim().length) { showSearch(); } searchField.on(‘input’, function (e) { let searchString = searchField.val(); let newSearch = searchString.trim().toLowerCase(); if(newSearch != app_params.search) { app_params.search = newSearch; filterProducts(app_params.application, app_params.category, app_params.lang, newSearch); } }); jQuery(“#searchIconHide”).on(‘click’, function (e) { app_params.search = “”; filterProducts(app_params.application, app_params.category, app_params.lang, app_params.search); }); } /********** Handler del language selector ***********/ function initLanguageSelector(lang) { renderLanguageSelector(lang); //Mostra il menu al passaggio del mouse var langSelector = document.querySelector(“.languageSelector”); //Applica la lingua al click langSelector.querySelectorAll(“.flag-lang”).forEach(flag=> { flag.addEventListener(‘click’, e => { let classes = flag.className; let newLanguage = classes.substr( classes.indexOf(“flag-lang-“)+10, 2 ); console.log(“Scelta lingua: “, newLanguage); //Se la lingua impostata è diversa dall’attuale if(newLanguage != app_params.lang) { renderLanguageSelector(newLanguage); renderData(params, newLanguage); filterProducts(app_params.application, app_params.category, newLanguage, app_params.search); } }); }); } function renderLanguageSelector(lang) { //Nasconde tutte le lingue document.querySelectorAll(“.flag-lang”).forEach(flag=> { flag.classList.remove(“flag-lang-active”); }); //Mostra la lingua inizialmente selezionata document.querySelector(“.flag-lang-“+lang).style.display = ‘block’; document.querySelector(“.flag-lang-“+lang).classList.add(“flag-lang-active”); } function filterProducts(applicationFilters, categoryFilters, currentLanguage, search) { // Per debuggare usa: // document.querySelectorAll(“article .type-products”)[0].querySelectorAll(“.productApplications li span span span”) console.log(“Filtro per: “, {applicationFilters, categoryFilters, currentLanguage, search}); //Aggiorno la barra dell’indirizzo updateAddressFilters(categoryFilters, applicationFilters, currentLanguage, search); //Traduce usando il dizionario key:value (da slug a testo) //Trova l’oggetto con lo stesso id/slug applicationFilters = applicationFilters.map( filterId => applicationList.find(app=> app.id == filterId) ); categoryFilters = categoryFilters.map( filterId => categoryList.find(cat=> cat.id == filterId ) ); //Rimuovi gli elementi senza corrispondenza applicationFilters = applicationFilters.filter(x=> x && x.text); categoryFilters = categoryFilters.filter(x=> x && x.text); //rimuovo gli undefined //Conserva solo il testo/label applicationFilters = applicationFilters.map( filterObj => filterObj.text.toLowerCase() ); categoryFilters = categoryFilters.map( filterObj => filterObj.text.toLowerCase() ); console.log(“applicationFilters”, applicationFilters); console.log(“categoryFilters”, categoryFilters); let visibleCount = 0; document.querySelectorAll(“article.type-products”).forEach(product=> { let productApplications = product.querySelectorAll(“.productApplications li span span span”); let productCategories = product.querySelectorAll(“.productCategories li span span span”); let geoElement = product.querySelector(“.productGeoData span”); let productTitle = product.querySelector(“.productTitle”); let productDescription = product.querySelector(“.productDescription span”); let productHasSearchedApplication = true; //Se c’è un filtro sulle application if(applicationFilters.length>0) { //Per ogni categoria del prodotto productHasSearchedApplication = false; productApplications.forEach(application=> { //Normalizza application = application.innerText; application = application.trim().toLowerCase(); //controlla se l’application del prodotto è presente nell’array dei applicationFilters if(applicationFilters.indexOf(application)>=0) { productHasSearchedApplication = true; // break; } }); } let productHasSearchedCategory = true; //Se c’è un filtro sulle categories if(categoryFilters.length>0) { //Per ogni categoria del prodotto productHasSearchedCategory = false; productCategories.forEach(category=> { //Normalizza category = category.innerText; category = category.trim().toLowerCase(); //controlla se la category del prodotto è presente nell’array dei categoryFilters if(categoryFilters.indexOf(category)>=0) { productHasSearchedCategory = true; // break; } }); } let productIsInGeoCatalog = true; if(currentLanguage) { //get mercato di riferimento let geoValue = geoElement ? geoElement.innerText.trim().toLowerCase() : “”; let geoZones = geoValue ? geoValue.replaceAll(” “,””).split(“,”) : []; //Se il prodotto è presente nel geo-catalogo selezionato let catalogCheck = geoZones.indexOf(currentLanguage); if( ! (catalogCheck>=0) ) { productIsInGeoCatalog = false; } } let productMatchSearch = true; if(search) { productMatchSearch = false; let words = search.split(” “); words.forEach(word=>{ word = word.trim().toLowerCase(); if(word && word.length) { if(productTitle.innerText.toLowerCase().indexOf(word)>=0) { productMatchSearch = true; // break; } else if(productDescription.innerText.toLowerCase().indexOf(word)>=0) { productMatchSearch = true; // break; } } }) } //Filtro AND if(productHasSearchedApplication && productHasSearchedCategory && productIsInGeoCatalog && productMatchSearch) { product.style.display = “block”; visibleCount++; } else { product.style.display = “none”; } }); if(visibleCount<1) { jQuery("#noDataMessage").show(); } else { jQuery("#noDataMessage").hide(); } } /********** Nasconde valori nulli o nascosti ***********/ function renderData(params, lang) { console.log("renderData", params, lang); if(lang) { lang = lang.toLowerCase(); } else { return; } try { //Per ogni prodotto document.querySelectorAll("article.type-products").forEach(product=>{ //get cfg let cfgElement = product.querySelector(“.productConfigData span”); let cfgValue = cfgElement ? cfgElement.innerText.trim().toLowerCase() : “”; let cfg = cfgValue ? cfgValue.replaceAll(“#”,””).replaceAll(” “,””).split(“,”) : []; //Per ogni possibile parametro params.forEach(param => { //Se presente in cfg (=show) if(cfg.indexOf(param)>=0) { //get valore let paramElement = product.querySelector(“.”+param+”DataValue”); let paramValue = paramElement ? paramElement.innerText.trim().toLowerCase() : “”; //Se valore disponibile, mostra e traduci if(paramValue.indexOf(“not available”)<0) { showElement(product, "."+param+"DataValue", true); showElement(product, "."+param+"DataLabel", true); //Per i campi che possono contenere un range if( rangeParams.indexOf(param)>=0 ) { //Controlla se valore o range, contando quanti elementi contiene (3=valore, 4=range) let li = paramElement.querySelectorAll(“div ul li”); //Se è presente solo lo start del range if(li.length==3) { //nascondi il “-” del range showElement(li[1], null, false); //i18n tTemperatureValue( li[0], “span”, lang ); tTemperatureLabel( li[2], “span”, lang ); //Se sono presenti entrambi i valori } else if(li.length==4) { //i18n tTemperatureValue( li[0], “span”, lang ); tTemperatureValue( li[2], “span”, lang ); tTemperatureLabel( li[3], “span”, lang ); } //Per i campi della viscosità } else if( viscoParams.indexOf(param)>=0 ) { //Controlla se sono presenti entrambi i dati (temp/value) let li = paramElement.querySelectorAll(“div ul li”); //Se presenta temperatura e valore if(li.length==4) { //i18n tTemperatureValue( li[1], “span”, lang ); tTemperatureLabel( li[2], “span”, lang ); //Se presenta solo valore } else if(li.length==3) { //Nasconde la temperatura showElement(li[0], null, false); showElement(li[1], null, false); showElement(li[2], null, false); //Se qualcosa andasse storto } else { //Ri-Nasconde tutto showElement(product, “.”+param+”DataValue”, false); showElement(product, “.”+param+”DataLabel”, false); } } } } }); //Mostra/nasconde i pdf della lingua selezionata // showElement(product, “.downloadWrapper-eu”, (lang==’eu’) ); // showElement(product, “.downloadWrapper-us”, (lang==’us’) ); }); app_params.lang = lang; } catch (error) { location.reload(); } } /********** Traduce l’etichetta di temperatura ***********/ function tTemperatureLabel(parent, query, lang) { //Se la lingua da impostare è diversa dall’attuale if(app_params.lang!=lang) { let elem = parent.querySelector(query); elem.innerText = (lang==’eu’) ? “°C” : “°F”; } } /********** Traduce il valore della temperatura ***********/ function tTemperatureValue(parent, query, lang) { let elem = parent.querySelector(query); let value = elem? elem.innerText.trim().toLowerCase() :””; //Se la lingua da impostare è diversa dall’attuale if(app_params.lang!=lang && value) { //Il campo è Float let parsed = null; let newValue = null; parsed = Number.parseFloat(value); if(!Number.isNaN(parsed)){ newValue = (lang==’eu’) ? ((parsed – 32)*(5/9)) : ((parsed * 1.8)+32); newValue = Math.round(newValue*10)/10; } if(newValue) { newValue = elem.innerText = newValue; } } } /********** Helper per mostrare/nascondere elementi del DOM ***********/ function showElement(containerElement, querySelector, value) { let el = containerElement; if(querySelector) { el = containerElement.querySelector(querySelector); } if(el) { el.style.display = value ? ‘block’ : ‘none’; } } //})(); //Fine scoping function]]>

Source

Leave a Reply

Your email address will not be published.