<p>&nbsp;</p>
<style>
        /* تنظیمات پایه برای body و html */
        html, body {
            margin: 0;
            padding: 0;
            height: 100%;
            overflow: hidden;
            background-color: #f0f0f0;
            font-family: Arial, sans-serif;
        }

        /* متغیر CSS برای ارتفاع نمایشگر */
        :root {
            --vh: 100%;
        }

        /* حالت عادی */
        .iframe-container.normal {
            position: relative;
            width: 100%;
            height: 100vh;
            overflow: hidden;
        }

        .iframe-container.normal iframe {
            width: 100%;
            height: 100%;
            border: none;
            display: none;
            position: relative;
            top: 0;
        }

        /* حالت تمام صفحه */
        .iframe-container.fullscreen {
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: calc(var(--vh) * 100);
            overflow: hidden;
            z-index: 1;
        }

        .iframe-container.fullscreen iframe {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            border: none;
            display: block;
        }

        /* استایل‌های مشترک */
        .loading {
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            display: flex;
            flex-direction: column;
            align-items: center;
            z-index: 10000;
        }

        .loading-message {
            margin-bottom: 20px;
            font-size: 18px;
        }

        .progress {
            width: 80%;
            max-width: 400px;
            height: 20px;
            background-color: #ddd;
            border-radius: 5px;
            overflow: hidden;
        }

        .progress-bar {
            height: 100%;
            width: 0;
            background-color: #4caf50;
            transition: width 1s;
        }

        .error-message {
            display: none;
            color: red;
            margin-top: 20px;
            font-size: 16px;
            text-align: center;
        }

        #retryButton {
            display: none;
            margin-top: 10px;
            padding: 10px 20px;
            font-size: 16px;
            cursor: pointer;
            background-color: #4caf50;
            color: white;
            border: none;
            border-radius: 5px;
        }

        /* استایل دکمه دانلود */
        .download-button {
            display: block;
            width: 30px;
            height: 30px;
            color: white;
            text-align: center;
            padding: 4px;
            border-radius: 50%;
            cursor: pointer;
            font-size: 14px;
            line-height: 22px;
            transition: background-color 0.3s;
            position: fixed;
            top: 10px;
            right: 10px;
            z-index: 10001;
            text-decoration: none;
            background-color: #4CAF50;
        }

        .download-button:hover {
            background-color: #45a049;
        }

        /* استایل نوار تصاویر */
        .image-bar {
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 50px; /* ارتفاع نوار تصویر */
            background-color: #ffffff;
            display: flex;
            align-items: center;
            overflow-x: auto;
            z-index: 10002;
            border-bottom: 1px solid #ccc;
        }

        .image-item {
            display: flex;
            flex-direction: column;
            align-items: center;
            margin: 0 5px;
        }

        .image-item img {
            width: 40px;
            height: 40px;
            object-fit: cover;
            border-radius: 5px;
        }

        .image-item button {
            background-color: #4CAF50;
            color: white;
            padding: 2px 5px;
            border: none;
            border-radius: 5px;
            cursor: pointer;
            font-size: 10px;
            margin-top: 2px;
        }

        .image-item button:hover {
            background-color: #45a049;
        }

    </style>
