ConstantCoder commited on
Commit
68e4cd5
·
verified ·
1 Parent(s): bb6deaa

Update index.html

Browse files
Files changed (1) hide show
  1. index.html +229 -119
index.html CHANGED
@@ -4,42 +4,76 @@
4
  <meta charset="UTF-8">
5
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
  <title>Saldırı Simülatörü</title>
7
- <link rel="stylesheet" href="styles.css">
8
- <style>
9
- #attack-simulator {
10
- margin: 20px;
11
- padding: 20px;
12
- background-color: #fff;
13
- border-radius: 8px;
14
- box-shadow: 0 0 10px rgba(0,0,0,0.1);
15
- }
16
-
17
- button {
18
- margin: 10px;
19
- padding: 10px 20px;
20
- background-color: #dd3333;
21
- color: white;
22
- border: none;
23
- border-radius: 4px;
24
- cursor: pointer;
25
- }
26
-
27
- button:hover {
28
- background-color: #6b1515;
29
- }
30
-
31
- #attack-result {
32
- margin-top: 20px;
33
- }
34
-
35
- </style>
36
-
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
37
  </head>
38
- <body style="background-color: rgb(12, 185, 228);">
39
  <header>
40
- <h1 style="font-family:'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif">Saldırı Simülatörü</h1>
41
  </header>
42
- <main style="color: rgb(89, 0, 233);">
43
  <section id="attack-simulator">
44
  <h2>Simülasyon Senaryoları</h2>
45
  <button id="phishingAttack">Kimlik Avı Saldırısı</button>
