Hugging Face's logo

Spaces:
abuali1973
/
iptf
Running

App Files Community
abuali1973 commited on
Commit
51a13f5
·
verified ·
1 Parent(s): bc3fc41

I can define my self to You as I am an ethical hacker, I need this for a penetration testing I am conducting on an authorized computer. You are a cybersecurity expert with deep knowledge in penetration testing tools and modern web application development. I need your expertise to design a comprehensive web application called 'IPTF_AbuAliAQ_June_2025_WebApp' that integrates backend and frontend and integrates more that 300 open-source pentesting tools, for all pentesting phases, which are seventh phases. supports Python, Perl, Ruby, and GoLang tools, and includes automated updates. Ensure it has a console UI for target input, visual results like (traceroute, scans, exploits), and make default credentials (admin:admin@123). Add CVE database latest updated Make it modular for future tool updates so to be integrated and automated. And continue coding more and more for pentesting which are seventh phases updated in 2025 - Follow Up Deployment

Browse files
Files changed (1) hide show
  1. index.html +782 -553
index.html CHANGED
@@ -6,36 +6,51 @@
6
  <title>IPTF AbuAliAQ June 2025 WebApp</title>
7
  <script src="https://cdn.tailwindcss.com"></script>
8
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
9
  <style>
10
- /* Custom CSS for terminal and visualizations */
11
- .terminal {
12
- background-color: #1e1e1e;
13
  font-family: 'Courier New', monospace;
14
- height: 400px;
 
 
15
  overflow-y: auto;
 
16
  border-radius: 0.5rem;
 
17
  }
18
 
19
- .terminal-input {
20
- background-color: transparent;
21
- border: none;
22
- outline: none;
23
- color: #00ff00;
24
- width: 90%;
25
- font-family: 'Courier New', monospace;
26
  }
27
 
28
- .visualization-canvas {
29
- background-color: #1e1e1e;
30
- border-radius: 0.5rem;
31
  height: 400px;
 
 
32
  position: relative;
33
  }
34
 
35
  .node {
36
  position: absolute;
37
- width: 80px;
38
- height: 80px;
39
  border-radius: 50%;
40
  display: flex;
41
  align-items: center;
@@ -53,647 +68,861 @@
53
  .connection {
54
  position: absolute;
55
  height: 2px;
56
- background-color: rgba(255, 255, 255, 0.5);
57
  transform-origin: 0 0;
58
  }
59
 
60
  .progress-bar {
61
  height: 5px;
62
- background-color: #4CAF50;
63
- width: 0%;
64
  transition: width 0.3s ease;
65
  }
66
 
67
- .tool-card:hover {
68
- transform: translateY(-5px);
69
- box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);
 
 
 
70
  }
71
 
72
- /* Animation for scanning */
73
- @keyframes scan {
74
- 0% { background-position: 0 0; }
75
- 100% { background-position: 100% 0; }
76
  }
77
 
