`;
isCart
? target.insertAdjacentHTML("beforebegin", html)
: target.insertAdjacentHTML("afterend", html);
};
createUI(".product__description");
createUI(".totals-div.shadow-custom", true);
});
// for Digital Cards - Hide delivery time & Add Instant Delivery Text
document.addEventListener("DOMContentLoaded", () => {
const cat = document.querySelector('meta[property="product:category"]')
?.content;
if (cat !== "البطاقات الرقمية" && cat !== "Digital Cards") return;
const run = () => {
// 1. إخفاء العناصر غير المرغوب فيها (بما فيها وقت التوصيل السابق وأدوات التقسيط)
[
"salla-installment",
"tamara-widget",
"tabby-promo-widget",
"#tabbyPromoWrapper",
".details.shpr",
].forEach((s) => {
const el = document.querySelector(s);
if (el) el.style.setProperty("display", "none", "important");
});
// 2. إضافة نص التسليم الفوري باللون الأخضر الأصلي
const target = document.querySelector(".product__description");
if (target && !document.querySelector(".instant-delivery-box")) {
const html = `
تسليم فوري وآلي يصلك كود البطاقة خلال ثواني من الدفع
`;
target.insertAdjacentHTML("afterend", html);
}
};
run();
const obs = new MutationObserver(run);
obs.observe(document.body, { childList: true, subtree: true });
// التوقف بعد 5 ثوانٍ لضمان استقرار الصفحة
setTimeout(() => obs.disconnect(), 5000);
});
document.addEventListener("DOMContentLoaded", () => {
const outOfStockRegex = /([\-—]\s*(نفدت الكمية|Out of Stock).*)$/i;
// دالة لتحديث الأزرار عند تغير الselect من جهة سلة (إذا حدث تحديث تلقائي)
function syncRadioWithSelect(select, container) {
const currentValue = select.value;
const matchingRadio = container.querySelector(`input[value="${CSS.escape(currentValue)}"]`);
if (matchingRadio && !matchingRadio.checked) {
matchingRadio.checked = true;
}
}
document.querySelectorAll(".s-product-options-option-content select").forEach((select) => {
const wrapper = select.closest(".s-product-options-option-content");
if (!wrapper || !select.name) return;
// منع تكرار إنشاء الحاوية إذا تم تشغيل الكود أكثر من مرة
if (wrapper.querySelector(".custom-radio-buttons-container")) return;
wrapper.insertAdjacentHTML("beforeend", ``);
const container = wrapper.lastElementChild;
// استخدام معرف فريد آمن تماماً لتجنب تداخل الـ ID
const uniqueGroup = 'opt_' + Math.random().toString(36).substring(2, 9);
Array.from(select.options).forEach((opt, i) => {
if (!opt.value) return; // السماح بقراءة الخيارات حتى لو كانت disabled لمعالجتها بالشكل الصحيح
const match = opt.textContent.match(outOfStockRegex);
const cleanText = opt.textContent.replace(outOfStockRegex, "").trim();
const id = `${uniqueGroup}_${i}`;
const isOutOfStock = !!match || opt.disabled;
const html = `
`;
container.insertAdjacentHTML("beforeend", html);
});
// استماع لحدث التغيير على حاوية الأزرار (Event Delegation) لمنع تضارب الـListeners
container.addEventListener("change", (e) => {
if (!e.target.classList.contains("custom-radio-input")) return;
const selectedValue = e.target.value;
if (select.value !== selectedValue) {
select.value = selectedValue;
// إطلاق أحداث التغيير المتوافقة مع سلة (Native + Event مع bubbels)
select.dispatchEvent(new Event('input', { bubbles: true }));
select.dispatchEvent(new Event('change', { bubbles: true }));
// إذا كان النظام يستعمل Framework مثل Vue/Alpine
if (typeof Alpine !== 'undefined' || select._value) {
select.dispatchEvent(new CustomEvent('input', { detail: selectedValue, bubbles: true }));
}
}
});
// الاستماع لأي تغيير يحدث من النظام الأصلي لسلة لكي تبقى الأزرار متزامنة
select.addEventListener("change", () => {
syncRadioWithSelect(select, container);
});
// إخفاء الـ select الأصلي بطريقة آمنة لا تعطيل وظائفه البرمجية
select.style.position = "absolute";
select.style.opacity = "0";
select.style.pointerEvents = "none";
select.style.height = "0";
select.style.width = "0";
select.style.overflow = "hidden";
});
});
// استهداف الصور داخل حاوية الشعار
const logos = document.querySelectorAll(".ps-logo img");
logos.forEach((logo) => {
logo.src =
"https://cdn.salla.sa/oNQR/0dkIB4kYl8Z36TS5qStqBPvnAYRKJe3Ew5WLIHOB.gif";
// تحديث srcset أيضاً لضمان عدم تحميل الصورة القديمة في الشاشات المختلفة
logo.srcset =
"https://cdn.salla.sa/oNQR/0dkIB4kYl8Z36TS5qStqBPvnAYRKJe3Ew5WLIHOB.gif";
});
// الوان بطاقة المنتج بخيارات
(function () {
function addColorsIcon() {
// 1. نبحث عن كل بطاقات المنتجات التي تحتوي على شارة "الوان متعددة"
const promoBadges = document.querySelectorAll(
".s-product-card-promotion-title",
);
promoBadges.forEach((badge) => {
if (badge && badge.textContent.trim() === "الوان متعددة") {
// 2. الصعود للملف الأب (مربع الصورة الرئيسي)
const imageContainer = badge.closest(".s-product-card-image");
// التحقق من وجود مربع الصورة وأنه لم يتم إضافة الأيقونة له مسبقاً لمنع التكرار
if (
imageContainer &&
!imageContainer.querySelector(".custom-colors-icon")
) {
// 3. إنشاء عنصر الأيقونة الجديد وحقن صورتك الخاصة مباشرة
const iconDiv = document.createElement("div");
iconDiv.className = "custom-colors-icon";
// استخدام رابط صورتك الجديدة مع إضافة ظل ناعم (drop-shadow) لإبرازها فوق صور المنتجات البيضاء
iconDiv.innerHTML = `
`;
// تحديد مكان الأيقونة بدقة (الارتفاع 10% واليسار 10px)
iconDiv.style.position = "absolute";
iconDiv.style.bottom = "10%";
iconDiv.style.left = "10px";
iconDiv.style.zIndex = "10";
iconDiv.style.cursor = "pointer";
// 4. حقن الأيقونة داخل مربع الصورة
imageContainer.appendChild(iconDiv);
}
}
});
}
// تشغيل الفحص فوراً ومراقبته ديناميكياً مع السلايدر والتحميل المتأخر
addColorsIcon();
const observer = new MutationObserver(() => {
addColorsIcon();
});
observer.observe(document.body, { childList: true, subtree: true });
})();