در این کد دکمه لطفاً صبر کنید و نوار پیشرفت یک عملکرد فوق العاده ای داره می‌دونی چیه این عملکردش اینجوری که وقتی دکمه لطفاً صبر کنید و نوار پیشرفت در حال باز شدن است اگه اینترنت قطع بشه دکمه لطفاً صبر کنید و نوار پیشرفت از بین نمیره و قطع نمیشه م استپ میشه در واقع <p>&nbsp;</p>
<style>
        /* استایل‌ها همانند قبل باقی می‌مانند */
        body {
            margin: 0;
            padding: 0;
            overflow: hidden;
            height: 100vh;
            background-color: #f0f0f0;
            font-family: Arial, sans-serif;
        }

        .iframe-container {
            position: relative;
            width: 100%;
            height: 100vh;
            overflow: hidden;
        }

        iframe {
            width: 100%;
            height: 100%;
            border: none;
            display: none;
            position: relative;
        }

        .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, .description-button {
            display: block;
            width: 90px;
            color: white;
            text-align: center;
            padding: 6px;
            border-radius: 5px;
            cursor: pointer;
            font-size: 11px;
            transition: background-color 0.3s;
            position: fixed;
            top: 10px;
            z-index: 10001;
            text-decoration: none;
        }

        .download-button {
            background-color: #4CAF50;
            right: 10px;
        }

        .description-button {
            background-color: rgb(84, 110, 122);
            left: 10px;
        }

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

        .modal {
            display: none;
            position: fixed;
            z-index: 10002;
            left: 0;
            top: 0;
            width: 100%;
            height: 100%;
            background-color: rgba(0, 0, 0, 0.5);
        }

        .modal-content {
            background-color: #fefefe;
            margin: 15% auto;
            padding: 20px;
            border: 1px solid #888;
            width: 80%;
            max-width: 400px;
            text-align: center;
            border-radius: 5px;
        }

        .modal-button {
            margin-top: 20px;
            padding: 10px 20px;
            border: none;
            border-radius: 5px;
            cursor: pointer;
            font-size: 14px;
        }

        .cancel-btn {
            background-color: #f44336;
            color: white;
        }

        .translate-btn {
            background-color: #4CAF50;
            color: white;
        }

        .translate-btn:hover {
            background-color: #45a049;
        }

        .image-container {
            display: flex;
            flex-wrap: wrap;
            justify-content: center;
        }

        .image-item {
            margin: 10px;
            text-align: center;
        }

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

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

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

        .download-button-bottom {
            position: fixed;
            bottom: 10px;
            left: 50%;
            transform: translateX(-50%);
            background-color: #4CAF50;
            padding: 10px;
            border-radius: 5px;
            color: white;
            text-align: center;
            font-size: 14px;
            text-decoration: none;
            z-index: 10001;
            cursor: pointer;
        }

        .download-button-bottom:hover {
            background-color: #45a049;
        }
    </style>
