app.js

(() => {
    'use strict';

    // ─── DOM References ───────────────────────────────────────────
    const form             = document.getElementById('profilerForm');
    const generateBtn      = document.getElementById('generateBtn');
    const outputPlaceholder = document.getElementById('outputPlaceholder');
    const outputContent    = document.getElementById('outputContent');
    const outputList       = document.getElementById('outputList');
    const passwordCounter  = document.getElementById('passwordCounter');
    const copyBtn          = document.getElementById('copyBtn');
    const downloadBtn      = document.getElementById('downloadBtn');
    const searchInput      = document.getElementById('searchInput');
    const progressContainer = document.getElementById('progressContainer');
    const progressBar      = document.getElementById('progressBar');
    const toast            = document.getElementById('toast');
    const toastMessage     = document.getElementById('toastMessage');

    let currentPasswords = [];

    form.addEventListener('submit', (e) => {
        e.preventDefault();

        const info = {
            firstName:   document.getElementById('firstName').value,
            lastName:    document.getElementById('lastName').value,
            nickname:    document.getElementById('nickname').value,
            dob:         document.getElementById('dob').value,
            mobile:      document.getElementById('mobile').value,
            birthYear:   document.getElementById('birthYear').value,
            partnerName: document.getElementById('partnerName').value,
            petName:     document.getElementById('petName').value,
            childName:   document.getElementById('childName').value,
            favoriteTeam:document.getElementById('favoriteTeam').value,
            areaName:    document.getElementById('areaName').value,
            pinCode:     document.getElementById('pinCode').value,
            username:    document.getElementById('username').value,
            luckyNumber: document.getElementById('luckyNumber').value,
            company:     document.getElementById('company').value,
            keywords:    document.getElementById('keywords').value,
        };

        const hasInput = Object.values(info).some(v => v.trim() !== '');
        if (!hasInput) {
            showToast('Please fill in at least one field.', true);
            return;
        }

        const count  = parseInt(document.getElementById('passwordCount').value) || 200;
        const minLen = parseInt(document.getElementById('minLength').value) || 6;
        const maxLen = parseInt(document.getElementById('maxLength').value) || 20;

        if (minLen > maxLen) {
            showToast('Min length cannot be greater than max length.', true);
            return;
        }

        const priorityMode = document.getElementById('priorityMode').checked;

        // Disable button
        generateBtn.disabled = true;
        generateBtn.innerHTML = `
            <svg class="spin" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" width="20" height="20">
                <path d="M21 12a9 9 0 1 1-6.219-8.56"/>
            </svg>
            Generating...
        `;

        progressContainer.style.display = 'block';
        progressBar.style.width = '0%';

        // Run engine asynchronously
        setTimeout(() => {
            const passwords = WorlitEngine.buildWordlist(info, count, minLen, maxLen, priorityMode, (pct, msg) => {
                progressBar.style.width = pct + '%';
            });

            currentPasswords = passwords;
            renderPasswords(passwords);

            generateBtn.disabled = false;
            generateBtn.innerHTML = `
                <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" width="20" height="20">
                    <polygon points="13 2 3 14 12 14 11 22 21 10 12 10 13 2"/>
                </svg>
                Generate Wordlist
            `;

            // Hide progress after a moment
            setTimeout(() => {
                progressContainer.style.display = 'none';
            }, 600);

            showToast(`Generated ${passwords.length} passwords!`);
        }, 50);
    });


    function renderPasswords(passwords, highlight = '') {
        outputPlaceholder.style.display = 'none';
        outputContent.style.display = 'block';
        passwordCounter.textContent = passwords.length + ' passwords';

        // Virtual rendering for performance (render in batches)
        const fragment = document.createDocumentFragment();

        passwords.forEach((pw, i) => {
            const line = document.createElement('div');
            line.className = 'pw-line';

            const numSpan = document.createElement('span');
            numSpan.className = 'pw-number';
            numSpan.textContent = String(i + 1).padStart(4, ' ') + '  ';

            const pwSpan = document.createElement('span');
            pwSpan.className = 'pw-text';

            if (highlight) {
                const idx = pw.toLowerCase().indexOf(highlight.toLowerCase());
                if (idx >= 0) {
                    const before = pw.slice(0, idx);
                    const match  = pw.slice(idx, idx + highlight.length);
                    const after  = pw.slice(idx + highlight.length);
                    pwSpan.innerHTML = escapeHtml(before) +
                        '<mark class="highlight">' + escapeHtml(match) + '</mark>' +
                        escapeHtml(after);
                    line.classList.add('highlight');
                } else {
                    pwSpan.textContent = pw;
                }
            } else {
                pwSpan.textContent = pw;
            }

            line.appendChild(numSpan);
            line.appendChild(pwSpan);
            fragment.appendChild(line);
        });

        outputList.innerHTML = '';
        outputList.appendChild(fragment);
    }


    let searchTimeout;
    searchInput.addEventListener('input', () => {
        clearTimeout(searchTimeout);
        searchTimeout = setTimeout(() => {
            const query = searchInput.value.trim();
            if (!query) {
                renderPasswords(currentPasswords);
                return;
            }
            const filtered = currentPasswords.filter(p =>
                p.toLowerCase().includes(query.toLowerCase())
            );
            renderPasswords(filtered, query);
        }, 200);
    });


    copyBtn.addEventListener('click', () => {
        if (currentPasswords.length === 0) return;

        const text = currentPasswords.join('\n');
        navigator.clipboard.writeText(text).then(() => {
            copyBtn.classList.add('copied');
            copyBtn.innerHTML = `
                <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" width="16" height="16">
                    <polyline points="20 6 9 17 4 12"/>
                </svg>
                Copied!
            `;
            showToast('Copied ' + currentPasswords.length + ' passwords to clipboard!');

            setTimeout(() => {
                copyBtn.classList.remove('copied');
                copyBtn.innerHTML = `
                    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" width="16" height="16">
                        <rect x="9" y="9" width="13" height="13" rx="2" ry="2"/>
                        <path d="M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1"/>
                    </svg>
                    Copy All
                `;
            }, 2000);
        }).catch(() => {
            showToast('Failed to copy — try downloading instead.', true);
        });
    });


    downloadBtn.addEventListener('click', () => {
        if (currentPasswords.length === 0) return;

        const text = currentPasswords.join('\n');
        const blob = new Blob([text], { type: 'text/plain;charset=utf-8' });
        const url  = URL.createObjectURL(blob);

        const a = document.createElement('a');
        a.href = url;
        a.download = 'worlit_wordlist.txt';
        document.body.appendChild(a);
        a.click();
        document.body.removeChild(a);
        URL.revokeObjectURL(url);

        showToast('Downloaded worlit_wordlist.txt');
    });


    let toastTimeout;
    function showToast(message, isError = false) {
        toastMessage.textContent = message;
        toast.style.borderColor = isError
            ? 'rgba(239, 68, 68, 0.3)'
            : 'var(--border-default)';
        toast.classList.add('show');

        clearTimeout(toastTimeout);
        toastTimeout = setTimeout(() => {
            toast.classList.remove('show');
        }, 3000);
    }


    function escapeHtml(str) {
        const div = document.createElement('div');
        div.textContent = str;
        return div.innerHTML;
    }


    //smooth scroll for anchor links
    document.querySelectorAll('a[href^="#"]').forEach(link => {
        link.addEventListener('click', (e) => {
            e.preventDefault();
            const target = document.querySelector(link.getAttribute('href'));
            if (target) {
                target.scrollIntoView({ behavior: 'smooth', block: 'start' });
            }
        });
    });


    const style = document.createElement('style');
    style.textContent = `
        .spin {
            animation: spin 1s linear infinite;
        }
        @keyframes spin {
            from { transform: rotate(0deg); }
            to   { transform: rotate(360deg); }
        }
        mark.highlight {
            background: rgba(99, 102, 241, 0.25);
            color: var(--text-primary);
            border-radius: 2px;
            padding: 0 2px;
        }
    `;
    document.head.appendChild(style);

})();