script.js

document.addEventListener('DOMContentLoaded', function() {
    // Tab functionality
    const tabBtns = document.querySelectorAll('.tab-btn');
    const tabPanels = document.querySelectorAll('.tab-panel');

    tabBtns.forEach(btn => {
        btn.addEventListener('click', () => {
            const tabId = btn.getAttribute('data-tab');
            
            // Remove active class from all buttons and panels
            tabBtns.forEach(b => b.classList.remove('active'));
            tabPanels.forEach(p => p.classList.remove('active'));
            
            // Add active class to current button and panel
            btn.classList.add('active');
            document.getElementById(tabId).classList.add('active');
        });
    });

    // Copy functionality with Fallback for non-HTTPS
    const copyBtns = document.querySelectorAll('.copy-btn');
    const copyTimeouts = new Map();

    copyBtns.forEach(btn => {
        btn.addEventListener('click', () => {
            const textToCopy = btn.getAttribute('data-copy');
            
            if (navigator.clipboard && window.isSecureContext) {
                // Modern way
                navigator.clipboard.writeText(textToCopy)
                    .then(() => showSuccess(btn))
                    .catch(err => fallbackCopy(textToCopy, btn));
            } else {
                // Fallback way
                fallbackCopy(textToCopy, btn);
            }
        });
    });

    function fallbackCopy(text, btn) {
        const textArea = document.createElement("textarea");
        textArea.value = text;
        textArea.className = "clipboard-helper";
        document.body.appendChild(textArea);
        textArea.focus();
        textArea.select();
        
        try {
            const successful = document.execCommand('copy');
            if (successful) {
                showSuccess(btn);
            } else {
                alert('Gagal menyalin alamat.');
            }
        } catch (err) {
            console.error('Fallback copy failed', err);
            alert('Gagal menyalin alamat.');
        }
        
        document.body.removeChild(textArea);
    }

    function showSuccess(btn) {
        // Clear existing timeout for this button if any
        if (copyTimeouts.has(btn)) {
            clearTimeout(copyTimeouts.get(btn));
        }

        const originalText = btn.getAttribute('data-original-text') || btn.innerText;
        if (!btn.getAttribute('data-original-text')) {
            btn.setAttribute('data-original-text', originalText);
        }

        btn.innerText = 'Copied!';
        btn.classList.add('copied');
        
        const timeoutId = setTimeout(() => {
            btn.innerText = originalText;
            btn.classList.remove('copied');
            copyTimeouts.delete(btn);
        }, 2000);

        copyTimeouts.set(btn, timeoutId);
    }
});