Spaces:

ConstantCoder
/

Cyber-Security-Attack-Simulator

Running

App Files Files Community

ConstantCoder commited on Jul 25, 2024

Commit

68e4cd5

verified ·

1 Parent(s): bb6deaa

Update index.html

Browse files

Files changed (1) hide show

index.html +229 -119

index.html CHANGED Viewed

@@ -4,42 +4,76 @@
     <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>
-    #attack-simulator {
-    margin: 20px;
-    padding: 20px;
-    background-color: #fff;
-    border-radius: 8px;
-    box-shadow: 0 0 10px rgba(0,0,0,0.1);
-}
-button {
-    margin: 10px;
-    padding: 10px 20px;
-    background-color: #dd3333;
-    color: white;
-    border: none;
-    border-radius: 4px;
-    cursor: pointer;
-}
-button:hover {
-    background-color: #6b1515;
-}
-#attack-result {
-    margin-top: 20px;
-}
-  </style>
 </head>
-<body style="background-color: rgb(12, 185, 228);">
     <header>
-        <h1 style="font-family:'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif">Saldırı Simülatörü</h1>
     </header>
-    <main style="color: rgb(89, 0, 233);">
         <section id="attack-simulator">
             <h2>Simülasyon Senaryoları</h2>
             <button id="phishingAttack">Kimlik Avı Saldırısı</button>
