XButton

Tombol tambahan: kalkulator umur, auto reload, Hapus iklan

// ==UserScript==
// @name         XButton
// @namespace    http://tampermonkey.net/
// @version      1.0
// @description  Tombol tambahan: kalkulator umur, auto reload, Hapus iklan
// @author       Khudhori
// @match        *://*/*
// @grant        none
// ==/UserScript==

(function() {
    'use strict';

    // Create the floating button (main icon)
    const floatingBtn = document.createElement('div');
    floatingBtn.style.position = 'fixed';
    floatingBtn.style.bottom = '10px';
    floatingBtn.style.right = '10px';
    floatingBtn.style.width = '48px';
    floatingBtn.style.height = '48px';
    floatingBtn.style.backgroundColor = 'transparent';
    floatingBtn.style.borderRadius = '50%';
    floatingBtn.style.overflow = 'hidden';
    floatingBtn.style.zIndex = '9999';
    floatingBtn.style.transition = 'transform 0.5s ease, box-shadow 0.5s ease';
    floatingBtn.style.border = '3px solid #007bff';
    floatingBtn.style.boxShadow = '0 0 10px rgba(0, 0, 0, 0.2)';

    // img floating button
    const iconImg = document.createElement('img');
    iconImg.src = 'https://lh3.googleusercontent.com/a/AGNmyxaEnKjzfKogUt2-V-11G5OAQMl0OZKBz7562IzJ=s96-c';
    iconImg.style.width = '100%';
    iconImg.style.height = '100%';
    iconImg.style.objectFit = 'cover';
    iconImg.style.borderRadius = '50%';
    floatingBtn.appendChild(iconImg);
    document.body.appendChild(floatingBtn);

    // Create container for script buttons
    const btnContainer = document.createElement('div');
    btnContainer.style.position = 'fixed';
    btnContainer.style.bottom = '70px';
    btnContainer.style.right = '10px';
    btnContainer.style.display = 'none';
    btnContainer.style.opacity = '0';
    btnContainer.style.transition = 'opacity 0.2s ease, transform 0.2s ease';
    btnContainer.style.transform = 'translateY(-50px)';
    btnContainer.style.zIndex = '9999';
    document.body.appendChild(btnContainer);

    // Function to create individual buttons
    function createScriptButton(text, callback) {
        const btn = document.createElement('button');
        btn.innerHTML = text;
        btn.style.display = 'block';
        btn.style.marginBottom = '7px';
        btn.style.padding = '7px';
        btn.style.backgroundColor = '#ffffff';
        btn.style.color = '#333333';
        btn.style.border = '1px solid #cccccc';
        btn.style.borderRadius = '10px';
        btn.style.cursor = 'pointer';
        btn.style.fontFamily = 'Helvetica Neue, Arial, sans-serif';
        btn.style.fontSize = '13px';
        btn.style.fontWeight = '400';
        btn.style.boxShadow = '0 2px 4px rgba(0, 0, 0, 0.1)';
        btn.style.opacity = '0';
        btn.style.transform = 'translateY(-20px)';
        btn.style.transition = 'opacity 0.3s ease, transform 0.3s ease';
        btn.onmouseover = () => {
            btn.style.boxShadow = '0 4px 8px rgba(0, 0, 0, 0.2)';
            btn.style.transform = 'scale(1.05)';
        };
        btn.onmouseout = () => {
            btn.style.boxShadow = '0 6px 4px rgba(0, 0, 0, 0.1)';
            btn.style.transform = 'scale(1)';
        };
        btn.onclick = callback;
        btnContainer.appendChild(btn);

        // Show the button with fade-in effect after a small delay
        setTimeout(() => {
            btn.style.opacity = '1';
            btn.style.transform = 'translateY(0)';
        }, 100);
    }

    // Toggle button container visibility animation
    floatingBtn.onclick = () => {
        if (btnContainer.style.display === 'none') {
            btnContainer.style.display = 'block';
            setTimeout(() => {
                btnContainer.style.opacity = '1';
                btnContainer.style.transform = 'translateY(0)';
            }, 100);
            floatingBtn.style.transform = 'rotate(45deg) scale(1.2)';
            floatingBtn.style.boxShadow = '0px 0px 20px rgba(0, 0, 0, 0.2)';
        } else {
            btnContainer.style.opacity = '0';
            btnContainer.style.transform = 'translateY(-20px)';
            setTimeout(() => {
                btnContainer.style.display = 'none';
            }, 300);
            floatingBtn.style.transform = 'rotate(0deg) scale(1)';
            floatingBtn.style.boxShadow = '0px 0px 15px rgba(0, 0, 0, 0.1)';
        }
    };

    // Function to create a calculator popup
    function createCalculator() {
        const calcContainer = document.createElement('div');
        calcContainer.style.position = 'fixed';
        calcContainer.style.top = '50px';
        calcContainer.style.right = '10px';
        calcContainer.style.width = '300px';
        calcContainer.style.padding = '10px';
        calcContainer.style.backgroundColor = '#ffffff';
        calcContainer.style.border = '1px solid #cccccc';
        calcContainer.style.borderRadius = '12px';
        calcContainer.style.boxShadow = '0 2px 4px rgba(0, 0, 0, 0.1)';
        calcContainer.style.zIndex = '10000';
        calcContainer.style.display = 'none';
        calcContainer.style.opacity = '0';
        calcContainer.style.transition = 'opacity 0.3s ease';

        const calcHTML = `
            <div style="margin-bottom: 10px;">
                <input id="calc-display" type="text" readonly style="width: 100%; padding: 10px; font-size: 18px; text-align: right; border: 1px solid #cccccc; border-radius: 6px;">
            </div>
            <div style="margin-bottom: 10px;">
                <label for="birthdate">Tanggal Lahir:</label><br>
                <input id="birthdate-day" type="number" placeholder="Tanggal" style="width: 30%; margin-right: 5px; padding: 5px; border: 1px solid #cccccc; border-radius: 6px;">
                <input id="birthdate-month" type="number" placeholder="Bulan" style="width: 30%; margin-right: 5px; padding: 5px; border: 1px solid #cccccc; border-radius: 6px;">
                <input id="birthdate-year" type="number" placeholder="Tahun" style="width: 35%; padding: 5px; border: 1px solid #cccccc; border-radius: 6px;">
            </div>
            <div style="margin-bottom: 10px;">
                <label for="today-date">Tanggal Hari Ini:</label><br>
                <input id="today-day" type="number" placeholder="Tanggal" style="width: 30%; margin-right: 5px; padding: 5px; border: 1px solid #cccccc; border-radius: 6px;">
                <input id="today-month" type="number" placeholder="Bulan" style="width: 30%; margin-right: 5px; padding: 5px; border: 1px solid #cccccc; border-radius: 6px;">
                <input id="today-year" type="number" placeholder="Tahun" style="width: 35%; padding: 5px; border: 1px solid #cccccc; border-radius: 6px;">
            </div>
            <div style="display: grid; grid-template-columns: repeat(3, 1fr); gap: 5px;">
                <button id="calc-calculate" style="padding: 10px; background-color: #007bff; color: white; border: 1px solid #007bff; border-radius: 6px; grid-column: span 3;">Hitung Usia</button>
                <button id="calc-clear" style="padding: 10px; background-color: #f44336; color: white; border: 1px solid #f44336; border-radius: 6px;">C</button>
                <button id="calc-close" style="padding: 10px; background-color: #007bff; color: white; border: 1px solid #007bff; border-radius: 6px;">Tutup</button>
            </div>
        `;

        calcContainer.innerHTML = calcHTML;
        document.body.appendChild(calcContainer);

        // Calculator logic
        const display = document.getElementById('calc-display');
        const clearBtn = document.getElementById('calc-clear');
        const calculateBtn = document.getElementById('calc-calculate');
        const closeBtn = document.getElementById('calc-close');

        // Function to calculate age
        function calculateAge() {
            const dayOfBirth = parseInt(document.getElementById('birthdate-day').value, 10);
            const monthOfBirth = parseInt(document.getElementById('birthdate-month').value, 10);
            const yearOfBirth = parseInt(document.getElementById('birthdate-year').value, 10);
            const dayToday = parseInt(document.getElementById('today-day').value, 10);
            const monthToday = parseInt(document.getElementById('today-month').value, 10);
            const yearToday = parseInt(document.getElementById('today-year').value, 10);

            if (!isNaN(dayOfBirth) && !isNaN(monthOfBirth) && !isNaN(yearOfBirth) &&
                !isNaN(dayToday) && !isNaN(monthToday) && !isNaN(yearToday)) {
                const birthDate = new Date(yearOfBirth, monthOfBirth - 1, dayOfBirth);
                const todayDate = new Date(yearToday, monthToday - 1, dayToday);

                let ageYears = todayDate.getFullYear() - birthDate.getFullYear();
                let ageMonths = todayDate.getMonth() - birthDate.getMonth();
                let ageDays = todayDate.getDate() - birthDate.getDate();

                if (ageDays < 0) {
                    ageMonths--;
                    ageDays += new Date(todayDate.getFullYear(), todayDate.getMonth(), 0).getDate();
                }
                if (ageMonths < 0) {
                    ageYears--;
                    ageMonths += 12;
                }

                display.value = `Usia: ${ageYears} tahun, ${ageMonths} bulan, ${ageDays} hari`;
            } else {
                display.value = 'Masukkan tanggal yang valid';
            }
        }

        // Button click handlers
        clearBtn.addEventListener('click', () => {
            display.value = ''; // Clear display
            document.getElementById('birthdate-day').value = '';
            document.getElementById('birthdate-month').value = '';
            document.getElementById('birthdate-year').value = '';
            document.getElementById('today-day').value = '';
            document.getElementById('today-month').value = '';
            document.getElementById('today-year').value = '';
        });

        calculateBtn.addEventListener('click', calculateAge);

        closeBtn.addEventListener('click', () => {
            calcContainer.style.opacity = '0';
            setTimeout(() => {
                calcContainer.style.display = 'none';
            }, 300);
        });

        // Prevent closing the calculator when clicking inside it
        calcContainer.addEventListener('click', (event) => {
            event.stopPropagation();
        });

        return calcContainer;
    }

    // Function to create an auto-reload popup with time setting
    function createAutoReloadPopup() {
        const reloadContainer = document.createElement('div');
        reloadContainer.style.position = 'fixed';
        reloadContainer.style.top = '50px';
        reloadContainer.style.right = '10px';
        reloadContainer.style.width = '300px';
        reloadContainer.style.padding = '10px';
        reloadContainer.style.backgroundColor = '#ffffff';
        reloadContainer.style.border = '1px solid #cccccc';
        reloadContainer.style.borderRadius = '12px';
        reloadContainer.style.boxShadow = '0 2px 4px rgba(0, 0, 0, 0.1)';
        reloadContainer.style.zIndex = '10000';
        reloadContainer.style.display = 'none';
        reloadContainer.style.opacity = '0';
        reloadContainer.style.transition = 'opacity 0.3s ease';

        const reloadHTML = `
            <div style="margin-bottom: 10px;">
                <label for="reload-interval">Interval Reload (menit):</label><br>
                <input id="reload-interval" type="number" min="1" placeholder="Menit" style="width: 100%; padding: 5px; border: 1px solid #cccccc; border-radius: 6px;">
            </div>
            <div style="display: grid; grid-template-columns: repeat(2, 1fr); gap: 5px;">
                <button id="reload-start" style="padding: 10px; background-color: #007bff; color: white; border: 1px solid #007bff; border-radius: 6px; grid-column: span 1;">Mulai</button>
                <button id="reload-stop" style="padding: 10px; background-color: #f44336; color: white; border: 1px solid #f44336; border-radius: 6px; grid-column: span 1;">Berhenti</button>
                <button id="reload-close" style="padding: 10px; background-color: #007bff; color: white; border: 1px solid #007bff; border-radius: 6px; grid-column: span 2;">Tutup</button>
            </div>
        `;

        reloadContainer.innerHTML = reloadHTML;
        document.body.appendChild(reloadContainer);

        // Auto-reload logic
        let reloadInterval = null;

        const intervalInput = document.getElementById('reload-interval');
        const startBtn = document.getElementById('reload-start');
        const stopBtn = document.getElementById('reload-stop');
        const closeBtn = document.getElementById('reload-close');

        startBtn.addEventListener('click', () => {
            const minutes = parseInt(intervalInput.value, 10);
            if (!isNaN(minutes) && minutes > 0) {
                if (reloadInterval !== null) clearInterval(reloadInterval);
                reloadInterval = setInterval(() => {
                    location.reload();
                }, minutes * 60 * 1000); // Convert minutes to milliseconds
            }
        });

        stopBtn.addEventListener('click', () => {
            if (reloadInterval !== null) clearInterval(reloadInterval);
        });

        closeBtn.addEventListener('click', () => {
            reloadContainer.style.opacity = '0'; // Fade out reload popup
            setTimeout(() => {
                reloadContainer.style.display = 'none';
            }, 300);
        });

        // Prevent closing the reload popup when clicking inside it
        reloadContainer.addEventListener('click', (event) => {
            event.stopPropagation();
        });

        return reloadContainer;
    }
	
// start tombol

    // Tombol Kalkulator Umur
    createScriptButton('Kalkulator Umur', () => {
        const calcContainer = createCalculator();
        calcContainer.style.display = 'block';
        setTimeout(() => {
            calcContainer.style.opacity = '1';
        }, 100);
    });

    // Tombol auto reload
    createScriptButton('Auto Reload', () => {
        const reloadContainer = createAutoReloadPopup();
        reloadContainer.style.display = 'block';
        setTimeout(() => {
            reloadContainer.style.opacity = '1';
        }, 100);
    });

// Create the ad removal button
createScriptButton('Hapus Iklan', () => {
    // Function to hide ads
    const hideAds = () => {
        const adSelectors = [
            '[id^="ad"]',
            '[class*="ad"]',
            '[id*="ad"]',
            '[class*="advertisement"]',
            '[id^="banner"]',
            '[class*="banner"]',
            '[id*="banner"]',
            '[class*="promo"]',
            '[id^="promo"]',
            '[class*="sponsored"]',
            '[id*="sponsored"]',
            '[class*="ads"]',
            '[id*="ads"]',
            '[id*="popup"]',
            '[class*="popup"]',
            '[class*="overlay"]',
            '[id*="overlay"]'
        ];

        adSelectors.forEach(selector => {
            const ads = document.querySelectorAll(selector);
            ads.forEach(ad => ad.style.display = 'none');
        });
    };

    // Function to block popups on link click
    const blockPopups = () => {
        document.querySelectorAll('a').forEach(link => {
            link.addEventListener('click', (event) => {
                const href = link.getAttribute('href');
                if (href && (href.includes('popup') || href.includes('ad') || href.includes('advertisement'))) {
                    event.preventDefault();
                    console.log('Blocked popup ad link:', href);
                }
            });
        });
    };

    // Execute both functions
    hideAds();
    blockPopups();
});


// end tombol

    // Close both containers when 'Esc' key is pressed
    document.addEventListener('keydown', (event) => {
        if (event.key === 'Escape') {
            // Close calculator if visible
            const calcContainer = document.querySelector('div[style*="top: 50px"][style*="right: 10px"]');
            if (calcContainer) {
                calcContainer.style.opacity = '0';
                setTimeout(() => {
                    calcContainer.style.display = 'none';
                }, 300);
            }

            // Close reload popup if visible
            const reloadContainer = document.querySelector('div[style*="top: 50px"][style*="right: 10px"]');
            if (reloadContainer) {
                reloadContainer.style.opacity = '0';
                setTimeout(() => {
                    reloadContainer.style.display = 'none';
                }, 300);
            }

            // Close button container if visible
            if (btnContainer.style.display === 'block') {
                btnContainer.style.opacity = '0';
                btnContainer.style.transform = 'translateY(-20px)';
                setTimeout(() => {
                    btnContainer.style.display = 'none';
                }, 300);
                floatingBtn.style.transform = 'rotate(0deg) scale(1)';
                floatingBtn.style.boxShadow = '0px 0px 15px rgba(0, 0, 0, 0.1)';
            }
        }
    });

})();