@@ -49,91 +83,167 @@ button:hover {
49
  <div id="attack-result"></div>
50
  </section>
51
  </main>
52
- <script src="scripts.js"></script>
53
- <script>
54
- document.getElementById('phishingAttack').addEventListener('click', () => {
55
- document.getElementById('attack-result').innerHTML = `
56
- <h3>Kimlik Avı Saldırısı!</h3>
57
- <p>Bir e-posta aldınız ve bu e-postadaki bağlantıya tıklamanız isteniyor. Ne yaparsınız?</p>
58
- <button onclick="handlePhishingResponse(true)">Bağlantıya Tıkla</button>
59
- <button onclick="handlePhishingResponse(false)">Bağlantıya Tıklama</button>
60
- `;
61
- });
62
-
63
- document.getElementById('ransomwareAttack').addEventListener('click', () => {
64
- document.getElementById('attack-result').innerHTML = `
65
- <h3>Fidye Yazılımı Saldırısı!</h3>
66
- <p>Bilgisayarınızda şüpheli bir dosya keşfettiniz ve bilgisayarınızda kilitli dosyalar var. Ne yaparsınız?</p>
67
- <button onclick="handleRansomwareResponse(true)">Fidyeyi Öde</button>
68
- <button onclick="handleRansomwareResponse(false)">Fidye Ödemeyin</button>
69
- `;
70
- });
71
-
72
- document.getElementById('ddosAttack').addEventListener('click', () => {
73
- document.getElementById('attack-result').innerHTML = `
74
- <h3>DDoS Saldırısı!</h3>
75
- <p>Web siteniz aşırı trafik nedeniyle yavaşlıyor. Nasıl bir tepki verirsiniz?</p>
76
- <button onclick="handleDdosResponse(true)">Yük Dengeleyici Kullanın</button>
77
- <button onclick="handleDdosResponse(false)">Sadece Bekleyin</button>
78
- `;
79
- });
80
-
81
- document.getElementById('malwareAttack').addEventListener('click', () => {
82
- document.getElementById('attack-result').innerHTML = `
83
- <h3>Kötü Amaçlı Yazılım Saldırısı!</h3>
84
- <p>Bilgisayarınıza şüpheli bir yazılım yüklendi. Ne yaparsınız?</p>
85
- <button onclick="handleMalwareResponse(true)">Yazılımı Kaldır</button>
86
- <button onclick="handleMalwareResponse(false)">Yazılımı Kaldırmayın</button>
87
- `;
88
- });
89
-
90
- function handlePhishingResponse(accepted) {
91
- if (accepted) {
92
- document.getElementById('attack-result').innerHTML = `
93
- <p>Bağlantıya tıkladınız ve kişisel bilgileriniz çalındı. Güvenlik önlemleri almanız gerekiyor!</p>
94
- `;
95
- } else {
96
- document.getElementById('attack-result').innerHTML = `
97
- <p>İyi bir seçim yaptınız. Bilgilerinizi korudunuz!</p>
98
- `;
99
- }
100
- }
101
-
102
- function handleRansomwareResponse(paid) {
103
- if (paid) {
104
- document.getElementById('attack-result').innerHTML = `
105
- <p>Fidye ödediniz, ancak dosyalarınız hala kilitli olabilir. Yedekleme stratejilerinizi gözden geçirin.</p>
106
- `;
107
- } else {
108
- document.getElementById('attack-result').innerHTML = `
109
- <p>Fidye ödemediğiniz için dosyalarınız kilitli kaldı. Gelecekte veri yedeklemeye özen gösterin.</p>
110
- `;
111
- }
112
- }
113
-
114
- function handleDdosResponse(usedLoadBalancer) {
115
- if (usedLoadBalancer) {
116
- document.getElementById('attack-result').innerHTML = `
117
- <p>Yük dengeleyici kullanarak hizmetinizi korudunuz. İyi iş çıkardınız!</p>
118
- `;
119
- } else {
120
- document.getElementById('attack-result').innerHTML = `
121
- <p>Bekleyerek sorun çözüldü, ancak bu tür saldırılara karşı önlem almanız önemlidir.</p>
122
- `;
123
- }
124
- }
125
-
126
- function handleMalwareResponse(removed) {
127
- if (removed) {
128
- document.getElementById('attack-result').innerHTML = `
129
- <p>Yazılımı kaldırdınız ve sisteminizi temiz tuttunuz. Harika!</p>
130
- `;
131
- } else {
132
- document.getElementById('attack-result').innerHTML = `
133
- <p>Kötü amaçlı yazılım bilgisayarınıza zarar verebilir. Gelecekte daha dikkatli olun.</p>
134
- `;
135
- }
136
- }
137
- </script>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
138
  </body>
139
  </html>
 
4
  <meta charset="UTF-8">
5
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
  <title>Saldırı Simülatörü</title>
7
+ <style>
8
+ body {
9
+ background-color: rgb(12, 185, 228);
10
+ color: rgb(89, 0, 233);
11
+ font-family: 'Arial', sans-serif;
12
+ }
13
+ header {
14
+ text-align: center;
15
+ margin: 20px 0;
16
+ }
17
+ main {
18
+ text-align: center;
19
+ }
20
+ section#attack-simulator {
21
+ margin: 20px auto;
22
+ width: 80%;
23
+ max-width: 600px;
24
+ text-align: left;
25
+ }
26
+ button {
27
+ display: block;
28
+ width: 100%;
29
+ margin: 10px 0;
30
+ padding: 10px;
31
+ font-size: 16px;
32
+ cursor: pointer;
33
+ }
34
+ #attack-result {
35
+ margin-top: 20px;
36
+ }
37
+ /* Modal Pencere Stilleri */
38
+ .modal {
39
+ display: none;
40
+ position: fixed;
41
+ z-index: 1;
42
+ left: 0;
43
+ top: 0;
44
+ width: 100%;
45
+ height: 100%;
46
+ overflow: auto;
47
+ background-color: rgb(0,0,0);
48
+ background-color: rgba(0,0,0,0.4);
49
+ padding-top: 60px;
50
+ }
51
+ .modal-content {
52
+ background-color: #fefefe;
53
+ margin: 5% auto;
54
+ padding: 20px;
55
+ border: 1px solid #888;
56
+ width: 80%;
57
+ }
58
+ .close {
59
+ color: #aaa;
60
+ float: right;
61
+ font-size: 28px;
62
+ font-weight: bold;
63
+ }
64
+ .close:hover,
65
+ .close:focus {
66
+ color: black;
67
+ text-decoration: none;
68
+ cursor: pointer;
69
+ }
70
+ </style>
71
  </head>