<!-- دکمه‌های دانلود و توضیحات -->
<p><a href="#" class="download-button" id="downloadButton">دانلود تصویر 📥</a></p>
<p><a href="#" class="description-button" id="descriptionButton">توضیحات</a></p>
<!-- پنجره سفارشی (modal) برای نمایش تصاویر دانلود -->
<div id="myModal" class="modal">
<div class="modal-content">
<p style="text-align: center;">تصاویر شناسایی&zwnj;شده</p>
<div class="image-container" id="imageContainer"></div>
<button class="modal-button cancel-btn" id="closeBtn">بستن</button></div>
</div>
<!-- پنجره سفارشی (modal) برای نمایش توضیحات -->
<div id="myDescriptionModal" class="modal">
<div class="modal-content">
<p>مبدل تصویر با هوش مصنوعی</p>
<button class="modal-button translate-btn" id="translateBtn">مترجم</button> <button class="modal-button cancel-btn" id="closeDescriptionBtn">بستن</button></div>
</div>
<!-- لودینگ و iframe -->
<div class="iframe-container">
<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>
<!-- افزودن ویژگی‌های sandbox و allow به iframe --> <iframe id="myIframe" sandbox="allow-scripts allow-same-origin allow-forms allow-modals" allow="clipboard-read; clipboard-write"></iframe></div>
<!-- دکمه دانلود تصویر در پایین صفحه -->
<p><a href="#" class="download-button-bottom" id="downloadButtonBottom">دانلود تصویر 📥</a></p>
<p>
<script>
        const siteURL = 'https://yanze-pulid.hf.space/';
        const excludeUrls = [
            'https://yanze-pulid.hf.space/--replicas/3t64n/file=/tmp/gradio/7567beceda2541f726af7beb4c9aa857b4a96b77/liuyifei.png',
            'https://yanze-pulid.hf.space/--replicas/ms3gr/file=/tmp/gradio/7567beceda2541f726af7beb4c9aa857b4a96b77/liuyifei.png', // تصویر همیشه موجود در سایت است
            // می‌توانید URL‌های دیگری را نیز اضافه کنید
        ];

        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;

        // متونی که باید جایگزین شوند
        const textsToReplace = {
            "Techenical report": "ezmary noori",
            "If PuLID is helpful, please help to ⭐ the . Thanks!": "اگر این ربات براتون خوشایند است  پنج ستاره بدید‌ .",
            "guozinan.1@bytedance.com": "ezmarynoori@gmail.com",
            "On mobile, the connection can break if this tab is unfocused or the device sleeps, losing your position in queue.": "در حال اجرای دستور کاربر برای تبدیل تصویر به مدل دلخواه با برنامه هوش مصنوعی",
            "Loading...": "...لطفاً صبر کنید",
            "Examples": "نمونه ها",
            "Generate": "شروع ساخت",
            "Prompt": "متن",
            "Negative Prompt": "چه چیزی اعمال نشه",
            "we provide some examples in the bottom, you can try these example prompts first": "ما برخی نمونه‌ها را در پایین ارائه می‌دهیم، می‌توانید ابتدا این مثال‌های متن را امتحان کنید.",
            "a single ID image is usually sufficient, you can also supplement with additional auxiliary images": "یک تصویر ID معمولاً کافی است، می‌توانید با تصاویر کمکی اضافی آن را تکمیل کنید.",
            "We offer two modes: fidelity mode and extremely style mode. In most cases, the default fidelity mode should suffice. If you find that the generated results are not stylized enough, you can choose the extremely style mode": "ما دو حالت ارائه می‌دهیم: حالت وفاداری و حالت استایل بسیار. در بیشتر موارد، حالت پیش‌فرض وفاداری کافی است. اگر متوجه شدید نتایج تولید شده به اندازه کافی استایل‌دار نیستند، می‌توانید حالت استایل بسیار را انتخاب کنید.",
            "turn this off)": "ترکیب شناسه (اگر می‌خواهید دو تصویر شناسه را ترکیب کنید، این گزینه را روشن کنید، در غیر این صورت خاموش کنید)",
            "fidelity": "وفاداری",
            "extremely style": "استایل بسیار",
            "ID scale": "مقیاس ID",
            "Width": "عرض",
            "Height": "ارتفاع",
            "Steps": "مراحل",
            "mode": "حالت",
            "Num samples": "تعداد نمونه‌ها",
            "Seed": "بذر",
            "You have exceeded your GPU quota": "محدودیت جی پی یو! انگار با ربات زیاد کار کردی. این محدودیت چند ساعت بعد برداشته میشه اما اگه میخوای الان مجدد تولید کنی فیلتر شکن پور لایت طبق آموزش ویدیویی یک بار خاموش و روشن کن این محدودیت برداشته میشه",
            "error": "خسته شدم🥹 چند دقیقه بعد بیا. اگه الان میخوای بسازم مشکلی نیست آی پی عوض کن",
            "Error": "خسته شدم🥹 چند دقیقه بعد بیا. اگه الان میخوای بسازم مشکلی نیست آی پی عوض کن"
        };

        // متونی که باید مخفی شوند
        const unwantedTexts = [
            "wuyanze123@gmail.com", // ایمیل مخفی شده
            "Gradio Demo", // مخفی شده
            "🤗", // مخفی شده
            "ArXiv", // مخفی شده
            "LICENSE file", // مخفی شده
            "PuLID", // مخفی شده
            "Use via API", // مخفی شده
            "Use via APIlogo" // مخفی شده
        ];

        // لینک‌هایی که باید مخفی شوند
        const linksToHide = [
            'https://github.com/ToTheBeginning/PuLID',
            'https://gradio.app/',
            'https://yanze-pulid.hf.space/placeholder',
            'https://arxiv.org/abs/2404.16022' // اضافه شده
        ];

        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';
            document.getElementById('myIframe').style.display = 'block';

            try {
                hideUnwantedElements();
                setupElementHiding();
            } catch (e) {
                console.error('Cannot access iframe content:', e);
            }
        }

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

        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 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();
                });
        }

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

                if (!iframeDocument) return;

                // ابتدا جایگزینی متون مشخص‌شده
                Object.keys(textsToReplace).forEach(originalText => {
                    const newText = textsToReplace[originalText];
                    const textNodes = getTextNodesContaining(iframeDocument.body, originalText);
                    textNodes.forEach(node => {
                        node.textContent = node.textContent.replace(new RegExp(escapeRegExp(originalText), 'g'), newText);
                    });
                });

                // سپس مخفی کردن متون مشخص‌شده
                unwantedTexts.forEach(unwanted => {
                    const textNodes = getTextNodesContaining(iframeDocument.body, unwanted);
                    textNodes.forEach(node => {
                        const parentElement = node.parentElement;
                        if (parentElement) {
                            parentElement.style.display = 'none';
                        }
                    });
                });

                // مخفی کردن لینک‌های مشخص‌شده
                const links = iframeDocument.querySelectorAll('a');
                links.forEach(link => {
                    if (linksToHide.includes(link.href)) {
                        link.style.display = 'none';
                    }
                });

            } catch (error) {
                console.error("Cannot access iframe content: ", error);
            }
        }

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

                if (!iframeDocument) return;

                hideUnwantedElements();

                const observer = new MutationObserver(function(mutations) {
                    mutations.forEach(function(mutation) {
                        if (mutation.addedNodes.length) {
                            hideUnwantedElements();
                        }
                    });
                });

                observer.observe(iframeDocument.body, {
                    childList: true,
                    subtree: true
                });
            } catch (error) {
                console.error("Cannot access iframe content: ", error);
            }
        }

        function getTextNodesContaining(node, text) {
            let textNodes = [];
            if (node.nodeType === Node.TEXT_NODE && node.nodeValue.includes(text)) {
                textNodes.push(node);
            } else {
                node.childNodes.forEach(child => {
                    textNodes = textNodes.concat(getTextNodesContaining(child, text));
                });
            }
            return textNodes;
        }

        function escapeRegExp(string) {
            return string.replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
        }

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

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

                let pngImages = [];
                images.forEach((img) => {
                    if (img.src.endsWith('.png') && !excludeUrls.includes(img.src)) {
                        pngImages.push(img.src);
                    }
                });

                pngImages = pngImages.slice(0, 4);

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

                const imageContainer = document.getElementById('imageContainer');
                imageContainer.innerHTML = '';

                pngImages.forEach((imageUrl, index) => {
                    const imageItem = document.createElement('div');
                    imageItem.classList.add('image-item');
                    imageItem.innerHTML = `
                        <img src="${imageUrl}" alt="Image ${index + 1}">
                        <button onclick="downloadImage('${imageUrl}')">دانلود</button>
                    `;
                    imageContainer.appendChild(imageItem);
                });

                document.getElementById('myModal').style.display = 'block';

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

        function downloadImage(imageUrl) {
            window.open(imageUrl, '_blank');
        }

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

        const modal = document.getElementById('myModal');
        const closeBtn = document.getElementById('closeBtn');

        closeBtn.addEventListener('click', function() {
            modal.style.display = 'none';
        });

        window.addEventListener('click', function(event) {
            if (event.target == modal) {
                modal.style.display = 'none';
            }
            if (event.target == descriptionModal) {
                descriptionModal.style.display = 'none';
            }
        });

        const descriptionModal = document.getElementById('myDescriptionModal');
        const descriptionButton = document.getElementById('descriptionButton');
        const closeDescriptionBtn = document.getElementById('closeDescriptionBtn');
        const translateBtn = document.getElementById('translateBtn');

        descriptionButton.addEventListener('click', function(event) {
            event.preventDefault();
            descriptionModal.style.display = 'block';
        });

        closeDescriptionBtn.addEventListener('click', function() {
            descriptionModal.style.display = 'none';
        });

        translateBtn.addEventListener('click', function() {
            window.open('https://translate.google.com/?hl=fa&sl=fa&tl=en&op=translate', '_blank');
        });

        loadIframe();
        startProgress();
    </script>
