// ==================== Main ====================
// ========== Lang Curn Explain Text ==========
const langCurnExplain = document.createElement('span');
langCurnExplain.textContent = 'تغيير العملة';
langCurnExplain.style.marginInlineEnd = '.5rem';
[document.querySelector('.menu-fixed-bar button'), document.querySelector('.store-header .header-btn')].forEach(e => e.prepend(langCurnExplain.cloneNode(true)));
// ========== Products Cards Discount Percentage ==========
const productsSections = [...document.querySelectorAll('salla-products-list'), ...document.querySelectorAll('salla-products-slider')];
productsSections.forEach(s => {
const productsInt = setInterval(() => {
if (s.querySelector('.s-button-wrap.hydrated')) {
clearInterval(productsInt);
s.querySelectorAll('.s-product-card-sale-price').forEach(e => {
const originalPrice = Number.parseFloat(e.querySelector('span').textContent.replace(/,/g, ''));
const newPrice = Number.parseFloat(e.querySelector('h4').textContent.replace(/,/g, ''));
const discountPercentage = Math.round(((originalPrice - newPrice) / originalPrice) * 100) + '%';
const discountPercentageElm = document.createElement('div');
discountPercentageElm.textContent = `خصم ${discountPercentage}`;
e.append(discountPercentageElm);
});
}
});
});
// ========== Custom WhatsApp Icon ==========
waIcon = document.createElement('div');
waIcon.className = 'float-wa';
waIcon.innerHTML = `
يا هلا👋 عندك سؤال؟ تواصل معنا
`;
const waIconBtn = document.createElement('button');
waIconBtn.className = 'hide-msg-btn sicon-cancel';
waIconBtn.onclick = () => waIcon.classList.add('hidden-msg');
waIcon.append(waIconBtn);
const prodOptCont = document.querySelector('.page-container.product-has-options .main-content')
prodOptCont ? prodOptCont.append(waIcon) : document.body.append(waIcon);
// ==================== Home Page ====================
if (document.body.classList.contains('index')) {
// ========== Categories&Social Banners ==========
let bannersBlocks;
const bannersBlocksInt = setInterval(() => {
bannersBlocks = document.querySelectorAll('.s-block--banners');
if (bannersBlocks.length === 2) {
clearInterval(bannersBlocksInt);
bannersBlocks[0].classList.add('categories-banners');
bannersBlocks[1].classList.add('social-banners');
bannersBlocks[0].querySelectorAll('a').forEach(e => {
const bfImg = document.createElement('img');
bfImg.src = 'https://i.ibb.co/9GnJb1d/05-shopping-bag.gif';
e.prepend(bfImg);
});
document.querySelectorAll('section.s-block--banners a').forEach(e => {
const bgImg = document.createElement('img');
bgImg.src = e.getAttribute("data-bg");
e.append(bgImg);
});
}
});
// ========== App Banner ==========
const appStore = document.querySelector('section:has([href="https://apps.apple.com/us/app/zmord/id6593659607?platform=iphone"])');
const appBanner = appStore.previousElementSibling;
appBanner.classList.add('app-banner');
const playStore = appStore.nextElementSibling;
appBanner.querySelector('.container').append(appStore.querySelector('a'), playStore.querySelector('a'));
}
// ==================== Product Page ====================
if (document.body.classList.contains('product-single')) {
const desc = document.querySelector('.article--main');
// ========== sale Amount Tag ==========
const salePrices = document.querySelectorAll('.price_is_on_sale');
if (salePrices) {
const bfPr = salePrices[0].querySelector('.before-price');
const afpr = salePrices[0].querySelector('.total-price');
const currency = afpr.textContent.split(' ')[1]
let saleAmountElms = [];
salePrices.forEach((e) => {
const saleAmountWrap = document.createElement('div');
saleAmountWrap.className = 'sale-amount-wrap';
saleAmountWrap.innerHTML = `
`;
const saleAmountElm = document.createElement('span');
saleAmountElms.push(saleAmountElm);
calcSaleAmount([saleAmountElm]);
saleAmountWrap.append(saleAmountElm);
e.append(saleAmountWrap);
});
if (document.getElementById('options-panel-trigger')) {
let productOptions;
const productOptionsInt = setInterval(() => {
productOptions = document.querySelectorAll('.s-product-options-wrapper select');
if (productOptions.length) {
clearInterval(productOptionsInt);
productOptions.forEach(e => e.addEventListener('change', () => {
const callback = function(mutationsList, observer) {
mutationsList.forEach((mutation) => {
if (mutation.type === 'attributes') {
calcSaleAmount(saleAmountElms);
afprObserver.disconnect()
}
});
};
const afprObserver = new MutationObserver(callback);
afprObserver.observe(afpr, { attributes: true });
}));
}
});
}
function calcSaleAmount(arr) {
let saleAmount = Number.parseFloat(bfPr.textContent.replace(/,/g, '')) - Number.parseFloat(afpr.textContent.replace(/,/g, ''));
saleAmount = Number(saleAmount.toFixed(2));
if (saleAmount > 0) {
arr.forEach(e => e.innerHTML = `وفري
${saleAmount.toLocaleString('en-US')}
${currency}`);
document.body.classList.remove('no-sale-amount');
} else document.body.classList.add('no-sale-amount');
}
}
// ========== Sort Sections ==========
const sortCont = document.createElement('div');
sortCont.className ='sort-cont';
const elementOrder = ['.main-link', '.product__description + div:has(> a)', 'div:has(>salla-installment)'];
elementOrder.forEach(classSelc => {
const e = document.querySelector(classSelc);
if (e) sortCont.append(e);
});
desc ? document.getElementById('product-details-tab').after(sortCont) : document.getElementById('single-product-form').before(sortCont);
// ========== Read More ==========
if (desc && desc.clientHeight > 320) {
document.querySelector('.product__description').style.display = 'none';
desc.classList.add('read-more-close');
const readMoreWrap = document.createElement('div');
readMoreWrap.className = 'read-more-wrap';
const readMoreBtn = document.createElement('button');
readMoreBtn.className = 'read-more-btn';
readMoreBtn.textContent = 'قراءة المزيد';
readMoreWrap.append(readMoreBtn);
desc.after(readMoreWrap);
readMoreBtn.onclick = function () {
readMoreWrap.style.display = 'none';
desc.classList.remove('read-more-close');
}
}
}