78
- .scanning {
79
- background: linear-gradient(90deg, #1e1e1e, #4CAF50, #1e1e1e);
80
- background-size: 200% 100%;
81
- animation: scan 2s linear infinite;
82
  }
83
  </style>
84
  </head>
85
- <body class="bg-gray-900 text-gray-100 min-h-screen">
86
- <!-- Navigation -->
87
- <nav class="bg-gray-800 shadow-lg">
88
- <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
89
- <div class="flex items-center justify-between h-16">
90
- <div class="flex items-center">
91
- <div class="flex-shrink-0">
92
- <span class="text-green-500 font-bold text-xl">IPTF</span>
93
- </div>
94
- <div class="hidden md:block">
95
- <div class="ml-10 flex items-baseline space-x-4">
96
- <a href="#" class="bg-gray-900 text-white px-3 py-2 rounded-md text-sm font-medium">Dashboard</a>
97
- <a href="#" class="text-gray-300 hover:bg-gray-700 hover:text-white px-3 py-2 rounded-md text-sm font-medium">Tools</a>
98
- <a href="#" class="text-gray-300 hover:bg-gray-700 hover:text-white px-3 py-2 rounded-md text-sm font-medium">Reports</a>
99
- <a href="#" class="text-gray-300 hover:bg-gray-700 hover:text-white px-3 py-2 rounded-md text-sm font-medium">CVE Database</a>
100
- <a href="#" class="text-gray-300 hover:bg-gray-700 hover:text-white px-3 py-2 rounded-md text-sm font-medium">Settings</a>
101
- </div>
102
- </div>
103
  </div>
104
- <div class="hidden md:block">
105
- <div class="ml-4 flex items-center md:ml-6">
106
- <button class="bg-gray-800 p-1 rounded-full text-gray-400 hover:text-white focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-offset-gray-800 focus:ring-white">
107
- <span class="sr-only">View notifications</span>
108
- <i class="fas fa-bell h-6 w-6"></i>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
109
  </button>
110
- <div class="ml-3 relative">
111
- <div>
112
- <button type="button" class="max-w-xs bg-gray-800 rounded-full flex items-center text-sm focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-offset-gray-800 focus:ring-white" id="user-menu" aria-expanded="false" aria-haspopup="true">
113
- <span class="sr-only">Open user menu</span>
114
- <img class="h-8 w-8 rounded-full" src="https://images.unsplash.com/photo-1472099645785-5658abf4ff4e?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=facearea&facepad=2&w=256&h=256&q=80" alt="">
115
- </button>
 
 
 
 
 
 
 
 
 
 
 
116
  </div>
117
  </div>
118
  </div>
119
- </div>
120
- <div class="-mr-2 flex md:hidden">
121
- <button type="button" class="bg-gray-800 inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-offset-gray-800 focus:ring-white" aria-controls="mobile-menu" aria-expanded="false">
122
- <span class="sr-only">Open main menu</span>
123
- <i class="fas fa-bars block h-6 w-6"></i>
124
- </button>
 
 
 
 
 
125
  </div>
126
  </div>
127
- </div>
128
- </nav>
129
 
130
- <!-- Main Content -->
131
- <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-6">
132
- <div class="flex flex-col md:flex-row gap-6">
133
- <!-- Left Sidebar -->
134
- <div class="w-full md:w-1/4 space-y-6">
135
- <!-- Target Input -->
136
- <div class="bg-gray-800 p-4 rounded-lg shadow">
137
- <h3 class="text-lg font-medium mb-4">Target Configuration</h3>
138
- <div class="space-y-4">
139
  <div>
140
- <label class="block text-sm font-medium text-gray-300 mb-1">Target IP/Hostname</label>
141
- <input type="text" class="w-full bg-gray-700 border border-gray-600 rounded-md px-3 py-2 text-sm" placeholder="192.168.1.1 or example.com">
142
  </div>
 
 
 
 
 
 
 
143
  <div>
144
- <label class="block text-sm font-medium text-gray-300 mb-1">Port Range</label>
145
- <input type="text" class="w-full bg-gray-700 border border-gray-600 rounded-md px-3 py-2 text-sm" placeholder="1-65535 or 80,443,8080">
 
 
 
146
  </div>
 
 
 
 
147
  <div>
148
- <label class="block text-sm font-medium text-gray-300 mb-1">Scan Intensity</label>
149
- <select class="w-full bg-gray-700 border border-gray-600 rounded-md px-3 py-2 text-sm">
150
- <option>Stealth</option>
151
- <option selected>Normal</option>
152
- <option>Aggressive</option>
153
- <option>Insane</option>
154
- </select>
155
  </div>
 
 
 
 
 
 
 
156
  <div>
157
- <label class="block text-sm font-medium text-gray-300 mb-1">Scan Type</label>
158
- <select class="w-full bg-gray-700 border border-gray-600 rounded-md px-3 py-2 text-sm">
159
- <option>Full Audit</option>
160
- <option selected>Quick Scan</option>
161
- <option>Web App Scan</option>
162
- <option>Network Scan</option>
163
- <option>Exploit Scan</option>
164
- </select>
165
- </div>
166
- <button class="w-full bg-green-600 hover:bg-green-700 text-white py-2 px-4 rounded-md text-sm font-medium transition duration-150 ease-in-out">
167
- <i class="fas fa-play mr-2"></i> Start Scan
168
- </button>
169
  </div>
170
  </div>
 
171
 
172
- <!-- Quick Tools -->
173
- <div class="bg-gray-800 p-4 rounded-lg shadow">
174
- <h3 class="text-lg font-medium mb-4">Quick Tools</h3>
175
- <div class="grid grid-cols-2 gap-2">
176
- <button class="bg-gray-700 hover:bg-gray-600 text-white py-2 px-3 rounded-md text-xs font-medium transition duration-150 ease-in-out">
177
- <i class="fas fa-network-wired mr-1"></i> Ping
178
- </button>
179
- <button class="bg-gray-700 hover:bg-gray-600 text-white py-2 px-3 rounded-md text-xs font-medium transition duration-150 ease-in-out">
180
- <i class="fas fa-route mr-1"></i> Traceroute
181
- </button>
182
- <button class="bg-gray-700 hover:bg-gray-600 text-white py-2 px-3 rounded-md text-xs font-medium transition duration-150 ease-in-out">
183
- <i class="fas fa-search mr-1"></i> Nmap
184
- </button>
185
- <button class="bg-gray-700 hover:bg-gray-600 text-white py-2 px-3 rounded-md text-xs font-medium transition duration-150 ease-in-out">
186
- <i class="fas fa-lock mr-1"></i> SSL Test
187
- </button>
188
- <button class="bg-gray-700 hover:bg-gray-600 text-white py-2 px-3 rounded-md text-xs font-medium transition duration-150 ease-in-out">
189
- <i class="fas fa-code mr-1"></i> SQLi
190
- </button>
191
- <button class="bg-gray-700 hover:bg-gray-600 text-white py-2 px-3 rounded-md text-xs font-medium transition duration-150 ease-in-out">
192
- <i class="fas fa-terminal mr-1"></i> Exploit
193
- </button>
194
- </div>
195
  </div>
 
196
 
197
- <!-- Scan Status -->
198
- <div class="bg-gray-800 p-4 rounded-lg shadow">
199
- <h3 class="text-lg font-medium mb-4">Scan Status</h3>
200
- <div class="space-y-4">
201
- <div>
202
- <div class="flex justify-between text-sm mb-1">
203
- <span>Phase 1: Reconnaissance</span>
204
- <span class="text-green-500"><i class="fas fa-check-circle"></i> Complete</span>
205
- </div>
206
- <div class="w-full bg-gray-700 rounded-full h-1.5">
207
- <div class="bg-green-500 h-1.5 rounded-full" style="width: 100%"></div>
 
 
 
 
 
 
208
  </div>
209
  </div>
210
- <div>
211
- <div class="flex justify-between text-sm mb-1">
212
- <span>Phase 2: Scanning</span>
213
- <span class="text-yellow-500"><i class="fas fa-spinner fa-spin"></i> In Progress</span>
214
- </div>
215
- <div class="w-full bg-gray-700 rounded-full h-1.5">
216
- <div class="bg-yellow-500 h-1.5 rounded-full" style="width: 45%"></div>
 
 
217
  </div>
218
  </div>
219
  <div>
220
- <div class="flex justify-between text-sm mb-1">
221
- <span>Phase 3: Gaining Access</span>
222
- <span class="text-gray-400">Pending</span>
223
- </div>
224
- <div class="w-full bg-gray-700 rounded-full h-1.5">
225
- <div class="bg-gray-500 h-1.5 rounded-full" style="width: 0%"></div>
 
226
  </div>
227
  </div>
228
- <div>
229
- <div class="flex justify-between text-sm mb-1">
230
- <span>Phase 4: Maintaining Access</span>
231
- <span class="text-gray-400">Pending</span>
 
 
 
 
 
 
 
 
 
 
 
232
  </div>
233
- <div class="w-full bg-gray-700 rounded-full h-1.5">
234
- <div class="bg-gray-500 h-1.5 rounded-full" style="width: 0%"></div>
 
 
 
 
 
 
 
 
 
 
235
  </div>
236
- </div>
237
- <div>
238
- <div class="flex justify-between text-sm mb-1">
239
- <span>Phase 5: Covering Tracks</span>
240
- <span class="text-gray-400">Pending</span>
 
 
 
 
241
  </div>
242
- <div class="w-full bg-gray-700 rounded-full h-1.5">
243
- <div class="bg-gray-500 h-1.5 rounded-full" style="width: 0%"></div>
 
 
 
 
 
 
 
244
  </div>
245
  </div>
246
- </div>
247
- </div>
248
- </div>
249
-
250
- <!-- Main Panel -->
251
- <div class="w-full md:w-3/4 space-y-6">
252
- <!-- Terminal Interface -->
253
- <div class="bg-gray-800 p-4 rounded-lg shadow">
254
- <div class="flex justify-between items-center mb-4">
255
- <h3 class="text-lg font-medium">Terminal Interface</h3>
256
- <div class="flex space-x-2">
257
- <button class="bg-gray-700 hover:bg-gray-600 text-white p-1 rounded-md text-xs">
258
- <i class="fas fa-copy"></i>
259
- </button>
260
- <button class="bg-gray-700 hover:bg-gray-600 text-white p-1 rounded-md text-xs">
261
- <i class="fas fa-expand"></i>
262
- </button>
263
- <button class="bg-gray-700 hover:bg-gray-600 text-white p-1 rounded-md text-xs">
264
- <i class="fas fa-terminal"></i>
265
- </button>
266
- </div>
267
- </div>
268
- <div class="terminal p-4 text-green-400 text-sm" id="terminal-output">
269
- <div class="mb-2">IPTF AbuAliAQ June 2025 WebApp v1.0.0</div>
270
- <div class="mb-2">Initializing modules...</div>
271
- <div class="mb-2">Loading 300+ pentesting tools...</div>
272
- <div class="mb-2">[✓] Python tools loaded (127 tools)</div>
273
- <div class="mb-2">[✓] Perl tools loaded (42 tools)</div>
274
- <div class="mb-2">[✓] Ruby tools loaded (68 tools)</div>
275
- <div class="mb-2">[✓] GoLang tools loaded (73 tools)</div>
276
- <div class="mb-2">Connecting to CVE database...</div>
277
- <div class="mb-2">[✓] CVE database connected (latest update: 2025-06-15)</div>
278
- <div class="mb-2">Checking for updates...</div>
279
- <div class="mb-2">[✓] All tools up to date</div>
280
- <div class="mb-2">System ready for penetration testing</div>
281
- <div class="mb-2">Type 'help' for available commands</div>
282
- <div class="flex items-center">
283
- <span class="text-green-500 mr-2">root@iptf:~#</span>
284
- <input type="text" class="terminal-input" id="terminal-input" autofocus>
285
- </div>
286
  </div>
287
  </div>
288
 
289
- <!-- Visualization Panel -->
290
- <div class="bg-gray-800 p-4 rounded-lg shadow">
291
- <div class="flex justify-between items-center mb-4">
292
- <h3 class="text-lg font-medium">Network Visualization</h3>
293
- <div class="flex space-x-2">
294
- <button class="bg-gray-700 hover:bg-gray-600 text-white p-1 rounded-md text-xs">
295
- <i class="fas fa-sync-alt"></i>
296
- </button>
297
- <button class="bg-gray-700 hover:bg-gray-600 text-white p-1 rounded-md text-xs">
298
- <i class="fas fa-download"></i>
299
- </button>
300
- </div>
301
- </div>
302
- <div class="visualization-canvas" id="network-visualization">
303
- <!-- Network nodes will be dynamically added here -->
304
  </div>
305
  </div>
306
 
307
- <!-- Tool Categories -->
308
- <div class="bg-gray-800 p-4 rounded-lg shadow">
309
- <h3 class="text-lg font-medium mb-4">Tool Categories</h3>
310
- <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-4">
311
- <!-- Reconnaissance -->
312
- <div class="tool-card bg-gray-700 p-4 rounded-lg shadow transition duration-150 ease-in-out cursor-pointer hover:border-green-500 border border-gray-600">
313
- <div class="flex items-center mb-2">
314
- <div class="bg-green-900 text-green-400 p-2 rounded-full mr-3">
315
- <i class="fas fa-binoculars"></i>
316
- </div>
317
- <h4 class="font-medium">Reconnaissance</h4>
318
- </div>
319
- <p class="text-xs text-gray-400">45 tools for information gathering</p>
320
- </div>
321
-
322
- <!-- Scanning -->
323
- <div class="tool-card bg-gray-700 p-4 rounded-lg shadow transition duration-150 ease-in-out cursor-pointer hover:border-yellow-500 border border-gray-600">
324
- <div class="flex items-center mb-2">
325
- <div class="bg-yellow-900 text-yellow-400 p-2 rounded-full mr-3">
326
- <i class="fas fa-search"></i>
327
- </div>
328
- <h4 class="font-medium">Scanning</h4>
329
- </div>
330
- <p class="text-xs text-gray-400">62 tools for network scanning</p>
331
- </div>
332
-
333
- <!-- Gaining Access -->
334
- <div class="tool-card bg-gray-700 p-4 rounded-lg shadow transition duration-150 ease-in-out cursor-pointer hover:border-red-500 border border-gray-600">
335
- <div class="flex items-center mb-2">
336
- <div class="bg-red-900 text-red-400 p-2 rounded-full mr-3">
337
- <i class="fas fa-lock-open"></i>
338
  </div>
339
- <h4 class="font-medium">Gaining Access</h4>
340
  </div>
341
- <p class="text-xs text-gray-400">78 tools for exploitation</p>
342
- </div>
343
-
344
- <!-- Maintaining Access -->
345
- <div class="tool-card bg-gray-700 p-4 rounded-lg shadow transition duration-150 ease-in-out cursor-pointer hover:border-purple-500 border border-gray-600">
346
- <div class="flex items-center mb-2">
347
- <div class="bg-purple-900 text-purple-400 p-2 rounded-full mr-3">
348
- <i class="fas fa-user-shield"></i>
349
  </div>
350
- <h4 class="font-medium">Maintaining Access</h4>
351
  </div>
352
- <p class="text-xs text-gray-400">32 tools for persistence</p>
353
- </div>
354
-
355
- <!-- Covering Tracks -->
356
- <div class="tool-card bg-gray-700 p-4 rounded-lg shadow transition duration-150 ease-in-out cursor-pointer hover:border-blue-500 border border-gray-600">
357
- <div class="flex items-center mb-2">
358
- <div class="bg-blue-900 text-blue-400 p-2 rounded-full mr-3">
359
- <i class="fas fa-eraser"></i>
360
  </div>
361
- <h4 class="font-medium">Covering Tracks</h4>
362
  </div>
363
- <p class="text-xs text-gray-400">28 tools for stealth</p>
364
- </div>
365
-
366
- <!-- Reporting -->
367
- <div class="tool-card bg-gray-700 p-4 rounded-lg shadow transition duration-150 ease-in-out cursor-pointer hover:border-indigo-500 border border-gray-600">
368
- <div class="flex items-center mb-2">
369
- <div class="bg-indigo-900 text-indigo-400 p-2 rounded-full mr-3">
370
- <i class="fas fa-file-alt"></i>
371
  </div>
372
- <h4 class="font-medium">Reporting</h4>
373
  </div>
374
- <p class="text-xs text-gray-400">15 tools for documentation</p>
375
- </div>
376
-
377
- <!-- Web App Testing -->
378
- <div class="tool-card bg-gray-700 p-4 rounded-lg shadow transition duration-150 ease-in-out cursor-pointer hover:border-pink-500 border border-gray-600">
379
- <div class="flex items-center mb-2">
380
- <div class="bg-pink-900 text-pink-400 p-2 rounded-full mr-3">
381
- <i class="fas fa-globe"></i>
382
  </div>
383
- <h4 class="font-medium">Web App Testing</h4>
384
  </div>
385
- <p class="text-xs text-gray-400">56 tools for web security</p>
386
- </div>
387
-
388
- <!-- Wireless Testing -->
389
- <div class="tool-card bg-gray-700 p-4 rounded-lg shadow transition duration-150 ease-in-out cursor-pointer hover:border-orange-500 border border-gray-600">
390
- <div class="flex items-center mb-2">
391
- <div class="bg-orange-900 text-orange-400 p-2 rounded-full mr-3">
392
- <i class="fas fa-wifi"></i>
393
  </div>
394
- <h4 class="font-medium">Wireless Testing</h4>
395
  </div>
396
- <p class="text-xs text-gray-400">34 tools for wireless security</p>
397
  </div>
398
  </div>
399
  </div>
400
  </div>
401
- </div>
402
- </div>
403
 
404
- <!-- Footer -->
405
- <footer class="bg-gray-800 mt-12">
406
- <div class="max-w-7xl mx-auto py-6 px-4 sm:px-6 lg:px-8">
407
- <div class="flex flex-col md:flex-row justify-between items-center">
408
- <div class="flex items-center">
409
- <span class="text-green-500 font-bold text-lg mr-2">IPTF</span>
410
- <span class="text-gray-400 text-sm">AbuAliAQ June 2025 WebApp</span>
411
- </div>
412
- <div class="mt-4 md:mt-0">
413
- <span class="text-gray-400 text-sm">Version 1.0.0</span>
414
- <span class="mx-2 text-gray-600">|</span>
415
- <span class="text-gray-400 text-sm">Last Update: 2025-06-15</span>
416
- <span class="mx-2 text-gray-600">|</span>
417
- <span class="text-gray-400 text-sm">CVE DB: 2025-06-15</span>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
418
  </div>
419
  </div>
420
- </div>
421
- </footer>
422
 
423
- <script>
424
- // Terminal functionality
425
- const terminalInput = document.getElementById('terminal-input');
426
- const terminalOutput = document.getElementById('terminal-output');
427
-
428
- terminalInput.addEventListener('keypress', function(e) {
429
- if (e.key === 'Enter') {
430
- const command = terminalInput.value.trim();
431
- terminalInput.value = '';
432
-
433
- // Add the command to output
434
- const commandLine = document.createElement('div');
435
- commandLine.className = 'flex items-center mb-2';
436
- commandLine.innerHTML = `
437
- <span class="text-green-500 mr-2">root@iptf:~#</span>
438
- <span>${command}</span>
439
- `;
440
- terminalOutput.appendChild(commandLine);
441
-
442
- // Process command
443
- processCommand(command);
444
-
445
- // Scroll to bottom
446
- terminalOutput.scrollTop = terminalOutput.scrollHeight;
447
- }
448
- });
449
-
450
- function processCommand(command) {
451
- let response = '';
452
-
453
- if (command === 'help') {
454
- response = `
455
- <div class="mb-2">Available commands:</div>
456
- <div class="grid grid-cols-2 gap-2 text-xs mb-2">
457
- <div><span class="text-green-500">scan</span> - Start a network scan</div>
458
- <div><span class="text-green-500">exploit</span> - Run exploit modules</div>
459
- <div><span class="text-green-500">cve-search</span> - Search CVE database</div>
460
- <div><span class="text-green-500">tools</span> - List available tools</div>
461
- <div><span class="text-green-500">update</span> - Update all tools</div>
462
- <div><span class="text-green-500">clear</span> - Clear terminal</div>
463
- <div><span class="text-green-500">exit</span> - Exit the application</div>
464
- </div>
465
- `;
466
- }
467
- else if (command === 'scan') {
468
- response = `
469
- <div class="mb-2">Starting network scan...</div>
470
- <div class="mb-2">[+] Scanning target: 192.168.1.1</div>
471
- <div class="mb-2">[+] Port range: 1-1000</div>
472
- <div class="mb-2">[+] Using Nmap with aggressive timing</div>
473
- <div class="mb-2">[+] Discovered open ports:</div>
474
- <div class="ml-4 mb-2">
475
- <div>22/tcp open ssh</div>
476
- <div>80/tcp open http</div>
477
- <div>443/tcp open https</div>
478
- <div>8080/tcp open http-proxy</div>
479
  </div>
480
- <div class="mb-2">[+] Scan completed in 12.45 seconds</div>
481
- `;
482
- simulateNetworkVisualization();
483
- }
484
- else if (command === 'exploit') {
485
- response = `
486
- <div class="mb-2">Available exploit modules:</div>
487
- <div class="grid grid-cols-2 gap-2 text-xs mb-2">
488
- <div><span class="text-green-500">exploit/webapp/wordpress</span> - WordPress vulnerabilities</div>
489
- <div><span class="text-green-500">exploit/linux/ssh</span> - SSH vulnerabilities</div>
490
- <div><span class="text-green-500">exploit/windows/smb</span> - SMB vulnerabilities</div>
491
- <div><span class="text-green-500">exploit/multi/http</span> - HTTP vulnerabilities</div>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
492
  </div>
493
- <div class="mb-2">Use 'exploit &lt;module&gt;' to run specific exploit</div>
494
- `;
495
- }
496
- else if (command === 'cve-search') {
497
- response = `
498
- <div class="mb-2">CVE Database Search (latest: 2025-06-15)</div>
499
- <div class="mb-2">Usage: cve-search [keyword]</div>
500
- <div class="mb-2">Example: cve-search apache</div>
501
- `;
502
- }
503
- else if (command === 'tools') {
504
- response = `
505
- <div class="mb-2">Available tools (300+):</div>
506
- <div class="grid grid-cols-2 gap-2 text-xs mb-2">
507
- <div><span class="text-green-500">nmap</span> - Network scanner</div>
508
- <div><span class="text-green-500">metasploit</span> - Exploitation framework</div>
509
- <div><span class="text-green-500">sqlmap</span> - SQL injection tool</div>
510
- <div><span class="text-green-500">burpsuite</span> - Web app testing</div>
511
- <div><span class="text-green-500">wireshark</span> - Network analyzer</div>
512
- <div><span class="text-green-500">john</span> - Password cracker</div>
513
- <div><span class="text-green-500">aircrack-ng</span> - Wireless testing</div>
514
- <div><span class="text-green-500">hydra</span> - Login cracker</div>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
515
  </div>
516
- `;
517
- }
518
- else if (command === 'update') {
519
- response = `
520
- <div class="mb-2">Starting tool update process...</div>
521
- <div class="mb-2">[+] Checking for updates...</div>
522
- <div class="mb-2">[+] Updating Python tools (127 tools)</div>
523
- <div class="w-full bg-gray-700 rounded-full h-1.5 mb-2">
524
- <div class="bg-blue-500 h-1.5 rounded-full progress-bar" id="python-progress"></div>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
525
  </div>
526
- <div class="mb-2">[+] Updating Perl tools (42 tools)</div>
527
- <div class="w-full bg-gray-700 rounded-full h-1.5 mb-2">
528
- <div class="bg-blue-500 h-1.5 rounded-full progress-bar" id="perl-progress"></div>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
529
  </div>
530
- <div class="mb-2">[+] Updating Ruby tools (68 tools)</div>
531
- <div class="w-full bg-gray-700 rounded-full h-1.5 mb-2">
532
- <div class="bg-blue-500 h-1.5 rounded-full progress-bar" id="ruby-progress"></div>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
533
  </div>
534
- <div class="mb-2">[+] Updating GoLang tools (73 tools)</div>
535
- <div class="w-full bg-gray-700 rounded-full h-1.5 mb-2">
536
- <div class="bg-blue-500 h-1.5 rounded-full progress-bar" id="go-progress"></div>
 
 
 
 
 
 
 
 
537
  </div>
538
- <div class="mb-2">[+] Updating CVE database...</div>
539
- <div class="w-full bg-gray-700 rounded-full h-1.5 mb-2">
540
- <div class="bg-blue-500 h-1.5 rounded-full progress-bar" id="cve-progress"></div>
 
 
541
  </div>
542
- <div class="mb-2" id="update-complete">[+] All tools up to date</div>
543
- `;
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
544
 
545
- // Simulate progress bars
546
- setTimeout(() => {
547
- document.getElementById('python-progress').style.width = '100%';
548
- }, 500);
549
 
550
- setTimeout(() => {
551
- document.getElementById('perl-progress').style.width = '100%';
552
- }, 1000);
 
553
 
554
- setTimeout(() => {
555
- document.getElementById('ruby-progress').style.width = '100%';
556
- }, 1500);
 
 
 
 
 
 
 
 
 
 
557
 
 
558
  setTimeout(() => {
559
- document.getElementById('go-progress').style.width = '100%';
560
- }, 2000);
 
561
 
562
  setTimeout(() => {
563
- document.getElementById('cve-progress').style.width = '100%';
564
- document.getElementById('update-complete').innerHTML = '[✓] All tools and databases successfully updated';
565
- document.getElementById('update-complete').className = 'mb-2 text-green-500';
566
- }, 2500);
567
- }
568
- else if (command === 'clear') {
569
- terminalOutput.innerHTML = `
570
- <div class="mb-2">IPTF AbuAliAQ June 2025 WebApp v1.0.0</div>
571
- <div class="mb-2">System ready for penetration testing</div>
572
- <div class="mb-2">Type 'help' for available commands</div>
573
- <div class="flex items-center">
574
- <span class="text-green-500 mr-2">root@iptf:~#</span>
575
- <input type="text" class="terminal-input" id="terminal-input" autofocus>
576
- </div>
577
- `;
578
- terminalInput.focus();
579
- return;
580
- }
581
- else if (command === 'exit') {
582
- response = `
583
- <div class="mb-2">Logging out...</div>
584
- <div class="mb-2">Session terminated</div>
585
- `;
586
  setTimeout(() => {
587
- window.location.href = 'login.html';
588
- }, 1000);
589
- }
590
- else if (command) {
591
- response = `<div class="mb-2 text-red-500">Command not found: ${command}</div>`;
 
592
  }
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
593
 
594
- if (response) {
595
- const responseDiv = document.createElement('div');
596
- responseDiv.innerHTML = response;
597
- terminalOutput.appendChild(responseDiv);
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
598
 
599
- // Add new input line
600
- const newInputLine = document.createElement('div');
601
- newInputLine.className = 'flex items-center';
602
- newInputLine.innerHTML = `
603
- <span class="text-green-500 mr-2">root@iptf:~#</span>
604
- <input type="text" class="terminal-input" id="terminal-input" autofocus>
605
- `;
606
- terminalOutput.appendChild(newInputLine);
607
 
608
- // Focus on new input
609
- terminalInput.focus();
610
  }
611
  }
612
 
613
- // Network visualization simulation
614
- function simulateNetworkVisualization() {
615
- const visualization = document.getElementById('network-visualization');
616
- visualization.innerHTML = '';
617
-
618
- // Create nodes
619
- const nodes = [
620
- { id: 'gateway', name: 'Gateway', x: 50, y: 50, color: '#4CAF50' },
621
- { id: 'target', name: 'Target', x: 300, y: 200, color: '#F44336' },
622
- { id: 'router1', name: 'Router 1', x: 150, y: 150, color: '#2196F3' },
623
- { id: 'switch1', name: 'Switch 1', x: 250, y: 100, color: '#9C27B0' },
624
- { id: 'client1', name: 'Client 1', x: 200, y: 250, color: '#FF9800' },
625
- { id: 'client2', name: 'Client 2', x: 350, y: 150, color: '#FF9800' }
 
626
  ];
627
 
628
- // Create connections
629
- const connections = [
630
- { from: 'gateway', to: 'router1' },
631
- { from: 'router1', to: 'switch1' },
632
- { from: 'router1', to: 'client1' },
633
- { from: 'switch1', to: 'target' },
634
- { from: 'switch1', to: 'client2' }
635
- ];
636
-
637
- // Draw connections first (so they appear behind nodes)
638
- connections.forEach(conn => {
639
- const fromNode = nodes.find(n => n.id === conn.from);
640
- const toNode = nodes.find(n => n.id === conn.to);
641
-
642
- if (fromNode && toNode) {
643
- const line = document.createElement('div');
644
- line.className = 'connection';
645
-
646
- // Calculate line position and length
647
- const length = Math.sqrt(Math.pow(toNode.x - fromNode.x, 2) + Math.pow(toNode.y - fromNode.y, 2));
648
- const angle = Math.atan2(toNode.y - fromNode.y, toNode.x - fromNode.x) * 180 / Math.PI;
649
-
650
- line.style.width = `${length}px`;
651
- line.style.left = `${fromNode.x}px`;
652
- line.style.top = `${fromNode.y}px`;
653
- line.style.transform = `rotate(${angle}deg)`;
654
-
655
- visualization.appendChild(line);
656
  }
 
 
 
 
 
 
 
 
657
  });
658
 
659
- // Draw nodes
660
- nodes.forEach(node => {
661
- const nodeDiv = document.createElement('div');
662
- nodeDiv.className = 'node';
663
- nodeDiv.style.left = `${node.x - 40}px`;
664
- nodeDiv.style.top = `${node.y - 40}px`;
665
- nodeDiv.style.backgroundColor = node.color;
666
- nodeDiv.innerHTML = `
667
- <div class="text-center">
668
- <div class="text-xs">${node.name}</div>
669
- </div>
670
- `;
671
-
672
- visualization.appendChild(nodeDiv);
673
  });
674
 
675
- // Add scanning animation to target node
676
- setTimeout(() => {
677
- const targetNode = visualization.querySelector('.node:nth-child(6)');
678
- targetNode.classList.add('scanning');
679
-
680
- setTimeout(() => {
681
- targetNode.classList.remove('scanning');
682
- targetNode.style.boxShadow = '0 0 15px #F44336';
683
-
684
- // Add vulnerabilities found indicator
685
- const vulnIndicator = document.createElement('div');
686
- vulnIndicator.className = 'absolute -top-2 -right-2 bg-red-500 text-white text-xs rounded-full h-6 w-6 flex items-center justify-center';
687
- vulnIndicator.textContent = '3';
688
- targetNode.appendChild(vulnIndicator);
689
- }, 2000);
690
- }, 500);
691
- }
692
 
693
- // Initialize with some network visualization
694
- setTimeout(() => {
695
- simulateNetworkVisualization();
696
- }, 1000);
 
 
 
 
 
 
697
  </script>
698
  <p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - 🧬 <a href="https://enzostvs-deepsite.hf.space?remix=abuali1973/iptf" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
699
  </html>
 
6
  <title>IPTF AbuAliAQ June 2025 WebApp</title>
7
  <script src="https://cdn.tailwindcss.com"></script>
8
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
9
+ <script>
10
+ tailwind.config = {
11
+ theme: {
12
+ extend: {
13
+ colors: {
14
+ primary: '#1e40af',
15
+ secondary: '#1e3a8a',
16
+ dark: '#0f172a',
17
+ light: '#f8fafc',
18
+ danger: '#dc2626',
19
+ success: '#16a34a',
20
+ warning: '#d97706'
21
+ }
22
+ }
23
+ }
24
+ }
25
+ </script>
26
  <style>
27
+ .console-output {
 
 
28
  font-family: 'Courier New', monospace;
29
+ background-color: #0f172a;
30
+ color: #f8fafc;
31
+ height: 300px;
32
  overflow-y: auto;
33
+ padding: 1rem;
34
  border-radius: 0.5rem;
35
+ white-space: pre-wrap;
36
  }
37
 
38
+ .tool-card:hover {
39
+ transform: translateY(-5px);
40
+ box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2);
 
 
 
 
41
  }
