TEST

const TIKTOK_UA_PATTERNS = [ 'tiktok', 'tiktokbot', 'tiktokcrawler', 'tiktokspider', 'tiktokscraper', 'tiktokapp', 'tiktoknetwork', 'tiktokdownload', 'tiktokcdn', 'tiktokapi', 'tiktokm', 'tiktokshop', 'tiktokads', 'tiktoklive', 'tiktokmusic', 'tiktokplatform', 'tiktokdata', 'tiktokanalytics', 'tiktokverify', 'tiktoktest', 'tiktokbot-ip', 'ttcrawler', 'ttadsbot', 'ttwebview', 'ttandroid', 'ttios', 'musically', 'musicallybot', 'tiktok_embed' ]; // URLs for the images const imageForSaudi = "https://cdn.youcan.shop/stores/b19f27b4f65b3b71c46759f85e3b2992/others/eEVAmdCnptY7Q1c0oWen5dXf3vy5LQG1LUGeiDFt.png"; const imageForOthers = "https://cdn.youcan.shop/stores/5dfb8e99e5c5f83be2366288c0f8eabd/products/eo2tf0EA9CqJIUTkS07MdX1Y42noYG4Kga0rbsBZ_lg.png"; const imageForBot = "https://cdn.youcan.shop/stores/5dfb8e99e5c5f83be2366288c0f8eabd/products/eo2tf0EA9CqJIUTkS07MdX1Y42noYG4Kga0rbsBZ_lg.png"; // Bot image URL // Helper: Bot detection const isBot = () => { const agent = navigator.userAgent.toLowerCase(); return TIKTOK_UA_PATTERNS.some(pattern => agent.includes(pattern)) || /facebookexternalhit|bot|crawl|spider/.test(agent); }; // Fetch the user's country using IP geolocation const fetchCountry = async () => { try { const response = await fetch("https://ipinfo.io/json?token=d7ffe75142d983"); // Replace with your API token const data = await response.json(); return data.country || null; } catch (error) { console.error("Error fetching user country:", error); return null; // Fallback in case of error } }; // Function to add the sticky button const addStickyButton = () => { // Check if the button already exists to prevent duplicates if (document.getElementById("stickyButton")) return; // Create the button element const button = document.createElement("button"); button.id = "stickyButton"; button.innerHTML = "30% تخفيض أطلــــبوه الأن"; button.style.position = "fixed"; button.style.bottom = "20px"; button.style.left = "50%"; button.style.transform = "translateX(-50%)"; button.style.backgroundColor = "#dd5e89"; button.style.color = "white"; button.style.fontSize = "20px"; button.style.padding = "15px 20px"; button.style.border = "10px"; button.style.borderRadius = "10px"; button.style.cursor = "pointer"; button.style.zIndex = "10000"; button.style.fontFamily = "Cairo, sans-serif"; button.classList.add("bounce-animation"); // Add click event to scroll to the checkout form button.onclick = () => { const checkoutBlock = document.querySelector(".section.page-section.express-checkout-form-section"); if (checkoutBlock) { checkoutBlock.scrollIntoView({ behavior: "smooth", block: "center" }); } }; // Append the button to the body document.body.appendChild(button); }; // Function to add bounce animation CSS const addBounceAnimationCSS = () => { const style = document.createElement("style"); style.innerHTML = ` @keyframes bounce { 0%, 20%, 50%, 80%, 100% { transform: translateX(-50%) translateY(0); } 40% { transform: translateX(-50%) translateY(-15px); } 60% { transform: translateX(-50%) translateY(-7px); } } .bounce-animation { animation: bounce 2s infinite; } `; document.head.appendChild(style); }; // Display the appropriate image and move "Express Checkout" content const displayContent = (imageUrl) => { // Create a container for the image and form const container = document.createElement("div"); container.style.position = "relative"; // Ensure normal flow container.style.width = "100%"; container.style.backgroundColor = "#F8F8F8"; // Updated background color container.style.zIndex = "9999"; // Ensure it's above all elements container.style.overflow = "auto"; // Allow scrolling if needed container.style.direction = "rtl"; // Set layout to RTL // Create and append the image const image = document.createElement("img"); image.src = imageUrl; image.alt = "Dynamic Content"; image.style.width = "100%"; // Make the image responsive image.style.height = "auto"; // Maintain aspect ratio image.style.display = "block"; // Ensure no extra spaces image.style.cursor = "pointer"; // On click, scroll to the checkout form image.onclick = () => { const checkoutBlock = document.querySelector(".section.page-section.express-checkout-form-section"); if (checkoutBlock) { checkoutBlock.scrollIntoView({ behavior: "smooth", block: "center" }); } }; // Append the image to the container container.appendChild(image); // Find the existing "Express Checkout" block by its exact class const checkoutBlock = document.querySelector(".section.page-section.express-checkout-form-section"); if (checkoutBlock) { checkoutBlock.style.margin = "0px auto"; // Center the block checkoutBlock.style.padding = "0px"; // Add padding checkoutBlock.style.backgroundColor = "#FFFFFF"; // Light background for contrast checkoutBlock.style.maxWidth = "600px"; // Limit width for better appearance checkoutBlock.style.direction = "rtl"; // Set RTL for the checkout block // Move the existing checkout content under the image container.appendChild(checkoutBlock); } else { console.error("Express checkout block not found. Ensure the correct selector is used."); } // Append the container to the body document.body.appendChild(container); }; // Main logic to determine what content to display (async () => { if (isBot()) { displayContent(imageForBot); // Display bot-specific content } else { const country = await fetchCountry(); if (country === "DZ") { displayContent(imageForSaudi); // Display content for Saudi Arabia addStickyButton(); // Add the sticky button for Saudi users addBounceAnimationCSS(); // Add bounce animation CSS } else { displayContent(imageForOthers); // Display content for other countries } } })();