<!-- دکمه دانلود -->
<p><a href="#" class="download-button" id="downloadButton">📥</a></p>
<!-- نوار تصاویر -->
<div class="image-bar" id="imageBar" style="display: none;"></div>
<!-- لودینگ و iframe -->
<div class="iframe-container normal">
<div class="loading" id="loadingContainer">
<div class="loading-message">لطفاً صبر کنید...</div>
<div class="progress">
<div class="progress-bar" id="progressBar"></div>
</div>
<div class="error-message" id="errorMessage">بارگیری زیاد طول کشید. در صورت عدم بارگذاری، فیلترشکن خود را روشن کنید.</div>
<button id="retryButton">بارگذاری مجدد</button></div>
<iframe id="myIframe" sandbox="allow-scripts allow-same-origin allow-forms allow-modals" allow="clipboard-read; clipboard-write"></iframe></div>
<p>
<script>
    const siteURL = 'http://magic.chenjunfeng.xyz/';

    let progress = 0;
    const progressBar = document.getElementById('progressBar');
    const retryButton = document.getElementById('retryButton');
    const errorMessage = document.getElementById('errorMessage');
    const loadingContainer = document.getElementById('loadingContainer');
    let interval;
    let iframeLoadedFlag = false;

    function startProgress() {
        loadingContainer.style.display = 'flex';
        progressBar.style.width = '0%';
        progress = 0;

        interval = setInterval(() => {
            if (progress < 100) {
                progress += 10;
                progressBar.style.width = progress + '%';
            }
            if (progress === 100) {
                clearInterval(interval);
                if (!iframeLoadedFlag) {
                    retryButton.style.display = 'block';
                    errorMessage.style.display = 'block';
                }
            }
        }, 1000);
    }

    function iframeLoaded() {
        iframeLoadedFlag = true;
        clearInterval(interval);
        loadingContainer.style.display = 'none';
        const iframeContainer = document.querySelector('.iframe-container');
        iframeContainer.classList.remove('normal');
        iframeContainer.classList.add('fullscreen');
        document.getElementById('myIframe').style.display = 'block';

        setupMutationObserver();
    }

    function iframeError() {
        clearInterval(interval);
        loadingContainer.style.display = 'flex';
        retryButton.style.display = 'block';
        errorMessage.style.display = 'block';
    }

    function loadIframe() {
        fetch(siteURL, { method: 'HEAD', mode: 'no-cors' })
            .then(() => {
                const iframe = document.getElementById('myIframe');
                iframe.src = siteURL;
                iframe.onload = iframeLoaded;
                iframe.onerror = iframeError;
            })
            .catch(() => {
                iframeError();
            });
    }

    retryButton.addEventListener('click', function() {
        progress = 0;
        progressBar.style.width = '0%';
        iframeLoadedFlag = false;
        retryButton.style.display = 'none';
        errorMessage.style.display = 'none';
        loadingContainer.style.display = 'flex';
        document.getElementById('myIframe').style.display = 'none';
        loadIframe();
        startProgress();
    });

    function setVh() {
        let vh = window.innerHeight * 0.01;
        document.documentElement.style.setProperty('--vh', `${vh}px`);
    }

    setVh();
    window.addEventListener('resize', setVh);

    loadIframe();
    startProgress();

    document.getElementById('downloadButton').addEventListener('click', handleDownload);

    function handleDownload(event) {
        event.preventDefault();
        try {
            const iframe = document.getElementById('myIframe');
            const iframeDocument = iframe.contentDocument || iframe.contentWindow.document;

            if (!iframeDocument) {
                alert("نمی‌توان به محتوای iframe دسترسی پیدا کرد.");
                return;
            }

            const images = iframeDocument.querySelectorAll('img');
            if (images.length === 0) {
                alert("هیچ تصویری برای دانلود یافت نشد.");
                return;
            }

            let dataImages = [];
            images.forEach((img) => {
                if (img.src.startsWith('data:image')) {
                    dataImages.push(img.src);
                }
            });

            if (dataImages.length === 0) {
                alert("هیچ تصویر ساخته شده‌ای برای دانلود یافت نشد.");
                return;
            }

            const imageBar = document.getElementById('imageBar');
            imageBar.innerHTML = '';
            imageBar.style.display = 'flex';

            dataImages.forEach((imageUrl, index) => {
                const imageItem = document.createElement('div');
                imageItem.classList.add('image-item');
                imageItem.innerHTML = `
                    <img src="${imageUrl}" alt="Image ${index + 1}">
                    <button onclick="processImage('${imageUrl}')">⬇️</button>
                `;
                imageBar.appendChild(imageItem);
            });

        } catch (error) {
            console.error("خطا در شناسایی تصاویر: ", error);
            alert("خطایی در شناسایی تصاویر رخ داد.");
        }
    }

    // تابع برای آپلود تصویر به سرور و دریافت لینک
    window.processImage = function(imageUrl) {
        // نمایش پیام ساخت لینک دانلود
        const buildingLinkNotification = document.createElement('div');
        buildingLinkNotification.classList.add('notification');
        buildingLinkNotification.innerHTML = `<p>در حال ساخت لینک دانلود، لطفاً صبر کنید...</p>`;
        document.body.appendChild(buildingLinkNotification);
        buildingLinkNotification.style.display = 'block';

        // تبدیل data URL به blob
        function dataURLtoBlob(dataurl) {
            let arr = dataurl.split(','), mime = arr[0].match(/:(.*?);/)[1],
                bstr = atob(arr[1]), n = bstr.length, u8arr = new Uint8Array(n);
            while(n--){
                u8arr[n] = bstr.charCodeAt(n);
            }
            return new Blob([u8arr], {type:mime});
        }

        const blob = dataURLtoBlob(imageUrl);

        // آماده‌سازی فرم دیتا
        const formData = new FormData();
        formData.append('image', blob, 'downloaded_image.png');

        // ارسال تصویر به upload.php
        fetch('https://www.yourdomain.com/upload.php', { // آدرس upload.php در سرور خودتان
            method: 'POST',
            body: formData,
            mode: 'cors'
        })
        .then(response => response.json())
        .then(data => {
            buildingLinkNotification.style.display = 'none';
            if (data.success) {
                if (confirm("لینک دانلود آماده است. برای دانلود تصویر روی تأیید کلیک کنید.")) {
                    // باز کردن لینک در تب جدید
                    window.open(data.url, '_blank');
                }
            } else {
                alert('خطا در آپلود تصویر: ' + data.message);
            }
        })
        .catch(error => {
            buildingLinkNotification.style.display = 'none';
            console.error('خطا:', error);
            alert('خطا در آپلود تصویر');
        });
    }
</script>
</p> این کد کاری کن تصاویر که شناسایی می‌کنه در یک اعلان نشون میده خب تو کاری کن اصلا یک اعلان ساده بیاد روی صفحه که بزنه مثلاً یک تصویر یا دو تصویر شناسایی شد داخل اعلان نشون نده یعنی اعلان ساده من و چون اعلان ساده دکمه لغو و تایید داره وقتی کاربر روی تایید کلیک می‌کنه کاری کن تصویر در سایت خودم ذخیره بشه و لینک با دامنه جدید در یک پیغام ساده نمایش داده بشه