Spaces:

abuali1973
/

iptf

Running

App Files Files Community

iptf / index.html

abuali1973

continue coding more and more for pentesting which are seventh phases updated in 2025 - Initial Deployment

bc3fc41 verified 2 months ago

raw

history blame

39 kB

	<!DOCTYPE html>
	<html lang="en">
	<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>IPTF AbuAliAQ June 2025 WebApp</title>
	<script src="https://cdn.tailwindcss.com"></script>
	<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
	<style>
	/* Custom CSS for terminal and visualizations */
	.terminal {
	background-color: #1e1e1e;
	font-family: 'Courier New', monospace;
	height: 400px;
	overflow-y: auto;
	border-radius: 0.5rem;
	}

	.terminal-input {
	background-color: transparent;
	border: none;
	outline: none;
	color: #00ff00;
	width: 90%;
	font-family: 'Courier New', monospace;
	}

	.visualization-canvas {
	background-color: #1e1e1e;
	border-radius: 0.5rem;
	height: 400px;
	position: relative;
	}

	.node {
	position: absolute;
	width: 80px;
	height: 80px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	color: white;
	font-weight: bold;
	cursor: pointer;
	transition: all 0.3s ease;
	}

	.node:hover {
	transform: scale(1.1);
	}

	.connection {
	position: absolute;
	height: 2px;
	background-color: rgba(255, 255, 255, 0.5);
	transform-origin: 0 0;
	}

	.progress-bar {
	height: 5px;
	background-color: #4CAF50;
	width: 0%;
	transition: width 0.3s ease;
	}

	.tool-card:hover {
	transform: translateY(-5px);
	box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);
	}

	/* Animation for scanning */
	@keyframes scan {
	0% { background-position: 0 0; }
	100% { background-position: 100% 0; }
	}

	.scanning {
	background: linear-gradient(90deg, #1e1e1e, #4CAF50, #1e1e1e);
	background-size: 200% 100%;
	animation: scan 2s linear infinite;
	}
	</style>
	</head>
	<body class="bg-gray-900 text-gray-100 min-h-screen">
	<!-- Navigation -->
	<nav class="bg-gray-800 shadow-lg">
	<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
	<div class="flex items-center justify-between h-16">
	<div class="flex items-center">
	<div class="flex-shrink-0">
	<span class="text-green-500 font-bold text-xl">IPTF</span>
	</div>
	<div class="hidden md:block">
	<div class="ml-10 flex items-baseline space-x-4">
	<a href="#" class="bg-gray-900 text-white px-3 py-2 rounded-md text-sm font-medium">Dashboard</a>
	<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>
	<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>
	<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>
	<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>
	</div>
	</div>
	</div>
	<div class="hidden md:block">
	<div class="ml-4 flex items-center md:ml-6">
	<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">
	<span class="sr-only">View notifications</span>
	<i class="fas fa-bell h-6 w-6"></i>
	</button>
	<div class="ml-3 relative">
	<div>
	<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">
	<span class="sr-only">Open user menu</span>
	<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="">
	</button>
	</div>
	</div>
	</div>
	</div>
	<div class="-mr-2 flex md:hidden">
	<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">
	<span class="sr-only">Open main menu</span>
	<i class="fas fa-bars block h-6 w-6"></i>
	</button>
	</div>
	</div>
	</div>
	</nav>

	<!-- Main Content -->
	<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-6">
	<div class="flex flex-col md:flex-row gap-6">
	<!-- Left Sidebar -->
	<div class="w-full md:w-1/4 space-y-6">
	<!-- Target Input -->
	<div class="bg-gray-800 p-4 rounded-lg shadow">
	<h3 class="text-lg font-medium mb-4">Target Configuration</h3>
	<div class="space-y-4">
	<div>
	<label class="block text-sm font-medium text-gray-300 mb-1">Target IP/Hostname</label>
	<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">
	</div>
	<div>
	<label class="block text-sm font-medium text-gray-300 mb-1">Port Range</label>
	<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">
	</div>
	<div>
	<label class="block text-sm font-medium text-gray-300 mb-1">Scan Intensity</label>
	<select class="w-full bg-gray-700 border border-gray-600 rounded-md px-3 py-2 text-sm">
	<option>Stealth</option>
	<option selected>Normal</option>
	<option>Aggressive</option>
	<option>Insane</option>
	</select>
	</div>
	<div>
	<label class="block text-sm font-medium text-gray-300 mb-1">Scan Type</label>
	<select class="w-full bg-gray-700 border border-gray-600 rounded-md px-3 py-2 text-sm">
	<option>Full Audit</option>
	<option selected>Quick Scan</option>
	<option>Web App Scan</option>
	<option>Network Scan</option>
	<option>Exploit Scan</option>
	</select>
	</div>
	<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">
	<i class="fas fa-play mr-2"></i> Start Scan
	</button>
	</div>
	</div>

	<!-- Quick Tools -->
	<div class="bg-gray-800 p-4 rounded-lg shadow">
	<h3 class="text-lg font-medium mb-4">Quick Tools</h3>
	<div class="grid grid-cols-2 gap-2">
	<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">
	<i class="fas fa-network-wired mr-1"></i> Ping
	</button>
	<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">
	<i class="fas fa-route mr-1"></i> Traceroute
	</button>
	<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">
	<i class="fas fa-search mr-1"></i> Nmap
	</button>
	<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">
	<i class="fas fa-lock mr-1"></i> SSL Test
	</button>
	<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">
	<i class="fas fa-code mr-1"></i> SQLi
	</button>
	<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">
	<i class="fas fa-terminal mr-1"></i> Exploit
	</button>
	</div>
	</div>

	<!-- Scan Status -->
	<div class="bg-gray-800 p-4 rounded-lg shadow">
	<h3 class="text-lg font-medium mb-4">Scan Status</h3>
	<div class="space-y-4">
	<div>
	<div class="flex justify-between text-sm mb-1">
	<span>Phase 1: Reconnaissance</span>
	<span class="text-green-500"><i class="fas fa-check-circle"></i> Complete</span>
	</div>
	<div class="w-full bg-gray-700 rounded-full h-1.5">
	<div class="bg-green-500 h-1.5 rounded-full" style="width: 100%"></div>
	</div>
	</div>
	<div>
	<div class="flex justify-between text-sm mb-1">
	<span>Phase 2: Scanning</span>
	<span class="text-yellow-500"><i class="fas fa-spinner fa-spin"></i> In Progress</span>
	</div>
	<div class="w-full bg-gray-700 rounded-full h-1.5">
	<div class="bg-yellow-500 h-1.5 rounded-full" style="width: 45%"></div>
	</div>
	</div>
	<div>
	<div class="flex justify-between text-sm mb-1">
	<span>Phase 3: Gaining Access</span>
	<span class="text-gray-400">Pending</span>
	</div>
	<div class="w-full bg-gray-700 rounded-full h-1.5">
	<div class="bg-gray-500 h-1.5 rounded-full" style="width: 0%"></div>
	</div>
	</div>
	<div>
	<div class="flex justify-between text-sm mb-1">
	<span>Phase 4: Maintaining Access</span>
	<span class="text-gray-400">Pending</span>
	</div>
	<div class="w-full bg-gray-700 rounded-full h-1.5">
	<div class="bg-gray-500 h-1.5 rounded-full" style="width: 0%"></div>
	</div>
	</div>
	<div>
	<div class="flex justify-between text-sm mb-1">
	<span>Phase 5: Covering Tracks</span>
	<span class="text-gray-400">Pending</span>
	</div>
	<div class="w-full bg-gray-700 rounded-full h-1.5">
	<div class="bg-gray-500 h-1.5 rounded-full" style="width: 0%"></div>
	</div>
	</div>
	</div>
	</div>
	</div>

	<!-- Main Panel -->
	<div class="w-full md:w-3/4 space-y-6">
	<!-- Terminal Interface -->
	<div class="bg-gray-800 p-4 rounded-lg shadow">
	<div class="flex justify-between items-center mb-4">
	<h3 class="text-lg font-medium">Terminal Interface</h3>
	<div class="flex space-x-2">
	<button class="bg-gray-700 hover:bg-gray-600 text-white p-1 rounded-md text-xs">
	<i class="fas fa-copy"></i>
	</button>
	<button class="bg-gray-700 hover:bg-gray-600 text-white p-1 rounded-md text-xs">
	<i class="fas fa-expand"></i>
	</button>
	<button class="bg-gray-700 hover:bg-gray-600 text-white p-1 rounded-md text-xs">
	<i class="fas fa-terminal"></i>
	</button>
	</div>
	</div>
	<div class="terminal p-4 text-green-400 text-sm" id="terminal-output">
	<div class="mb-2">IPTF AbuAliAQ June 2025 WebApp v1.0.0</div>
	<div class="mb-2">Initializing modules...</div>
	<div class="mb-2">Loading 300+ pentesting tools...</div>
	<div class="mb-2">[✓] Python tools loaded (127 tools)</div>
	<div class="mb-2">[✓] Perl tools loaded (42 tools)</div>
	<div class="mb-2">[✓] Ruby tools loaded (68 tools)</div>
	<div class="mb-2">[✓] GoLang tools loaded (73 tools)</div>
	<div class="mb-2">Connecting to CVE database...</div>
	<div class="mb-2">[✓] CVE database connected (latest update: 2025-06-15)</div>
	<div class="mb-2">Checking for updates...</div>
	<div class="mb-2">[✓] All tools up to date</div>
	<div class="mb-2">System ready for penetration testing</div>
	<div class="mb-2">Type 'help' for available commands</div>
	<div class="flex items-center">
	<span class="text-green-500 mr-2">root@iptf:~#</span>
	<input type="text" class="terminal-input" id="terminal-input" autofocus>
	</div>
	</div>
	</div>

	<!-- Visualization Panel -->
	<div class="bg-gray-800 p-4 rounded-lg shadow">
	<div class="flex justify-between items-center mb-4">
	<h3 class="text-lg font-medium">Network Visualization</h3>
	<div class="flex space-x-2">
	<button class="bg-gray-700 hover:bg-gray-600 text-white p-1 rounded-md text-xs">
	<i class="fas fa-sync-alt"></i>
	</button>
	<button class="bg-gray-700 hover:bg-gray-600 text-white p-1 rounded-md text-xs">
	<i class="fas fa-download"></i>
	</button>
	</div>
	</div>
	<div class="visualization-canvas" id="network-visualization">
	<!-- Network nodes will be dynamically added here -->
	</div>
	</div>

	<!-- Tool Categories -->
	<div class="bg-gray-800 p-4 rounded-lg shadow">
	<h3 class="text-lg font-medium mb-4">Tool Categories</h3>
	<div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-4">
	<!-- Reconnaissance -->
	<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">
	<div class="flex items-center mb-2">
	<div class="bg-green-900 text-green-400 p-2 rounded-full mr-3">
	<i class="fas fa-binoculars"></i>
	</div>
	<h4 class="font-medium">Reconnaissance</h4>
	</div>
	<p class="text-xs text-gray-400">45 tools for information gathering</p>
	</div>

	<!-- Scanning -->
	<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">
	<div class="flex items-center mb-2">
	<div class="bg-yellow-900 text-yellow-400 p-2 rounded-full mr-3">
	<i class="fas fa-search"></i>
	</div>
	<h4 class="font-medium">Scanning</h4>
	</div>
	<p class="text-xs text-gray-400">62 tools for network scanning</p>
	</div>

	<!-- Gaining Access -->
	<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">
	<div class="flex items-center mb-2">
	<div class="bg-red-900 text-red-400 p-2 rounded-full mr-3">
	<i class="fas fa-lock-open"></i>
	</div>
	<h4 class="font-medium">Gaining Access</h4>
	</div>
	<p class="text-xs text-gray-400">78 tools for exploitation</p>
	</div>

	<!-- Maintaining Access -->
	<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">
	<div class="flex items-center mb-2">
	<div class="bg-purple-900 text-purple-400 p-2 rounded-full mr-3">
	<i class="fas fa-user-shield"></i>
	</div>
	<h4 class="font-medium">Maintaining Access</h4>
	</div>
	<p class="text-xs text-gray-400">32 tools for persistence</p>
	</div>

	<!-- Covering Tracks -->
	<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">
	<div class="flex items-center mb-2">
	<div class="bg-blue-900 text-blue-400 p-2 rounded-full mr-3">
	<i class="fas fa-eraser"></i>
	</div>
	<h4 class="font-medium">Covering Tracks</h4>
	</div>
	<p class="text-xs text-gray-400">28 tools for stealth</p>
	</div>

	<!-- Reporting -->
	<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">
	<div class="flex items-center mb-2">
	<div class="bg-indigo-900 text-indigo-400 p-2 rounded-full mr-3">
	<i class="fas fa-file-alt"></i>
	</div>
	<h4 class="font-medium">Reporting</h4>
	</div>
	<p class="text-xs text-gray-400">15 tools for documentation</p>
	</div>

	<!-- Web App Testing -->
	<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">
	<div class="flex items-center mb-2">
	<div class="bg-pink-900 text-pink-400 p-2 rounded-full mr-3">
	<i class="fas fa-globe"></i>
	</div>
	<h4 class="font-medium">Web App Testing</h4>
	</div>
	<p class="text-xs text-gray-400">56 tools for web security</p>
	</div>

	<!-- Wireless Testing -->
	<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">
	<div class="flex items-center mb-2">
	<div class="bg-orange-900 text-orange-400 p-2 rounded-full mr-3">
	<i class="fas fa-wifi"></i>
	</div>
	<h4 class="font-medium">Wireless Testing</h4>
	</div>
	<p class="text-xs text-gray-400">34 tools for wireless security</p>
	</div>
	</div>
	</div>
	</div>
	</div>
	</div>

	<!-- Footer -->
	<footer class="bg-gray-800 mt-12">
	<div class="max-w-7xl mx-auto py-6 px-4 sm:px-6 lg:px-8">
	<div class="flex flex-col md:flex-row justify-between items-center">
	<div class="flex items-center">
	<span class="text-green-500 font-bold text-lg mr-2">IPTF</span>
	<span class="text-gray-400 text-sm">AbuAliAQ June 2025 WebApp</span>
	</div>
	<div class="mt-4 md:mt-0">
	<span class="text-gray-400 text-sm">Version 1.0.0</span>
	<span class="mx-2 text-gray-600">\|</span>
	<span class="text-gray-400 text-sm">Last Update: 2025-06-15</span>
	<span class="mx-2 text-gray-600">\|</span>
	<span class="text-gray-400 text-sm">CVE DB: 2025-06-15</span>
	</div>
	</div>
	</div>
	</footer>

	<script>
	// Terminal functionality
	const terminalInput = document.getElementById('terminal-input');
	const terminalOutput = document.getElementById('terminal-output');

	terminalInput.addEventListener('keypress', function(e) {
	if (e.key === 'Enter') {
	const command = terminalInput.value.trim();
	terminalInput.value = '';

	// Add the command to output
	const commandLine = document.createElement('div');
	commandLine.className = 'flex items-center mb-2';
	commandLine.innerHTML = `
	<span class="text-green-500 mr-2">root@iptf:~#</span>
	<span>${command}</span>
	`;
	terminalOutput.appendChild(commandLine);

	// Process command
	processCommand(command);

	// Scroll to bottom
	terminalOutput.scrollTop = terminalOutput.scrollHeight;
	}
	});

	function processCommand(command) {
	let response = '';

	if (command === 'help') {
	response = `
	<div class="mb-2">Available commands:</div>
	<div class="grid grid-cols-2 gap-2 text-xs mb-2">
	<div><span class="text-green-500">scan</span> - Start a network scan</div>
	<div><span class="text-green-500">exploit</span> - Run exploit modules</div>
	<div><span class="text-green-500">cve-search</span> - Search CVE database</div>
	<div><span class="text-green-500">tools</span> - List available tools</div>
	<div><span class="text-green-500">update</span> - Update all tools</div>
	<div><span class="text-green-500">clear</span> - Clear terminal</div>
	<div><span class="text-green-500">exit</span> - Exit the application</div>
	</div>
	`;
	}
	else if (command === 'scan') {
	response = `
	<div class="mb-2">Starting network scan...</div>
	<div class="mb-2">[+] Scanning target: 192.168.1.1</div>
	<div class="mb-2">[+] Port range: 1-1000</div>
	<div class="mb-2">[+] Using Nmap with aggressive timing</div>
	<div class="mb-2">[+] Discovered open ports:</div>
	<div class="ml-4 mb-2">
	<div>22/tcp open ssh</div>
	<div>80/tcp open http</div>
	<div>443/tcp open https</div>
	<div>8080/tcp open http-proxy</div>
	</div>
	<div class="mb-2">[+] Scan completed in 12.45 seconds</div>
	`;
	simulateNetworkVisualization();
	}
	else if (command === 'exploit') {
	response = `
	<div class="mb-2">Available exploit modules:</div>
	<div class="grid grid-cols-2 gap-2 text-xs mb-2">
	<div><span class="text-green-500">exploit/webapp/wordpress</span> - WordPress vulnerabilities</div>
	<div><span class="text-green-500">exploit/linux/ssh</span> - SSH vulnerabilities</div>
	<div><span class="text-green-500">exploit/windows/smb</span> - SMB vulnerabilities</div>
	<div><span class="text-green-500">exploit/multi/http</span> - HTTP vulnerabilities</div>
	</div>
	<div class="mb-2">Use 'exploit <module>' to run specific exploit</div>
	`;
	}
	else if (command === 'cve-search') {
	response = `
	<div class="mb-2">CVE Database Search (latest: 2025-06-15)</div>
	<div class="mb-2">Usage: cve-search [keyword]</div>
	<div class="mb-2">Example: cve-search apache</div>
	`;
	}
	else if (command === 'tools') {
	response = `
	<div class="mb-2">Available tools (300+):</div>
	<div class="grid grid-cols-2 gap-2 text-xs mb-2">
	<div><span class="text-green-500">nmap</span> - Network scanner</div>
	<div><span class="text-green-500">metasploit</span> - Exploitation framework</div>
	<div><span class="text-green-500">sqlmap</span> - SQL injection tool</div>
	<div><span class="text-green-500">burpsuite</span> - Web app testing</div>
	<div><span class="text-green-500">wireshark</span> - Network analyzer</div>
	<div><span class="text-green-500">john</span> - Password cracker</div>
	<div><span class="text-green-500">aircrack-ng</span> - Wireless testing</div>
	<div><span class="text-green-500">hydra</span> - Login cracker</div>
	</div>
	`;
	}
	else if (command === 'update') {
	response = `
	<div class="mb-2">Starting tool update process...</div>
	<div class="mb-2">[+] Checking for updates...</div>
	<div class="mb-2">[+] Updating Python tools (127 tools)</div>
	<div class="w-full bg-gray-700 rounded-full h-1.5 mb-2">
	<div class="bg-blue-500 h-1.5 rounded-full progress-bar" id="python-progress"></div>
	</div>
	<div class="mb-2">[+] Updating Perl tools (42 tools)</div>
	<div class="w-full bg-gray-700 rounded-full h-1.5 mb-2">
	<div class="bg-blue-500 h-1.5 rounded-full progress-bar" id="perl-progress"></div>
	</div>
	<div class="mb-2">[+] Updating Ruby tools (68 tools)</div>
	<div class="w-full bg-gray-700 rounded-full h-1.5 mb-2">
	<div class="bg-blue-500 h-1.5 rounded-full progress-bar" id="ruby-progress"></div>
	</div>
	<div class="mb-2">[+] Updating GoLang tools (73 tools)</div>
	<div class="w-full bg-gray-700 rounded-full h-1.5 mb-2">
	<div class="bg-blue-500 h-1.5 rounded-full progress-bar" id="go-progress"></div>
	</div>
	<div class="mb-2">[+] Updating CVE database...</div>
	<div class="w-full bg-gray-700 rounded-full h-1.5 mb-2">
	<div class="bg-blue-500 h-1.5 rounded-full progress-bar" id="cve-progress"></div>
	</div>
	<div class="mb-2" id="update-complete">[+] All tools up to date</div>
	`;

	// Simulate progress bars
	setTimeout(() => {
	document.getElementById('python-progress').style.width = '100%';
	}, 500);

	setTimeout(() => {
	document.getElementById('perl-progress').style.width = '100%';
	}, 1000);

	setTimeout(() => {
	document.getElementById('ruby-progress').style.width = '100%';
	}, 1500);

	setTimeout(() => {
	document.getElementById('go-progress').style.width = '100%';
	}, 2000);

	setTimeout(() => {
	document.getElementById('cve-progress').style.width = '100%';
	document.getElementById('update-complete').innerHTML = '[✓] All tools and databases successfully updated';
	document.getElementById('update-complete').className = 'mb-2 text-green-500';
	}, 2500);
	}
	else if (command === 'clear') {
	terminalOutput.innerHTML = `
	<div class="mb-2">IPTF AbuAliAQ June 2025 WebApp v1.0.0</div>
	<div class="mb-2">System ready for penetration testing</div>
	<div class="mb-2">Type 'help' for available commands</div>
	<div class="flex items-center">
	<span class="text-green-500 mr-2">root@iptf:~#</span>
	<input type="text" class="terminal-input" id="terminal-input" autofocus>
	</div>
	`;
	terminalInput.focus();
	return;
	}
	else if (command === 'exit') {
	response = `
	<div class="mb-2">Logging out...</div>
	<div class="mb-2">Session terminated</div>
	`;
	setTimeout(() => {
	window.location.href = 'login.html';
	}, 1000);
	}
	else if (command) {
	response = `<div class="mb-2 text-red-500">Command not found: ${command}</div>`;
	}

	if (response) {
	const responseDiv = document.createElement('div');
	responseDiv.innerHTML = response;
	terminalOutput.appendChild(responseDiv);

	// Add new input line
	const newInputLine = document.createElement('div');
	newInputLine.className = 'flex items-center';
	newInputLine.innerHTML = `
	<span class="text-green-500 mr-2">root@iptf:~#</span>
	<input type="text" class="terminal-input" id="terminal-input" autofocus>
	`;
	terminalOutput.appendChild(newInputLine);

	// Focus on new input
	terminalInput.focus();
	}
	}

	// Network visualization simulation
	function simulateNetworkVisualization() {
	const visualization = document.getElementById('network-visualization');
	visualization.innerHTML = '';

	// Create nodes
	const nodes = [
	{ id: 'gateway', name: 'Gateway', x: 50, y: 50, color: '#4CAF50' },
	{ id: 'target', name: 'Target', x: 300, y: 200, color: '#F44336' },
	{ id: 'router1', name: 'Router 1', x: 150, y: 150, color: '#2196F3' },
	{ id: 'switch1', name: 'Switch 1', x: 250, y: 100, color: '#9C27B0' },
	{ id: 'client1', name: 'Client 1', x: 200, y: 250, color: '#FF9800' },
	{ id: 'client2', name: 'Client 2', x: 350, y: 150, color: '#FF9800' }
	];

	// Create connections
	const connections = [
	{ from: 'gateway', to: 'router1' },
	{ from: 'router1', to: 'switch1' },
	{ from: 'router1', to: 'client1' },
	{ from: 'switch1', to: 'target' },
	{ from: 'switch1', to: 'client2' }
	];

	// Draw connections first (so they appear behind nodes)
	connections.forEach(conn => {
	const fromNode = nodes.find(n => n.id === conn.from);
	const toNode = nodes.find(n => n.id === conn.to);

	if (fromNode && toNode) {
	const line = document.createElement('div');
	line.className = 'connection';

	// Calculate line position and length
	const length = Math.sqrt(Math.pow(toNode.x - fromNode.x, 2) + Math.pow(toNode.y - fromNode.y, 2));
	const angle = Math.atan2(toNode.y - fromNode.y, toNode.x - fromNode.x) * 180 / Math.PI;

	line.style.width = `${length}px`;
	line.style.left = `${fromNode.x}px`;
	line.style.top = `${fromNode.y}px`;
	line.style.transform = `rotate(${angle}deg)`;

	visualization.appendChild(line);
	}
	});

	// Draw nodes
	nodes.forEach(node => {
	const nodeDiv = document.createElement('div');
	nodeDiv.className = 'node';
	nodeDiv.style.left = `${node.x - 40}px`;
	nodeDiv.style.top = `${node.y - 40}px`;
	nodeDiv.style.backgroundColor = node.color;
	nodeDiv.innerHTML = `
	<div class="text-center">
	<div class="text-xs">${node.name}</div>
	</div>
	`;

	visualization.appendChild(nodeDiv);
	});

	// Add scanning animation to target node
	setTimeout(() => {
	const targetNode = visualization.querySelector('.node:nth-child(6)');
	targetNode.classList.add('scanning');

	setTimeout(() => {
	targetNode.classList.remove('scanning');
	targetNode.style.boxShadow = '0 0 15px #F44336';

	// Add vulnerabilities found indicator
	const vulnIndicator = document.createElement('div');
	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';
	vulnIndicator.textContent = '3';
	targetNode.appendChild(vulnIndicator);
	}, 2000);
	}, 500);
	}

	// Initialize with some network visualization
	setTimeout(() => {
	simulateNetworkVisualization();
	}, 1000);
	</script>
	<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>
	</html>