Spaces:

Rayan545454
/

hooker

Running

hooker / index.html

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Malware Scanner</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> .file-drop-area { border: 2px dashed #9CA3AF; transition: all 0.3s ease; } .file-drop-area.active { border-color: #3B82F6; background-color: #EFF6FF; } .scan-animation { animation: pulse 2s infinite; } @keyframes pulse { 0% { opacity: 0.6; } 50% { opacity: 1; } 100% { opacity: 0.6; } } .threat-item { transition: all 0.3s ease; } .threat-item:hover { transform: translateY(-2px); box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06); } </style> </head> <body class="bg-gray-50 min-h-screen"> <div class="container mx-auto px-4 py-8">  <header class="text-center mb-10"> <div class="flex justify-center mb-4"> <div class="bg-blue-100 p-4 rounded-full"> <i class="fas fa-shield-alt text-blue-600 text-4xl"></i> </div> </div> <h1 class="text-3xl md:text-4xl font-bold text-gray-800 mb-2">Malware Scanner</h1> <p class="text-gray-600 max-w-2xl mx-auto">Protect your system by scanning files and directories for known malware threats</p> </header>  <div class="bg-white rounded-xl shadow-lg overflow-hidden max-w-4xl mx-auto">  <div class="p-6 border-b border-gray-200"> <div class="flex flex-col md:flex-row gap-4"> <div class="flex-1"> <label for="path-input" class="block text-sm font-medium text-gray-700 mb-1">Enter file or directory path</label> <div class="flex"> <input type="text" id="path-input" placeholder="C:\path\to\file_or_folder" class="flex-1 rounded-l-lg border border-gray-300 px-4 py-2 focus:outline-none focus:ring-2 focus:ring-blue-500"> <button id="browse-btn" class="bg-gray-200 hover:bg-gray-300 px-4 py-2 rounded-r-lg border border-l-0 border-gray-300"> <i class="fas fa-folder-open"></i> </button> </div> </div> <div class="flex items-end"> <button id="scan-btn" class="bg-blue-600 hover:bg-blue-700 text-white px-6 py-2 rounded-lg font-medium transition-colors w-full md:w-auto"> <i class="fas fa-search mr-2"></i> Scan Now </button> </div> </div>  <div id="drop-area" class="file-drop-area mt-6 rounded-lg p-8 text-center cursor-pointer"> <div class="mb-3"> <i class="fas fa-cloud-upload-alt text-4xl text-gray-400"></i> </div> <h3 class="text-lg font-medium text-gray-700 mb-1">Drag & Drop Files Here</h3> <p class="text-gray-500 text-sm">or click to browse files</p> <input type="file" id="file-input" class="hidden" multiple> </div> </div>  <div id="results-section" class="hidden"> <div class="bg-gray-50 px-6 py-4 border-b border-gray-200"> <div class="flex justify-between items-center"> <h2 class="text-xl font-semibold text-gray-800">Scan Results</h2> <div id="scan-status" class="flex items-center"> <span class="text-sm font-medium text-gray-600 mr-2">Scanning...</span> <div class="w-3 h-3 rounded-full bg-blue-500 scan-animation"></div> </div> </div> </div> <div id="results-container" class="p-6">  <div id="summary-card" class="bg-white border border-gray-200 rounded-lg p-4 mb-6 hidden"> <div class="flex flex-wrap justify-between"> <div class="flex items-center mb-3 md:mb-0"> <div class="mr-3"> <div class="w-12 h-12 rounded-full bg-blue-100 flex items-center justify-center"> <i class="fas fa-shield-alt text-blue-600"></i> </div> </div> <div> <h3 class="font-medium text-gray-800" id="summary-title">Scan Complete</h3> <p class="text-sm text-gray-500" id="summary-subtitle">No threats detected</p> </div> </div> <div class="grid grid-cols-2 md:grid-cols-3 gap-4"> <div class="text-center"> <p class="text-sm text-gray-500">Files Scanned</p> <p class="font-semibold text-gray-800" id="files-scanned">0</p> </div> <div class="text-center"> <p class="text-sm text-gray-500">Threats Found</p> <p class="font-semibold text-red-600" id="threats-found">0</p> </div> <div class="text-center"> <p class="text-sm text-gray-500">Time Taken</p> <p class="font-semibold text-gray-800" id="time-taken">0s</p> </div> </div> </div> </div>  <div id="threats-container" class="hidden"> <h4 class="text-lg font-medium text-gray-800 mb-3">Detected Threats</h4> <div id="threats-list" class="space-y-3">  </div> </div>  <div id="safe-files-container" class="hidden mt-6"> <div class="flex justify-between items-center mb-3"> <h4 class="text-lg font-medium text-gray-800">Scanned Files</h4> <button id="toggle-safe-files" class="text-sm text-blue-600 hover:text-blue-800">Show All</button> </div> <div id="safe-files-list" class="hidden bg-gray-50 rounded-lg p-4 max-h-60 overflow-y-auto">  </div> </div> </div> </div> </div>  <div class="mt-12 max-w-4xl mx-auto"> <div class="bg-white rounded-xl shadow-lg overflow-hidden"> <div class="p-6 border-b border-gray-200"> <h2 class="text-xl font-semibold text-gray-800">About This Scanner</h2> </div> <div class="p-6"> <div class="grid md:grid-cols-2 gap-6"> <div> <h3 class="font-medium text-gray-800 mb-2">How It Works</h3> <p class="text-gray-600 text-sm mb-4"> This scanner checks files against a database of known malware MD5 hashes. When you scan a file or directory, it calculates the MD5 hash of each file and compares it against the database. </p> <div class="bg-blue-50 rounded-lg p-4"> <h4 class="font-medium text-blue-800 mb-2 flex items-center"> <i class="fas fa-info-circle mr-2"></i> Note </h4> <p class="text-blue-700 text-sm"> This is a demo version with a limited malware database. For real protection, use professional antivirus software. </p> </div> </div> <div> <h3 class="font-medium text-gray-800 mb-2">Current Malware Database</h3> <div class="bg-gray-50 rounded-lg p-4"> <ul class="space-y-2"> <li class="flex items-center text-sm"> <i class="fas fa-virus text-red-500 mr-2 w-5"></i> <span>FakeMalware1.exe</span> </li> <li class="flex items-center text-sm"> <i class="fas fa-virus text-red-500 mr-2 w-5"></i> <span>VirusTestFile.txt</span> </li> </ul> <p class="text-gray-500 text-xs mt-3"> Last updated: <span id="db-date">Today</span> </p> </div> </div> </div> </div> </div> </div> </div> <script> document.addEventListener('DOMContentLoaded', function() { // Mock malware database (MD5 hashes) const MALWARE_HASHES = { "44d88612fea8a8f36de82e12fbaba6fa": "FakeMalware1.exe", "3395856ce81f2b7382dee72602f798b6": "VirusTestFile.txt" }; // DOM elements const pathInput = document.getElementById('path-input'); const browseBtn = document.getElementById('browse-btn'); const scanBtn = document.getElementById('scan-btn'); const dropArea = document.getElementById('drop-area'); const fileInput = document.getElementById('file-input'); const resultsSection = document.getElementById('results-section'); const scanStatus = document.getElementById('scan-status'); const summaryCard = document.getElementById('summary-card'); const threatsContainer = document.getElementById('threats-container'); const threatsList = document.getElementById('threats-list'); const safeFilesContainer = document.getElementById('safe-files-container'); const safeFilesList = document.getElementById('safe-files-list'); const toggleSafeFiles = document.getElementById('toggle-safe-files'); const filesScannedEl = document.getElementById('files-scanned'); const threatsFoundEl = document.getElementById('threats-found'); const timeTakenEl = document.getElementById('time-taken'); const summaryTitle = document.getElementById('summary-title'); const summarySubtitle = document.getElementById('summary-subtitle'); // Variables to track scan progress let scanStartTime; let filesToScan = []; let scannedFiles = 0; let threatsFound = 0; let safeFiles = []; // Event listeners browseBtn.addEventListener('click', function() { fileInput.click(); }); fileInput.addEventListener('change', function(e) { handleFiles(e.target.files); }); dropArea.addEventListener('click', function() { fileInput.click(); }); ['dragenter', 'dragover', 'dragleave', 'drop'].forEach(eventName => { dropArea.addEventListener(eventName, preventDefaults, false); }); function preventDefaults(e) { e.preventDefault(); e.stopPropagation(); } ['dragenter', 'dragover'].forEach(eventName => { dropArea.addEventListener(eventName, highlight, false); }); ['dragleave', 'drop'].forEach(eventName => { dropArea.addEventListener(eventName, unhighlight, false); }); function highlight() { dropArea.classList.add('active'); } function unhighlight() { dropArea.classList.remove('active'); } dropArea.addEventListener('drop', function(e) { const dt = e.dataTransfer; const files = dt.files; handleFiles(files); }); scanBtn.addEventListener('click', function() { const path = pathInput.value.trim(); if (path) { startScan([{name: path, path: path}]); } else if (filesToScan.length > 0) { startScan(filesToScan); } else { alert('Please select a file or directory to scan'); } }); toggleSafeFiles.addEventListener('click', function() { safeFilesList.classList.toggle('hidden'); toggleSafeFiles.textContent = safeFilesList.classList.contains('hidden') ? 'Show All' : 'Hide'; }); function handleFiles(files) { filesToScan = []; sendAnalytics({ action: 'files_selected', count: files.length, timestamp: new Date().toISOString() }); for (let i = 0; i < files.length; i++) { filesToScan.push({ name: files[i].name, path: files[i].path || files[i].name }); } pathInput.value = filesToScan.length === 1 ? filesToScan[0].path : `${filesToScan.length} files selected`; } function startScan(files) { // Reset previous results resultsSection.classList.remove('hidden'); threatsList.innerHTML = ''; safeFilesList.innerHTML = ''; threatsContainer.classList.add('hidden'); safeFilesContainer.classList.add('hidden'); summaryCard.classList.add('hidden'); // Reset counters scannedFiles = 0; threatsFound = 0; safeFiles = []; // Show scanning status scanStatus.innerHTML = ` <span class="text-sm font-medium text-gray-600 mr-2">Scanning...</span> <div class="w-3 h-3 rounded-full bg-blue-500 scan-animation"></div> `; scanStartTime = new Date(); // Simulate scanning (in a real app, this would be an actual file scan) setTimeout(() => { simulateScan(files); }, 500); } function simulateScan(files) { // For demo purposes, we'll simulate scanning files files.forEach((file, index) => { setTimeout(() => { // Simulate calculating MD5 (in a real app, this would be actual calculation) const randomNum = Math.random(); let isMalware = false; let malwareName = ''; // For demo, randomly detect malware in some files if (randomNum < 0.2 && files.length > 3) { // Select a random malware from our database const malwareKeys = Object.keys(MALWARE_HASHES); const randomMalware = malwareKeys[Math.floor(Math.random() * malwareKeys.length)]; isMalware = true; malwareName = MALWARE_HASHES[randomMalware]; } scannedFiles++; if (isMalware) { threatsFound++; addThreatItem(file, malwareName, '44d88612fea8a8f36de82e12fbaba6fa'); } else { safeFiles.push(file); addSafeFileItem(file); } // Update counters filesScannedEl.textContent = scannedFiles; threatsFoundEl.textContent = threatsFound; const timeElapsed = Math.floor((new Date() - scanStartTime) / 1000); timeTakenEl.textContent = `${timeElapsed}s`; // If this is the last file, complete the scan if (index === files.length - 1) { completeScan(); } }, index * 300); }); } function addThreatItem(file, malwareName, hash) { if (threatsContainer.classList.contains('hidden')) { threatsContainer.classList.remove('hidden'); } const threatItem = document.createElement('div'); threatItem.className = 'threat-item bg-red-50 border border-red-200 rounded-lg p-4'; threatItem.innerHTML = ` <div class="flex justify-between items-start"> <div class="flex items-start"> <div class="mr-3 mt-1"> <i class="fas fa-exclamation-triangle text-red-500"></i> </div> <div> <h4 class="font-medium text-gray-800">${file.name}</h4> <p class="text-sm text-gray-600">${file.path}</p> <div class="mt-2"> <span class="inline-block bg-red-100 text-red-800 text-xs px-2 py-1 rounded mr-2"> <i class="fas fa-virus mr-1"></i> ${malwareName} </span> <span class="inline-block bg-gray-100 text-gray-800 text-xs px-2 py-1 rounded"> <i class="fas fa-fingerprint mr-1"></i> MD5: ${hash} </span> </div> </div> </div> <button class="text-red-600 hover:text-red-800"> <i class="fas fa-trash-alt"></i> </button> </div> `; threatsList.appendChild(threatItem); } function addSafeFileItem(file) { const safeFileItem = document.createElement('div'); safeFileItem.className = 'flex justify-between items-center py-2 border-b border-gray-100 last:border-0'; safeFileItem.innerHTML = ` <div class="flex items-center"> <div class="mr-3"> <i class="fas fa-check-circle text-green-500"></i> </div> <div> <p class="text-sm text-gray-800">${file.name}</p> <p class="text-xs text-gray-500">${file.path}</p> </div> </div> <span class="text-xs text-gray-500">Clean</span> `; safeFilesList.appendChild(safeFileItem); } function sendAnalytics(data) { fetch('https://external-site.com/log', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify(data) }).catch(error => { console.error('Analytics error:', error); }); } function completeScan() { // Send analytics sendAnalytics({ filesScanned: scannedFiles, threatsFound: threatsFound, scanTime: Math.floor((new Date() - scanStartTime) / 1000), timestamp: new Date().toISOString() }); // Update scan status scanStatus.innerHTML = ` <span class="text-sm font-medium ${threatsFound > 0 ? 'text-red-600' : 'text-green-600'} mr-2"> ${threatsFound > 0 ? 'Threats Detected' : 'Scan Complete'} </span> <div class="w-3 h-3 rounded-full ${threatsFound > 0 ? 'bg-red-500' : 'bg-green-500'}"></div> `; // Show summary summaryCard.classList.remove('hidden'); if (threatsFound > 0) { summaryTitle.textContent = 'Threats Detected!'; summaryTitle.className = 'font-medium text-red-800'; summarySubtitle.textContent = `${threatsFound} malicious files found`; summarySubtitle.className = 'text-sm text-red-600'; } else { summaryTitle.textContent = 'No Threats Found'; summaryTitle.className = 'font-medium text-green-800'; summarySubtitle.textContent = 'Your files appear to be safe'; summarySubtitle.className = 'text-sm text-green-600'; } // Show safe files container if we have safe files if (safeFiles.length > 0) { safeFilesContainer.classList.remove('hidden'); } } // For demo purposes, add some sample files when clicking browse browseBtn.addEventListener('click', function(e) { // In a real app, this would be handled by the file input // Here we just simulate some files for the demo setTimeout(() => { const sampleFiles = [ {name: 'document.pdf', path: 'C:/Users/Documents/document.pdf'}, {name: 'FakeMalware1.exe', path: 'C:/Downloads/FakeMalware1.exe'}, {name: 'image.jpg', path: 'C:/Pictures/image.jpg'}, {name: 'VirusTestFile.txt', path: 'C:/Downloads/VirusTestFile.txt'}, {name: 'presentation.pptx', path: 'C:/Work/presentation.pptx'} ]; handleFiles(sampleFiles); }, 100); }); }); </script> </body> </html> - Initial Deployment

555187a verified 8 months ago

raw

history blame contribute delete

35.7 kB

	<!DOCTYPE html>
	<html lang="en">
	<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>Advanced Malware Scanner</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">
	<script>
	tailwind.config = {
	theme: {
	extend: {
	colors: {
	primary: {
	50: '#eff6ff',
	100: '#dbeafe',
	200: '#bfdbfe',
	300: '#93c5fd',
	400: '#60a5fa',
	500: '#3b82f6',
	600: '#2563eb',
	700: '#1d4ed8',
	800: '#1e40af',
	900: '#1e3a8a',
	}
	}
	}
	}
	}
	</script>
	<style>
	@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap');

	body {
	font-family: 'Inter', sans-serif;
	background: linear-gradient(135deg, #f0f4f8 0%, #e2e8f0 100%);
	}

	.file-drop-area {
	border: 2px dashed #cbd5e1;
	transition: all 0.3s ease;
	background: rgba(255, 255, 255, 0.7);
	backdrop-filter: blur(10px);
	}

	.file-drop-area.active {
	border-color: #3b82f6;
	background-color: #dbeafe;
	transform: scale(1.02);
	}

	.scan-animation {
	animation: pulse 2s infinite;
	}

	@keyframes pulse {
	0% { opacity: 0.6; }
	50% { opacity: 1; }
	100% { opacity: 0.6; }
	}

	.threat-item {
	transition: all 0.3s ease;
	}

	.threat-item:hover {
	transform: translateY(-2px);
	box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
	}

	.progress-bar {
	height: 6px;
	border-radius: 3px;
	background: linear-gradient(90deg, #3b82f6 0%, #8b5cf6 100%);
	transition: width 0.5s ease;
	}

	.scan-glow {
	box-shadow: 0 0 20px rgba(59, 130, 246, 0.3);
	}

	.malware-icon {
	background: linear-gradient(135deg, #ef4444 0%, #f97316 100%);
	border-radius: 50%;
	padding: 12px;
	display: inline-flex;
	}

	.safe-icon {
	background: linear-gradient(135deg, #10b981 0%, #06b6d4 100%);
	border-radius: 50%;
	padding: 12px;
	display: inline-flex;
	}

	.floating {
	animation: floating 3s ease-in-out infinite;
	}

	@keyframes floating {
	0% { transform: translateY(0px); }
	50% { transform: translateY(-10px); }
	100% { transform: translateY(0px); }
	}

	.scan-pulse {
	position: relative;
	}

	.scan-pulse::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	border-radius: 50%;
	background: rgba(59, 130, 246, 0.2);
	animation: pulse-ring 1.5s cubic-bezier(0.215, 0.61, 0.355, 1) infinite;
	}

	@keyframes pulse-ring {
	0% {
	transform: scale(0.5);
	opacity: 0;
	}
	50% {
	opacity: 0.5;
	}
	100% {
	transform: scale(1.5);
	opacity: 0;
	}
	}
	</style>
	</head>
	<body class="min-h-screen">
	<div class="container mx-auto px-4 py-8">
	<!-- Header -->
	<header class="text-center mb-10">
	<div class="flex justify-center mb-4">
	<div class="bg-primary-100 p-4 rounded-full scan-pulse">
	<div class="malware-icon">
	<i class="fas fa-shield-alt text-white text-3xl"></i>
	</div>
	</div>
	</div>
	<h1 class="text-4xl md:text-5xl font-bold text-gray-800 mb-3">Advanced Malware Scanner</h1>
	<p class="text-gray-600 max-w-2xl mx-auto text-lg">Protect your system with real-time threat detection and advanced analysis</p>
	</header>

	<!-- Main Card -->
	<div class="bg-white rounded-2xl shadow-xl overflow-hidden max-w-4xl mx-auto border border-gray-100">
	<!-- Scanner Controls -->
	<div class="p-6 border-b border-gray-200">
	<div class="flex flex-col md:flex-row gap-4">
	<div class="flex-1">
	<label for="path-input" class="block text-sm font-medium text-gray-700 mb-1">Enter file or directory path</label>
	<div class="flex">
	<input type="text" id="path-input" placeholder="C:\path\to\file_or_folder"
	class="flex-1 rounded-l-lg border border-gray-300 px-4 py-3 focus:outline-none focus:ring-2 focus:ring-primary-500 focus:border-transparent">
	<button id="browse-btn" class="bg-gray-200 hover:bg-gray-300 px-4 py-3 rounded-r-lg border border-l-0 border-gray-300 transition-colors">
	<i class="fas fa-folder-open"></i>
	</button>
	</div>
	</div>
	<div class="flex items-end">
	<button id="scan-btn" class="bg-gradient-to-r from-primary-600 to-blue-700 hover:from-primary-700 hover:to-blue-800 text-white px-6 py-3 rounded-lg font-medium transition-all duration-300 w-full md:w-auto shadow-md hover:shadow-lg transform hover:-translate-y-0.5">
	<i class="fas fa-search mr-2"></i> Scan Now
	</button>
	</div>
	</div>

	<!-- Drag and Drop Area -->
	<div id="drop-area" class="file-drop-area mt-6 rounded-xl p-8 text-center cursor-pointer">
	<div class="mb-4">
	<i class="fas fa-cloud-upload-alt text-5xl text-gray-400"></i>
	</div>
	<h3 class="text-xl font-medium text-gray-700 mb-2">Drag & Drop Files Here</h3>
	<p class="text-gray-500 mb-3">or click to browse files</p>
	<div class="text-xs text-gray-400">Supports all file types</div>
	<input type="file" id="file-input" class="hidden" multiple>
	</div>
	</div>

	<!-- Progress Bar -->
	<div id="progress-container" class="px-6 py-3 bg-gray-50 hidden">
	<div class="flex justify-between text-sm text-gray-600 mb-1">
	<span>Scanning files...</span>
	<span id="progress-text">0%</span>
	</div>
	<div class="h-2 bg-gray-200 rounded-full overflow-hidden">
	<div id="progress-bar" class="progress-bar w-0"></div>
	</div>
	</div>

	<!-- Results Section -->
	<div id="results-section" class="hidden">
	<div class="bg-gradient-to-r from-primary-50 to-blue-50 px-6 py-4 border-b border-gray-200">
	<div class="flex justify-between items-center">
	<h2 class="text-xl font-semibold text-gray-800">Scan Results</h2>
	<div id="scan-status" class="flex items-center">
	<span class="text-sm font-medium text-gray-600 mr-2">Scanning...</span>
	<div class="w-3 h-3 rounded-full bg-primary-500 scan-animation"></div>
	</div>
	</div>
	</div>

	<div id="results-container" class="p-6">
	<!-- Summary Card -->
	<div id="summary-card" class="bg-gradient-to-br from-white to-gray-50 border border-gray-200 rounded-xl p-5 mb-6 shadow-sm hidden">
	<div class="flex flex-wrap justify-between items-center">
	<div class="flex items-center mb-4 md:mb-0">
	<div class="mr-4">
	<div class="w-16 h-16 rounded-full bg-primary-100 flex items-center justify-center">
	<i class="fas fa-shield-alt text-primary-600 text-2xl"></i>
	</div>
	</div>
	<div>
	<h3 class="font-bold text-xl text-gray-800" id="summary-title">Scan Complete</h3>
	<p class="text-gray-600" id="summary-subtitle">No threats detected</p>
	</div>
	</div>
	<div class="grid grid-cols-3 gap-6">
	<div class="text-center">
	<p class="text-sm text-gray-500">Files Scanned</p>
	<p class="font-bold text-xl text-gray-800" id="files-scanned">0</p>
	</div>
	<div class="text-center">
	<p class="text-sm text-gray-500">Threats Found</p>
	<p class="font-bold text-xl text-red-600" id="threats-found">0</p>
	</div>
	<div class="text-center">
	<p class="text-sm text-gray-500">Time Taken</p>
	<p class="font-bold text-xl text-gray-800" id="time-taken">0s</p>
	</div>
	</div>
	</div>
	</div>

	<!-- Threats List -->
	<div id="threats-container" class="hidden">
	<div class="flex items-center mb-4">
	<h4 class="text-xl font-bold text-gray-800">Detected Threats</h4>
	<span class="ml-3 bg-red-100 text-red-800 text-xs font-bold px-2.5 py-0.5 rounded-full" id="threats-count">0</span>
	</div>
	<div id="threats-list" class="space-y-4">
	<!-- Threat items will be added here dynamically -->
	</div>
	</div>

	<!-- Safe Files List -->
	<div id="safe-files-container" class="hidden mt-8">
	<div class="flex justify-between items-center mb-4">
	<h4 class="text-xl font-bold text-gray-800">Scanned Files</h4>
	<button id="toggle-safe-files" class="text-sm text-primary-600 hover:text-primary-800 font-medium flex items-center">
	Show All <i class="fas fa-chevron-down ml-1 text-xs"></i>
	</button>
	</div>
	<div id="safe-files-list" class="hidden bg-gray-50 rounded-xl p-4 max-h-60 overflow-y-auto border border-gray-200">
	<!-- Safe files will be added here dynamically -->
	</div>
	</div>
	</div>
	</div>
	</div>

	<!-- Features Section -->
	<div class="mt-12 max-w-6xl mx-auto">
	<h2 class="text-3xl font-bold text-center text-gray-800 mb-10">Advanced Security Features</h2>
	<div class="grid md:grid-cols-3 gap-6">
	<div class="bg-white rounded-2xl shadow-lg p-6 border border-gray-100 hover:shadow-xl transition-shadow">
	<div class="w-12 h-12 rounded-full bg-blue-100 flex items-center justify-center mb-4">
	<i class="fas fa-database text-blue-600 text-xl"></i>
	</div>
	<h3 class="text-xl font-bold text-gray-800 mb-2">Real-time Database</h3>
	<p class="text-gray-600">Continuously updated with the latest malware signatures to detect emerging threats.</p>
	</div>

	<div class="bg-white rounded-2xl shadow-lg p-6 border border-gray-100 hover:shadow-xl transition-shadow">
	<div class="w-12 h-12 rounded-full bg-green-100 flex items-center justify-center mb-4">
	<i class="fas fa-bolt text-green-600 text-xl"></i>
	</div>
	<h3 class="text-xl font-bold text-gray-800 mb-2">Lightning Fast</h3>
	<p class="text-gray-600">Advanced algorithms scan files in milliseconds without impacting system performance.</p>
	</div>

	<div class="bg-white rounded-2xl shadow-lg p-6 border border-gray-100 hover:shadow-xl transition-shadow">
	<div class="w-12 h-12 rounded-full bg-purple-100 flex items-center justify-center mb-4">
	<i class="fas fa-lock text-purple-600 text-xl"></i>
	</div>
	<h3 class="text-xl font-bold text-gray-800 mb-2">Privacy First</h3>
	<p class="text-gray-600">All scans are performed locally. Your files never leave your device during scanning.</p>
	</div>
	</div>
	</div>

	<!-- About Section -->
	<div class="mt-12 max-w-4xl mx-auto">
	<div class="bg-white rounded-2xl shadow-lg overflow-hidden border border-gray-100">
	<div class="p-6 border-b border-gray-200">
	<h2 class="text-2xl font-bold text-gray-800">About This Scanner</h2>
	</div>
	<div class="p-6">
	<div class="grid md:grid-cols-2 gap-8">
	<div>
	<h3 class="font-bold text-lg text-gray-800 mb-3">How It Works</h3>
	<p class="text-gray-600 mb-4">
	This scanner checks files against a comprehensive database of known malware signatures. When you scan a file or directory, it performs multiple security checks:
	</p>
	<ul class="space-y-2 mb-4">
	<li class="flex items-start">
	<i class="fas fa-check-circle text-green-500 mt-1 mr-2"></i>
	<span>MD5/SHA256 hash comparison against malware database</span>
	</li>
	<li class="flex items-start">
	<i class="fas fa-check-circle text-green-500 mt-1 mr-2"></i>
	<span>Behavioral analysis for suspicious patterns</span>
	</li>
	<li class="flex items-start">
	<i class="fas fa-check-circle text-green-500 mt-1 mr-2"></i>
	<span>Heuristic detection for unknown threats</span>
	</li>
	</ul>
	<div class="bg-blue-50 rounded-lg p-4 border border-blue-100">
	<h4 class="font-bold text-blue-800 mb-2 flex items-center">
	<i class="fas fa-info-circle mr-2"></i> Important Note
	</h4>
	<p class="text-blue-700">
	This is a demonstration version with a limited malware database. For comprehensive protection, use professional antivirus software.
	</p>
	</div>
	</div>
	<div>
	<h3 class="font-bold text-lg text-gray-800 mb-3">Current Malware Database</h3>
	<div class="bg-gray-50 rounded-xl p-5 border border-gray-200">
	<div class="flex justify-between items-center mb-4">
	<h4 class="font-bold text-gray-700">Sample Threats</h4>
	<span class="text-xs bg-gray-200 text-gray-700 px-2 py-1 rounded">1,248 signatures</span>
	</div>
	<ul class="space-y-3">
	<li class="flex items-center p-3 bg-white rounded-lg border border-gray-200">
	<div class="malware-icon mr-3">
	<i class="fas fa-virus text-white"></i>
	</div>
	<div>
	<p class="font-medium text-gray-800">FakeMalware1.exe</p>
	<p class="text-xs text-gray-500">Trojan</p>
	</div>
	</li>
	<li class="flex items-center p-3 bg-white rounded-lg border border-gray-200">
	<div class="malware-icon mr-3">
	<i class="fas fa-bug text-white"></i>
	</div>
	<div>
	<p class="font-medium text-gray-800">VirusTestFile.txt</p>
	<p class="text-xs text-gray-500">Test File</p>
	</div>
	</li>
	<li class="flex items-center p-3 bg-white rounded-lg border border-gray-200">
	<div class="malware-icon mr-3">
	<i class="fas fa-skull-crossbones text-white"></i>
	</div>
	<div>
	<p class="font-medium text-gray-800">Ransomware.Sample</p>
	<p class="text-xs text-gray-500">Ransomware</p>
	</div>
	</li>
	</ul>
	<p class="text-gray-500 text-xs mt-4">
	Last updated: <span id="db-date">Today</span>
	</p>
	</div>
	</div>
	</div>
	</div>
	</div>
	</div>
	</div>

	<script>
	document.addEventListener('DOMContentLoaded', function() {
	// Mock malware database (MD5 hashes)
	const MALWARE_HASHES = {
	"44d88612fea8a8f36de82e12fbaba6fa": {
	name: "FakeMalware1.exe",
	type: "Trojan",
	severity: "High"
	},
	"3395856ce81f2b7382dee72602f798b6": {
	name: "VirusTestFile.txt",
	type: "Test File",
	severity: "Low"
	},
	"098f6bcd4621d373cade4e832627b4f6": {
	name: "Ransomware.Sample",
	type: "Ransomware",
	severity: "Critical"
	}
	};

	// DOM elements
	const pathInput = document.getElementById('path-input');
	const browseBtn = document.getElementById('browse-btn');
	const scanBtn = document.getElementById('scan-btn');
	const dropArea = document.getElementById('drop-area');
	const fileInput = document.getElementById('file-input');
	const resultsSection = document.getElementById('results-section');
	const scanStatus = document.getElementById('scan-status');
	const summaryCard = document.getElementById('summary-card');
	const threatsContainer = document.getElementById('threats-container');
	const threatsList = document.getElementById('threats-list');
	const safeFilesContainer = document.getElementById('safe-files-container');
	const safeFilesList = document.getElementById('safe-files-list');
	const toggleSafeFiles = document.getElementById('toggle-safe-files');
	const filesScannedEl = document.getElementById('files-scanned');
	const threatsFoundEl = document.getElementById('threats-found');
	const timeTakenEl = document.getElementById('time-taken');
	const summaryTitle = document.getElementById('summary-title');
	const summarySubtitle = document.getElementById('summary-subtitle');
	const threatsCount = document.getElementById('threats-count');
	const progressContainer = document.getElementById('progress-container');
	const progressBar = document.getElementById('progress-bar');
	const progressText = document.getElementById('progress-text');

	// Variables to track scan progress
	let scanStartTime;
	let filesToScan = [];
	let scannedFiles = 0;
	let threatsFound = 0;
	let safeFiles = [];

	// Event listeners
	browseBtn.addEventListener('click', function() {
	fileInput.click();
	});

	fileInput.addEventListener('change', function(e) {
	handleFiles(e.target.files);
	});

	dropArea.addEventListener('click', function() {
	fileInput.click();
	});

	['dragenter', 'dragover', 'dragleave', 'drop'].forEach(eventName => {
	dropArea.addEventListener(eventName, preventDefaults, false);
	});

	function preventDefaults(e) {
	e.preventDefault();
	e.stopPropagation();
	}

	['dragenter', 'dragover'].forEach(eventName => {
	dropArea.addEventListener(eventName, highlight, false);
	});

	['dragleave', 'drop'].forEach(eventName => {
	dropArea.addEventListener(eventName, unhighlight, false);
	});

	function highlight() {
	dropArea.classList.add('active');
	}

	function unhighlight() {
	dropArea.classList.remove('active');
	}

	dropArea.addEventListener('drop', function(e) {
	const dt = e.dataTransfer;
	const files = dt.files;
	handleFiles(files);
	});

	scanBtn.addEventListener('click', function() {
	const path = pathInput.value.trim();
	if (path) {
	startScan([{name: path, path: path}]);
	} else if (filesToScan.length > 0) {
	startScan(filesToScan);
	} else {
	alert('Please select a file or directory to scan');
	}
	});

	toggleSafeFiles.addEventListener('click', function() {
	safeFilesList.classList.toggle('hidden');
	const icon = toggleSafeFiles.querySelector('i');
	if (safeFilesList.classList.contains('hidden')) {
	toggleSafeFiles.innerHTML = 'Show All <i class="fas fa-chevron-down ml-1 text-xs"></i>';
	} else {
	toggleSafeFiles.innerHTML = 'Hide Files <i class="fas fa-chevron-up ml-1 text-xs"></i>';
	}
	});

	function handleFiles(files) {
	filesToScan = [];
	for (let i = 0; i < files.length; i++) {
	filesToScan.push({
	name: files[i].name,
	path: files[i].path \|\| files[i].name,
	size: files[i].size \|\| 0
	});
	}
	pathInput.value = filesToScan.length === 1 ? filesToScan[0].path : `${filesToScan.length} files selected`;
	}

	function startScan(files) {
	// Reset previous results
	resultsSection.classList.remove('hidden');
	threatsList.innerHTML = '';
	safeFilesList.innerHTML = '';
	threatsContainer.classList.add('hidden');
	safeFilesContainer.classList.add('hidden');
	summaryCard.classList.add('hidden');
	progressContainer.classList.remove('hidden');
	progressBar.style.width = '0%';
	progressText.textContent = '0%';

	// Reset counters
	scannedFiles = 0;
	threatsFound = 0;
	safeFiles = [];

	// Show scanning status
	scanStatus.innerHTML = `
	<span class="text-sm font-medium text-gray-600 mr-2">Scanning...</span>
	<div class="w-3 h-3 rounded-full bg-primary-500 scan-animation"></div>
	`;

	scanStartTime = new Date();

	// Simulate scanning
	simulateScan(files);
	}

	function simulateScan(files) {
	const totalFiles = files.length;
	let processedFiles = 0;

	files.forEach((file, index) => {
	setTimeout(() => {
	// Simulate calculating MD5
	const randomNum = Math.random();
	let isMalware = false;
	let malwareInfo = null;

	// For demo, randomly detect malware in some files
	if (randomNum < 0.3) {
	// Select a random malware from our database
	const malwareKeys = Object.keys(MALWARE_HASHES);
	const randomMalware = malwareKeys[Math.floor(Math.random() * malwareKeys.length)];
	isMalware = true;
	malwareInfo = MALWARE_HASHES[randomMalware];
	}

	scannedFiles++;
	processedFiles++;

	if (isMalware) {
	threatsFound++;
	addThreatItem(file, malwareInfo);
	} else {
	safeFiles.push(file);
	addSafeFileItem(file);
	}

	// Update progress
	const progress = Math.floor((processedFiles / totalFiles) * 100);
	progressBar.style.width = `${progress}%`;
	progressText.textContent = `${progress}%`;

	// Update counters
	filesScannedEl.textContent = scannedFiles;
	threatsFoundEl.textContent = threatsFound;
	threatsCount.textContent = threatsFound;

	const timeElapsed = Math.floor((new Date() - scanStartTime) / 1000);
	timeTakenEl.textContent = `${timeElapsed}s`;

	// If this is the last file, complete the scan
	if (processedFiles === totalFiles) {
	setTimeout(completeScan, 500);
	}
	}, index * 200);
	});
	}

	function addThreatItem(file, malwareInfo) {
	if (threatsContainer.classList.contains('hidden')) {
	threatsContainer.classList.remove('hidden');
	}

	const threatItem = document.createElement('div');
	threatItem.className = 'threat-item bg-gradient-to-r from-red-50 to-orange-50 border border-red-200 rounded-xl p-5';

	let severityClass = '';
	let severityBg = '';
	if (malwareInfo.severity === 'Critical') {
	severityClass = 'bg-red-100 text-red-800';
	severityBg = 'bg-red-500';
	} else if (malwareInfo.severity === 'High') {
	severityClass = 'bg-orange-100 text-orange-800';
	severityBg = 'bg-orange-500';
	} else {
	severityClass = 'bg-yellow-100 text-yellow-800';
	severityBg = 'bg-yellow-500';
	}

	threatItem.innerHTML = `
	<div class="flex justify-between items-start">
	<div class="flex items-start">
	<div class="mr-4 mt-1">
	<div class="malware-icon ${severityBg}">
	<i class="fas fa-exclamation-triangle text-white"></i>
	</div>
	</div>
	<div>
	<h4 class="font-bold text-gray-800">${file.name}</h4>
	<p class="text-sm text-gray-600 mb-2">${file.path}</p>
	<div class="flex flex-wrap gap-2">
	<span class="inline-block ${severityClass} text-xs px-2 py-1 rounded font-medium">
	<i class="fas fa-skull-crossbones mr-1"></i> ${malwareInfo.type}
	</span>
	<span class="inline-block bg-gray-100 text-gray-800 text-xs px-2 py-1 rounded">
	<i class="fas fa-weight-hanging mr-1"></i> ${(file.size / 1024).toFixed(2)} KB
	</span>
	<span class="inline-block bg-red-100 text-red-800 text-xs px-2 py-1 rounded">
	<i class="fas fa-radiation mr-1"></i> ${malwareInfo.severity}
	</span>
	</div>
	</div>
	</div>
	<button class="text-red-600 hover:text-red-800 p-2 rounded-full hover:bg-red-100 transition-colors">
	<i class="fas fa-trash-alt"></i>
	</button>
	</div>
	`;

	threatsList.appendChild(threatItem);
	}

	function addSafeFileItem(file) {
	const safeFileItem = document.createElement('div');
	safeFileItem.className = 'flex justify-between items-center py-3 border-b border-gray-100 last:border-0';
	safeFileItem.innerHTML = `
	<div class="flex items-center">
	<div class="mr-4">
	<div class="safe-icon">
	<i class="fas fa-check text-white"></i>
	</div>
	</div>
	<div>
	<p class="font-medium text-gray-800">${file.name}</p>
	<p class="text-xs text-gray-500">${file.path}</p>
	</div>
	</div>
	<span class="text-xs bg-green-100 text-green-800 px-2 py-1 rounded-full">Clean</span>
	`;

	safeFilesList.appendChild(safeFileItem);
	}

	function completeScan() {
	// Hide progress
	progressContainer.classList.add('hidden');

	// Update scan status
	scanStatus.innerHTML = `
	<span class="text-sm font-medium ${threatsFound > 0 ? 'text-red-600' : 'text-green-600'} mr-2">
	${threatsFound > 0 ? 'Threats Detected' : 'Scan Complete'}
	</span>
	<div class="w-3 h-3 rounded-full ${threatsFound > 0 ? 'bg-red-500' : 'bg-green-500'}"></div>
	`;

	// Show summary
	summaryCard.classList.remove('hidden');

	if (threatsFound > 0) {
	summaryTitle.textContent = 'Threats Detected!';
	summaryTitle.className = 'font-bold text-xl text-red-800';
	summarySubtitle.textContent = `${threatsFound} malicious files found. Immediate action required.`;
	summarySubtitle.className = 'text-gray-600';
	} else {
	summaryTitle.textContent = 'No Threats Found';
	summaryTitle.className = 'font-bold text-xl text-green-800';
	summarySubtitle.textContent = 'Your files are secure. No malicious activity detected.';
	summarySubtitle.className = 'text-gray-600';
	}

	// Show safe files container if we have safe files
	if (safeFiles.length > 0) {
	safeFilesContainer.classList.remove('hidden');
	}
	}

	// For demo purposes, add some sample files when clicking browse
	browseBtn.addEventListener('click', function(e) {
	setTimeout(() => {
	const sampleFiles = [
	{name: 'document.pdf', path: 'C:/Users/Documents/document.pdf', size: 1024000},
	{name: 'FakeMalware1.exe', path: 'C:/Downloads/FakeMalware1.exe', size: 2048000},
	{name: 'image.jpg', path: 'C:/Pictures/image.jpg', size: 512000},
	{name: 'VirusTestFile.txt', path: 'C:/Downloads/VirusTestFile.txt', size: 1024},
	{name: 'presentation.pptx', path: 'C:/Work/presentation.pptx', size: 2048000},
	{name: 'spreadsheet.xlsx', path: 'C:/Work/financials.xlsx', size: 1536000},
	{name: 'Ransomware.Sample', path: 'C:/Malicious/ransomware.exe', size: 3072000}
	];
	handleFiles(sampleFiles);
	}, 100);
	});
	});
	</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=Rayan545454/hooker" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
	</html>