Webpage-Saver-Single-File-Userscript

Webpage-Saver-Single-File-Userscript.user.js

// ==UserScript==
// @name         Webpage Saver v2.1
// @namespace    https://github.com/gildas-lormeau/SingleFile
// @author      Intika https://github.com/intika
// @version      2.1
// @match        *://*/*
// @grant        none
// ==/UserScript==

(async function() {
    const btn = document.createElement('button');
    btn.textContent = "💾 Save the page";
    btn.style.cssText = "position:fixed;bottom:20px;right:20px;z-index:9999999;padding:10px 15px;background:#007AFF;color:#fff;border:none;border-radius:20px;font-family:sans-serif;font-weight:bold;box-shadow:0 4px 6px rgba(0,0,0,0.3);";
    document.body.appendChild(btn);

    btn.addEventListener('click', async () => {
        btn.textContent = "⏳ Chargement JS...";
        
        const script = document.createElement('script');
        script.src = 'https://cdn.jsdelivr.net/gh/gildas-lormeau/SingleFile@master/lib/single-file.js';
        document.head.appendChild(script);

        script.onload = async () => {
            // BOUM : on planque le bouton pour ne pas polluer le DOM aspiré
            btn.style.display = 'none';
            
            try {
                const sf = window.singlefile; 
                const { content } = await sf.getPageData({
                    removeHiddenElements: true,
                    removeUnusedStyles: true,
                    blockScripts: true,
                    blockAudios: true,
                    blockVideos: true
                });

                document.body.innerHTML = '';
                document.body.style.background = '#111';
                
                const container = document.createElement('div');
                container.style.cssText = 'padding:20px; height:100vh; display:flex; flex-direction:column; gap:10px; box-sizing:border-box;';
                
                const controls = document.createElement('div');
                controls.style.cssText = 'display:flex; gap:10px;';
                
                const btnCopy = document.createElement('button');
                btnCopy.textContent = "📋 Copy";
                btnCopy.style.cssText = 'flex:1; padding:15px; font-size:16px; font-weight:bold; background:#333; color:#fff; border:none; border-radius:10px;';
                
                const btnShare = document.createElement('button');
                btnShare.textContent = "📤 Share (Save to Files)";
                btnShare.style.cssText = 'flex:1; padding:15px; font-size:16px; font-weight:bold; background:#007AFF; color:#fff; border:none; border-radius:10px;';
                
                const ta = document.createElement('textarea');
                ta.value = content;
                ta.style.cssText = 'flex:1; width:100%; background:#000; color:#0f0; font-family:monospace; padding:10px; border:1px solid #333; border-radius:10px; margin-top:10px;';
                
                btnCopy.onclick = () => {
                    ta.select();
                    document.execCommand('copy');
                    btnCopy.textContent = "✅ Copied!";
                };
                
                btnShare.onclick = async () => {
                    if (navigator.share) {
                        try {
                            await navigator.share({
                                title: document.title,
                                text: content
                            });
                        } catch (e) {
                            console.error(e);
                        }
                    }
                };

                controls.appendChild(btnCopy);
                controls.appendChild(btnShare);
                container.appendChild(controls);
                container.appendChild(ta);
                document.body.appendChild(container);
                
            } catch (error) {
                alert("Erreur : " + error.message);
            }
        };
    });
})();