</p> الان من میخواستم این کد پایین هم نوار پیشرفت و دکمه لطفاً صبر کنید اش استپ بشه در وقتی که اینترنت قطع میشه <p>&nbsp;</p>
<style>
        body {
            margin: 0;
            padding: 0;
            overflow: hidden;
            height: 100vh;
            background-color: #f0f0f0;
            font-family: Arial, sans-serif;
        }

        .iframe-container {
            position: relative;
            width: 100%;
            height: 100vh;
            overflow: hidden;
        }

        iframe {
            width: 100%;
            height: 100%;
            border: none;
            display: none; /* مخفی تا زمانی که سایت بارگذاری شود */
        }

        .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, .description-button {
            display: block;
            width: 90px;
            color: white;
            text-align: center;
            padding: 6px;
            border-radius: 5px;
            cursor: pointer;
            font-size: 11px;
            transition: background-color 0.3s;
            position: fixed;
            top: 10px;
            z-index: 10001;
            text-decoration: none;
        }

        .download-button {
            background-color: #4CAF50;
            right: 10px;
        }

        .description-button {
            background-color: rgb(84, 110, 122);
            left: 10px;
        }

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

        .modal {
            display: none;
            position: fixed;
            z-index: 10002;
            left: 0;
            top: 0;
            width: 100%;
            height: 100%;
            background-color: rgba(0, 0, 0, 0.5);
        }

        .modal-content {
            background-color: #fefefe;
            margin: 10% auto;
            padding: 20px;
            border: 1px solid #888;
            width: 90%;
            max-width: 500px;
            text-align: center;
            border-radius: 5px;
        }

        .modal-button {
            margin-top: 20px;
            padding: 10px 20px;
            border: none;
            border-radius: 5px;
            cursor: pointer;
            font-size: 14px;
        }

        .close-btn {
            background-color: #f44336;
            color: white;
        }

        .translate-btn {
            background-color: #4CAF50;
            color: white;
        }

        .translate-btn:hover {
            background-color: #45a049;
        }

        .image-container {
            display: flex;
            flex-wrap: wrap;
            justify-content: center;
            margin-top: 20px;
        }

        .image-item {
            margin: 10px;
            text-align: center;
        }

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

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

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

        .download-button-bottom {
            position: fixed;
            bottom: 10px;
            left: 50%;
            transform: translateX(-50%);
            background-color: #4CAF50;
            padding: 10px;
            border-radius: 5px;
            color: white;
            text-align: center;
            font-size: 14px;
            text-decoration: none;
            z-index: 10001;
            cursor: pointer;
        }

        .download-button-bottom:hover {
            background-color: #45a049;
        }
    </style>
