FrontendComponents/hotspots
8
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Wylaczenie dodawania do ulubionych w modalu

Browse Source
This commit is contained in:
pawel.gaca
2025-12-12 12:17:52 +01:00
parent 03a0ab0029
commit 91a3cdcd06
4 changed files with 155 additions and 39 deletions
Download Patch File Download Diff File Expand all files Collapse all files

104
klasa.js
View File

@@ -464,7 +464,7 @@ class IdmHotspot{
addToCompare: false,
// WYBÓR
// selectSize: false,
selectSize: false,
selectVersion: false,
// SWIPER
@@ -512,16 +512,9 @@ class IdmHotspot{
this.handleShowSecondImage = this.handleShowSecondImage.bind(this);
this.handleHideSecondImage = this.handleHideSecondImage.bind(this);
this.handleSelectVersion = this.handleSelectVersion.bind(this);
this.handleSelectSize = this.handleSelectSize.bind(this);
this.init();
// WCZYTANIE PONOWNIE DLA KOSZYKA
if(typeof app_shop.fn?.basket?.reloadForm === "function" && this.hotspotEl.closest("#content")){
app_shop.run(()=>{
this.init();
}, "all", "#Basket", true)
}
}
@@ -632,7 +625,7 @@ class IdmHotspot{
// markup pojedynczego produktu
let singleMarkup = "";
singleMarkup += `
<div class="product hotspot__product swiper-slide d-flex flex-column ${prod.price.price[this.priceType].value === 0 ? "--phone" : ""}" data-id="${prod.id}">
<div class="product hotspot__product swiper-slide d-flex flex-column ${prod.price.price[this.priceType].value === 0 ? "--phone" : ""}" data-id="${prod.id}" data-type="${prod.type}">
${this.markupProductInnerHTML(prod)}
</div>`;
@@ -682,7 +675,7 @@ class IdmHotspot{
}
markupFavorite(prod){
if(!this.options?.addToFavorites || typeof this.addToFavFn !== "function") return "";
if(!this.options?.addToFavorites || typeof this.addToFavFn !== "function" || this.hotspotEl.closest(".modal")) return "";
return `<span
data-href="#add_favorite"
@@ -693,7 +686,7 @@ class IdmHotspot{
}
markupVersions(prod){
if(!this.options?.selectVersion || !prod.group?.versions || prod.group?.versions?.length === 1 ) return "";
if(!this.options?.selectVersion || !prod.group?.versions || prod.group?.versions?.length < 2 ) return "";
// let MAX_VERSION_AMOUNT = 5;
// if(app_shop.vars.view > 2){
@@ -855,8 +848,11 @@ class IdmHotspot{
let markup = "";
if(!this.options.addToBasket) return markup;
const prodTotalAmount = this.getProdTotalAmount(prod);
// link do produktu jak nie jest to zwykły produkt
if(prod.type !== "product" || prod.sizes[0].amount === 0) markup = `<a class="btn --solid --medium add_to_basket__link" href="${prod.href}">Zobacz produkt</a>`;
if(prod.type !== "product" || prodTotalAmount === 0) markup = `<a class="btn --solid --medium add_to_basket__link" href="${prod.href}">Zobacz produkt</a>`;
else if(this.options.addToBasket === "range") // +-
markup = `<form class="add_to_basket --range" action="/basketchange.php" type="post">
<input name="mode" type="hidden" value="1">
@@ -901,25 +897,32 @@ class IdmHotspot{
}
markupSize(prod){
return `<input name="size" type="hidden" value="${prod.sizes[0].id}">`;
// if(!this.options?.selectSize || prod.sizes.length === 1) return `<input name="size" type="hidden" value="${prod.sizes[0].id}">`;
// return `<input name="size" type="hidden" value="${prod.sizes[0].id}">`;
if(!this.options?.selectSize || prod.sizes.length === 1) return `<input name="size" type="hidden" value="${prod.sizes[0].id}">`;
// const sizesName = `${this.id}-${prod.id}`;
// return `
// <div class="product__select_sizes">
// ${prod.sizes.reduce((acc, val)=>{
// const inputId = `${sizesName}-${val.id}`;
const sizesName = `${this.id}-${prod.id}`;
// return acc + `
// <label class="product__size_select" for="${sizesName}">
// <input type="radio" name="${sizesName}" id="${sizesName}"/>
// <span>${val.name}</span>
// </label>
// `
// }, "")}
// </div>
// `;
let selectedDefault = false;
return `
<input name="size" type="hidden" value="${prod.sizes[0].id}">
<div class="product__select_sizes">
${prod.sizes.reduce((acc, val, index)=>{
const inputId = `${sizesName}-${val.id}`;
const isSelected = !selectedDefault && val?.amount !== 0 ? true : false;
if(isSelected) selectedDefault = true;
return acc + `
<label class="product__size_select" for="${inputId}">
<input type="radio" name="${sizesName}" id="${inputId}" ${isSelected ? "checked" : ""} ${val?.amount === 0 ? "disabled" : ""} data-value="${val.id}"/>
<span>${val.name}</span>
</label>
`
}, "")}
</div>
`;
}
markupHotspotContainer(){
@@ -973,6 +976,7 @@ class IdmHotspot{
return `
<div class="idm_hotspot__skeleton_product">
<div class="idm_hotspot__skeleton_img idm-loading"></div>
${this.options.showOpinions ? `<div class="idm_hotspot__skeleton_opinions idm-loading"></div>` : ""}
<div class="idm_hotspot__skeleton_name idm-loading"></div>
<div class="idm_hotspot__skeleton_price idm-loading"></div>
${this.options.addToBasket ? `<div class="idm_hotspot__skeleton_btn idm-loading"></div>` : ""}
@@ -1174,6 +1178,18 @@ class IdmHotspot{
this.reloadProduct(prodEl, closestVersion.dataset.productId);
}
handleSelectSize(e){
const inputEl = e.target.closest("input[type='radio']");
if(!inputEl) return;
const newValue = inputEl?.dataset?.value;
const hiddenSizeInputEl = e.target.closest("form.add_to_basket")?.querySelector("input[type='hidden'][name='size']");
if(!hiddenSizeInputEl || !newValue) return inputEl.checked = false;
hiddenSizeInputEl.value = newValue;
}
/**
* Lazy-load hotspotu – wczytuje dane dopiero, gdy element pojawi się w viewportcie.
*/
@@ -1289,6 +1305,10 @@ class IdmHotspot{
// FUNKCJE POMOCNICZE
// ========================================================
getProdTotalAmount(prod){
return prod.sizes.reduce((acc, val) => val === -1 || acc === -1 ? -1 : acc + val, 0);
}
/**
* Wyświetla alert o maksymalnej ilości produktu.
*/
@@ -1739,6 +1759,21 @@ class IdmHotspot{
}
}
afterInitOnce(){
if(this.initialized) return;
// WCZYTANIE PONOWNIE DLA KOSZYKA
if(typeof app_shop.fn?.basket?.reloadForm === "function" && this.hotspotEl.closest("#content")){
app_shop.run(()=>{
this.init();
console.log("test", this.hotspotEl)
}, "all", "#Basket", true)
}
this.initialized = true;
}
initExternalFunctions(){
this.addToFavFn = app_shop.fn?.shoppingList?.addProductToList;
}
@@ -1748,7 +1783,6 @@ class IdmHotspot{
*/
async fillHotspot(){
// Zdefiniowanie funkcji do dodawania do ulubionych
this.initExternalFunctions();
try{
if(!this.products){
if((!this?.query?.graphFn || !this?.query?.string) && !this.source?.link) this.setQueryData();
@@ -1758,9 +1792,13 @@ class IdmHotspot{
if(!this.products) throw new Error(idmHotspotTextObject["Nie znaleziono produktów"]);
}
// Skeleton
this.hotspotEl.querySelector(".idm_hotspot__skeleton")?.remove();
this.hotspotEl.classList.remove("--hotspot-loading");
this.initExternalFunctions();
// Wstawienie markupa na strone
if(this.hotspotEl.querySelector(".products.hotspot__products")) this.hotspotEl.querySelector(".products.hotspot__products").insertAdjacentHTML("beforeend", this.markup());
else if(this.hotspotEl.querySelector(".hotspot")){
@@ -1771,7 +1809,8 @@ class IdmHotspot{
}
// init swiper + add to basket
this.afterInit();
await this.afterInit();
this.afterInitOnce();
}catch(err){
console.error(idmHotspotTextObject["Wystąpił błąd"], err);
this.hotspotEl.remove();
@@ -1837,6 +1876,9 @@ class IdmHotspot{
// Wybór wersji
if(this.options?.selectVersion) prodEl.querySelector(".product__versions")?.addEventListener("click", this.handleSelectVersion);
// Wybór rozmiaru
if(this.options?.selectSize) prodEl.querySelector(".product__select_sizes")?.addEventListener("click", this.handleSelectSize);
}
/**