|
|
<!DOCTYPE html> |
|
|
<html lang="en"> |
|
|
<head> |
|
|
<meta charset="UTF-8"> |
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0"> |
|
|
<title>IP Tracker | Advanced IP Lookup Tool</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> |
|
|
.gradient-bg { |
|
|
background: linear-gradient(135deg, #6e8efb, #a777e3); |
|
|
} |
|
|
.card-hover:hover { |
|
|
transform: translateY(-5px); |
|
|
box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04); |
|
|
} |
|
|
.result-box { |
|
|
min-height: 200px; |
|
|
max-height: 300px; |
|
|
overflow-y: auto; |
|
|
} |
|
|
.copy-btn { |
|
|
transition: all 0.3s ease; |
|
|
} |
|
|
.copy-btn:hover { |
|
|
background-color: #4f46e5; |
|
|
} |
|
|
.tab-active { |
|
|
border-bottom: 3px solid #4f46e5; |
|
|
color: #4f46e5; |
|
|
font-weight: 600; |
|
|
} |
|
|
</style> |
|
|
</head> |
|
|
<body class="gradient-bg min-h-screen text-gray-800"> |
|
|
<div class="container mx-auto px-4 py-8"> |
|
|
|
|
|
<header class="text-center mb-12"> |
|
|
<h1 class="text-4xl md:text-5xl font-bold text-white mb-4">IP Tracker Pro</h1> |
|
|
<p class="text-xl text-white opacity-90">Advanced IP lookup and domain tracking tool</p> |
|
|
</header> |
|
|
|
|
|
|
|
|
<div class="bg-white rounded-xl shadow-2xl overflow-hidden transition-all duration-300 card-hover max-w-4xl mx-auto"> |
|
|
|
|
|
<div class="flex border-b"> |
|
|
<button id="ipLookupTab" class="tab-active flex-1 py-4 px-6 text-center font-medium focus:outline-none"> |
|
|
<i class="fas fa-search-location mr-2"></i>IP Lookup |
|
|
</button> |
|
|
<button id="domainLookupTab" class="flex-1 py-4 px-6 text-center font-medium text-gray-500 focus:outline-none"> |
|
|
<i class="fas fa-globe mr-2"></i>Domain Lookup |
|
|
</button> |
|
|
<button id="proxyTab" class="flex-1 py-4 px-6 text-center font-medium text-gray-500 focus:outline-none"> |
|
|
<i class="fas fa-shield-alt mr-2"></i>Proxy Finder |
|
|
</button> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="p-6"> |
|
|
|
|
|
<div id="ipLookupContent" class="space-y-6"> |
|
|
<div class="flex flex-col md:flex-row gap-4"> |
|
|
<input type="text" id="ipInput" placeholder="Enter IP address (e.g., 8.8.8.8)" |
|
|
class="flex-1 px-4 py-3 border rounded-lg focus:ring-2 focus:ring-indigo-500 focus:border-indigo-500"> |
|
|
<button id="lookupIpBtn" class="bg-indigo-600 hover:bg-indigo-700 text-white px-6 py-3 rounded-lg font-medium transition"> |
|
|
<i class="fas fa-search mr-2"></i>Lookup |
|
|
</button> |
|
|
</div> |
|
|
<div class="flex justify-center"> |
|
|
<button id="myIpBtn" class="text-indigo-600 hover:text-indigo-800 font-medium flex items-center"> |
|
|
<i class="fas fa-network-wired mr-2"></i>Show My IP |
|
|
</button> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div id="domainLookupContent" class="space-y-6 hidden"> |
|
|
<div class="flex flex-col md:flex-row gap-4"> |
|
|
<input type="text" id="domainInput" placeholder="Enter domain (e.g., google.com)" |
|
|
class="flex-1 px-4 py-3 border rounded-lg focus:ring-2 focus:ring-indigo-500 focus:border-indigo-500"> |
|
|
<button id="lookupDomainBtn" class="bg-indigo-600 hover:bg-indigo-700 text-white px-6 py-3 rounded-lg font-medium transition"> |
|
|
<i class="fas fa-search mr-2"></i>Lookup |
|
|
</button> |
|
|
</div> |
|
|
<div class="text-sm text-gray-500 text-center"> |
|
|
Finds all IP addresses associated with a domain, including those behind Cloudflare |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div id="proxyContent" class="space-y-6 hidden"> |
|
|
<div class="flex flex-col md:flex-row gap-4"> |
|
|
<select id="proxyType" class="flex-1 px-4 py-3 border rounded-lg focus:ring-2 focus:ring-indigo-500 focus:border-indigo-500"> |
|
|
<option value="single">Get Single Proxy</option> |
|
|
<option value="list">Get Proxy List</option> |
|
|
</select> |
|
|
<button id="getProxyBtn" class="bg-indigo-600 hover:bg-indigo-700 text-white px-6 py-3 rounded-lg font-medium transition"> |
|
|
<i class="fas fa-download mr-2"></i>Get Proxies |
|
|
</button> |
|
|
</div> |
|
|
<div class="text-sm text-gray-500 text-center"> |
|
|
Fetch working proxy servers for your needs |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="mt-8"> |
|
|
<h3 class="text-lg font-semibold mb-3 flex items-center"> |
|
|
<i class="fas fa-poll mr-2"></i>Results |
|
|
</h3> |
|
|
<div id="resultBox" class="result-box bg-gray-50 p-4 rounded-lg border border-gray-200"> |
|
|
<div class="text-center text-gray-400 py-10"> |
|
|
<i class="fas fa-info-circle text-3xl mb-2"></i> |
|
|
<p>Enter an IP address, domain, or use the proxy finder to see results here</p> |
|
|
</div> |
|
|
</div> |
|
|
<div class="mt-3 flex justify-end"> |
|
|
<button id="copyResultsBtn" class="copy-btn bg-gray-200 hover:bg-gray-300 text-gray-700 px-4 py-2 rounded-lg text-sm hidden"> |
|
|
<i class="fas fa-copy mr-1"></i>Copy Results |
|
|
</button> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="mt-16 grid grid-cols-1 md:grid-cols-3 gap-8 max-w-6xl mx-auto"> |
|
|
<div class="bg-white p-6 rounded-xl shadow-lg"> |
|
|
<div class="text-indigo-600 text-3xl mb-4"> |
|
|
<i class="fas fa-bolt"></i> |
|
|
</div> |
|
|
<h3 class="text-xl font-bold mb-2">Fast Lookups</h3> |
|
|
<p class="text-gray-600">Get instant results for any IP address or domain with our optimized API.</p> |
|
|
</div> |
|
|
<div class="bg-white p-6 rounded-xl shadow-lg"> |
|
|
<div class="text-indigo-600 text-3xl mb-4"> |
|
|
<i class="fas fa-shield-alt"></i> |
|
|
</div> |
|
|
<h3 class="text-xl font-bold mb-2">Proxy Detection</h3> |
|
|
<p class="text-gray-600">Find working proxy servers and detect if an IP is using a proxy.</p> |
|
|
</div> |
|
|
<div class="bg-white p-6 rounded-xl shadow-lg"> |
|
|
<div class="text-indigo-600 text-3xl mb-4"> |
|
|
<i class="fas fa-cloud"></i> |
|
|
</div> |
|
|
<h3 class="text-xl font-bold mb-2">Cloudflare Bypass</h3> |
|
|
<p class="text-gray-600">Discover real IP addresses behind Cloudflare protection.</p> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<footer class="mt-16 text-center text-white opacity-80 text-sm"> |
|
|
<p>© 2023 IP Tracker Pro. All rights reserved.</p> |
|
|
<p class="mt-2">This is a demo interface. For actual IP tracking functionality, you would need to implement the backend API.</p> |
|
|
</footer> |
|
|
</div> |
|
|
|
|
|
<script> |
|
|
document.addEventListener('DOMContentLoaded', function() { |
|
|
|
|
|
const tabs = { |
|
|
ipLookup: { |
|
|
tab: document.getElementById('ipLookupTab'), |
|
|
content: document.getElementById('ipLookupContent') |
|
|
}, |
|
|
domainLookup: { |
|
|
tab: document.getElementById('domainLookupTab'), |
|
|
content: document.getElementById('domainLookupContent') |
|
|
}, |
|
|
proxy: { |
|
|
tab: document.getElementById('proxyTab'), |
|
|
content: document.getElementById('proxyContent') |
|
|
} |
|
|
}; |
|
|
|
|
|
function activateTab(activeTab) { |
|
|
|
|
|
Object.values(tabs).forEach(tab => { |
|
|
tab.tab.classList.remove('tab-active'); |
|
|
tab.tab.classList.add('text-gray-500'); |
|
|
tab.content.classList.add('hidden'); |
|
|
}); |
|
|
|
|
|
|
|
|
activeTab.tab.classList.add('tab-active'); |
|
|
activeTab.tab.classList.remove('text-gray-500'); |
|
|
activeTab.content.classList.remove('hidden'); |
|
|
} |
|
|
|
|
|
tabs.ipLookup.tab.addEventListener('click', () => activateTab(tabs.ipLookup)); |
|
|
tabs.domainLookup.tab.addEventListener('click', () => activateTab(tabs.domainLookup)); |
|
|
tabs.proxy.tab.addEventListener('click', () => activateTab(tabs.proxy)); |
|
|
|
|
|
|
|
|
const resultBox = document.getElementById('resultBox'); |
|
|
const copyResultsBtn = document.getElementById('copyResultsBtn'); |
|
|
|
|
|
function showResults(content, isList = false) { |
|
|
if (isList) { |
|
|
const items = content.map(item => `<div class="py-2 px-3 mb-2 bg-white rounded border flex justify-between items-center"> |
|
|
<span>${item}</span> |
|
|
<button class="copy-item-btn text-indigo-600 hover:text-indigo-800" data-item="${item}"> |
|
|
<i class="fas fa-copy"></i> |
|
|
</button> |
|
|
</div>`).join(''); |
|
|
resultBox.innerHTML = items; |
|
|
|
|
|
|
|
|
document.querySelectorAll('.copy-item-btn').forEach(btn => { |
|
|
btn.addEventListener('click', function() { |
|
|
const item = this.getAttribute('data-item'); |
|
|
navigator.clipboard.writeText(item); |
|
|
const originalHtml = this.innerHTML; |
|
|
this.innerHTML = '<i class="fas fa-check"></i>'; |
|
|
setTimeout(() => { |
|
|
this.innerHTML = originalHtml; |
|
|
}, 1000); |
|
|
}); |
|
|
}); |
|
|
} else { |
|
|
resultBox.innerHTML = `<div class="whitespace-pre-wrap font-mono">${content}</div>`; |
|
|
} |
|
|
copyResultsBtn.classList.remove('hidden'); |
|
|
} |
|
|
|
|
|
function showLoading() { |
|
|
resultBox.innerHTML = `<div class="text-center py-10"> |
|
|
<i class="fas fa-spinner fa-spin text-3xl text-indigo-600 mb-2"></i> |
|
|
<p>Processing your request...</p> |
|
|
</div>`; |
|
|
copyResultsBtn.classList.add('hidden'); |
|
|
} |
|
|
|
|
|
function showError(message) { |
|
|
resultBox.innerHTML = `<div class="text-center text-red-500 py-10"> |
|
|
<i class="fas fa-exclamation-triangle text-3xl mb-2"></i> |
|
|
<p>${message}</p> |
|
|
</div>`; |
|
|
copyResultsBtn.classList.add('hidden'); |
|
|
} |
|
|
|
|
|
|
|
|
document.getElementById('lookupIpBtn').addEventListener('click', function() { |
|
|
const ip = document.getElementById('ipInput').value.trim(); |
|
|
if (!ip) { |
|
|
showError('Please enter an IP address'); |
|
|
return; |
|
|
} |
|
|
|
|
|
showLoading(); |
|
|
|
|
|
setTimeout(() => { |
|
|
showResults(`IP Address: ${ip}\nLocation: United States\nISP: Google LLC\nASN: AS15169\nOrganization: Google\nProxy: No\n\nGeolocation:\n- Latitude: 37.4056\n- Longitude: -122.0775\n- Timezone: America/Los_Angeles`); |
|
|
}, 800); |
|
|
}); |
|
|
|
|
|
|
|
|
document.getElementById('myIpBtn').addEventListener('click', function() { |
|
|
showLoading(); |
|
|
|
|
|
setTimeout(() => { |
|
|
showResults(`Your IP Address: 192.168.1.100\nPublic IP: 203.0.113.45\nLocation: Your Country\nISP: Your ISP\nASN: AS12345\nOrganization: Your Organization\nProxy: No`); |
|
|
}, 800); |
|
|
}); |
|
|
|
|
|
|
|
|
document.getElementById('lookupDomainBtn').addEventListener('click', function() { |
|
|
const domain = document.getElementById('domainInput').value.trim(); |
|
|
if (!domain) { |
|
|
showError('Please enter a domain name'); |
|
|
return; |
|
|
} |
|
|
|
|
|
showLoading(); |
|
|
|
|
|
setTimeout(() => { |
|
|
showResults(`Domain: ${domain}\n\nIP Addresses:\n1.0.126.229\n1.0.158.92\n1.0.160.34\n1.0.161.31\n1.0.164.79\n1.0.167.84\n1.0.167.205\n1.0.168.165\n1.0.169.41\n1.0.247.243\n\nCloudflare Protected: Yes`); |
|
|
}, 1000); |
|
|
}); |
|
|
|
|
|
|
|
|
document.getElementById('getProxyBtn').addEventListener('click', function() { |
|
|
const proxyType = document.getElementById('proxyType').value; |
|
|
|
|
|
showLoading(); |
|
|
|
|
|
setTimeout(() => { |
|
|
if (proxyType === 'single') { |
|
|
showResults(`Proxy Server:\n130.41.47.235:8080\n\nType: HTTP\nCountry: United States\nLatency: 120ms\nLast Checked: Just now`); |
|
|
} else { |
|
|
const proxyList = [ |
|
|
'3.66.38.117:10882', |
|
|
'130.41.47.235:8080', |
|
|
'130.41.55.190:8080', |
|
|
'45.77.56.113:3128', |
|
|
'209.97.150.167:3128', |
|
|
'138.197.157.60:8080', |
|
|
'167.99.236.14:80', |
|
|
'165.227.15.124:80' |
|
|
]; |
|
|
showResults(proxyList, true); |
|
|
} |
|
|
}, 1200); |
|
|
}); |
|
|
|
|
|
|
|
|
copyResultsBtn.addEventListener('click', function() { |
|
|
const textToCopy = resultBox.innerText; |
|
|
navigator.clipboard.writeText(textToCopy); |
|
|
|
|
|
const originalHtml = this.innerHTML; |
|
|
this.innerHTML = '<i class="fas fa-check mr-1"></i>Copied!'; |
|
|
setTimeout(() => { |
|
|
this.innerHTML = originalHtml; |
|
|
}, 2000); |
|
|
}); |
|
|
}); |
|
|
</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=6ee5ali/ip-finder" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body> |
|
|
</html> |