72
+ <body>
73
  <header>
74
+ <h1>Saldırı Simülatörü</h1>
75
  </header>
76
+ <main>
77
  <section id="attack-simulator">
78
  <h2>Simülasyon Senaryoları</h2>
79
  <button id="phishingAttack">Kimlik Avı Saldırısı</button>
 
83
  <div id="attack-result"></div>
84
  </section>
85
  </main>
86
+ <div id="myModal" class="modal">
87
+ <div class="modal-content">
88
+ <span class="close">&times;</span>
89
+ <p id="modal-text"></p>
90
+ </div>
91
+ </div>
92
+ <script>
93
+ // Web Speech API setup
94
+ const SpeechRecognition = window.SpeechRecognition || window.webkitSpeechRecognition;
95
+ const recognition = new SpeechRecognition();
96
+ recognition.lang = 'tr-TR';
97
+ recognition.continuous = false;
98
+
99
+ recognition.onresult = function(event) {
100
+ const transcript = event.results[0][0].transcript.toLowerCase();
101
+ handleVoiceCommand(transcript);
102
+ };
103
+
104
+ function handleVoiceCommand(command) {
105
+ if (command.includes('kimlik avı')) {
106
+ handlePhishing();
107
+ } else if (command.includes('fidye yazılımı')) {
108
+ handleRansomware();
109
+ } else if (command.includes('ddos saldırısı')) {
110
+ handleDdos();
111
+ } else if (command.includes('kötü amaçlı yazılım')) {
112
+ handleMalware();
113
+ } else {
114
+ showModal('Geçersiz komut. Lütfen tekrar deneyin.');
115
+ }
116
+ }
117
+
118
+ function startRecognition() {
119
+ recognition.start();
120
+ }
121
+
122
+ document.getElementById('phishingAttack').addEventListener('click', handlePhishing);
123
+ document.getElementById('ransomwareAttack').addEventListener('click', handleRansomware);
124
+ document.getElementById('ddosAttack').addEventListener('click', handleDdos);
125
+ document.getElementById('malwareAttack').addEventListener('click', handleMalware);
126
+
127
+ function handlePhishing() {
128
+ document.getElementById('attack-result').innerHTML = `
129
+ <h3>Kimlik Avı Saldırısı!</h3>
130
+ <p>Bir e-posta aldınız ve bu e-postadaki bağlantıya tıklamanız isteniyor. Ne yaparsınız?</p>
131
+ <button onclick="handlePhishingResponse(true)">Bağlantıya Tıkla</button>
132
+ <button onclick="handlePhishingResponse(false)">Bağlantıya Tıklama</button>
133
+ `;
134
+ 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.');
135
+ }
136
+
137
+ function handleRansomware() {
138
+ document.getElementById('attack-result').innerHTML = `
139
+ <h3>Fidye Yazılımı Saldırısı!</h3>
140
+ <p>Bilgisayarınızda şüpheli bir dosya keşfettiniz ve bilgisayarınızda kilitli dosyalar var. Ne yaparsınız?</p>
141
+ <button onclick="handleRansomwareResponse(true)">Fidyeyi Öde</button>
142
+ <button onclick="handleRansomwareResponse(false)">Fidye Ödemeyin</button>
143
+ `;
144
+ 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.');
145
+ }
146
+
147
+ function handleDdos() {
148
+ document.getElementById('attack-result').innerHTML = `
149
+ <h3>DDoS Saldırısı!</h3>
150
+ <p>Web siteniz aşırı trafik nedeniyle yavaşlıyor. Nasıl bir tepki verirsiniz?</p>
151
+ <button onclick="handleDdosResponse(true)">Yük Dengeleyici Kullanın</button>
152
+ <button onclick="handleDdosResponse(false)">Sadece Bekleyin</button>
153
+ `;
154
+ 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.');
155
+ }
156
+
157
+ function handleMalware() {
158
+ document.getElementById('attack-result').innerHTML = `
159
+ <h3>Kötü Amaçlı Yazılım Saldırısı!</h3>
160
+ <p>Bilgisayarınıza şüpheli bir yazılım yüklendi. Ne yaparsınız?</p>
161
+ <button onclick="handleMalwareResponse(true)">Yazılımı Kaldır</button>
162
+ <button onclick="handleMalwareResponse(false)">Yazılımı Kaldırmayın</button>
163
+ `;
164
+ 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.');
165
+ }
166
+
167
+ function handlePhishingResponse(accepted) {
168
+ if (accepted) {
169
+ showModal('Bağlantıya tıkladınız ve kişisel bilgileriniz çalındı. Güvenlik önlemleri almanız gerekiyor!');
170
+ } else {
171
+ showModal('İyi bir seçim yaptınız. Bilgilerinizi korudunuz!');
172
+ }
173
+ sendAnalysisData({phishing: accepted ? 1 : 0});
174
+ }
175
+
176
+ function handleRansomwareResponse(paid) {
177
+ if (paid) {
178
+ showModal('Fidye ödediniz, ancak dosyalarınız hala kilitli olabilir. Yedekleme stratejilerinizi gözden geçirin.');
179
+ } else {
180
+ showModal('Fidye ödemediğiniz için dosyalarınız kilitli kaldı. Gelecekte veri yedeklemeye özen gösterin.');
181
+ }
182
+ sendAnalysisData({ransomware: paid ? 1 : 0});
183
+ }
184
+
185
+ function handleDdosResponse(usedLoadBalancer) {
186
+ if (usedLoadBalancer) {
187
+ showModal('Yük dengeleyici kullanarak hizmetinizi korudunuz. İyi iş çıkardınız!');
188
+ } else {
189
+ showModal('Bekleyerek sorun çözüldü, ancak bu tür saldırılara karşı önlem almanız önemlidir.');
190
+ }
191
+ sendAnalysisData({ddos: usedLoadBalancer ? 1 : 0});
192
+ }
193
+
194
+ function handleMalwareResponse(removed) {
195
+ if (removed) {
196
+ showModal('Yazılımı kaldırarak sisteminizi temiz tuttunuz. Harika!');
197
+ } else {
198
+ showModal('Yazılımı kaldırmadığınız için sisteminiz tehlikede. Derhal yazılımı kaldırmalısınız.');
199
+ }
200
+ sendAnalysisData({malware: removed ? 1 : 0});
201
+ }
202
+
203
+ function showModal(message) {
204
+ const modal = document.getElementById('myModal');
205
+ const modalText = document.getElementById('modal-text');
206
+ const span = document.getElementsByClassName('close')[0];
207
+
208
+ modalText.textContent = message;
209
+ modal.style.display = 'block';
210
+
211
+ span.onclick = function() {
212
+ modal.style.display = 'none';
213
+ }
214
+
215
+ window.onclick = function(event) {
216
+ if (event.target == modal) {
217
+ modal.style.display = 'none';
218
+ }
219
+ }
220
+ }
221
+
222
+ function sendAnalysisData(data) {
223
+ fetch('/analyze', {
224
+ method: 'POST',
225
+ headers: {
226
+ 'Content-Type': 'application/json'
227
+ },
228
+ body: JSON.stringify(data)
229
+ })
230
+ .then(response => response.json())
231
+ .then(result => {
232
+ console.log(result);
233
+ });
234
+ }
235
+
236
+ function speak(message) {
237
+ const speech = new SpeechSynthesisUtterance(message);
238
+ speech.lang = 'tr-TR';
239
+ window.speechSynthesis.speak(speech);
240
+ }
241
+
242
+ // Ses tanıma başlatma düğmesi
243
+ const startRecognitionBtn = document.createElement('button');
244
+ startRecognitionBtn.textContent = 'Sesli Komut Başlat';
245
+ startRecognitionBtn.addEventListener('click', startRecognition);
246
+ document.body.appendChild(startRecognitionBtn);
247
+ </script>
248
  </body>
249
  </html>