@@ -49,91 +83,167 @@ button:hover {
             <div id="attack-result"></div>
         </section>
     </main>
-    <script src="scripts.js"></script>
-   <script>
-    document.getElementById('phishingAttack').addEventListener('click', () => {
-    document.getElementById('attack-result').innerHTML = `
-        <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('ransomwareAttack').addEventListener('click', () => {
-    document.getElementById('attack-result').innerHTML = `
-        <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('ddosAttack').addEventListener('click', () => {
-    document.getElementById('attack-result').innerHTML = `
-        <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('malwareAttack').addEventListener('click', () => {
-    document.getElementById('attack-result').innerHTML = `
-        <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>
-    `;
-});
-function handlePhishingResponse(accepted) {
-    if (accepted) {
-        document.getElementById('attack-result').innerHTML = `
-            <p>Bağlantıya tıkladınız ve kişisel bilgileriniz çalındı. Güvenlik önlemleri almanız gerekiyor!</p>
-        `;
-    } else {
-        document.getElementById('attack-result').innerHTML = `
-            <p>İyi bir seçim yaptınız. Bilgilerinizi korudunuz!</p>
-        `;
-    }
-}
-function handleRansomwareResponse(paid) {
-    if (paid) {
-        document.getElementById('attack-result').innerHTML = `
-            <p>Fidye ödediniz, ancak dosyalarınız hala kilitli olabilir. Yedekleme stratejilerinizi gözden geçirin.</p>
-        `;
-    } else {
-        document.getElementById('attack-result').innerHTML = `
-            <p>Fidye ödemediğiniz için dosyalarınız kilitli kaldı. Gelecekte veri yedeklemeye özen gösterin.</p>
-        `;
-    }
-}
-function handleDdosResponse(usedLoadBalancer) {
-    if (usedLoadBalancer) {
-        document.getElementById('attack-result').innerHTML = `
-            <p>Yük dengeleyici kullanarak hizmetinizi korudunuz. İyi iş çıkardınız!</p>
-        `;
-    } else {
-        document.getElementById('attack-result').innerHTML = `
-            <p>Bekleyerek sorun çözüldü, ancak bu tür saldırılara karşı önlem almanız önemlidir.</p>
-        `;
-    }
-}
-function handleMalwareResponse(removed) {
-    if (removed) {
-        document.getElementById('attack-result').innerHTML = `
-            <p>Yazılımı kaldırdınız ve sisteminizi temiz tuttunuz. Harika!</p>
-        `;
-    } else {
-        document.getElementById('attack-result').innerHTML = `
-            <p>Kötü amaçlı yazılım bilgisayarınıza zarar verebilir. Gelecekte daha dikkatli olun.</p>
-        `;
-    }
-}
-  </script>
 </body>
 </html>

     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>Saldırı Simülatörü</title>
+    <style>
+        body {
+            background-color: rgb(12, 185, 228);
+            color: rgb(89, 0, 233);
+            font-family: 'Arial', sans-serif;
+        }
+        header {
+            text-align: center;
+            margin: 20px 0;
+        }
+        main {
+            text-align: center;
+        }
+        section#attack-simulator {
+            margin: 20px auto;
+            width: 80%;
+            max-width: 600px;
+            text-align: left;
+        }
+        button {
+            display: block;
+            width: 100%;
+            margin: 10px 0;
+            padding: 10px;
+            font-size: 16px;
+            cursor: pointer;
+        }
+        #attack-result {
+            margin-top: 20px;
+        }
+        /* Modal Pencere Stilleri */
+        .modal {
+            display: none;
+            position: fixed;
+            z-index: 1;
+            left: 0;
+            top: 0;
+            width: 100%;
+            height: 100%;
+            overflow: auto;
+            background-color: rgb(0,0,0);
+            background-color: rgba(0,0,0,0.4);
+            padding-top: 60px;
+        }
+        .modal-content {
+            background-color: #fefefe;
+            margin: 5% auto;
+            padding: 20px;
+            border: 1px solid #888;
+            width: 80%;
+        }
+        .close {
+            color: #aaa;
+            float: right;
+            font-size: 28px;
+            font-weight: bold;
+        }
+        .close:hover,
+        .close:focus {
+            color: black;
+            text-decoration: none;
+            cursor: pointer;
+        }
+    </style>
 </head>
+<body>
     <header>
+        <h1>Saldırı Simülatörü</h1>
     </header>
+    <main>
         <section id="attack-simulator">
             <h2>Simülasyon Senaryoları</h2>
             <button id="phishingAttack">Kimlik Avı Saldırısı</button>
             <div id="attack-result"></div>
         </section>
     </main>
+    <div id="myModal" class="modal">
+        <div class="modal-content">
+            <span class="close">&times;</span>
+            <p id="modal-text"></p>
+        </div>
+    </div>
+    <script>
+        // Web Speech API setup
+        const SpeechRecognition = window.SpeechRecognition || window.webkitSpeechRecognition;
+        const recognition = new SpeechRecognition();
+        recognition.lang = 'tr-TR';
+        recognition.continuous = false;
+        recognition.onresult = function(event) {
+            const transcript = event.results[0][0].transcript.toLowerCase();
+            handleVoiceCommand(transcript);
+        };
+        function handleVoiceCommand(command) {
+            if (command.includes('kimlik avı')) {
+                handlePhishing();
+            } else if (command.includes('fidye yazılımı')) {
+                handleRansomware();
+            } else if (command.includes('ddos saldırısı')) {
+                handleDdos();
+            } else if (command.includes('kötü amaçlı yazılım')) {
+                handleMalware();
+            } else {
+                showModal('Geçersiz komut. Lütfen tekrar deneyin.');
+            }
+        }
+        function startRecognition() {
+            recognition.start();
+        }
+        document.getElementById('phishingAttack').addEventListener('click', handlePhishing);
+        document.getElementById('ransomwareAttack').addEventListener('click', handleRansomware);
+        document.getElementById('ddosAttack').addEventListener('click', handleDdos);
+        document.getElementById('malwareAttack').addEventListener('click', handleMalware);
+        function handlePhishing() {
+            document.getElementById('attack-result').innerHTML = `
+                <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>
+            `;
+            speak('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? Bağlantıya tıkla veya bağlantıya tıklama seçeneklerinden birini söyleyin.');
+        }
+        function handleRansomware() {
+            document.getElementById('attack-result').innerHTML = `
+                <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>
+            `;
+            speak('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? Fidyeyi öde veya fidye ödemeyin seçeneklerinden birini söyleyin.');
+        }
+        function handleDdos() {
+            document.getElementById('attack-result').innerHTML = `
+                <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>
+            `;
+            speak('DDoS saldırısı! Web siteniz aşırı trafik nedeniyle yavaşlıyor. Nasıl bir tepki verirsiniz? Yük dengeleyici kullanın veya sadece bekleyin seçeneklerinden birini söyleyin.');
+        }
+        function handleMalware() {
+            document.getElementById('attack-result').innerHTML = `
+                <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>
+            `;
+            speak('Kötü amaçlı yazılım saldırısı! Bilgisayarınıza şüpheli bir yazılım yüklendi. Ne yaparsınız? Yazılımı kaldır veya yazılımı kaldırmayın seçeneklerinden birini söyleyin.');
+        }
+        function handlePhishingResponse(accepted) {
+            if (accepted) {
+                showModal('Bağlantıya tıkladınız ve kişisel bilgileriniz çalındı. Güvenlik önlemleri almanız gerekiyor!');
+            } else {
+                showModal('İyi bir seçim yaptınız. Bilgilerinizi korudunuz!');
+            }
+            sendAnalysisData({phishing: accepted ? 1 : 0});
+        }
+        function handleRansomwareResponse(paid) {
+            if (paid) {
+                showModal('Fidye ödediniz, ancak dosyalarınız hala kilitli olabilir. Yedekleme stratejilerinizi gözden geçirin.');
+            } else {
+                showModal('Fidye ödemediğiniz için dosyalarınız kilitli kaldı. Gelecekte veri yedeklemeye özen gösterin.');
+            }
+            sendAnalysisData({ransomware: paid ? 1 : 0});
+        }
+        function handleDdosResponse(usedLoadBalancer) {
+            if (usedLoadBalancer) {
+                showModal('Yük dengeleyici kullanarak hizmetinizi korudunuz. İyi iş çıkardınız!');
+            } else {
+                showModal('Bekleyerek sorun çözüldü, ancak bu tür saldırılara karşı önlem almanız önemlidir.');
+            }
+            sendAnalysisData({ddos: usedLoadBalancer ? 1 : 0});
+        }
+        function handleMalwareResponse(removed) {
+            if (removed) {
+                showModal('Yazılımı kaldırarak sisteminizi temiz tuttunuz. Harika!');
+            } else {
+                showModal('Yazılımı kaldırmadığınız için sisteminiz tehlikede. Derhal yazılımı kaldırmalısınız.');
+            }
+            sendAnalysisData({malware: removed ? 1 : 0});
+        }
+        function showModal(message) {
+            const modal = document.getElementById('myModal');
+            const modalText = document.getElementById('modal-text');
+            const span = document.getElementsByClassName('close')[0];
+            modalText.textContent = message;
+            modal.style.display = 'block';
+            span.onclick = function() {
+                modal.style.display = 'none';
+            }
+            window.onclick = function(event) {
+                if (event.target == modal) {
+                    modal.style.display = 'none';
+                }
+            }
+        }
+        function sendAnalysisData(data) {
+            fetch('/analyze', {
+                method: 'POST',
+                headers: {
+                    'Content-Type': 'application/json'
+                },
+                body: JSON.stringify(data)
+            })
+            .then(response => response.json())
+            .then(result => {
+                console.log(result);
+            });
+        }
+        function speak(message) {
+            const speech = new SpeechSynthesisUtterance(message);
+            speech.lang = 'tr-TR';
+            window.speechSynthesis.speak(speech);
+        }
+        // Ses tanıma başlatma düğmesi
+        const startRecognitionBtn = document.createElement('button');
+        startRecognitionBtn.textContent = 'Sesli Komut Başlat';
+        startRecognitionBtn.addEventListener('click', startRecognition);
+        document.body.appendChild(startRecognitionBtn);
+    </script>
 </body>
 </html>