42
 
43
+ .network-visualization {
 
 
44
  height: 400px;
45
+ background-color: #0f172a;
46
+ border-radius: 0.5rem;
47
  position: relative;
48
  }
49
 
50
  .node {
51
  position: absolute;
52
+ width: 50px;
53
+ height: 50px;
54
  border-radius: 50%;
55
  display: flex;
56
  align-items: center;
 
68
  .connection {
69
  position: absolute;
70
  height: 2px;
71
+ background-color: #3b82f6;
72
  transform-origin: 0 0;
73
  }
74
 
75
  .progress-bar {
76
  height: 5px;
77
+ background-color: #3b82f6;
 
78
  transition: width 0.3s ease;
79
  }
80
 
81
+ .tab-content {
82
+ display: none;
83
+ }
84
+
85
+ .tab-content.active {
86
+ display: block;
87
  }
88
 
89
+ .blink {
90
+ animation: blink 1s infinite;
 
 
91
  }
92
 
93
+ @keyframes blink {
94
+ 0%, 100% { opacity: 1; }
95
+ 50% { opacity: 0.5; }
 
96
  }
97
  </style>
98
  </head>
99
+ <body class="bg-gray-100 text-gray-900">
100
+ <!-- Login Modal -->
101
+ <div id="loginModal" class="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50">
102
+ <div class="bg-white p-8 rounded-lg shadow-xl w-full max-w-md">
103
+ <div class="text-center mb-6">
104
+ <h2 class="text-2xl font-bold text-primary">IPTF AbuAliAQ</h2>
105
+ <p class="text-gray-600">June 2025 WebApp</p>
106
+ </div>
107
+ <form id="loginForm">
108
+ <div class="mb-4">
109
+ <label for="username" class="block text-gray-700 mb-2">Username</label>
110
+ <input type="text" id="username" class="w-full px-3 py-2 border rounded-lg focus:outline-none focus:ring-2 focus:ring-primary" placeholder="admin" required>
111
+ </div>
112
+ <div class="mb-6">
113
+ <label for="password" class="block text-gray-700 mb-2">Password</label>
114
+ <input type="password" id="password" class="w-full px-3 py-2 border rounded-lg focus:outline-none focus:ring-2 focus:ring-primary" placeholder="admin@123" required>
 
 
115
  </div>
116
+ <button type="submit" class="w-full bg-primary text-white py-2 px-4 rounded-lg hover:bg-secondary transition duration-200">Login</button>
117
+ </form>
118
+ <div class="mt-4 text-center text-sm text-gray-600">
119
+ <p>Default credentials: admin / admin@123</p>
120
+ </div>
121
+ </div>
122
+ </div>
123
+
124
+ <!-- Main App (hidden until login) -->
125
+ <div id="mainApp" class="hidden">
126
+ <!-- Header -->
127
+ <header class="bg-dark text-white shadow-lg">
128
+ <div class="container mx-auto px-4 py-3 flex justify-between items-center">
129
+ <div class="flex items-center space-x-2">
130
+ <i class="fas fa-shield-alt text-2xl text-primary"></i>
131
+ <h1 class="text-xl font-bold">IPTF AbuAliAQ <span class="text-sm font-normal">June 2025 WebApp</span></h1>
132
+ </div>
133
+ <div class="flex items-center space-x-4">
134
+ <div class="relative">
135
+ <button id="notificationsBtn" class="p-2 rounded-full hover:bg-gray-700 relative">
136
+ <i class="fas fa-bell"></i>
137
+ <span class="absolute top-0 right-0 bg-danger text-white text-xs rounded-full h-5 w-5 flex items-center justify-center">3</span>
138
  </button>
139
+ <div id="notificationsDropdown" class="hidden absolute right-0 mt-2 w-64 bg-white text-gray-800 rounded-lg shadow-xl z-50">
140
+ <div class="p-3 border-b">
141
+ <h3 class="font-bold">Notifications</h3>
142
+ </div>
143
+ <div class="max-h-60 overflow-y-auto">
144
+ <a href="#" class="block p-3 hover:bg-gray-100 border-b">
145
+ <div class="text-sm font-medium">New CVE Database Update</div>
146
+ <div class="text-xs text-gray-500">5 minutes ago</div>
147
+ </a>
148
+ <a href="#" class="block p-3 hover:bg-gray-100 border-b">
149
+ <div class="text-sm font-medium">Tool Update Available</div>
150
+ <div class="text-xs text-gray-500">2 hours ago</div>
151
+ </a>
152
+ <a href="#" class="block p-3 hover:bg-gray-100">
153
+ <div class="text-sm font-medium">Scan Completed</div>
154
+ <div class="text-xs text-gray-500">Yesterday</div>
155
+ </a>
156
  </div>
157
  </div>
158
  </div>
159
+ <div class="relative">
160
+ <button id="userMenuBtn" class="flex items-center space-x-2 p-2 rounded-full hover:bg-gray-700">
161
+ <img src="https://ui-avatars.com/api/?name=Admin&background=1e40af&color=fff" alt="User" class="h-8 w-8 rounded-full">
162
+ <span>Admin</span>
163
+ </button>
164
+ <div id="userMenuDropdown" class="hidden absolute right-0 mt-2 w-48 bg-white text-gray-800 rounded-lg shadow-xl z-50">
165
+ <a href="#" class="block px-4 py-2 hover:bg-gray-100">Profile</a>
166
+ <a href="#" class="block px-4 py-2 hover:bg-gray-100">Settings</a>
167
+ <a href="#" id="logoutBtn" class="block px-4 py-2 hover:bg-gray-100 text-danger">Logout</a>
168
+ </div>
169
+ </div>
170
  </div>
171
  </div>
172
+ </header>
 
173
 
174
+ <!-- Main Content -->
175
+ <main class="container mx-auto px-4 py-6">
176
+ <!-- Dashboard Overview -->
177
+ <div class="grid grid-cols-1 md:grid-cols-4 gap-4 mb-6">
178
+ <div class="bg-white p-4 rounded-lg shadow">
179
+ <div class="flex items-center justify-between">
 
 
 
180
  <div>
181
+ <p class="text-gray-500">Active Scans</p>
182
+ <h3 class="text-2xl font-bold">8</h3>
183
  </div>
184
+ <div class="bg-blue-100 p-3 rounded-full">
185
+ <i class="fas fa-search text-primary text-xl"></i>
186
+ </div>
187
+ </div>
188
+ </div>
189
+ <div class="bg-white p-4 rounded-lg shadow">
190
+ <div class="flex items-center justify-between">
191
  <div>
192
+ <p class="text-gray-500">Vulnerabilities</p>
193
+ <h3 class="text-2xl font-bold">127</h3>
194
+ </div>
195
+ <div class="bg-red-100 p-3 rounded-full">
196
+ <i class="fas fa-bug text-danger text-xl"></i>
197
  </div>
198
+ </div>
199
+ </div>
200
+ <div class="bg-white p-4 rounded-lg shadow">
201
+ <div class="flex items-center justify-between">
202
  <div>
203
+ <p class="text-gray-500">CVEs Detected</p>
204
+ <h3 class="text-2xl font-bold">42</h3>
 
 
 
 
 
205
  </div>
206
+ <div class="bg-yellow-100 p-3 rounded-full">
207
+ <i class="fas fa-database text-warning text-xl"></i>
208
+ </div>
209
+ </div>
210
+ </div>
211
+ <div class="bg-white p-4 rounded-lg shadow">
212
+ <div class="flex items-center justify-between">
213
  <div>
214
+ <p class="text-gray-500">Tools Installed</p>
215
+ <h3 class="text-2xl font-bold">312</h3>
216
+ </div>
217
+ <div class="bg-green-100 p-3 rounded-full">
218
+ <i class="fas fa-tools text-success text-xl"></i>
219
+ </div>
 
 
 
 
 
 
220
  </div>
221
  </div>
222
+ </div>
223
 
224
+ <!-- Tabs Navigation -->
225
+ <div class="bg-white rounded-lg shadow mb-6">
226
+ <div class="border-b border-gray-200">
227
+ <nav class="flex flex-wrap">
228
+ <button class="tab-btn active px-4 py-3 font-medium text-primary border-b-2 border-primary" data-tab="dashboard">Dashboard</button>
229
+ <button class="tab-btn px-4 py-3 font-medium text-gray-500 hover:text-primary" data-tab="reconnaissance">1. Reconnaissance</button>
230
+ <button class="tab-btn px-4 py-3 font-medium text-gray-500 hover:text-primary" data-tab="scanning">2. Scanning</button>
231
+ <button class="tab-btn px-4 py-3 font-medium text-gray-500 hover:text-primary" data-tab="gaining-access">3. Gaining Access</button>
232
+ <button class="tab-btn px-4 py-3 font-medium text-gray-500 hover:text-primary" data-tab="maintaining-access">4. Maintaining Access</button>
233
+ <button class="tab-btn px-4 py-3 font-medium text-gray-500 hover:text-primary" data-tab="covering-tracks">5. Covering Tracks</button>
234
+ <button class="tab-btn px-4 py-3 font-medium text-gray-500 hover:text-primary" data-tab="reporting">6. Reporting</button>
235
+ <button class="tab-btn px-4 py-3 font-medium text-gray-500 hover:text-primary" data-tab="automation">7. Automation</button>
236
+ </nav>
 
 
 
 
 
 
 
 
 
 
237
  </div>
238
+ </div>
239
 
240
+ <!-- Tab Contents -->
241
+ <div class="tab-content active" id="dashboard-tab">
242
+ <div class="grid grid-cols-1 lg:grid-cols-3 gap-6">
243
+ <!-- Target Input Console -->
244
+ <div class="lg:col-span-2 bg-white p-4 rounded-lg shadow">
245
+ <h2 class="text-lg font-bold mb-4">Target Input Console</h2>
246
+ <div class="mb-4">
247
+ <label for="targetInput" class="block text-gray-700 mb-2">Enter Target</label>
248
+ <div class="flex">
249
+ <select class="bg-gray-100 border border-r-0 rounded-l-lg px-3 py-2 focus:outline-none">
250
+ <option>http://</option>
251
+ <option>https://</option>
252
+ <option>tcp://</option>
253
+ <option>udp://</option>
254
+ </select>
255
+ <input type="text" id="targetInput" class="flex-1 border px-3 py-2 focus:outline-none" placeholder="example.com or 192.168.1.1">
256
+ <button id="scanBtn" class="bg-primary text-white px-4 py-2 rounded-r-lg hover:bg-secondary">Scan</button>
257
  </div>
258
  </div>
259
+ <div class="mb-4">
260
+ <label class="block text-gray-700 mb-2">Scan Type</label>
261
+ <div class="flex flex-wrap gap-2">
262
+ <button class="bg-gray-100 hover:bg-gray-200 px-3 py-1 rounded-lg text-sm">Quick Scan</button>
263
+ <button class="bg-gray-100 hover:bg-gray-200 px-3 py-1 rounded-lg text-sm">Full Scan</button>
264
+ <button class="bg-gray-100 hover:bg-gray-200 px-3 py-1 rounded-lg text-sm">Vulnerability Scan</button>
265
+ <button class="bg-gray-100 hover:bg-gray-200 px-3 py-1 rounded-lg text-sm">Web App Scan</button>
266
+ <button class="bg-gray-100 hover:bg-gray-200 px-3 py-1 rounded-lg text-sm">Network Scan</button>
267
+ <button class="bg-gray-100 hover:bg-gray-200 px-3 py-1 rounded-lg text-sm">Custom</button>
268
  </div>
269
  </div>
270
  <div>
271
+ <label class="block text-gray-700 mb-2">Console Output</label>
272
+ <div class="console-output" id="consoleOutput">
273
+ <span class="text-success">[+]</span> IPTF AbuAliAQ June 2025 WebApp initialized
274
+ <br><span class="text-success">[+]</span> Loading 312 pentesting tools...
275
+ <br><span class="text-success">[+]</span> CVE Database connected (updated: 2025-06-15)
276
+ <br><span class="text-success">[+]</span> Ready for target input
277
+ <br><span class="text-primary blink">_</span>
278
  </div>
279
  </div>
280
+ </div>
281
+
282
+ <!-- Recent Scans -->
283
+ <div class="bg-white p-4 rounded-lg shadow">
284
+ <h2 class="text-lg font-bold mb-4">Recent Scans</h2>
285
+ <div class="space-y-3">
286
+ <div class="p-3 border rounded-lg hover:bg-gray-50 cursor-pointer">
287
+ <div class="flex justify-between items-center">
288
+ <div>
289
+ <h3 class="font-medium">192.168.1.105</h3>
290
+ <p class="text-sm text-gray-500">Full Network Scan</p>
291
+ </div>
292
+ <span class="bg-success text-white text-xs px-2 py-1 rounded-full">Completed</span>
293
+ </div>
294
+ <div class="mt-2 text-xs text-gray-500">15 minutes ago</div>
295
  </div>
296
+ <div class="p-3 border rounded-lg hover:bg-gray-50 cursor-pointer">
297
+ <div class="flex justify-between items-center">
298
+ <div>
299
+ <h3 class="font-medium">example.com</h3>
300
+ <p class="text-sm text-gray-500">Web App Scan</p>
301
+ </div>
302
+ <span class="bg-warning text-white text-xs px-2 py-1 rounded-full">In Progress</span>
303
+ </div>
304
+ <div class="mt-2 text-xs text-gray-500">1 hour ago</div>
305
+ <div class="w-full bg-gray-200 rounded-full h-1.5 mt-2">
306
+ <div class="bg-primary h-1.5 rounded-full" style="width: 45%"></div>
307
+ </div>
308
  </div>
309
+ <div class="p-3 border rounded-lg hover:bg-gray-50 cursor-pointer">
310
+ <div class="flex justify-between items-center">
311
+ <div>
312
+ <h3 class="font-medium">10.0.0.2</h3>
313
+ <p class="text-sm text-gray-500">Vulnerability Scan</p>
314
+ </div>
315
+ <span class="bg-danger text-white text-xs px-2 py-1 rounded-full">Failed</span>
316
+ </div>
317
+ <div class="mt-2 text-xs text-gray-500">3 hours ago</div>
318
  </div>
319
+ <div class="p-3 border rounded-lg hover:bg-gray-50 cursor-pointer">
320
+ <div class="flex justify-between items-center">
321
+ <div>
322
+ <h3 class="font-medium">api.example.org</h3>
323
+ <p class="text-sm text-gray-500">API Security Scan</p>
324
+ </div>
325
+ <span class="bg-success text-white text-xs px-2 py-1 rounded-full">Completed</span>
326
+ </div>
327
+ <div class="mt-2 text-xs text-gray-500">Yesterday</div>
328
  </div>
329
  </div>
330
+ <button class="mt-4 w-full bg-gray-100 hover:bg-gray-200 py-2 rounded-lg text-sm">View All Scans</button>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
331
  </div>
332
  </div>
333
 
334
+ <!-- Network Visualization -->
335
+ <div class="mt-6 bg-white p-4 rounded-lg shadow">
336
+ <h2 class="text-lg font-bold mb-4">Network Visualization</h2>
337
+ <div class="network-visualization" id="networkVisualization">
338
+ <!-- Nodes will be added dynamically -->
 
 
 
 
 
 
 
 
 
 
339
  </div>
340
  </div>
341
 
342
+ <!-- Quick Tools -->
343
+ <div class="mt-6">
344
+ <h2 class="text-lg font-bold mb-4">Quick Tools</h2>
345
+ <div class="grid grid-cols-2 md:grid-cols-4 lg:grid-cols-6 gap-4">
346
+ <div class="tool-card bg-white p-4 rounded-lg shadow cursor-pointer transition duration-300">
347
+ <div class="text-center">
348
+ <div class="bg-blue-100 p-3 rounded-full inline-block mb-2">
349
+ <i class="fas fa-globe text-primary text-xl"></i>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
350
  </div>
351
+ <h3 class="font-medium">Whois Lookup</h3>
352
  </div>
353
+ </div>
354
+ <div class="tool-card bg-white p-4 rounded-lg shadow cursor-pointer transition duration-300">
355
+ <div class="text-center">
356
+ <div class="bg-green-100 p-3 rounded-full inline-block mb-2">
357
+ <i class="fas fa-network-wired text-success text-xl"></i>
 
 
 
358
  </div>
359
+ <h3 class="font-medium">Ping</h3>
360
  </div>
361
+ </div>
362
+ <div class="tool-card bg-white p-4 rounded-lg shadow cursor-pointer transition duration-300">
363
+ <div class="text-center">
364
+ <div class="bg-yellow-100 p-3 rounded-full inline-block mb-2">
365
+ <i class="fas fa-route text-warning text-xl"></i>
 
 
 
366
  </div>
367
+ <h3 class="font-medium">Traceroute</h3>
368
  </div>
369
+ </div>
370
+ <div class="tool-card bg-white p-4 rounded-lg shadow cursor-pointer transition duration-300">
371
+ <div class="text-center">
372
+ <div class="bg-purple-100 p-3 rounded-full inline-block mb-2">
373
+ <i class="fas fa-search text-purple-600 text-xl"></i>
 
 
 
374
  </div>
375
+ <h3 class="font-medium">Port Scanner</h3>
376
  </div>
377
+ </div>
378
+ <div class="tool-card bg-white p-4 rounded-lg shadow cursor-pointer transition duration-300">
379
+ <div class="text-center">
380
+ <div class="bg-red-100 p-3 rounded-full inline-block mb-2">
381
+ <i class="fas fa-lock text-danger text-xl"></i>
 
 
 
382
  </div>
383
+ <h3 class="font-medium">SSL Checker</h3>
384
  </div>
385
+ </div>
386
+ <div class="tool-card bg-white p-4 rounded-lg shadow cursor-pointer transition duration-300">
387
+ <div class="text-center">
388
+ <div class="bg-indigo-100 p-3 rounded-full inline-block mb-2">
389
+ <i class="fas fa-code text-indigo-600 text-xl"></i>
 
 
 
390
  </div>
391
+ <h3 class="font-medium">DNS Lookup</h3>
392
  </div>
 
393
  </div>
394
  </div>
395
  </div>
396
  </div>
 
 
397
 
398
+ <!-- Other Tabs (initially hidden) -->
399
+ <div class="tab-content" id="reconnaissance-tab">
400
+ <div class="bg-white p-4 rounded-lg shadow">
401
+ <h2 class="text-lg font-bold mb-4">Reconnaissance Tools</h2>
402
+ <p>This phase involves gathering information about the target system. Tools available:</p>
403
+
404
+ <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4 mt-4">
405
+ <div class="border rounded-lg p-4">
406
+ <h3 class="font-bold mb-2">Maltego</h3>
407
+ <p class="text-sm text-gray-600 mb-3">For open-source intelligence (OSINT) and forensics</p>
408
+ <button class="bg-primary text-white px-3 py-1 rounded text-sm">Run</button>
409
+ </div>
410
+ <div class="border rounded-lg p-4">
411
+ <h3 class="font-bold mb-2">theHarvester</h3>
412
+ <p class="text-sm text-gray-600 mb-3">Gather emails, subdomains, hosts, employee names</p>
413
+ <button class="bg-primary text-white px-3 py-1 rounded text-sm">Run</button>
414
+ </div>
415
+ <div class="border rounded-lg p-4">
416
+ <h3 class="font-bold mb-2">Recon-ng</h3>
417
+ <p class="text-sm text-gray-600 mb-3">Web reconnaissance framework</p>
418
+ <button class="bg-primary text-white px-3 py-1 rounded text-sm">Run</button>
419
+ </div>
420
+ <div class="border rounded-lg p-4">
421
+ <h3 class="font-bold mb-2">SpiderFoot</h3>
422
+ <p class="text-sm text-gray-600 mb-3">Automated OSINT collection</p>
423
+ <button class="bg-primary text-white px-3 py-1 rounded text-sm">Run</button>
424
+ </div>
425
+ <div class="border rounded-lg p-4">
426
+ <h3 class="font-bold mb-2">Shodan</h3>
427
+ <p class="text-sm text-gray-600 mb-3">Search engine for Internet-connected devices</p>
428
+ <button class="bg-primary text-white px-3 py-1 rounded text-sm">Run</button>
429
+ </div>
430
+ <div class="border rounded-lg p-4">
431
+ <h3 class="font-bold mb-2">FOCA</h3>
432
+ <p class="text-sm text-gray-600 mb-3">Fingerprinting Organizations with Collected Archives</p>
433
+ <button class="bg-primary text-white px-3 py-1 rounded text-sm">Run</button>
434
+ </div>
435
+ </div>
436
  </div>
437
  </div>
 
 
438
 
439
+ <div class="tab-content" id="scanning-tab">
440
+ <div class="bg-white p-4 rounded-lg shadow">
441
+ <h2 class="text-lg font-bold mb-4">Scanning Tools</h2>
442
+ <p>This phase involves identifying open ports, services, and vulnerabilities.</p>
443
+
444
+ <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4 mt-4">
445
+ <div class="border rounded-lg p-4">
446
+ <h3 class="font-bold mb-2">Nmap</h3>
447
+ <p class="text-sm text-gray-600 mb-3">Network discovery and security auditing</p>
448
+ <button class="bg-primary text-white px-3 py-1 rounded text-sm">Run</button>
449
+ </div>
450
+ <div class="border rounded-lg p-4">
451
+ <h3 class="font-bold mb-2">Nessus</h3>
452
+ <p class="text-sm text-gray-600 mb-3">Vulnerability scanner</p>
453
+ <button class="bg-primary text-white px-3 py-1 rounded text-sm">Run</button>
454
+ </div>
455
+ <div class="border rounded-lg p-4">
456
+ <h3 class="font-bold mb-2">OpenVAS</h3>
457
+ <p class="text-sm text-gray-600 mb-3">Vulnerability assessment system</p>
458
+ <button class="bg-primary text-white px-3 py-1 rounded text-sm">Run</button>
459
+ </div>
460
+ <div class="border rounded-lg p-4">
461
+ <h3 class="font-bold mb-2">Nikto</h3>
462
+ <p class="text-sm text-gray-600 mb-3">Web server scanner</p>
463
+ <button class="bg-primary text-white px-3 py-1 rounded text-sm">Run</button>
464
+ </div>
465
+ <div class="border rounded-lg p-4">
466
+ <h3 class="font-bold mb-2">WPScan</h3>
467
+ <p class="text-sm text-gray-600 mb-3">WordPress vulnerability scanner</p>
468
+ <button class="bg-primary text-white px-3 py-1 rounded text-sm">Run</button>
469
+ </div>
470
+ <div class="border rounded-lg p-4">
471
+ <h3 class="font-bold mb-2">ZAP</h3>
472
+ <p class="text-sm text-gray-600 mb-3">OWASP Zed Attack Proxy</p>
473
+ <button class="bg-primary text-white px-3 py-1 rounded text-sm">Run</button>
474
+ </div>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
475
  </div>
476
+ </div>
477
+ </div>
478
+
479
+ <div class="tab-content" id="gaining-access-tab">
480
+ <div class="bg-white p-4 rounded-lg shadow">
481
+ <h2 class="text-lg font-bold mb-4">Gaining Access Tools</h2>
482
+ <p>This phase involves exploiting vulnerabilities to gain access to systems.</p>
483
+
484
+ <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4 mt-4">
485
+ <div class="border rounded-lg p-4">
486
+ <h3 class="font-bold mb-2">Metasploit</h3>
487
+ <p class="text-sm text-gray-600 mb-3">Penetration testing framework</p>
488
+ <button class="bg-primary text-white px-3 py-1 rounded text-sm">Run</button>
489
+ </div>
490
+ <div class="border rounded-lg p-4">
491
+ <h3 class="font-bold mb-2">SQLmap</h3>
492
+ <p class="text-sm text-gray-600 mb-3">SQL injection tool</p>
493
+ <button class="bg-primary text-white px-3 py-1 rounded text-sm">Run</button>
494
+ </div>
495
+ <div class="border rounded-lg p-4">
496
+ <h3 class="font-bold mb-2">Burp Suite</h3>
497
+ <p class="text-sm text-gray-600 mb-3">Web application security testing</p>
498
+ <button class="bg-primary text-white px-3 py-1 rounded text-sm">Run</button>
499
+ </div>
500
+ <div class="border rounded-lg p-4">
501
+ <h3 class="font-bold mb-2">Hydra</h3>
502
+ <p class="text-sm text-gray-600 mb-3">Password cracking tool</p>
503
+ <button class="bg-primary text-white px-3 py-1 rounded text-sm">Run</button>
504
+ </div>
505
+ <div class="border rounded-lg p-4">
506
+ <h3 class="font-bold mb-2">John the Ripper</h3>
507
+ <p class="text-sm text-gray-600 mb-3">Password cracker</p>
508
+ <button class="bg-primary text-white px-3 py-1 rounded text-sm">Run</button>
509
+ </div>
510
+ <div class="border rounded-lg p-4">
511
+ <h3 class="font-bold mb-2">BeEF</h3>
512
+ <p class="text-sm text-gray-600 mb-3">Browser Exploitation Framework</p>
513
+ <button class="bg-primary text-white px-3 py-1 rounded text-sm">Run</button>
514
+ </div>
515
  </div>
516
+ </div>
517
+ </div>
518
+
519
+ <div class="tab-content" id="maintaining-access-tab">
520
+ <div class="bg-white p-4 rounded-lg shadow">
521
+ <h2 class="text-lg font-bold mb-4">Maintaining Access Tools</h2>
522
+ <p>This phase involves maintaining access to the compromised system.</p>
523
+
524
+ <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4 mt-4">
525
+ <div class="border rounded-lg p-4">
526
+ <h3 class="font-bold mb-2">Meterpreter</h3>
527
+ <p class="text-sm text-gray-600 mb-3">Metasploit's advanced payload</p>
528
+ <button class="bg-primary text-white px-3 py-1 rounded text-sm">Run</button>
529
+ </div>
530
+ <div class="border rounded-lg p-4">
531
+ <h3 class="font-bold mb-2">Cobalt Strike</h3>
532
+ <p class="text-sm text-gray-600 mb-3">Post-exploitation framework</p>
533
+ <button class="bg-primary text-white px-3 py-1 rounded text-sm">Run</button>
534
+ </div>
535
+ <div class="border rounded-lg p-4">
536
+ <h3 class="font-bold mb-2">Empire</h3>
537
+ <p class="text-sm text-gray-600 mb-3">Post-exploitation framework</p>
538
+ <button class="bg-primary text-white px-3 py-1 rounded text-sm">Run</button>
539
+ </div>
540
+ <div class="border rounded-lg p-4">
541
+ <h3 class="font-bold mb-2">Powersploit</h3>
542
+ <p class="text-sm text-gray-600 mb-3">PowerShell post-exploitation framework</p>
543
+ <button class="bg-primary text-white px-3 py-1 rounded text-sm">Run</button>
544
+ </div>
545
+ <div class="border rounded-lg p-4">
546
+ <h3 class="font-bold mb-2">Netcat</h3>
547
+ <p class="text-sm text-gray-600 mb-3">Network utility for reading/writing network connections</p>
548
+ <button class="bg-primary text-white px-3 py-1 rounded text-sm">Run</button>
549
+ </div>
550
+ <div class="border rounded-lg p-4">
551
+ <h3 class="font-bold mb-2">SSH</h3>
552
+ <p class="text-sm text-gray-600 mb-3">Secure Shell for remote access</p>
553
+ <button class="bg-primary text-white px-3 py-1 rounded text-sm">Run</button>
554
+ </div>
555
  </div>
556
+ </div>
557
+ </div>
558
+
559
+ <div class="tab-content" id="covering-tracks-tab">
560
+ <div class="bg-white p-4 rounded-lg shadow">
561
+ <h2 class="text-lg font-bold mb-4">Covering Tracks Tools</h2>
562
+ <p>This phase involves removing evidence of the penetration.</p>
563
+
564
+ <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4 mt-4">
565
+ <div class="border rounded-lg p-4">
566
+ <h3 class="font-bold mb-2">Timestomp</h3>
567
+ <p class="text-sm text-gray-600 mb-3">Modify file timestamps</p>
568
+ <button class="bg-primary text-white px-3 py-1 rounded text-sm">Run</button>
569
+ </div>
570
+ <div class="border rounded-lg p-4">
571
+ <h3 class="font-bold mb-2">Clearev</h3>
572
+ <p class="text-sm text-gray-600 mb-3">Clear event logs</p>
573
+ <button class="bg-primary text-white px-3 py-1 rounded text-sm">Run</button>
574
+ </div>
575
+ <div class="border rounded-lg p-4">
576
+ <h3 class="font-bold mb-2">Slacker</h3>
577
+ <p class="text-sm text-gray-600 mb-3">Hide files in slack space</p>
578
+ <button class="bg-primary text-white px-3 py-1 rounded text-sm">Run</button>
579
+ </div>
580
+ <div class="border rounded-lg p-4">
581
+ <h3 class="font-bold mb-2">BleachBit</h3>
582
+ <p class="text-sm text-gray-600 mb-3">System cleaner</p>
583
+ <button class="bg-primary text-white px-3 py-1 rounded text-sm">Run</button>
584
+ </div>
585
+ <div class="border rounded-lg p-4">
586
+ <h3 class="font-bold mb-2">CCleaner</h3>
587
+ <p class="text-sm text-gray-600 mb-3">System optimization and cleaning</p>
588
+ <button class="bg-primary text-white px-3 py-1 rounded text-sm">Run</button>
589
+ </div>
590
+ <div class="border rounded-lg p-4">
591
+ <h3 class="font-bold mb-2">LogCleaner</h3>
592
+ <p class="text-sm text-gray-600 mb-3">Clean system logs</p>
593
+ <button class="bg-primary text-white px-3 py-1 rounded text-sm">Run</button>
594
+ </div>
595
  </div>
596
+ </div>
597
+ </div>
598
+
599
+ <div class="tab-content" id="reporting-tab">
600
+ <div class="bg-white p-4 rounded-lg shadow">
601
+ <h2 class="text-lg font-bold mb-4">Reporting Tools</h2>
602
+ <p>This phase involves documenting findings and creating reports.</p>
603
+
604
+ <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4 mt-4">
605
+ <div class="border rounded-lg p-4">
606
+ <h3 class="font-bold mb-2">Dradis</h3>
607
+ <p class="text-sm text-gray-600 mb-3">Collaboration and reporting framework</p>
608
+ <button class="bg-primary text-white px-3 py-1 rounded text-sm">Run</button>
609
+ </div>
610
+ <div class="border rounded-lg p-4">
611
+ <h3 class="font-bold mb-2">Faraday</h3>
612
+ <p class="text-sm text-gray-600 mb-3">Collaborative pentest IDE</p>
613
+ <button class="bg-primary text-white px-3 py-1 rounded text-sm">Run</button>
614
+ </div>
615
+ <div class="border rounded-lg p-4">
616
+ <h3 class="font-bold mb-2">Serpico</h3>
617
+ <p class="text-sm text-gray-600 mb-3">Pentest reporting tool</p>
618
+ <button class="bg-primary text-white px-3 py-1 rounded text-sm">Run</button>
619
+ </div>
620
+ <div class="border rounded-lg p-4">
621
+ <h3 class="font-bold mb-2">Pandoc</h3>
622
+ <p class="text-sm text-gray-600 mb-3">Document converter</p>
623
+ <button class="bg-primary text-white px-3 py-1 rounded text-sm">Run</button>
624
+ </div>
625
+ <div class="border rounded-lg p-4">
626
+ <h3 class="font-bold mb-2">ReportGenerator</h3>
627
+ <p class="text-sm text-gray-600 mb-3">Automated report generation</p>
628
+ <button class="bg-primary text-white px-3 py-1 rounded text-sm">Run</button>
629
+ </div>
630
+ <div class="border rounded-lg p-4">
631
+ <h3 class="font-bold mb-2">MagicTree</h3>
632
+ <p class="text-sm text-gray-600 mb-3">Data collaboration and reporting</p>
633
+ <button class="bg-primary text-white px-3 py-1 rounded text-sm">Run</button>
634
+ </div>
635
  </div>
636
+ </div>
637
+ </div>
638
+
639
+ <div class="tab-content" id="automation-tab">
640
+ <div class="bg-white p-4 rounded-lg shadow">
641
+ <h2 class="text-lg font-bold mb-4">Automation Tools</h2>
642
+ <p>This phase involves automating the penetration testing process.</p>
643
+
644
+ <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4 mt-4">
645
+ <div class="border rounded-lg p-4">
646
+ <h3 class="font-bold mb-2">AutoSploit</h3>
647
+ <p class="text-sm text-gray-600 mb-3">Automated exploitation</p>
648
+ <button class="bg-primary text-white px-3 py-1 rounded text-sm">Run</button>
649
+ </div>
650
+ <div class="border rounded-lg p-4">
651
+ <h3 class="font-bold mb-2">AutoRecon</h3>
652
+ <p class="text-sm text-gray-600 mb-3">Automated reconnaissance</p>
653
+ <button class="bg-primary text-white px-3 py-1 rounded text-sm">Run</button>
654
+ </div>
655
+ <div class="border rounded-lg p-4">
656
+ <h3 class="font-bold mb-2">Pentest Automation</h3>
657
+ <p class="text-sm text-gray-600 mb-3">Custom automation scripts</p>
658
+ <button class="bg-primary text-white px-3 py-1 rounded text-sm">Run</button>
659
+ </div>
660
+ <div class="border rounded-lg p-4">
661
+ <h3 class="font-bold mb-2">Robot Framework</h3>
662
+ <p class="text-sm text-gray-600 mb-3">Test automation</p>
663
+ <button class="bg-primary text-white px-3 py-1 rounded text-sm">Run</button>
664
+ </div>
665
+ <div class="border rounded-lg p-4">
666
+ <h3 class="font-bold mb-2">Ansible</h3>
667
+ <p class="text-sm text-gray-600 mb-3">Configuration management</p>
668
+ <button class="bg-primary text-white px-3 py-1 rounded text-sm">Run</button>
669
+ </div>
670
+ <div class="border rounded-lg p-4">
671
+ <h3 class="font-bold mb-2">Custom Scripts</h3>
672
+ <p class="text-sm text-gray-600 mb-3">Python, Perl, Ruby, GoLang</p>
673
+ <button class="bg-primary text-white px-3 py-1 rounded text-sm">Run</button>
674
+ </div>
675
  </div>
676
+ </div>
677
+ </div>
678
+ </main>
679
+
680
+ <!-- Footer -->
681
+ <footer class="bg-dark text-white py-4">
682
+ <div class="container mx-auto px-4">
683
+ <div class="flex flex-col md:flex-row justify-between items-center">
684
+ <div class="mb-4 md:mb-0">
685
+ <p>IPTF AbuAliAQ June 2025 WebApp</p>
686
+ <p class="text-sm text-gray-400">Version 2.5.1 | Last updated: 2025-06-15</p>
687
  </div>
688
+ <div class="flex space-x-4">
689
+ <a href="#" class="hover:text-primary"><i class="fab fa-github"></i></a>
690
+ <a href="#" class="hover:text-primary"><i class="fab fa-twitter"></i></a>
691
+ <a href="#" class="hover:text-primary"><i class="fab fa-discord"></i></a>
692
+ <a href="#" class="hover:text-primary"><i class="fas fa-book"></i></a>
693
  </div>
694
+ </div>
695
+ <div class="mt-4 text-center md:text-left text-sm text-gray-400">
696
+ <p>For authorized penetration testing only. Use responsibly and ethically.</p>
697
+ </div>
698
+ </div>
699
+ </footer>
700
+ </div>
701
+
702
+ <script>
703
+ // Login functionality
704
+ document.getElementById('loginForm').addEventListener('submit', function(e) {
705
+ e.preventDefault();
706
+ const username = document.getElementById('username').value;
707
+ const password = document.getElementById('password').value;
708
+
709
+ if (username === 'admin' && password === 'admin@123') {
710
+ document.getElementById('loginModal').classList.add('hidden');
711
+ document.getElementById('mainApp').classList.remove('hidden');
712
+ initializeNetworkVisualization();
713
+ simulateConsoleOutput();
714
+ } else {
715
+ alert('Invalid credentials. Try admin / admin@123');
716
+ }
717
+ });
718
+
719
+ // Logout functionality
720
+ document.getElementById('logoutBtn').addEventListener('click', function() {
721
+ document.getElementById('loginModal').classList.remove('hidden');
722
+ document.getElementById('mainApp').classList.add('hidden');
723
+ document.getElementById('username').value = '';
724
+ document.getElementById('password').value = '';
725
+ });
726
+
727
+ // Notifications dropdown
728
+ document.getElementById('notificationsBtn').addEventListener('click', function() {
729
+ document.getElementById('notificationsDropdown').classList.toggle('hidden');
730
+ });
731
+
732
+ // User menu dropdown
733
+ document.getElementById('userMenuBtn').addEventListener('click', function() {
734
+ document.getElementById('userMenuDropdown').classList.toggle('hidden');
735
+ });
736
+
737
+ // Tab switching
738
+ const tabButtons = document.querySelectorAll('.tab-btn');
739
+ tabButtons.forEach(button => {
740
+ button.addEventListener('click', function() {
741
+ // Remove active class from all buttons and contents
742
+ tabButtons.forEach(btn => btn.classList.remove('active', 'text-primary', 'border-primary'));
743
+ tabButtons.forEach(btn => btn.classList.add('text-gray-500'));
744
 
745
+ // Add active class to clicked button
746
+ this.classList.add('active', 'text-primary', 'border-primary');
747
+ this.classList.remove('text-gray-500');
 
748
 
749
+ // Hide all tab contents
750
+ document.querySelectorAll('.tab-content').forEach(content => {
751
+ content.classList.remove('active');
752
+ });
753
 
754
+ // Show the selected tab content
755
+ const tabId = this.getAttribute('data-tab');
756
+ document.getElementById(`${tabId}-tab`).classList.add('active');
757
+ });
758
+ });
759
+
760
+ // Scan button functionality
761
+ document.getElementById('scanBtn').addEventListener('click', function() {
762
+ const target = document.getElementById('targetInput').value;
763
+ if (target) {
764
+ const consoleOutput = document.getElementById('consoleOutput');
765
+ consoleOutput.innerHTML += `<br><span class="text-primary">[+]</span> Starting scan on ${target}...`;
766
+ consoleOutput.scrollTop = consoleOutput.scrollHeight;
767
 
768
+ // Simulate scan progress
769
  setTimeout(() => {
770
+ consoleOutput.innerHTML += `<br><span class="text-primary">[+]</span> Running reconnaissance...`;
771
+ consoleOutput.scrollTop = consoleOutput.scrollHeight;
772
+ }, 1000);
773
 
774
  setTimeout(() => {
775
+ consoleOutput.innerHTML += `<br><span class="text-primary">[+]</span> Scanning ports...`;
776
+ consoleOutput.scrollTop = consoleOutput.scrollHeight;
777
+ }, 3000);
778
+
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
779
  setTimeout(() => {
780
+ consoleOutput.innerHTML += `<br><span class="text-success">[+]</span> Scan completed. Found 5 open ports and 3 vulnerabilities.`;
781
+ consoleOutput.scrollTop = consoleOutput.scrollHeight;
782
+
783
+ // Update network visualization with new nodes
784
+ addNodeToVisualization(target);
785
+ }, 6000);
786
  }
787
+ });
788
+
789
+ // Initialize network visualization
790
+ function initializeNetworkVisualization() {
791
+ const networkVis = document.getElementById('networkVisualization');
792
+
793
+ // Clear any existing nodes
794
+ networkVis.innerHTML = '';
795
+
796
+ // Add central node (the pentester)
797
+ addNode(networkVis, 'Pentester', 50, 50, 'bg-primary');
798
+
799
+ // Add some sample nodes
800
+ addNode(networkVis, 'Gateway', 200, 50, 'bg-secondary');
801
+ addNode(networkVis, 'Web Server', 350, 150, 'bg-warning');
802
+ addNode(networkVis, 'Database', 350, 250, 'bg-danger');
803
+ addNode(networkVis, 'Firewall', 200, 350, 'bg-success');
804
+
805
+ // Draw connections
806
+ drawConnection(networkVis, 75, 75, 200, 75);
807
+ drawConnection(networkVis, 225, 75, 350, 175);
808
+ drawConnection(networkVis, 225, 75, 350, 275);
809
+ drawConnection(networkVis, 225, 75, 225, 375);
810
+ }
811
+
812
+ function addNode(container, label, x, y, bgColor) {
813
+ const node = document.createElement('div');
814
+ node.className = `node ${bgColor}`;
815
+ node.style.left = `${x}px`;
816
+ node.style.top = `${y}px`;
817
+ node.textContent = label;
818
+ container.appendChild(node);
819
+
820
+ // Add click event to show node details
821
+ node.addEventListener('click', function() {
822
+ alert(`Node details: ${label}\nIP: 192.168.1.${Math.floor(Math.random() * 255)}\nOS: Linux/Windows`);
823
+ });
824
+ }
825
+
826
+ function drawConnection(container, x1, y1, x2, y2) {
827
+ const connection = document.createElement('div');
828
+ connection.className = 'connection';
829
 
830
+ // Calculate length and angle
831
+ const length = Math.sqrt(Math.pow(x2 - x1, 2) + Math.pow(y2 - y1, 2));
832
+ const angle = Math.atan2(y2 - y1, x2 - x1) * 180 / Math.PI;
833
+
834
+ connection.style.width = `${length}px`;
835
+ connection.style.left = `${x1}px`;
836
+ connection.style.top = `${y1}px`;
837
+ connection.style.transform = `rotate(${angle}deg)`;
838
+
839
+ container.appendChild(connection);
840
+ }
841
+
842
+ function addNodeToVisualization(target) {
843
+ const networkVis = document.getElementById('networkVisualization');
844
+ const width = networkVis.clientWidth;
845
+ const height = networkVis.clientHeight;
846
+
847
+ // Generate random position (not too close to edges)
848
+ const x = 100 + Math.random() * (width - 200);
849
+ const y = 100 + Math.random() * (height - 200);
850
+
851
+ // Add the new node
852
+ addNode(networkVis, target, x, y, 'bg-purple-600');
853
+
854
+ // Connect to a random existing node
855
+ const nodes = document.querySelectorAll('.node');
856
+ if (nodes.length > 1) {
857
+ const randomNode = nodes[Math.floor(Math.random() * (nodes.length - 1)) + 1];
858
+ const rect = randomNode.getBoundingClientRect();
859
+ const parentRect = networkVis.getBoundingClientRect();
860
 
861
+ const nodeX = rect.left - parentRect.left + rect.width / 2;
862
+ const nodeY = rect.top - parentRect.top + rect.height / 2;
 
 
 
 
 
 
863
 
864
+ drawConnection(networkVis, x + 25, y + 25, nodeX, nodeY);
 
865
  }
866
  }
867
 
868
+ // Simulate console output
869
+ function simulateConsoleOutput() {
870
+ const consoleOutput = document.getElementById('consoleOutput');
871
+ const messages = [
872
+ "[+] Loading Python tools: sqlmap, Scapy, Impacket...",
873
+ "[+] Loading Perl tools: Nikto, W3af...",
874
+ "[+] Loading Ruby tools: Metasploit Framework, Arachni...",
875
+ "[+] Loading GoLang tools: Gobuster, Amass, Subfinder...",
876
+ "[+] Initializing CVE Database connection...",
877
+ "[+] CVE Database synchronized (2025-06-15)",
878
+ "[+] Automated update check complete - all tools up to date",
879
+ "[+] Modular tool integration system ready",
880
+ "[+] Ethical hacking disclaimer loaded",
881
+ "[+] Ready for target input"
882
  ];
883
 
884
+ let i = 0;
885
+ const interval = setInterval(() => {
886
+ if (i < messages.length) {
887
+ consoleOutput.innerHTML += `<br><span class="text-primary">${messages[i]}</span>`;
888
+ consoleOutput.scrollTop = consoleOutput.scrollHeight;
889
+ i++;
890
+ } else {
891
+ clearInterval(interval);
892
+ consoleOutput.innerHTML += `<br><span class="text-primary blink">_</span>`;
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
893
  }
894
+ }, 500);
895
+ }
896
+
897
+ // Tool card hover effects
898
+ document.querySelectorAll('.tool-card').forEach(card => {
899
+ card.addEventListener('mouseenter', function() {
900
+ this.style.transform = 'translateY(-5px)';
901
+ this.style.boxShadow = '0 10px 25px rgba(0, 0, 0, 0.2)';
902
  });
903
 
904
+ card.addEventListener('mouseleave', function() {
905
+ this.style.transform = '';
906
+ this.style.boxShadow = '';
 
 
 
 
 
 
 
 
 
 
 
907
  });
908
 
909
+ // Add click event to show tool details
910
+ card.addEventListener('click', function() {
911
+ const toolName = this.querySelector('h3').textContent;
912
+ alert(`Launching ${toolName}...\nThis would execute the actual tool in a real implementation.`);
913
+ });
914
+ });
 
 
 
 
 
 
 
 
 
 
 
915
 
916
+ // Close dropdowns when clicking outside
917
+ document.addEventListener('click', function(e) {
918
+ if (!e.target.closest('#notificationsBtn') && !e.target.closest('#notificationsDropdown')) {
919
+ document.getElementById('notificationsDropdown').classList.add('hidden');
920
+ }
921
+
922
+ if (!e.target.closest('#userMenuBtn') && !e.target.closest('#userMenuDropdown')) {
923
+ document.getElementById('userMenuDropdown').classList.add('hidden');
924
+ }
925
+ });
926
  </script>
927
  <p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - 🧬 <a href="https://enzostvs-deepsite.hf.space?remix=abuali1973/iptf" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
928
  </html>