<!-- دکمه‌های دانلود و توضیحات -->
<p><a href="#" class="download-button" id="downloadButton">دانلود تصویر 📥</a> <a href="#" class="description-button" id="descriptionButton">توضیحات</a></p>
<!-- پنجره سفارشی (modal) برای نمایش تصاویر دانلود -->
<div id="downloadModal" class="modal">
<div class="modal-content">
<p style="text-align: center;">تصاویر شناسایی&zwnj;شده</p>
<div class="image-container" id="imageContainer"></div>
<button class="modal-button close-btn" id="closeDownloadModalBtn">بستن</button></div>
</div>
<!-- پنجره سفارشی (modal) برای نمایش توضیحات -->
<div id="myModal" class="modal">
<div class="modal-content">
<p style="text-align: center;">افزایش کیفیت تصاویر</p>
<p style="text-align: center;">با <span style="color: #008080;">هوش مصنوعی</span></p>
<p style="text-align: center;">وضوح تصاویر را با استفاده از پیشرفته&zwnj;ترین مدل بالا ببرید.</p>
<p style="text-align: center;">عکس&zwnj;های تار و پیکسلی را با این هوش مصنوعی افزایش دهید.</p>
<button class="modal-button translate-btn" id="translateBtn">مترجم</button> <button class="modal-button close-btn" id="closeBtn">بستن</button></div>
</div>
<!-- لودینگ و iframe -->
<div class="iframe-container">
<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>
<!-- افزودن ویژگی‌های sandbox و allow به iframe --> <iframe id="myIframe" sandbox="allow-scripts allow-same-origin allow-forms allow-modals" allow="clipboard-read; clipboard-write"></iframe></div>
<!-- دکمه دانلود تصویر در پایین صفحه -->
<p><a href="#" class="download-button-bottom" id="downloadButtonBottom">دانلود تصویر 📥</a></p>
<p>
<script>
        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';
            document.getElementById('myIframe').style.display = 'block';
            hideUnwantedElements();
            setupElementHiding();
        }

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

        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 loadIframe() {
            const iframe = document.getElementById('myIframe');
            const urlParts = ['https:', '', 'finegrain-finegrain-object-eraser.hf.space', ''];
            iframe.src = urlParts.join('/');
            iframe.onload = iframeLoaded;
            iframe.onerror = iframeError;
        }

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

                if (!iframeDocument) return;

                // لیست لینک‌های ناخواسته
                const unwantedLinks = [
                    'https://gradio.app/',
                    'https://huggingface.co/spaces/fffiloni/PASD?duplicate=true',
                    'https://github.com/yangxy/PASD',
                    'https://huggingface.co/papers/2308.14469',
                    'https://editor.finegrain.ai/signup?utm_source=hf&utm_campaign=object-eraser', // لینک Finegrain Editor
                    'https://github.com/finegrain-ai/refiners' // لینک GitHub Refiners
                ];

                // مخفی کردن لینک‌های مشخص‌شده و تصاویر داخل آن‌ها
                unwantedLinks.forEach(url => {
                    const links = iframeDocument.querySelectorAll(`a[href="${url}"]`);
                    links.forEach(link => {
                        link.style.display = 'none';
                        // مخفی کردن تصاویر داخل لینک
                        const images = link.querySelectorAll('img');
                        images.forEach(img => {
                            img.style.display = 'none';
                        });
                    });
                });

                // مخفی کردن تصاویر با src مشخص‌شده
                const images = iframeDocument.querySelectorAll('img');
                images.forEach(img => {
                    const src = img.src;
                    if (unwantedLinks.includes(src)) {
                        img.style.display = 'none';
                    }
                });

                // مخفی کردن متون مشخص‌شده
                const unwantedTexts = [
                    "Pixel-Aware Stable Diffusion for Realistic Image Super-resolution and Personalized Stylization",
                    "Made with Gradio",
                    "ساخته شده با gradio",
                    "Finegrain Editor", // اضافه کردن متن Finegrain Editor در لیست متون ناخواسته
                    "all the Finegrain spaces are now reunited under the" // اضافه کردن متن مورد نظر برای مخفی کردن
                ];

                unwantedTexts.forEach(unwanted => {
                    const textNodes = getTextNodesContaining(iframeDocument.body, unwanted);
                    textNodes.forEach(node => {
                        const parentElement = node.parentElement;
                        if (parentElement) {
                            parentElement.style.display = 'none';
                        }
                    });
                });

                // جایگزینی متون مشخص‌شده
                const textsToReplace = {
                    "NEW: ": "حذف اشیا از تصاویر با برنامه هوش مصنوعی",
                    "🚀": "",
                    "By bounding box": "جعبه محدود کننده",
                    "By prompt": "با متن",
                    "What should we erase?": "چه چیزی رو حذف کنیم ؟ انگلیسی وارد کن",
                    "Erase Object": "شروع ساخت",
                    "Give it a shot!": "",
                    "This space is powered by Refiners, our open source micro-framework for simple foundation model adaptation.": "",
                    "If you enjoyed it, please consider starring Refiners on GitHub!": "این ابزار با استفاده از تکنولوژی پیشرفته هوش مصنوعی اشیاء رو از تصاویر حذف می‌کنه و با برنامه های ادیت کاملا متفاوت است.",
                    "Examples": "نمونه ها",
                    "no manual work required!": "",
                    "Not only will the object disappear, but so will its effects on the scene, like shadows or reflections.": "",
                    "You have exceeded your GPU quota": "محدودیت جی پی یو: انگار با ربات زیاد کار کردی! این محدودیت ۱۲ ساعت بعد برداشته میشه،اما اگه الان میخوای این محدودیت برداشته بشه امکانش است. طبق ویدیو آموزشی داخل برنامه فیلترشکن پور لایت یک بار خاموش کن و دوباره روشن کن این محدودیت برداشته میشه.",
                    "Object Eraser Powered By Refiners": "نسخه پیشرفته حذف اشیاء دلخواه",
                    "Erase any object from your image just by naming it — ": "هر شیئی را از تصویر خود تنها با نام بردن آن پاک کنید — بدون نیاز به کار دستی! نه تنها آن شیء ناپدید خواهد شد، بلکه اثرات آن بر روی صحنه مثل سایه‌ها یا انعکاس‌ها نیز از بین خواهند رفت.",
                    "On mobile, the connection can break if this tab is unfocused or the device sleeps, losing your position in queue.": "اجرای دستور کاربر برای افزایش کیفیت عکس با برنامه هوش مصنوعی",
                    "Error": "خسته شدم🥺 میخوای دوباره بسازم؟ مشکلی نیست آی‌پی عوض کن",
                    "error": "خسته شدم🥺 میخوای دوباره بسازم؟ مشکلی نیست آی‌پی عوض کن"
                };

                Object.keys(textsToReplace).forEach(originalText => {
                    const newText = textsToReplace[originalText];
                    const textNodes = getTextNodesContaining(iframeDocument.body, originalText);
                    textNodes.forEach(node => {
                        node.textContent = node.textContent.replace(new RegExp(escapeRegExp(originalText), 'gi'), newText);
                    });
                });

            } catch (error) {
                console.error("نمی‌توان به محتوای iframe دسترسی پیدا کرد: ", error);
            }
        }

        function getTextNodesContaining(node, text) {
            let textNodes = [];
            if (node.nodeType === Node.TEXT_NODE && node.nodeValue.includes(text)) {
                textNodes.push(node);
            } else {
                node.childNodes.forEach(child => {
                    textNodes = textNodes.concat(getTextNodesContaining(child, text));
                });
            }
            return textNodes;
        }

        function escapeRegExp(string) {
            return string.replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
        }

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

                if (!iframeDocument) return;

                hideUnwantedElements();

                const observer = new MutationObserver(function(mutations) {
                    mutations.forEach(function(mutation) {
                        if (mutation.addedNodes.length) {
                            hideUnwantedElements();
                        }
                    });
                });

                observer.observe(iframeDocument.body, {
                    childList: true,
                    subtree: true
                });
            } catch (error) {
                console.error("نمی‌توان به محتوای iframe دسترسی پیدا کرد: ", error);
            }
        }

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

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

                let webpImages = [];
                images.forEach((img) => {
                    if ((img.src.endsWith('.webp')) && !img.src.includes('data:image')) {
                        webpImages.push(img.src);
                    }
                });

                if (webpImages.length === 0) {
                    alert("هیچ تصویر با فرمت WebP برای دانلود یافت نشد.");
                    return;
                }

                const imageContainer = document.getElementById('imageContainer');
                imageContainer.innerHTML = '';

                webpImages.forEach((imageUrl, index) => {
                    const imageItem = document.createElement('div');
                    imageItem.classList.add('image-item');
                    imageItem.innerHTML = `
                        <img src="${imageUrl}" alt="Image ${index + 1}">
                        <button onclick="downloadImage('${imageUrl}')">دانلود</button>
                    `;
                    imageContainer.appendChild(imageItem);
                });

                document.getElementById('downloadModal').style.display = 'block';

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

        function downloadImage(imageUrl) {
            if (confirm("برای دانلود تصویر روی تایید کلیک کنید و بعد از باز شدن مرورگر روی تصویر محکم نگهدارید و بارگیری تصویر را کلیک کنید.")) {
                window.open(imageUrl, '_blank');
            }
        }

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

        const modal = document.getElementById('myModal');
        const closeBtn = document.getElementById('closeBtn');
        const descriptionButton = document.getElementById('descriptionButton');
        const translateBtn = document.getElementById('translateBtn');

        // نمایش پنجره توضیحات
        descriptionButton.addEventListener('click', function(event) {
            event.preventDefault();
            modal.style.display = 'block';
        });

        // دکمه بستن داخل پنجره
        closeBtn.addEventListener('click', function() {
            modal.style.display = 'none';
        });

        // دکمه مترجم داخل پنجره
        translateBtn.addEventListener('click', function() {
            window.open('https://translate.google.com/?hl=fa&sl=fa&tl=en&op=translate', '_blank');
        });

        // بستن پنجره در صورت کلیک خارج از آن
        window.addEventListener('click', function(event) {
            if (event.target == modal) {
                modal.style.display = 'none';
            }
            if (event.target == downloadModal) {
                downloadModal.style.display = 'none';
            }
        });

        const downloadModal = document.getElementById('downloadModal');
        const closeDownloadModalBtn = document.getElementById('closeDownloadModalBtn');

        closeDownloadModalBtn.addEventListener('click', function() {
            downloadModal.style.display = 'none';
        });

        loadIframe();
        startProgress();
    </script>
</p> کد کامل یکجا درست کن بفرست  بدون اینکه مخفی سازی ها از بین بره کد دوم منو درست کن