Wrzucenie kodu do miejmy nadzieje dobrego folderu
This commit is contained in:
157
sklad/4init.js
Normal file
157
sklad/4init.js
Normal file
@@ -0,0 +1,157 @@
|
||||
////////////////////////////////////////////////////
|
||||
// INIT
|
||||
|
||||
// brutto/netto
|
||||
const idmPriceType = app_shop?.vars?.priceType || "gross";
|
||||
|
||||
|
||||
// Zmienna trzymająca dane o ustawieniach customowych ramek rekomendacji na całym sklepie
|
||||
/**
|
||||
* Obiekt konfiguracyjny ogólnych ustawień hotspotów rekomendacji.
|
||||
*
|
||||
* @typedef {object} idmGeneralHotspotObjData
|
||||
* @property {object} options - Główne ustawienia hotspotów
|
||||
* @property {boolean} options.lazy - Czy wczytywać zawartość w trybie lazy (required).
|
||||
* @property {boolean|string} options.addToBasket - Zachowanie przy dodawaniu do koszyka:
|
||||
* - true = przycisk dodaj do koszyka
|
||||
* - false = brak przycisku
|
||||
* - "range" = dodaj z wyborem zakresu (required).
|
||||
* @property {boolean|object} options.swiper - Ustawienia slidera:
|
||||
* - true/false = włącz/wyłącz
|
||||
* - object = konfiguracja instancji Swiper (required jeśli obiekt).
|
||||
*/
|
||||
const idmGeneralHotspotObjData = {
|
||||
options: {
|
||||
lazy: true,
|
||||
addToBasket: true, // true, false, "range"
|
||||
swiper: { // true, false, obiekt z opcjami swipera
|
||||
loop: false,
|
||||
autoHeight: false,
|
||||
spaceBetween: 16,
|
||||
slidesPerView: 1.4,
|
||||
centeredSlides: true,
|
||||
centeredSlidesBounds: true,
|
||||
breakpoints: {
|
||||
550: {
|
||||
slidesPerView: 3,
|
||||
centeredSlides: true,
|
||||
centeredSlidesBounds: true,
|
||||
},
|
||||
979: {
|
||||
slidesPerView: 4,
|
||||
centeredSlides: false,
|
||||
},
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// Funkcja inicjalizująca wybranego hotspota(addtobasket range - swiper)
|
||||
async function idmHotspotInit(id, options={}){
|
||||
try{
|
||||
const hotspotEl = document.getElementById(id);
|
||||
if(!hotspotEl) throw new Error("Nie znaleziono elementu");
|
||||
|
||||
// add to basket + -
|
||||
if(options?.addToBasket === "range" ||
|
||||
typeof options?.addToBasket === "undefined" && typeof idmGeneralHotspotObjData === "object" && idmGeneralHotspotObjData?.options?.addToBasket === "range"){
|
||||
|
||||
// obsługa i sprawdzanie clicków
|
||||
// hotspotEl.addEventListener("click", e=>{
|
||||
// const wrapper = e.target.closest(".idm-products-banner__qty");
|
||||
// if (!wrapper) return;
|
||||
|
||||
// if(e.target.classList.contains("idm-products-banner__qty-input")) return e.target.select();
|
||||
|
||||
// const input = wrapper.querySelector(".idm-products-banner__qty-input");
|
||||
// const step = parseFloat(wrapper.dataset.sellBy || "1");
|
||||
// const precision = parseInt(wrapper.dataset.precision || "0");
|
||||
// const max = parseFloat(wrapper.dataset.max || "999999");
|
||||
// let current = parseFloat(input.value) || 0;
|
||||
|
||||
// if (e.target.classList.contains("idm-products-banner__qty-increase")) {
|
||||
// current += step;
|
||||
// if (current > max){
|
||||
// current = max;
|
||||
// rangeMaxAlert(max)
|
||||
// }
|
||||
// } else if (e.target.classList.contains("idm-products-banner__qty-decrease")) {
|
||||
// current -= step;
|
||||
// if (current < step){
|
||||
// current = step;
|
||||
// rangeMinAlert(step)
|
||||
// }
|
||||
// }
|
||||
// input.value = current.toFixed(precision);
|
||||
// });
|
||||
// sprawdzanie na input
|
||||
// hotspotEl.querySelectorAll(".idm-products-banner__qty-input").forEach(inp=>{
|
||||
// inp.addEventListener("input", e=>{
|
||||
// if(e.target.value > +e.target.max){
|
||||
// rangeMaxAlert(e.target.max)
|
||||
// e.target.value = +e.target.max
|
||||
// }
|
||||
// if(e.target.value < +e.target.min){
|
||||
// rangeMinAlert(e.target.min)
|
||||
// e.target.value = +e.target.min;
|
||||
// }
|
||||
// });
|
||||
// })
|
||||
|
||||
}
|
||||
|
||||
// swiper || slick
|
||||
if(options?.swiper ||
|
||||
typeof options?.swiper === "undefined" && typeof idmGeneralHotspotObjData === "object" && idmGeneralHotspotObjData?.options?.swiper){
|
||||
|
||||
|
||||
// Opcje swipera
|
||||
let swiperOptions = typeof options.swiper === "object" ? options.swiper : "";
|
||||
if(typeof options.swiper === "object") swiperOptions = options.swiper;
|
||||
else if(typeof idmGeneralHotspotObjData === "object" && typeof idmGeneralHotspotObjData?.options?.swiper === "object"){
|
||||
swiperOptions = idmGeneralHotspotObjData?.options?.swiper;
|
||||
swiperOptions.navigation = {
|
||||
nextEl: `#${id} .idm-button-next`,
|
||||
prevEl: `#${id} .idm-button-prev`,
|
||||
}
|
||||
}else{
|
||||
swiperOptions = {
|
||||
loop: false,
|
||||
autoHeight: false,
|
||||
spaceBetween: 16,
|
||||
slidesPerView: 1.4,
|
||||
centeredSlides: true,
|
||||
centeredSlidesBounds: true,
|
||||
breakpoints: {
|
||||
550: {
|
||||
slidesPerView: 3,
|
||||
centeredSlides: true,
|
||||
centeredSlidesBounds: true,
|
||||
},
|
||||
979: {
|
||||
slidesPerView: 4,
|
||||
centeredSlides: false,
|
||||
},
|
||||
},
|
||||
navigation: {
|
||||
nextEl: `#${id} .idm-button-next`,
|
||||
prevEl: `#${id} .idm-button-prev`,
|
||||
},
|
||||
}
|
||||
}
|
||||
|
||||
// Wywołanie swipera
|
||||
const selectedSwiper = new HotspotSlider({
|
||||
selector: `#${id} .swiper`,
|
||||
hotspotName: `${id}`,
|
||||
options: swiperOptions,
|
||||
});
|
||||
await selectedSwiper.init();
|
||||
}
|
||||
}catch(err){
|
||||
console.error(idmHotspotTextObject["Wystąpił błąd z inicjalizacją. Proszę odśwież stronę"], err);
|
||||
}
|
||||
}
|
||||
|
||||
console.log("init")
|
||||
Reference in New Issue
Block a user