Untitled
unknown
plain_text
2 years ago
18 kB
3
Indexable
(function() {
try {
/* main variables */
var debug = 0;
var variation_name = "";
var $;
/* all Pure helper functions */
function waitForElement(selector, trigger, delayInterval, delayTimeout) {
var interval = setInterval(function() {
if (
document &&
document.querySelector(selector) &&
document.querySelectorAll(selector).length > 0
) {
clearInterval(interval);
trigger();
}
}, delayInterval);
setTimeout(function() {
clearInterval(interval);
}, delayTimeout);
}
// wait for jquery
function waitForjQuery(trigger) {
var interval = setInterval(function() {
if (window.jQuery != undefined) {
clearInterval(interval);
trigger();
} else {
addJQuery();
}
}, 50);
setTimeout(function() {
clearInterval(interval);
}, 15000)
}
function addJQuery() {
var jQueryScript = document.createElement('script');
// check for updated jquery cdn
jQueryScript.src = 'https://code.jquery.com/jquery-3.6.3.min.js';
document.getElementsByTagName('head')[0].appendChild(jQueryScript);
}
// wait for jquery
function waitForSlick(trigger) {
var interval = setInterval(function() {
if (window.jQuery.fn.slick != undefined) {
clearInterval(interval);
trigger();
}
}, 50);
setTimeout(function() {
clearInterval(interval);
}, 15000)
}
// slick script and css cdn
function addScript() {
var cssScript = '' +
"<link rel='stylesheet' href='https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.8.1/slick.css'/>";
let themeCssScript = `<link rel='stylesheet' href='https://cdn.jsdelivr.net/npm/slick-carousel@1.8.1/slick/slick-theme.css'/>`;
document.querySelector('head').insertAdjacentHTML('beforeend', cssScript);
document.querySelector('head').insertAdjacentHTML('beforeend', themeCssScript);
var swiperScript = document.createElement('script');
swiperScript.src = 'https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.8.1/slick.min.js';
document.getElementsByTagName('head')[0].appendChild(swiperScript);
}
function live(selector, event, callback, context) {
/****Helper Functions****/
// helper for enabling IE 8 event bindings
function addEvent(el, type, handler) {
if (el.attachEvent) el.attachEvent("on" + type, handler);
else el.addEventListener(type, handler);
}
// matches polyfill
this.Element &&
(function(ElementPrototype) {
ElementPrototype.matches =
ElementPrototype.matches ||
ElementPrototype.matchesSelector ||
ElementPrototype.webkitMatchesSelector ||
ElementPrototype.msMatchesSelector ||
function(selector) {
var node = this,
nodes = (node.parentNode || node.document).querySelectorAll(selector),
i = -1;
while (nodes[++i] && nodes[i] != node);
return !!nodes[i];
};
})(Element.prototype);
// live binding helper using matchesSelector
function live(selector, event, callback, context) {
addEvent(context || document, event, function(e) {
var found,
el = e.target || e.srcElement;
while (el && el.matches && el !== context && !(found = el.matches(selector))) el = el.parentElement;
if (found) callback.call(el, e);
});
}
live(selector, event, callback, context);
}
live('.eg-bag-container fieldset.pdp-fieldset>.options>a', 'click', (e) => {
e.preventDefault();
if (e.target.classList.contains("sold-out")) {
document.querySelector(".eg-bag-container.eg-show").classList.remove("eg-show");
} else {
let variantId = e.target.getAttribute("data-variant-id");
Shopify.addItem(variantId, '1', function() {
console.log("hello" + variantId);
setTimeout(() => {
sideCartValue();
// opening cart slide
document.querySelector("html body .cart__container > a").click();
document.querySelector(".eg-bag-container.eg-show").classList.remove("eg-show");
}, 2000);
});
}
});
function sideCartValue() {
var xmlHttp = new XMLHttpRequest();
xmlHttp.onreadystatechange = function() {
if (xmlHttp.readyState == 4) {
if (xmlHttp.status == 200) {
var parser = new DOMParser();
var response = parser.parseFromString(xmlHttp.responseText, 'text/html');
var cartproduces = response.querySelector(".inline-cart__content-container").innerHTML;
var Itemsqnty = response.querySelector(".inline-cart__header").innerHTML;
var ItemSubTotal = response.querySelector(".inline-cart__total-amount-container").innerHTML;
var MainNavQty = response.querySelector(".inline-cart__header .inline-cart__total-count").innerText;
document.querySelector(".inline-cart__content-container").innerHTML = cartproduces;
document.querySelector(".inline-cart__header").innerHTML = Itemsqnty;
document.querySelector(".inline-cart__total-amount-container").innerHTML = ItemSubTotal;
document.querySelector(".cart__container > a > span > span").innerText = MainNavQty;
setTimeout(function() {
if (document.querySelector(" .inline-cart .inline-cart__btn").classList.contains("is-disabled")) {
document.querySelector(".inline-cart .inline-cart__btn").classList.remove("is-disabled")
}
}, 500)
}
}
};
xmlHttp.open("GET", "https://www.wickedclothes.com/cart?view=contents", true);
xmlHttp.send(null);
}
live(".eg-add-to-bag", "click", function() {
if (document.querySelector(".eg-bag-container.eg-show") && document.querySelector(".eg-bag-container.eg-show") !== this.previousElementSibling) {
document.querySelector(".eg-bag-container.eg-show").classList.remove("eg-show");
}
this.previousElementSibling.classList.toggle("eg-show");
if (!document.querySelector(".eg-bag-container fieldset.pdp-fieldset>.options>a")) {
let variantId = this.previousElementSibling.querySelector("#pdp--form > input[name=id]").value;
Shopify.addItem(variantId, '1', function() {
console.log("hello" + variantId);
setTimeout(() => {
sideCartValue();
// opening cart slide
document.querySelector("html body .cart__container > a").click();
document.querySelector(".eg-bag-container.eg-show").classList.remove("eg-show");
}, 2000);
});
}
});
/* Variation Init */
function init() {
/* start your code here */
addData();
listener();
waitForjQuery(function() {
addScript();
$ = window.jQuery;
});
}
// navigate to pdp page when image gets click
live(".eg-swipe-img", "click", function() {
window.location.href = this.getAttribute("href");
});
function addData() {
document.querySelectorAll("html body .newCollection >div:not(.newCollection__head) > .findify-container .findify-components--cards--product:not(:has(+.eg-swipe-wrapper))").forEach(anchor => {
// getting data
async function getData(url) {
try {
const response = await fetch(url);
const data = await response.text();
const ele = document.createElement("div");
ele.innerHTML = data;
let imgsHtml = [...ele.querySelectorAll("#pdp--main-image .pdp-main-image--product-imgs > img")].map(img => {
return `<img href="${anchor.href}" class="eg-swipe-img" src="${img.dataset.srcset}"/>`;
}).join(" ");
let egComparePrice = anchor.querySelector(".findify-components--cards--product--price__compare");
let egOriginalPrice = anchor.querySelector(".findify-components--cards--product--price__price");
let egSwipeHtml = `
<div class="eg-swipe-wrapper">
<!-- swipper -->
<div class="eg-swipe">
<div>${imgsHtml}</div>
<!-- add to bag form -->
<div class="eg-bag-container">
${ele.querySelector("#pdp--form-container").innerHTML}
</div>
<button class="eg-add-to-bag">+ Quick Add</button>
</div>
<!-- product details -->
<div class="eg-product-detail">
<p class="eg-name">${anchor.querySelector(".findify-components--cards--product__title").innerText}</p>
<div class="eg-price-container">
<span class="eg-current-price eg-price">${egOriginalPrice.innerText}</span>`;
if(egComparePrice){
egSwipeHtml += `<span class="eg-original-price">${egComparePrice.innerText}</span></div>`;
}
egSwipeHtml += `
</div>
</div>
</div>`;
if (!anchor.parentElement.querySelector(".eg-swipe")) {
anchor.insertAdjacentHTML("afterend", egSwipeHtml);
waitForSlick(function() {
$(anchor.parentElement.querySelector(".eg-swipe > div")).slick({
dots:true,
arrows: false,
infinite: true,
speed: 300,
slidesToShow: 1,
init: function(slider) {
slider.$slider.css('transform', 'initial');
},
lazyLoad: 'ondemand',
draggable:true
});
});
}
} catch (error) {
console.error(error);
}
}
getData(anchor.href);
});
}
function listener() {
/* These are the modifications: */
window.addEventListener("locationchange", function() {
setTimeout(() => {
addData();
}, 100);
});
history.pushState = ((f) =>
function pushState() {
var ret = f.apply(this, arguments);
window.dispatchEvent(new Event("pushstate"));
window.dispatchEvent(new Event("locationchange"));
return ret;
})(history.pushState);
history.replaceState = ((f) =>
function replaceState() {
var ret = f.apply(this, arguments);
window.dispatchEvent(new Event("replacestate"));
window.dispatchEvent(new Event("locationchange"));
return ret;
})(history.replaceState);
window.addEventListener("popstate", () => {
window.dispatchEvent(new Event("locationchange"));
});
}
/* Initialize variation */
if (window.innerWidth < 768) {
waitForElement('html body .newCollection >div:not(.newCollection__head) > .findify-container .findify-components--cards--product:not(:has(+.eg-swipe-wrapper))', init, 150, 15000);
}
} catch (e) {
if (debug) console.log(e, "error in Test" + variation_name);
}
})();
<style>
@media(max-width:767px) {
html body .newCollection>div:not(.newCollection__head)>.findify-container .findify-components--cards--product:has(+ .eg-swipe-wrapper) {
display: none;
}
html body .eg-swipe .slick-dots {
top: unset !important;
bottom: 0;
display: flex;
align-items: center;
justify-content: center;
padding: 8px 0;
}
html body .eg-swipe .slick-dots button {
margin: 0 !important;
scale: 0.8;
transition: scale 0.5s;
background: rgb(255 255 255 /70%) !important;
border: none !important;
outline: none !important;
}
html body .eg-swipe .slick-dots li {
margin: 2px !important;
}
html body .eg-swipe .slick-dots li.slick-active button {
scale: 1.2;
}
.eg-swipe img {
display: block !important;
}
/*default cta*/
.eg-quick-atc-cta {
display: none !important;
}
.eg-swipe-wrapper {
width: calc(100% - 18px);
margin: 0 auto;
isolation: isolate;
}
.eg-swipe {
margin-bottom: 54px;
position: relative;
}
.eg-bag-container,
.eg-add-to-bag {
position: absolute;
width: 100%;
}
.eg-bag-container {
height: fit-content;
display: none;
flex-direction: column;
justify-content: flex-end;
bottom: 0;
z-index: 9999;
}
.eg-bag-container.eg-show {
display: flex;
}
.eg-add-to-bag {
display: block;
border: none;
outline: none !important;
width: 100%;
color: #fff;
font-weight: 500;
background: #1f1c1c !important;
font-family: "FuturaPT", sans-serif !important;
text-transform: uppercase;
letter-spacing: 0.8px;
padding: 10px;
font-size: 17px;
margin: 0 !important;
bottom: -41px;
}
/*add to cart form css*/
.eg-bag-container .options svg,
.eg-bag-container .options-size,
.eg-bag-container .pdp--form__cta-container,
.eg-bag-container .pdp-fieldset-header-wrap {
display: none !important;
}
.eg-bag-container fieldset.pdp-fieldset {
border: none !important;
}
.eg-bag-container fieldset.pdp-fieldset>.options {
display: flex;
background: rgb(255 255 255 /85%);
flex-wrap: wrap;
justify-content: center;
align-items: center;
padding: 38px 0 10px;
position: relative;
color: #1f1f1c;
}
.eg-bag-container fieldset.pdp-fieldset>.options::before {
content: "Select a size";
font-size: 22px;
position: absolute;
top: 5px;
}
.eg-bag-container fieldset.pdp-fieldset>.options>a {
font-size: 16px;
color: #1f1f1c;
display: flex;
width: 32px;
height: 32px;
justify-content: center;
align-items: center;
background: white;
border: 1px solid;
margin: 5px;
}
.eg-bag-container fieldset.pdp-fieldset>.options>a:hover {
border-color: #1f1f1c;
background-color: #1f1f1c;
color: #fff;
}
.eg-product-detail .eg-name,
.eg-product-detail .eg-price {
-webkit-font-smoothing: antialiased;
color: #1f1c1c;
display: block;
text-align: center;
font-family: "FuturaPT", sans-serif !important;
text-rendering: optimizeLegibility;
}
.eg-product-detail {
padding: 0 10px 20px;
}
.eg-product-detail .eg-name {
font-size: 16px !important;
margin-bottom: 10px;
}
.eg-product-detail .eg-price {
font-size: 14px;
font-weight: 700;
}
.eg-swipe .slick-track {
width: 100% !important;
height: 100% !important;
display: flex;
}
.eg-swipe .slick-track>img {
width: 100% !important;
height: 100% !important;
}
html body .eg-price-container {
display: flex;
justify-content: center;
}
html body .eg-price-container:has(.eg-original-price) .eg-price {
margin-right: 5px;
color: #d0284b;
}
html body .eg-price-container .eg-original-price {
font-style: italic;
text-decoration: line-through;
color: #8d8d8d;
}
html body .st-swipe-wrapper{
display:none !important;
}
html body .findify-container .findify-components-common--grid span + a {
display: none !important;
}
html body .eg-bag-container a.sold-out {
color: #aaa !important;
}
}
</style>Editor is loading...