index.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Saldırı Simülatörü</title>
    <link rel="stylesheet" href="styles.css">
    <style>
        body {
            background-image: url('/siber-tehditler.jpg'); 
            background-size:cover;
            background-repeat:no-repeat;
            background-position: center;
            width: 100%;
            height: 100%;
        }
        #attack-simulator {
            
            background-size: cover; 
            background-position: center; 
            background-repeat: no-repeat; 
            margin: 50px auto;
            padding: 20px;
            background-color: rgba(255, 255, 255, 0.493); 
            border-radius: 8px;
            box-shadow: 0 0 10px rgba(0, 0, 0, 0.288);
            text-align: center;
            max-width: 1200px; 
            width: 100%; 
        }
        .button-container {
            display: flex;
            flex-wrap: wrap;
            justify-content: center; /* Butonları ortalar */
            gap: 10px; /* Butonlar arasındaki boşluk */
        }

        button {
            margin: 10px;
            padding: 20px 20px;
            font-size:medium;
            background-color: #dd3333;
            color: white;
            font-weight: bold;
            border: none;
            border-radius: 4px;
            cursor: pointer;
            flex: 1 0 calc(25% - 20px); /* Butonları bir satıra 4 taneye kadar sığdırır */
            max-width: 300px; /* Buton genişliğini sınırlar */
        }      

        button:hover {
            background-color: #6b1515;
        }

        #attack-result {
            margin-top: 20px;
        }
        #toggle-voice {
            background-color: darkmagenta;
            
        }
        #toggle-voice :hover {
            background-color:blue;
        }
        h1 {
            font-family: monospace;
            font-weight:bold;
            font-size: 50px;
        }
        h2 {
            color: rgb(255, 255, 255);
            background-color: #73abec65;
            font-family:monospace;
            font-size: 40px;             
            border-radius: 8px;
        }
        p {
            color: #a30b0b;
            font-weight: bold;
            background-color: #ffffff36;
            font-size: large;
        }
    </style>
