dws3 / index.html
flitrx's picture
Update index.html
6cdeb0a verified
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>OnionScraper - Dark Web Search</title>
<script src="https://cdn.tailwindcss.com"></script>
<script>
tailwind.config = {
theme: {
extend: {
colors: {
neon: {
green: '#39FF14',
pink: '#FF10F0',
blue: '#00F5FF',
},
bgray: '#808080',
}
}
}
}
</script>
<style>
@import url('https://fonts.googleapis.com/css2?family=Major+Mono+Display&family=Share+Tech+Mono&display=swap');
body {
font-family: 'Share Tech Mono', monospace;
background-color: #808080;
color: #39FF14;
}
.title-font {
font-family: 'Major Mono Display', monospace;
}
.neon-glow {
text-shadow: 0 0 5px #39FF14, 0 0 10px #39FF14;
}
.neon-border {
box-shadow: 0 0 5px #39FF14, 0 0 10px #39FF14;
border: 1px solid #39FF14;
}
.neon-btn {
transition: all 0.3s ease;
}
.neon-btn:hover {
box-shadow: 0 0 15px #39FF14, 0 0 25px #39FF14;
transform: translateY(-2px);
}
.result-card {
transition: all 0.3s ease;
}
.result-card:hover {
transform: translateY(-5px);
box-shadow: 0 0 15px #39FF14, 0 0 25px #39FF14;
}
.tor-check {
animation: pulse 2s infinite;
}
@keyframes pulse {
0% {
box-shadow: 0 0 0 0 rgba(57, 255, 20, 0.7);
}
70% {
box-shadow: 0 0 0 10px rgba(57, 255, 20, 0);
}
100% {
box-shadow: 0 0 0 0 rgba(57, 255, 20, 0);
}
}
.loading {
display: inline-block;
width: 20px;
height: 20px;
border: 3px solid rgba(57, 255, 20, 0.3);
border-radius: 50%;
border-top-color: #39FF14;
animation: spin 1s ease-in-out infinite;
}
@keyframes spin {
to { transform: rotate(360deg); }
}
</style>
</head>
<body class="min-h-screen">
<div class="container mx-auto px-4 py-8">
<!-- Header -->
<header class="text-center mb-12">
<h1 class="title-font text-5xl md:text-6xl mb-4 neon-glow text-neon-green">OnionScraper</h1>
<p class="text-xl text-neon-blue">Dark Web Search Engine Interface</p>
</header>
<!-- Tor Status -->
<div id="torStatus" class="max-w-2xl mx-auto mb-8 p-4 rounded-lg bg-gray-700 text-center">
<div class="flex justify-center items-center mb-2">
<div id="torIndicator" class="w-4 h-4 rounded-full bg-red-500 mr-2 tor-check"></div>
<span id="torStatusText" class="text-neon-pink">Checking Tor connection...</span>
</div>
<p id="torInstructions" class="text-neon-blue hidden">
Please connect to Tor network to use this service.
<a href="https://www.torproject.org/download/" target="_blank" class="text-neon-green underline">Download Tor Browser</a>
</p>
</div>
<!-- Search Form -->
<div class="max-w-3xl mx-auto mb-12">
<form id="searchForm" class="flex flex-col md:flex-row gap-4">
<input
type="text"
id="searchQuery"
placeholder="Enter your search query..."
class="flex-grow px-4 py-3 rounded-lg bg-gray-700 text-neon-green neon-border focus:outline-none focus:ring-2 focus:ring-neon-green"
disabled
>
<button
type="submit"
id="searchBtn"
class="px-6 py-3 rounded-lg bg-gray-700 text-neon-green neon-border neon-btn font-bold disabled:opacity-50 disabled:cursor-not-allowed"
disabled
>
Search Dark Web
</button>
</form>
</div>
<!-- Results Section -->
<div id="resultsSection" class="hidden">
<h2 class="text-2xl text-neon-pink mb-6 neon-glow">Search Results</h2>
<div id="resultsContainer" class="grid grid-cols-1 md:grid-cols-2 gap-6">
<!-- Results will be inserted here -->
</div>
<div id="loadingIndicator" class="text-center py-8 hidden">
<div class="loading mx-auto mb-4"></div>
<p class="text-neon-blue">Scraping dark web resources...</p>
</div>
<div id="noResults" class="text-center py-8 hidden">
<p class="text-neon-pink">No results found. Try a different search term.</p>
</div>
</div>
<!-- Footer -->
<footer class="mt-16 text-center text-sm text-neon-blue">
<p>Warning: This interface provides access to dark web content. Use at your own risk.</p>
<p class="mt-2">Always ensure you're using Tor network for anonymity and security.</p>
</footer>
</div>
<script>
document.addEventListener('DOMContentLoaded', function() {
const torStatus = document.getElementById('torStatus');
const torIndicator = document.getElementById('torIndicator');
const torStatusText = document.getElementById('torStatusText');
const torInstructions = document.getElementById('torInstructions');
const searchForm = document.getElementById('searchForm');
const searchQuery = document.getElementById('searchQuery');
const searchBtn = document.getElementById('searchBtn');
const resultsSection = document.getElementById('resultsSection');
const resultsContainer = document.getElementById('resultsContainer');
const loadingIndicator = document.getElementById('loadingIndicator');
const noResults = document.getElementById('noResults');
// Check Tor connectivity
checkTorConnection();
// Function to check Tor connection
function checkTorConnection() {
// We'll attempt to fetch a known Tor-only resource
fetch('https://check.torproject.org/api/ip', {
method: 'GET',
mode: 'no-cors'
})
.then(() => {
// If we get here, we're probably not using Tor (since the request would fail otherwise)
showTorStatus(false);
})
.catch(() => {
// This is the expected path when using Tor
// Now verify with a more reliable method
verifyTor();
});
}
// More reliable Tor verification
function verifyTor() {
// Create an image element that points to a Tor-only resource
const img = new Image();
img.onload = function() {
// If the image loads, we're probably using Tor
showTorStatus(true);
};
img.onerror = function() {
// If the image fails to load, we're not using Tor
showTorStatus(false);
};
img.src = 'https://duckduckgogg42xjoc72x3sjasowoarfbgcmvfimaftt6twagswzczad.onion/static-assets/favicons/DDG-icon_256x256.png';
}
// Update UI based on Tor status
function showTorStatus(isConnected) {
if (isConnected) {
torIndicator.classList.remove('bg-red-500');
torIndicator.classList.add('bg-green-500');
torStatusText.textContent = 'Tor connection active';
torInstructions.classList.add('hidden');
searchQuery.disabled = false;
searchBtn.disabled = false;
} else {
torIndicator.classList.remove('bg-green-500');
torIndicator.classList.add('bg-red-500');
torStatusText.textContent = 'Tor connection not detected';
torInstructions.classList.remove('hidden');
searchQuery.disabled = true;
searchBtn.disabled = true;
}
}
// Handle search form submission
searchForm.addEventListener('submit', function(e) {
e.preventDefault();
const query = searchQuery.value.trim();
if (query) {
performSearch(query);
}
});
// Perform the search using ahmia.fi API
function performSearch(query) {
// Show loading state
resultsSection.classList.remove('hidden');
resultsContainer.innerHTML = '';
loadingIndicator.classList.remove('hidden');
noResults.classList.add('hidden');
// We need to use a proxy to bypass CORS since ahmia.fi doesn't allow direct access
const proxyUrl = 'https://cors-anywhere.herokuapp.com/';
const searchUrl = `https://ahmia.fi/search/?q=${encodeURIComponent(query)}`;
fetch(proxyUrl + searchUrl, {
headers: {
'X-Requested-With': 'XMLHttpRequest'
}
})
.then(response => {
if (!response.ok) throw new Error('Network response was not ok');
return response.text();
})
.then(html => {
// Parse the HTML response
const parser = new DOMParser();
const doc = parser.parseFromString(html, 'text/html');
// Extract results
const resultElements = doc.querySelectorAll('.result');
if (resultElements.length > 0) {
resultElements.forEach(result => {
const title = result.querySelector('h4 a')?.textContent || 'No title';
const url = result.querySelector('h4 a')?.href || '#';
const description = result.querySelector('p')?.textContent || 'No description available';
// Create result card
const resultCard = document.createElement('div');
resultCard.className = 'result-card p-4 rounded-lg bg-gray-700 neon-border';
resultCard.innerHTML = `
<h3 class="text-xl text-neon-green mb-2 truncate">${title}</h3>
<a href="${url}" target="_blank" rel="noopener noreferrer" class="text-neon-blue text-sm block mb-2 truncate">${url}</a>
<p class="text-gray-300">${description}</p>
`;
resultsContainer.appendChild(resultCard);
});
} else {
noResults.classList.remove('hidden');
}
})
.catch(error => {
console.error('Error:', error);
noResults.textContent = 'Error fetching results. Please try again.';
noResults.classList.remove('hidden');
})
.finally(() => {
loadingIndicator.classList.add('hidden');
});
}
// Periodically check Tor connection
setInterval(checkTorConnection, 30000);
});
</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=flitrx/dws3" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
</html>