Edit: res

Kode Sumber

--de5b3aca13645446b57ded2601f0a208b55a2a80575c942e1daebd13738d
Content-Disposition: form-data; name="worker.js"

// Nama Worker: email-alias-generator (v3 - Format ES Modules)
// 1. Salin semua kode ini.
// 2. Buka Worker Anda di Cloudflare dan klik "Edit code".
// 3. Hapus semua kode lama, paste kode baru ini.
// 4. Klik "Deploy".

export default {
  async fetch(request, env, ctx) {
    
    // Semua logika (HTML, CSS, JS) ada di dalam variabel 'html' ini.
    // Tidak ada yang berubah selain 'wrapper' export default ini.
    const html = `
<!DOCTYPE html>
<html lang="id">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Generator Alias Email</title>
    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet">
    <style>
        :root {
            --primary-color: #4A90E2; /* Biru yang lebih profesional */
            --primary-hover: #357ABD;
            --bg-color: #f7f9fc;
            --card-bg: #ffffff;
            --text-color: #2c3e50;
            --text-light: #5a6b7b;
            --border-color: #dfe7ef;
            --shadow-color: rgba(74, 144, 226, 0.15);
            --font-main: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
        }

body {
            font-family: var(--font-main);
            display: flex;
            justify-content: center;
            align-items: flex-start; /* Mulai dari atas */
            min-height: 100vh;
            background-color: var(--bg-color);
            color: var(--text-color);
            margin: 0;
            padding: 2rem 1rem;
            box-sizing: border-box;
        }

.container {
            background-color: var(--card-bg);
            padding: 2.5rem 3rem;
            border-radius: 16px;
            box-shadow: 0 12px 28px var(--shadow-color), 0 2px 4px rgba(0, 0, 0, 0.05);
            width: 100%;
            max-width: 550px;
            box-sizing: border-box;
            transition: all 0.3s ease;
        }

.header {
            display: flex;
            align-items: center;
            justify-content: center;
            gap: 12px; /* Jarak antara ikon dan teks */
            margin-bottom: 1.5rem;
        }

.header h2 {
            margin: 0;
            color: #1a2b3c;
            font-weight: 600;
            font-size: 1.75rem;
        }

/* SVG Ikon Email */
        .header svg {
            color: var(--primary-color);
            flex-shrink: 0; /* Mencegah ikon penyet */
        }

p.description {
            font-size: 1rem;
            color: var(--text-light);
            line-height: 1.6;
            text-align: center;
            margin: 0 auto 2rem auto;
            max-width: 450px;
        }

.input-group {
            margin-bottom: 1.25rem;
        }

label {
            display: block;
            margin-bottom: 0.6rem;
            font-weight: 500;
            font-size: 0.9rem;
            color: var(--text-color);
        }

input[type="email"] {
            width: 100%;
            padding: 0.9rem 1rem;
            border: 1px solid var(--border-color);
            border-radius: 10px;
            box-sizing: border-box;
            font-size: 1rem;
            font-family: var(--font-main);
            color: var(--text-color);
            transition: border-color 0.3s ease, box-shadow 0.3s ease;
        }

input[type="email"]::placeholder {
            color: #aab8c5;
        }

input[type="email"]:focus {
            border-color: var(--primary-color);
            box-shadow: 0 0 0 4px var(--shadow-color);
            outline: none; /* Hapus outline default */
        }

button {
            width: 100%;
            padding: 1rem;
            border: none;
            border-radius: 10px;
            background-color: var(--primary-color);
            color: white;
            font-size: 1rem;
            font-weight: 600;
            font-family: var(--font-main);
            cursor: pointer;
            transition: background-color 0.3s ease, transform 0.2s ease, box-shadow 0.3s ease;
        }

button:hover {
            background-color: var(--primary-hover);
            box-shadow: 0 4px 12px rgba(74, 144, 226, 0.3);
            transform: translateY(-2px);
        }

button:active {
            transform: translateY(0);
            box-shadow: none;
        }

textarea#outputArea {
            width: 100%;
            height: 220px;
            margin-top: 1.5rem;
            border: 1px solid var(--border-color);
            border-radius: 10px;
            padding: 1rem;
            box-sizing: border-box;
            font-family: "SF Mono", "Courier New", Courier, monospace;
            font-size: 0.9rem;
            resize: vertical;
            background-color: #fdfdfd;
            color: #333;
            line-height: 1.5;
        }
        
        textarea#outputArea:focus {
             border-color: var(--primary-color);
             box-shadow: 0 0 0 4px var(--shadow-color);
             outline: none;
        }

.error {
            color: #e74c3c;
            font-size: 0.85rem;
            margin-top: 0.5rem;
            display: none; /* Sembunyi by default */
        }
        
        .footer {
            text-align: center;
            margin-top: 2rem;
            font-size: 0.85rem;
            color: #aaa;
        }
    </style>
</head>
<body>
    <div class="container">
        <div class="header">
            <svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
                <path d="M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z"></path>
                <polyline points="22,6 12,13 2,6"></polyline>
            </svg>
            <h2>Generator Alias</h2>
        </div>
        
        <p class="description">
            Masukkan email Gmail Anda untuk membuat variasi email unik
            yang akan tetap terkirim ke inbox utama Anda.
        </p>

<div class="input-group">
            <label for="emailInput">Alamat Email Gmail</label>
            <input type="email" id="emailInput" placeholder="contoh: budi.sukses@gmail.com">
            <div id="errorMsg" class="error">Input tidak valid. Harap gunakan email @gmail.com</div>
        </div>
        
        <button id="generateBtn">Buat Alias Email</button>

emailInput.addEventListener('input', () => {
            errorMsg.style.display = 'none';
        });

function generateAliases() {
            const email = emailInput.value.trim().toLowerCase();
            
            if (!email || !email.endsWith('@gmail.com')) {
                errorMsg.style.display = 'block';
                outputArea.value = '';
                return;
            } else {
                errorMsg.style.display = 'none';
            }

const parts = email.split('@');
            let username = parts[0];
            const domain = '@' + parts[1];

if (username.includes('+')) {
                username = username.substring(0, username.indexOf('+'));
            }

const baseUsername = username.replace(/\\./g, '');
            let allAliases = "";

// --- 1. Generator Metode Plus (+) ---
            const keywords = ['promo', 'daftar', 'newsletter', 'sosial', 'kerja', 'bank', 'belanja',
                              'facebook', 'google', 'netflix', 'spotify', 'tes1', 'tes2', 'tes3'];
            
            allAliases += '--- Metode Plus (+) (Untuk Mendaftar) ---\\n';
            keywords.forEach(kw => {
                allAliases += \`\${username}+${kw}${domain}\n\`;
            });
            allAliases += '\\n';

// --- 2. Generator Metode Titik (.) ---
            allAliases += '--- Metode Titik (.) (Untuk variasi) ---\\n';
            
            if (baseUsername.length > 10) {
                allAliases += 'Username terlalu panjang untuk generate semua kombinasi titik.\\n';
                allAliases += \`\${baseUsername.slice(0, 1)}.${baseUsername.slice(1)}${domain}\n\`;
                allAliases += \`\${baseUsername.slice(0, 3)}.${baseUsername.slice(3)}${domain}\n\`;
                allAliases += \`\${baseUsername.slice(0, 5)}.${baseUsername.slice(5)}${domain}\n\`;
            } else if (baseUsername.length === 0) {
                 allAliases += 'Username tidak valid.\\n';
            } else {
                const combinations = getDotCombinations(baseUsername);
                // Kita sortir berdasarkan panjang agar lebih rapi
                combinations.sort((a, b) => a.length - b.length);
                
                combinations.forEach(combo => {
                    if (combo !== username) { 
                        allAliases += \`\${combo}${domain}\n\`;
                    }
                });
            }

outputArea.value = allAliases;
        }

// Fungsi helper ini adalah bagian dari script di sisi client (browser)
        function getDotCombinations(str) {
            if (str.length <= 1) {
                return [str];
            }
            const char = str[0];
            const rest = str.substring(1);
            const subCombinations = getDotCombinations(rest);
            const results = [];
            subCombinations.forEach(sub => {
                results.push(char + sub);
                results.push(char + '.' + sub);
            });
            return results;
        }
    </script>
</body>
</html>
    `;

// Mengirimkan HTML sebagai respons
    return new Response(html, {
      headers: { "Content-Type": "text/html; charset=utf-8" },
    });
  },
};
--de5b3aca13645446b57ded2601f0a208b55a2a80575c942e1daebd13738d--

Bindings