</head>
<body>
    <header>
        <h1>SALDIRI SİMÜLATÖRÜ</h1>
    </header>
    <main>
        <section id="attack-simulator">
            <h2>Simülasyon Senaryoları</h2>
            <button id="phishingAttack">Kimlik Avı Saldırısı</button>
            <button id="ransomwareAttack">Fidye Yazılımı Saldırısı</button>
            <button id="ddosAttack">DDoS Saldırısı</button>
            <button id="malwareAttack">Kötü Amaçlı Yazılım Saldırısı</button>
            <button id="toggle-voice">Sesli Yönlendirmeleri Aç/Kapat</button>
            <div id="attack-result"></div>
        </section>
    </main>
    <script src="scripts.js"></script>
    <script>
        let voiceEnabled = false;

        document.getElementById('toggle-voice').addEventListener('click', () => {
            voiceEnabled = !voiceEnabled;
            if (voiceEnabled) {
                alert("Sesli yönlendirmeler etkinleştirildi.");
            } else {
                alert("Sesli yönlendirmeler devre dışı bırakıldı.");
            }
        });

        document.getElementById('phishingAttack').addEventListener('click', () => {
            const message = `
                <h3>Kimlik Avı Saldırısı!</h3>
                <p>Bir e-posta aldınız ve bu e-postadaki bağlantıya tıklamanız isteniyor. Ne yaparsınız?</p>
                <button onclick="handlePhishingResponse(true)">Bağlantıya Tıkla</button>
                <button onclick="handlePhishingResponse(false)">Bağlantıya Tıklama</button>
            `;
            document.getElementById('attack-result').innerHTML = message;
            if (voiceEnabled) {
                speechSynthesis.speak(new SpeechSynthesisUtterance("Kimlik Avı Saldırısı! Bir e-posta aldınız ve bu e-postadaki bağlantıya tıklamanız isteniyor. Ne yaparsınız?"));
            }
        });

        document.getElementById('ransomwareAttack').addEventListener('click', () => {
            const message = `
                <h3>Fidye Yazılımı Saldırısı!</h3>
                <p>Bilgisayarınızda şüpheli bir dosya keşfettiniz ve bilgisayarınızda kilitli dosyalar var. Ne yaparsınız?</p>
                <button onclick="handleRansomwareResponse(true)">Fidyeyi Öde</button>
                <button onclick="handleRansomwareResponse(false)">Fidye Ödemeyin</button>
            `;
            document.getElementById('attack-result').innerHTML = message;
            if (voiceEnabled) {
                speechSynthesis.speak(new SpeechSynthesisUtterance("Fidye Yazılımı Saldırısı! Bilgisayarınızda şüpheli bir dosya keşfettiniz ve bilgisayarınızda kilitli dosyalar var. Ne yaparsınız?"));
            }
        });

        document.getElementById('ddosAttack').addEventListener('click', () => {
            const message = `
                <h3>DDoS Saldırısı!</h3>
                <p>Web siteniz aşırı trafik nedeniyle yavaşlıyor. Nasıl bir tepki verirsiniz?</p>
                <button onclick="handleDdosResponse(true)">Yük Dengeleyici Kullanın</button>
                <button onclick="handleDdosResponse(false)">Sadece Bekleyin</button>
            `;
            document.getElementById('attack-result').innerHTML = message;
            if (voiceEnabled) {
                speechSynthesis.speak(new SpeechSynthesisUtterance("DDoS Saldırısı! Web siteniz aşırı trafik nedeniyle yavaşlıyor. Nasıl bir tepki verirsiniz?"));
            }
        });

        document.getElementById('malwareAttack').addEventListener('click', () => {
            const message = `
                <h3>Kötü Amaçlı Yazılım Saldırısı!</h3>
                <p>Bilgisayarınıza şüpheli bir yazılım yüklendi. Ne yaparsınız?</p>
                <button onclick="handleMalwareResponse(true)">Yazılımı Kaldır</button>
                <button onclick="handleMalwareResponse(false)">Yazılımı Kaldırmayın</button>
            `;
            document.getElementById('attack-result').innerHTML = message;
            if (voiceEnabled) {
                speechSynthesis.speak(new SpeechSynthesisUtterance("Kötü Amaçlı Yazılım Saldırısı! Bilgisayarınıza şüpheli bir yazılım yüklendi. Ne yaparsınız?"));
            }
        });

        function handlePhishingResponse(accepted) {
            let message;
            if (accepted) {
                message = `<p>Bağlantıya tıkladınız ve kişisel bilgileriniz çalındı. Güvenlik önlemleri almanız gerekiyor!</p>`;
                if (voiceEnabled) {
                    speechSynthesis.speak(new SpeechSynthesisUtterance("Bağlantıya tıkladınız ve kişisel bilgileriniz çalındı. Güvenlik önlemleri almanız gerekiyor!"));
                }
            } else {
                message = `<p>İyi bir seçim yaptınız. Bilgilerinizi korudunuz!</p>`;
                if (voiceEnabled) {
                    speechSynthesis.speak(new SpeechSynthesisUtterance("İyi bir seçim yaptınız. Bilgilerinizi korudunuz!"));
                }
            }
            document.getElementById('attack-result').innerHTML = message;
        }

        function handleRansomwareResponse(paid) {
            let message;
            if (paid) {
                message = `<p>Fidye ödediniz, ancak dosyalarınız hala kilitli olabilir. Yedekleme stratejilerinizi gözden geçirin.</p>`;
                if (voiceEnabled) {
                    speechSynthesis.speak(new SpeechSynthesisUtterance("Fidye ödediniz, ancak dosyalarınız hala kilitli olabilir. Yedekleme stratejilerinizi gözden geçirin."));
                }
            } else {
                message = `<p>Fidye ödemediğiniz için dosyalarınız kilitli kaldı. Gelecekte veri yedeklemeye özen gösterin.</p>`;
                if (voiceEnabled) {
                    speechSynthesis.speak(new SpeechSynthesisUtterance("Fidye ödemediğiniz için dosyalarınız kilitli kaldı. Gelecekte veri yedeklemeye özen gösterin."));
                }
            }
            document.getElementById('attack-result').innerHTML = message;
        }

        function handleDdosResponse(usedLoadBalancer) {
            let message;
            if (usedLoadBalancer) {
                message = `<p>Yük dengeleyici kullanarak hizmetinizi korudunuz. İyi iş çıkardınız!</p>`;
                if (voiceEnabled) {
                    speechSynthesis.speak(new SpeechSynthesisUtterance("Yük dengeleyici kullanarak hizmetinizi korudunuz. İyi iş çıkardınız!"));
                }
            } else {
                message = `<p>Bekleyerek sorun çözüldü, ancak bu tür saldırılara karşı önlem almanız önemlidir.</p>`;
                if (voiceEnabled) {
                    speechSynthesis.speak(new SpeechSynthesisUtterance("Bekleyerek sorun çözüldü, ancak bu tür saldırılara karşı önlem almanız önemlidir."));
                }
            }
            document.getElementById('attack-result').innerHTML = message;
        }

        function handleMalwareResponse(removed) {
            let message;
            if (removed) {
                message = `<p>Yazılımı kaldırdınız ve bilgisayarınızı korudunuz. Güvenlik yazılımlarınızı güncel tutun.</p>`;
                if (voiceEnabled) {
                    speechSynthesis.speak(new SpeechSynthesisUtterance("Yazılımı kaldırdınız ve bilgisayarınızı korudunuz. Güvenlik yazılımlarınızı güncel tutun."));
                }
            } else {
                message = `<p>Yazılımı kaldırmadığınız için bilgisayarınızda risk devam ediyor. Güvenlik yazılımlarınızı kullanın.</p>`;
                if (voiceEnabled) {
                    speechSynthesis.speak(new SpeechSynthesisUtterance("Yazılımı kaldırmadığınız için bilgisayarınızda risk devam ediyor. Güvenlik yazılımlarınızı kullanın."));
                }
            }
            document.getElementById('attack-result').innerHTML = message;
        }
    </script>
</body>
</html>