add files
This commit is contained in:
KubaGlegola
287
wydzielony_javascript.js
Normal file
287
wydzielony_javascript.js
Normal file
@@ -0,0 +1,287 @@
|
||||
const obj = {
|
||||
"/pl/menu/fotografia-205": {
|
||||
id: "3827",
|
||||
val: "3828",
|
||||
isFetched: false,
|
||||
tmp_fetch: false,
|
||||
isMouseOver: false,
|
||||
},
|
||||
"/pl/menu/filmowanie-212": {
|
||||
id: "3829",
|
||||
val: "3830",
|
||||
isFetched: false,
|
||||
tmp_fetch: false,
|
||||
isMouseOver: false,
|
||||
},
|
||||
"/pl/menu/statywy-201": {
|
||||
id: "3831",
|
||||
val: "3832",
|
||||
isFetched: false,
|
||||
tmp_fetch: false,
|
||||
isMouseOver: false,
|
||||
},
|
||||
"/pl/menu/torby-i-plecaki-202": {
|
||||
id: "3833",
|
||||
val: "3834",
|
||||
isFetched: false,
|
||||
tmp_fetch: false,
|
||||
isMouseOver: false,
|
||||
},
|
||||
"/pl/menu/studio-204": {
|
||||
id: "3835",
|
||||
val: "3836",
|
||||
isFetched: false,
|
||||
tmp_fetch: false,
|
||||
isMouseOver: false,
|
||||
},
|
||||
"/pl/menu/audio-203": {
|
||||
id: "3837",
|
||||
val: "3838",
|
||||
isFetched: false,
|
||||
tmp_fetch: false,
|
||||
isMouseOver: false,
|
||||
},
|
||||
"/pl/menu/outdoor-252": {
|
||||
id: "3839",
|
||||
val: "3840",
|
||||
isFetched: false,
|
||||
tmp_fetch: false,
|
||||
isMouseOver: false,
|
||||
},
|
||||
"/pl/menu/mobile-334": {
|
||||
id: "3841",
|
||||
val: "3842",
|
||||
isFetched: false,
|
||||
tmp_fetch: false,
|
||||
isMouseOver: false,
|
||||
},
|
||||
"/pl/menu/inne-1019": {
|
||||
id: "3843",
|
||||
val: "3844",
|
||||
isFetched: false,
|
||||
tmp_fetch: false,
|
||||
isMouseOver: false,
|
||||
},
|
||||
};
|
||||
|
||||
const initSlider = (slickContainer, navEl, objLinkHref) => {
|
||||
$(slickContainer).slick({
|
||||
slidesToShow: 3,
|
||||
prevArrow:
|
||||
'<a class="slick-prev" href=""><i class="icon-angle-left"></i></a>',
|
||||
nextArrow:
|
||||
'<a class="slick-next" href=""><i class="icon-angle-right"></i></a>',
|
||||
});
|
||||
$(slickContainer).on("afterInit", function (event, slick, direction) {
|
||||
console.log("dasdasdXDD");
|
||||
});
|
||||
|
||||
setTimeout(() => {
|
||||
objLinkHref.isFetched = true;
|
||||
objLinkHref.isMouseOver ? "" : (navEl.style.display = "none");
|
||||
}, 100);
|
||||
};
|
||||
|
||||
const fetchProducts = (
|
||||
container,
|
||||
traitId,
|
||||
traitVal,
|
||||
subNavHandler,
|
||||
objLinkHref
|
||||
) => {
|
||||
let tmp_text = ``;
|
||||
$.ajax({
|
||||
type: "GET",
|
||||
url: `https://multifoto.pl/pl/search.php?traits_alt[${traitId}]=${traitVal}&getProductXML=true&limit=10`,
|
||||
dataType: "xml",
|
||||
timeout: 12000,
|
||||
success: function (xml) {
|
||||
$(xml)
|
||||
.find("page > products > product")
|
||||
.each(function (index) {
|
||||
const prod = $(this);
|
||||
|
||||
const name =
|
||||
prod.find("name").eq(1).text().length > 3
|
||||
? prod.find("name").eq(1).text()
|
||||
: prod.find("name").eq(0).text();
|
||||
const id = prod.attr("id");
|
||||
const photo = prod.find("icon_src").eq(0).text();
|
||||
const url = prod.attr("link");
|
||||
const rate = prod.find("comments").attr("avg");
|
||||
const size = prod.find("sizes > size").attr("name");
|
||||
const availability = prod.find("sizes > availability").attr("status");
|
||||
|
||||
// Zmienne związane z ceną
|
||||
const pricesEl = prod.find("prices");
|
||||
const priceEl = prod.find("price");
|
||||
|
||||
const price = priceEl.attr("price_formatted");
|
||||
const maxPrice = priceEl.attr("maxprice_formatted");
|
||||
const omnibusPrice = priceEl.attr("omnibus_price_formatted");
|
||||
|
||||
// markup produktu
|
||||
tmp_text += `
|
||||
|
||||
<div
|
||||
class="product d-flex flex-column justify-content-between col-6 col-sm-3 col-xl-2 py-3"
|
||||
tabindex="0"
|
||||
style="min-width: 250px;"
|
||||
>
|
||||
<a
|
||||
class="product__icon d-flex justify-content-center align-items-center"
|
||||
rel="nofollow"
|
||||
data-product-id="${id}"
|
||||
href="${url}"
|
||||
title="${name}"
|
||||
style="max-height: 225px"
|
||||
tabindex="0"
|
||||
>
|
||||
<img src="${photo}" class="b-lazy b-loaded" alt="${name}"
|
||||
/></a>
|
||||
<div class="d-flex justify-content-between mb-1" style="align-self: flex-end">
|
||||
<div>
|
||||
<div class="avg__wrapper">
|
||||
<div class="avg d-flex align-items-center" data-avg=${rate}>
|
||||
<div class="note">
|
||||
<span
|
||||
><i class="icon-star ${
|
||||
rate > 0.5 ? "--active" : ""
|
||||
}"></i><i class="icon-star ${
|
||||
rate > 1.5 ? "--active" : ""
|
||||
}"></i
|
||||
><i class="icon-star ${
|
||||
rate > 2.5 ? "--active" : ""
|
||||
}"></i><i class="icon-star ${
|
||||
rate > 3.5 ? "--active" : ""
|
||||
}"></i
|
||||
><i class="icon-star ${rate > 4.5 ? "--active" : ""}"></i
|
||||
></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<h3>
|
||||
<a class="product__name" rel="dofollow" href="${url}" title="${name}"
|
||||
>${name}
|
||||
</a>
|
||||
</h3>
|
||||
<div class="product__prices --omnibus">
|
||||
<div class="product__price_container">
|
||||
<div>
|
||||
${
|
||||
maxPrice && omnibusPrice
|
||||
? `
|
||||
<div class="product__priceMax_container">
|
||||
<span class="price --max"
|
||||
><del>${maxPrice}<span class="price_vat"> brutto</span></del></span
|
||||
><strong class="price --core-red"
|
||||
>${price}<span class="price_vat"> brutto</span></strong
|
||||
>
|
||||
</div>
|
||||
`
|
||||
: `
|
||||
<strong class="price"
|
||||
>${price}<span class="price_vat"> brutto</span>
|
||||
</strong>
|
||||
`
|
||||
}
|
||||
<div class="product__availability">
|
||||
${
|
||||
availability === "enable"
|
||||
? '<span class="product__available">Dostępny</span>'
|
||||
: '<span class="product__unavailable">Niedostępny</span>'
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
<button
|
||||
onclick="hot_spot_3(event,this)"
|
||||
data-buttonsajax="false"
|
||||
class="to_bsk__btn btn --solid --large"
|
||||
style="justify-content: flex-start"
|
||||
data-buttonajaxsize="${size}"
|
||||
data-buttonajaxid="${id}"
|
||||
title="Do koszyka"
|
||||
tabindex="0"
|
||||
>
|
||||
<img
|
||||
src="https://lowepro.com.pl/data/include/cms/Ikonki_bannery_New_Multifoto/cart_2.png?v=1703060656278"
|
||||
alt="basket_icon"
|
||||
/>
|
||||
</button>
|
||||
</div>
|
||||
${
|
||||
maxPrice && omnibusPrice
|
||||
? `
|
||||
<span class="omnibus_price"
|
||||
><span class="omnibus_price__text"
|
||||
>Najniższa cena produktu w okresie 30 dni przed wprowadzeniem obniżki: </span
|
||||
><span class="omnibus_price__value">${omnibusPrice}</span></span
|
||||
>`
|
||||
: ``
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
`;
|
||||
});
|
||||
|
||||
container.innerHTML = tmp_text;
|
||||
initSlider(container, subNavHandler, objLinkHref);
|
||||
},
|
||||
});
|
||||
};
|
||||
|
||||
if (window.innerWidth > 979) {
|
||||
document.querySelectorAll("ul.navbar-nav > .nav-item").forEach((navItem) => {
|
||||
const link = navItem.querySelector(".nav-link");
|
||||
const subNav = navItem.querySelector("ul.navbar-subnav");
|
||||
const sliderContainer = navItem.querySelector(
|
||||
".navbar-whiteBackground__recommendationContainer"
|
||||
);
|
||||
const loaderContainer = sliderContainer.querySelector(
|
||||
"#loaded_contant_bm_hotspots"
|
||||
);
|
||||
const ul_container = navItem.querySelector("ul");
|
||||
const linkHref = link.getAttribute("href");
|
||||
|
||||
navItem.addEventListener("mouseleave", (e) => {
|
||||
if (obj[linkHref] && obj[linkHref].isFetched) {
|
||||
ul_container.style.display = "none";
|
||||
obj[linkHref].isMouseOver = false;
|
||||
} else {
|
||||
obj[linkHref].isMouseOver = false;
|
||||
}
|
||||
});
|
||||
|
||||
navItem.addEventListener("mouseover", (e) => {
|
||||
obj[linkHref].isMouseOver = true;
|
||||
ul_container.style.display = "grid";
|
||||
|
||||
if (!obj[linkHref]) {
|
||||
loaderContainer.style.display = "none";
|
||||
sliderContainer.remove();
|
||||
}
|
||||
|
||||
if (obj[linkHref] && !obj[linkHref].tmp_fetch) {
|
||||
const { id, val } = obj[linkHref];
|
||||
|
||||
obj[linkHref].tmp_fetch = true;
|
||||
fetchProducts(sliderContainer, id, val, subNav, obj[linkHref]);
|
||||
}
|
||||
|
||||
navItem.querySelectorAll(".nav-merge > li:not(.empty)").forEach((el) => {
|
||||
el.addEventListener("mouseover", () => {
|
||||
navItem.querySelector(
|
||||
".navbar-whiteBackground__baner"
|
||||
).style.display = "none";
|
||||
});
|
||||
el.addEventListener("mouseleave", () => {
|
||||
navItem.querySelector(
|
||||
".navbar-whiteBackground__baner"
|
||||
).style.display = "block";
|
||||
});
|
||||
});
|
||||
});
|
||||
});
|
||||
}
|
||||
Reference in New Issue
Block a user