FrontendAplikacje/PhotoModule
8
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

aktualizacja kodu wtyczki

Browse Source
This commit is contained in:
Pawel33359
2026-01-23 13:58:41 +01:00
parent d8d4d6452f
commit fe5f0736f2
6 changed files with 679 additions and 322 deletions
Download Patch File Download Diff File Expand all files Collapse all files

259
IdoSellAddOn/script.js
View File

@@ -1,10 +1,23 @@
const idmPhotoModuleLiteralsPM = {
[`Okazja`]: "Okazja",
[`Promocja`]: "Promocja",
[`Zobacz produkt`]: "Zobacz produkt",
[`Dodany`]: "Dodany",
[`Wystąpił błąd`]: "Wystąpił błąd",
[`Do koszyka`]: "Do koszyka",
[`Najniższa cena z 30 dni przed obniżką:`]:
"Najniższa cena z 30 dni przed obniżką:",
[`Cena regularna:`]: "Cena regularna:",
[`Coś poszło nie tak podczas dodawania do koszyka. Spróbuj ponownie lub odśwież stronę`]:
"Coś poszło nie tak podczas dodawania do koszyka. Spróbuj ponownie lub odśwież stronę",
// mapowanie labelow
["new"]: "Nowość",
["bestseller"]: "Bestseller",
["promotion"]: "Promocja",
["discount"]: "Przecena",
["distinguished"]: "Produkt Wyróżniony",
["special"]: "Produkt Specjalny",
["subscription"]: "Subskrypcja",
};
// LAZY LOAD
@@ -21,7 +34,7 @@ function idmObserveEachOncePM(elements, callback, options = {}) {
{
threshold: 0.1,
...options,
},
}
);
elements.forEach((el) => observer.observe(el));
@@ -32,7 +45,7 @@ idmObserveEachOncePM(
document.querySelectorAll(".idm_picture__module"),
(entry) => {
idmPictureModuleProductsPM(entry.target);
},
}
);
// GRAPHQL QUERY
@@ -145,17 +158,27 @@ function idmGetSingleProdGraphQLPM({
${
addToBasket
? `
sizes{
id
name
code
amount
availability{
visible
status
}
${IDM_PRICE_QUERY(app_shop.vars.priceType)}
unit{
id
name
singular
plural
fraction
sellBy
precision
unitConvertedFormat
}
sizes{
id
name
code
amount
availability{
visible
status
}
${IDM_PRICE_QUERY(app_shop.vars.priceType)}
}
`
: ""
}
@@ -163,11 +186,70 @@ function idmGetSingleProdGraphQLPM({
}`;
}
function idmHandleAddToBasketPM(e) {
const formEl = e.target.closest(
`${this.isClosestForm ? "div" : "form"}.add_to_basket`,
);
async function idmHandleAddToBasketPM(e) {
const formEl = e.target.closest(".add_to_basket");
if (!formEl) return;
const buttonEl = formEl.querySelector(".add_to_basket__button");
e.preventDefault();
try {
formEl.classList.add("--loading");
const id = formEl.querySelector("input.product__add_id")?.value;
const size = formEl.querySelector("input.product__add_size")?.value;
const number = formEl.querySelector("input.product__add_number")?.value;
const res = await fetch(`/graphql/v1/`, {
method: "POST",
headers: {
"Content-Type": "application/json",
},
body: JSON.stringify({
query: `mutation {
addProductsToBasket(ProductInput: {id: ${id}, size: "${size}", quantity: ${number}}) {
status
results {
status
error {
code
message
}
}
}
}`,
}),
});
const data = await res.json();
// Błąd
if (data?.data?.addProductsToBasket?.status !== "success")
throw new Error(data);
else {
localStorage.setItem("addedtoBasket", true);
// Obsługiwanie sukcesu
app_shop.fn?.menu_basket_cache();
await app_shop.graphql.trackingEvents(res);
buttonEl.classList.add("--success");
buttonEl.innerHTML = `<span>${buttonEl.dataset.success}</span>`;
setTimeout(() => {
buttonEl.innerHTML = `<span>${buttonEl.dataset.text}</span>`;
buttonEl.classList.remove("--success");
}, 3000);
}
} catch (err) {
console.error(err);
Alertek.Error(
idmPhotoModuleLiteralsPM[
"Coś poszło nie tak podczas dodawania do koszyka. Spróbuj ponownie lub odśwież stronę"
]
);
buttonEl.innerHTML = `<span>${buttonEl.dataset.error}</span>`;
buttonEl.classList.add("--error");
setTimeout(() => {
buttonEl.classList.remove("--error");
buttonEl.innerHTML = `<span>${buttonEl.dataset.text}</span>`;
}, 3000);
} finally {
formEl.classList.remove("--loading");
}
}
function idmMarkupAddToBasketPM(prodData) {
@@ -185,20 +267,96 @@ function idmMarkupAddToBasketPM(prodData) {
return `<form class="add_to_basket" action="/basketchange.php" type="post">
<input class="product__add_mode" type="hidden" value="1" name="mode">
<input class="product__add_id" type="hidden" value="${prodData.id}" name="mode">
<input class="product__add_size" type="hidden" value="${prodData.sizes?.[0]?.id || "uniw"}" name="mode">
<input class="product__add_number" type="hidden" value="1" name="mode">
<button class="btn --solid --medium add_to_basket__button" tabindex="0" data-success="${idmPhotoModuleLiteralsPM["Dodany"]}" data-error="${idmPhotoModuleLiteralsPM["Wystąpił błąd"]}" data-text="${idmPhotoModuleLiteralsPM["Do koszyka"]}">
<input class="product__add_id" type="hidden" value="${
prodData.id
}" name="mode">
<input class="product__add_size" type="hidden" value="${
prodData.sizes?.[0]?.id || "uniw"
}" name="mode">
<input class="product__add_number" type="hidden" value="${
prodData.unit?.sellBy || 1
}" name="mode">
<button class="btn --solid --medium add_to_basket__button" tabindex="0" data-success="${
idmPhotoModuleLiteralsPM["Dodany"]
}" data-error="${idmPhotoModuleLiteralsPM["Wystąpił błąd"]}" data-text="${
idmPhotoModuleLiteralsPM["Do koszyka"]
}">
<span>${idmPhotoModuleLiteralsPM["Do koszyka"]}</span>
</button>
</form>`;
}
function idmMarkupPricePM({ prodData, addToBasket }) {
if (!prodData) return "";
let priceMarkup;
if (!addToBasket)
priceMarkup = `<div class="product_prices"><span class="price --normal --main">${
prodData.price?.price?.[app_shop.vars.priceType]?.formatted
}</span></div>`;
else {
const currentSize = prodData?.sizes?.[0] || prodData;
const price =
currentSize.price?.price?.[app_shop.vars.priceType]?.formatted;
const omnibusPrice =
currentSize?.price?.omnibusPrice?.[app_shop.vars.priceType]?.formatted;
const isOmnibusHigher =
currentSize?.price?.omnibusPriceDetails
?.omnibusPriceIsHigherThanSellingPrice;
const omnibusPercent =
currentSize?.price?.omnibusPriceDetails?.youSavePercent;
const maxPrice =
currentSize.price?.price?.[app_shop.vars.priceType]?.formatted;
const maxPercent = currentSize?.price?.youSavePercent;
priceMarkup = `
<div class="product_prices ${omnibusPrice ? `--omnibus` : ""} ${
isOmnibusHigher ? `--omnibus-higher` : ""
} ${omnibusPrice === maxPrice ? "--omnibus-short" : ""}">
<span class="price --normal --main">${price}</span>
${
omnibusPrice && typeof omnibusPercent === "number"
? `
<span class="price --omnibus omnibus_price">
<span class="omnibus_price__text">${idmPhotoModuleLiteralsPM["Najniższa cena z 30 dni przed obniżką:"]}</span>
<del class="omnibus_price__value">${omnibusPrice}</del>
<span class="price_percent">${omnibusPercent}%</span>
</span>`
: ``
}
${
maxPrice && typeof maxPercent === "number"
? `
<span class="price --max">
<span class="omnibus_label">${idmPhotoModuleLiteralsPM["Cena regularna:"]}</span>
<del>${maxPrice}</del>
<span class="price_percent">${maxPercent}%</span>
</span>`
: ``
}
</div>
`;
}
return priceMarkup;
}
function idmInitEventsPM({ prodEl, addToBasket }) {
if (!prodEl) return;
if (addToBasket)
prodEl
.querySelector("form.add_to_basket")
?.addEventListener("submit", idmHandleAddToBasketPM);
}
// POBIERANIE I WSTAWIANIE PRODUKTOW
async function idmPictureModuleProductsPM(containerEL) {
const allProdEl = containerEL.querySelectorAll(".product_info[data-id]");
try {
// TABLICA ID
const allProdEl = containerEL.querySelectorAll(".product_info[data-id]");
const productsId = [];
allProdEl.forEach((prodEl) => {
if (prodEl.dataset?.id) productsId.push(prodEl.dataset?.id);
@@ -224,18 +382,19 @@ async function idmPictureModuleProductsPM(containerEL) {
opinions: isOpinions,
addToBasket: isAddToBasket,
})}`,
"",
""
)}}`,
}),
});
const data = await res.json();
const products = Object.values(data?.data)?.map((prod) => prod.product);
const products = Object.values(data?.data)?.map((prod) => prod?.product);
// WSTAWIANIE PRODUKTOW
allProdEl.forEach((prodEl) => {
const prodData = products.find((p) => p.id === +prodEl.dataset.id);
if (!prodData) return prodEl.remove();
const prodData = products.find((p) => p?.id === +prodEl.dataset.id);
if (!prodData || typeof prodData !== "object")
return prodEl.closest(".idm_picture__product")?.remove();
prodEl.classList.add("--mod-init");
@@ -248,13 +407,14 @@ async function idmPictureModuleProductsPM(containerEL) {
prodData.price?.omnibusPriceDetails
?.omnibusPriceIsHigherThanSellingPrice
)
labelsHTML += `<span class="label --promo --omnibus">${idmPhotoModuleLiteralsPM["Promocja"]}</span>`;
labelsHTML += `<span class="label --promo --omnibus">${idmPhotoModuleLiteralsPM["promotion"]}</span>`;
else
labelsHTML += `<span class="label --bargain --omnibus">${idmPhotoModuleLiteralsPM["Okazja"]}</span>`;
}
prodData.zones?.forEach((zone) => {
labelsHTML += `<span class="label --${zone}">${zone[0].toUpperCase() + zone.slice(1)}</span>`;
if (zone === "promotion") return "";
labelsHTML += `<span class="label --${zone}">${idmPhotoModuleLiteralsPM[zone]}</span>`;
});
}
@@ -263,28 +423,49 @@ async function idmPictureModuleProductsPM(containerEL) {
if (isOpinions) {
opinionsHTML = `
<div class="product_opinions__stars">
<i class="icon-star ${prodData.opinion?.rating > 0.5 ? "--active" : ""}"></i>
<i class="icon-star ${prodData.opinion?.rating > 1.5 ? "--active" : ""}"></i>
<i class="icon-star ${prodData.opinion?.rating > 2.5 ? "--active" : ""}"></i>
<i class="icon-star ${prodData.opinion?.rating > 3.5 ? "--active" : ""}"></i>
<i class="icon-star ${prodData.opinion?.rating > 4.5 ? "--active" : ""}"></i>
<i class="icon-star ${
prodData.opinion?.rating > 0.5 ? "--active" : ""
}"></i>
<i class="icon-star ${
prodData.opinion?.rating > 1.5 ? "--active" : ""
}"></i>
<i class="icon-star ${
prodData.opinion?.rating > 2.5 ? "--active" : ""
}"></i>
<i class="icon-star ${
prodData.opinion?.rating > 3.5 ? "--active" : ""
}"></i>
<i class="icon-star ${
prodData.opinion?.rating > 4.5 ? "--active" : ""
}"></i>
</div>
<span class="product_opinions__score">${prodData.opinion.rating} / 5.00 </span>
<span class="product_opinions__score">${
prodData.opinion.rating
} / 5.00 </span>
<span class="product_opinions__count">${prodData.opinion.count}</span>
`;
}
prodEl.innerHTML = `
${isLabels ? `<strong class="label_icons">${labelsHTML}</strong>` : ""}
${isOpinions ? `<div class="product_opinions">${opinionsHTML}</div>` : ""}
${
isOpinions
? `<div class="product_opinions">${opinionsHTML}</div>`
: ""
}
<a class="product_name" href="${prodData.link}">${prodData.name}</a>
<span class="product_price">${prodData.price?.price?.[app_shop.vars.priceType]?.formatted}</span>
${idmMarkupPricePM({ prodData, addToBasket: isAddToBasket })}
${isAddToBasket ? idmMarkupAddToBasketPM(prodData) : ""}
`;
});
containerEL.querySelectorAll(".product_info:not(.--mod-init)");
idmInitEventsPM({
prodEl,
addToBasket: isAddToBasket,
});
});
} catch (err) {
allProdEl?.forEach((prodEl) =>
prodEl.closest(".idm_picture__product")?.remove()
);
console.error(err);
}
}