Rastgele tuşlara basarak çalışır.
Kod:
<!DOCTYPE html>
<html lang="tr">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
<meta name="apple-mobile-web-app-capable" content="yes">
<title>CYBER OVERRIDE | INFINITE HACKER SIMULATOR</title>
<link href="https://fonts.googleapis.com/css2?family=Orbitron:wght@500;700;900&family=Rajdhani:wght@300;500;700&display=swap" rel="stylesheet">
<style>
/* ==========================================================================
1. TEMEL STİLLER VE ARKA PLAN
========================================================================== */
* { margin: 0; padding: 0; box-sizing: border-box; }
body, html {
height: 100%; background-color: #0d0015; /* Koyu mor arka plan */
color: #ffffff; font-family: 'Rajdhani', sans-serif; overflow: hidden;
user-select: none; cursor: crosshair;
}
#matrixCanvas { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 1; opacity: 0.6; }
#networkCanvas { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 2; }
.vignette-overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: radial-gradient(circle at center, transparent 0%, #05000a 100%); z-index: 3; pointer-events: none; }
.scanlines { position: fixed; top: 0; left: 0; width: 100vw; height: 100vh; background: linear-gradient(to bottom, rgba(255,255,255,0) 50%, rgba(255, 0, 170, 0.05) 50%); background-size: 100% 4px; z-index: 100; pointer-events: none; }
/* ==========================================================================
2. SİBER SALDIRI EFEKTLERİ (YENİ)
========================================================================== */
.attack-overlay {
position: fixed; top: 0; left: 0; width: 100%; height: 100%;
background: rgba(255, 0, 0, 0.15); z-index: 99; pointer-events: none;
opacity: 0; transition: opacity 0.3s ease; mix-blend-mode: overlay;
}
.alarm-active .attack-overlay {
animation: redAlertPulse 1s infinite alternate;
}
.screen-shake {
animation: shake 0.4s cubic-bezier(.36,.07,.19,.97) infinite;
}
.critical-warning {
position: absolute; top: 20%; left: 50%; transform: translate(-50%, -50%);
font-family: 'Orbitron', sans-serif; font-size: 3rem; font-weight: 900;
color: #ff003c; text-shadow: 0 0 20px #ff003c, 0 0 40px #ff003c;
border: 4px dashed #ff003c; padding: 10px 30px; background: rgba(20,0,0,0.8);
z-index: 105; display: none; text-align: center;
}
/* ==========================================================================
3. HUD - YAN PANELLER (KIRMIZI & MAVİ & PEMBE)
========================================================================== */
.hud-container { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 5; pointer-events: none; display: flex; justify-content: space-between; padding: 20px; }
.hud-panel { width: 300px; height: 100%; display: flex; flex-direction: column; gap: 20px; }
.hud-box { background: rgba(10, 0, 15, 0.7); border: 1px solid rgba(255, 0, 60, 0.3); box-shadow: 0 0 20px rgba(0, 168, 255, 0.1) inset; padding: 15px; border-radius: 4px; position: relative; backdrop-filter: blur(5px); }
.hud-box::before { content: ''; position: absolute; top: 0; left: 0; width: 12px; height: 12px; border-top: 2px solid #00d4ff; border-left: 2px solid #00d4ff; }
.hud-box::after { content: ''; position: absolute; bottom: 0; right: 0; width: 12px; height: 12px; border-bottom: 2px solid #ff003c; border-right: 2px solid #ff003c; }
.hud-title { font-family: 'Orbitron', sans-serif; font-size: 0.85rem; color: #ff00aa; border-bottom: 1px dashed rgba(255, 0, 170, 0.4); padding-bottom: 5px; margin-bottom: 15px; letter-spacing: 2px; }
.stat-row { margin-bottom: 12px; }
.stat-label { font-size: 0.85rem; color: #ccc; display: flex; justify-content: space-between; font-family: monospace; }
.stat-bar-bg { width: 100%; height: 8px; background: rgba(255,255,255,0.05); margin-top: 4px; border: 1px solid rgba(255,255,255,0.1); }
.stat-bar-fill { height: 100%; transition: width 0.1s ease, background 0.3s; }
#bar-cpu { background: #ff003c; box-shadow: 0 0 10px #ff003c; }
#bar-mem { background: #ff00aa; box-shadow: 0 0 10px #ff00aa; }
#bar-net { background: #00d4ff; box-shadow: 0 0 10px #00d4ff; }
.radar-wrapper { display: flex; justify-content: center; align-items: center; padding: 10px 0; }
.radar { width: 160px; height: 160px; border-radius: 50%; border: 1px solid rgba(0, 212, 255, 0.4); background: repeating-radial-gradient(transparent, transparent 15px, rgba(255, 0, 60, 0.15) 16px), linear-gradient(90deg, transparent 49.5%, rgba(0, 212, 255, 0.4) 50%, transparent 50.5%), linear-gradient(0deg, transparent 49.5%, rgba(0, 212, 255, 0.4) 50%, transparent 50.5%); position: relative; overflow: hidden; box-shadow: 0 0 30px rgba(255, 0, 170, 0.1) inset; }
.radar-sweep { position: absolute; top: 0; left: 50%; width: 50%; height: 50%; background: conic-gradient(from 0deg, transparent 70%, rgba(255, 0, 60, 0.8) 100%); transform-origin: 0% 100%; animation: spin 3s linear infinite; }
.hex-dump { font-family: monospace; font-size: 0.8rem; color: #00d4ff; opacity: 0.9; height: calc(100vh - 150px); overflow: hidden; word-wrap: break-word; line-height: 1.5; }
.hex-red { color: #ff003c; text-shadow: 0 0 8px #ff003c; font-weight: bold; }
.hex-pink { color: #ff00aa; text-shadow: 0 0 8px #ff00aa; }
/* ==========================================================================
4. HACKER TYPER (ANA TERMİNAL)
========================================================================== */
.terminal-container { position: absolute; top: 10%; left: 320px; right: 320px; bottom: 10%; z-index: 4; display: flex; flex-direction: column; background: rgba(5, 0, 10, 0.5); border-radius: 8px; box-shadow: 0 0 50px rgba(255, 0, 170, 0.15); padding: 20px; border: 1px solid rgba(255,0,170,0.2); transition: all 0.2s; }
#code-screen { flex-grow: 1; overflow-y: hidden; font-family: 'Consolas', 'Courier New', monospace; font-size: 1.2rem; color: #ff00aa; text-shadow: 0 0 8px rgba(255, 0, 170, 0.6); white-space: pre-wrap; word-wrap: break-word; line-height: 1.4; }
.cursor { display: inline-block; width: 10px; height: 1.2rem; background-color: #00d4ff; vertical-align: bottom; animation: blink 0.8s step-end infinite; box-shadow: 0 0 10px #00d4ff; }
.typing-spark { position: fixed; color: #ff00d4; font-family: monospace; font-size: 20px; font-weight: 900; pointer-events: none; text-shadow: 0 0 15px #ff00d4, 0 0 30px #b500ff; z-index: 9999; animation: scatter 0.6s cubic-bezier(0.25, 1, 0.5, 1) forwards; }
/* KEYFRAMES */
@keyframes spin { 100% { transform: rotate(360deg); } }
@keyframes blink { 50% { opacity: 0; } }
@keyframes scatter { 0% { opacity: 1; transform: translate(0, 0) scale(1) rotate(0deg); } 100% { opacity: 0; transform: translate(var(--tx), var(--ty)) scale(0.3) rotate(var(--rot)); } }
@keyframes redAlertPulse { 0% { opacity: 0.3; } 100% { opacity: 0.8; } }
@keyframes shake { 0% { transform: translate(1px, 1px) rotate(0deg); } 10% { transform: translate(-1px, -2px) rotate(-1deg); } 20% { transform: translate(-3px, 0px) rotate(1deg); } 30% { transform: translate(3px, 2px) rotate(0deg); } 40% { transform: translate(1px, -1px) rotate(1deg); } 50% { transform: translate(-1px, 2px) rotate(-1deg); } 60% { transform: translate(-3px, 1px) rotate(0deg); } 70% { transform: translate(3px, 1px) rotate(-1deg); } 80% { transform: translate(-1px, -1px) rotate(1deg); } 90% { transform: translate(1px, 2px) rotate(0deg); } 100% { transform: translate(1px, -2px) rotate(-1deg); } }
@media (max-width: 1000px) { .hud-panel { display: none; } .terminal-container { left: 20px; right: 20px; } }
</style>
</head>
<body>
<canvas id="matrixCanvas"></canvas>
<canvas id="networkCanvas"></canvas>
<div class="vignette-overlay"></div>
<div class="scanlines"></div>
<div class="attack-overlay"></div> <div class="hud-container">
<div class="hud-panel">
<div class="hud-box">
<div class="hud-title">SYSTEM RESOURCES</div>
<div class="stat-row"><div class="stat-label"><span style="color:#ff003c;">CPU_CORE_OVR</span><span id="val-cpu">12%</span></div><div class="stat-bar-bg"><div class="stat-bar-fill" id="bar-cpu" style="width: 12%;"></div></div></div>
<div class="stat-row"><div class="stat-label"><span style="color:#ff00aa;">MEM_ALLOC</span><span id="val-mem">24%</span></div><div class="stat-bar-bg"><div class="stat-bar-fill" id="bar-mem" style="width: 24%;"></div></div></div>
<div class="stat-row"><div class="stat-label"><span style="color:#00d4ff;">NET_UPLINK</span><span id="val-net">8%</span></div><div class="stat-bar-bg"><div class="stat-bar-fill" id="bar-net" style="width: 8%;"></div></div></div>
</div>
<div class="hud-box">
<div class="hud-title">THREAT RADAR</div>
<div class="radar-wrapper">
<div class="radar"><div class="radar-sweep"></div></div>
</div>
</div>
</div>
<div class="hud-panel">
<div class="hud-box" style="height: 100%;">
<div class="hud-title">DECRYPTION STREAM</div>
<div class="hex-dump" id="hexContainer"></div>
</div>
</div>
</div>
<div class="terminal-container" id="terminalBox">
<div id="code-screen">AWAITING USER INPUT...<br>INITIALIZING RANDOMIZED ATTACK VECTORS...<br><br>> START TYPING TO EXECUTE PAYLOAD.</div>
</div>
<div class="critical-warning" id="warningMsg">DDoS ATTACK DETECTED</div>
<script>
// ==========================================
// 1. MATRIX VE AĞ (MOR VE PEMBE)
// ==========================================
const matrixCanvas = document.getElementById('matrixCanvas');
const mctx = matrixCanvas.getContext('2d');
const netCanvas = document.getElementById('networkCanvas');
const ctx = netCanvas.getContext('2d');
function resizeCanvases() {
matrixCanvas.width = netCanvas.width = window.innerWidth;
matrixCanvas.height = netCanvas.height = window.innerHeight;
}
window.addEventListener('resize', () => { resizeCanvases(); initNetwork(); });
resizeCanvases();
const matrixChars = '01ABCDEFGHIJKLMNOPQRSTUVWXYZ@#$%&*<>{}[]'.split('');
const fontSize = 18;
let columns = matrixCanvas.width / fontSize;
let drops = Array(Math.floor(columns)).fill(1);
function drawMatrix() {
mctx.fillStyle = 'rgba(10, 0, 15, 0.08)';
mctx.fillRect(0, 0, matrixCanvas.width, matrixCanvas.height);
mctx.font = fontSize + 'px monospace';
for (let i = 0; i < drops.length; i++) {
const text = matrixChars[Math.floor(Math.random() * matrixChars.length)];
// Alarm durumundaysa kırmızı yoğunluğunu artır
if(document.body.classList.contains('alarm-active') && Math.random() < 0.3) {
mctx.fillStyle = '#ff0000';
} else {
mctx.fillStyle = Math.random() < 0.05 ? '#00d4ff' : (Math.random() < 0.5 ? '#ff00aa' : '#b500ff');
}
mctx.fillText(text, i * fontSize, drops[i] * fontSize);
if (drops[i] * fontSize > matrixCanvas.height && Math.random() > 0.975) drops[i] = 0;
drops[i]++;
}
}
let particlesArray = [];
class Particle {
constructor(x, y, dx, dy, size) { this.x=x; this.y=y; this.dx=dx; this.dy=dy; this.size=size; }
draw() { ctx.beginPath(); ctx.arc(this.x, this.y, this.size, 0, Math.PI*2); ctx.fillStyle = '#00d4ff'; ctx.fill(); }
update() {
if (this.x > netCanvas.width || this.x < 0) this.dx = -this.dx;
if (this.y > netCanvas.height || this.y < 0) this.dy = -this.dy;
this.x += this.dx; this.y += this.dy; this.draw();
}
}
function initNetwork() {
particlesArray = [];
for (let i = 0; i < 100; i++) {
particlesArray.push(new Particle(Math.random() * innerWidth, Math.random() * innerHeight, (Math.random() * 0.6)-0.3, (Math.random() * 0.6)-0.3, Math.random() * 2 + 1));
}
}
function connectNetwork() {
for (let a = 0; a < particlesArray.length; a++) {
for (let b = a; b < particlesArray.length; b++) {
let dist = Math.pow(particlesArray[a].x - particlesArray[b].x, 2) + Math.pow(particlesArray[a].y - particlesArray[b].y, 2);
if (dist < 20000) {
ctx.strokeStyle = document.body.classList.contains('alarm-active') ? `rgba(255, 0, 0, ${1 - dist/20000})` : `rgba(255, 0, 170, ${(1 - dist/20000)*0.6})`;
ctx.lineWidth = 1;
ctx.beginPath(); ctx.moveTo(particlesArray[a].x, particlesArray[a].y); ctx.lineTo(particlesArray[b].x, particlesArray[b].y); ctx.stroke();
}
}
}
}
function animateAll() {
requestAnimationFrame(animateAll);
ctx.clearRect(0, 0, innerWidth, innerHeight);
drawMatrix();
particlesArray.forEach(p => p.update());
connectNetwork();
}
initNetwork(); animateAll();
// ==========================================
// 2. HUD DİNAMİK VERİ (HEX DUMP)
// ==========================================
const hexContainer = document.getElementById('hexContainer');
let hexSpeed = 500;
let hexInterval;
function generateHex() {
let str = "";
for(let i=0; i<6; i++) {
let hex = Math.floor(Math.random() * 256).toString(16).padStart(2, '0').toUpperCase();
let r = Math.random();
if(r < 0.1) hex = `<span class="hex-red">${hex}</span>`;
else if(r < 0.2) hex = `<span class="hex-pink">${hex}</span>`;
str += hex + " ";
}
return `0x${Math.floor(Math.random() * 9999).toString(16).padStart(4,'0').toUpperCase()} ${str}<br>`;
}
let hexContent = "";
for(let i=0; i<30; i++) hexContent += generateHex();
hexContainer.innerHTML = hexContent;
function updateHex() {
let lines = hexContainer.innerHTML.split('<br>').filter(l => l.length > 5);
lines.shift(); lines.push(generateHex().replace('<br>',''));
hexContainer.innerHTML = lines.join('<br>') + '<br>';
}
hexInterval = setInterval(updateHex, hexSpeed);
// ==========================================
// 3. SONSUZ RASTGELE KOD ÜRETİCİ (YENİ SİSTEM)
// ==========================================
const hackerVocab = {
actions: ["Bypassing", "Decrypting", "Compiling", "Injecting", "Extracting", "Routing", "Flooding", "Spoofing", "Parsing"],
targets: ["mainframe", "firewall", "encryption_key", "sys_kernel", "auth_token", "node_cluster", "proxy_chain", "database_cluster"],
paths: ["/var/log/syslog", "/etc/shadow", "/root/.bash_history", "/bin/bash", "/dev/null", "C:\\Windows\\System32\\SAM"],
codeSnippets: [
"int main(void) { void *ptr = malloc(0xFFFF); return 0; }",
"SELECT * FROM users WHERE password LIKE '%admin%';",
"const hash = crypto.createHash('sha256').update(payload).digest('hex');",
"if (credentials.role != 'ROOT') { throw new SecurityError(); }",
"socket.connect(4444, '192.168.1.100'); // Reverse shell active"
]
};
function getRandomIP() { return `${Math.floor(Math.random()*255)}.${Math.floor(Math.random()*255)}.${Math.floor(Math.random()*255)}.${Math.floor(Math.random()*255)}`; }
function getRandomHash() { return Math.random().toString(36).substring(2, 15) + Math.random().toString(36).substring(2, 15); }
// Blok blok sonsuz kod üretir
function generateRandomHackerCodeBlock() {
let block = "";
let blockType = Math.random();
if (blockType < 0.3) {
// Log akışı tarzı
block += `\n[${new Date().toISOString()}] [+] ${hackerVocab.actions[Math.floor(Math.random()*hackerVocab.actions.length)]} ${hackerVocab.targets[Math.floor(Math.random()*hackerVocab.targets.length)]}...\n`;
block += `[!] Target IP: ${getRandomIP()} -> Proxy: ${getRandomIP()}\n`;
block += `[+] Hash extracted: ${getRandomHash().toUpperCase()}\n`;
} else if (blockType < 0.6) {
// Dizin ve dosya taraması
block += `\nroot@tht-omega:~# ls -la ${hackerVocab.paths[Math.floor(Math.random()*hackerVocab.paths.length)]}\n`;
block += `-rwx------ 1 root root ${Math.floor(Math.random()*99999)} Mar 26 12:38 payload.bin\n`;
block += `Downloading...\n[#####################] 100%\n`;
} else if (blockType < 0.9) {
// Gerçekçi kod parçacıkları
block += `\n// Injecting malicious thread\n${hackerVocab.codeSnippets[Math.floor(Math.random()*hackerVocab.codeSnippets.length)]}\n`;
block += `Memory allocation at 0x${Math.floor(Math.random()*0xFFFFFF).toString(16).toUpperCase()} successful.\n`;
} else {
// Hex dump / RSA Key
block += `\n-----BEGIN RSA PRIVATE KEY-----\n`;
for(let i=0; i<3; i++) block += btoa(getRandomHash() + getRandomHash()) + "\n";
block += `-----END RSA PRIVATE KEY-----\n`;
}
return block;
}
const codeScreen = document.getElementById('code-screen');
let currentDynamicCode = generateRandomHackerCodeBlock();
let codeIndex = 0;
let isTypingStarted = false;
let typingSpeedCounter = 0; // Siber saldırı tespiti için
// ==========================================
// 4. TUŞ DİNLEME VE HACKER TYPER
// ==========================================
window.addEventListener('keydown', (e) => {
if (e.key === 'Shift' || e.key === 'Control' || e.key === 'Alt' || e.key.startsWith('F')) return;
e.preventDefault();
if (!isTypingStarted) { codeScreen.innerHTML = ''; isTypingStarted = true; }
typingSpeedCounter += 2; // Hızı ölçmek için
triggerHUDSpike();
createSpark();
// 4 ile 8 arası karakter ekle
let charsToAdd = Math.floor(Math.random() * 5) + 4;
let textChunk = currentDynamicCode.substring(codeIndex, codeIndex + charsToAdd);
textChunk = textChunk.replace(/\n/g, '<br>').replace(/ /g, ' ');
let currentHTML = codeScreen.innerHTML.replace('<span class="cursor"></span>', '');
codeScreen.innerHTML = currentHTML + textChunk + '<span class="cursor"></span>';
codeIndex += charsToAdd;
// Eğer mevcut blok bittiyse, yeni sonsuz rastgele blok üret
if (codeIndex >= currentDynamicCode.length) {
currentDynamicCode = generateRandomHackerCodeBlock();
codeIndex = 0;
}
codeScreen.scrollTop = codeScreen.scrollHeight;
// Sonsuza gitmesini engelle (RAM şişmesin)
if(codeScreen.innerHTML.length > 5000) {
codeScreen.innerHTML = codeScreen.innerHTML.substring(1500) + '<span class="cursor"></span>';
}
});
// ==========================================
// 5. ETKİLEŞİMLİ HUD & SİBER SALDIRI (ATTACK) EFEKTİ
// ==========================================
let cpuVal = 12, memVal = 24, netVal = 8;
const warningMsg = document.getElementById('warningMsg');
const terminalBox = document.getElementById('terminalBox');
function updateStatBar(id, val) {
document.getElementById('val-'+id).innerText = Math.floor(val) + '%';
document.getElementById('bar-'+id).style.width = val + '%';
}
function triggerHUDSpike() {
cpuVal = Math.min(100, cpuVal + (Math.random() * 15 + 10));
memVal = Math.min(100, memVal + (Math.random() * 8 + 4));
netVal = Math.min(100, netVal + (Math.random() * 20 + 10));
updateStatBar('cpu', cpuVal); updateStatBar('mem', memVal); updateStatBar('net', netVal);
clearInterval(hexInterval);
hexInterval = setInterval(updateHex, 20); // Hex çok hızlanır
}
// Hız kontrolü ve Siber Saldırı Alarmı Tetikleyicisi
setInterval(() => {
// Değerleri yavaşça düşür
if(cpuVal > 12) cpuVal -= 5;
if(memVal > 24) memVal -= 2;
if(netVal > 8) netVal -= 8;
updateStatBar('cpu', Math.max(12, cpuVal)); updateStatBar('mem', Math.max(24, memVal)); updateStatBar('net', Math.max(8, netVal));
// Eğer kullanıcı çok hızlı yazıyorsa (Sistem yükü çok artarsa) alarm ver!
if (typingSpeedCounter > 50) {
if(!document.body.classList.contains('alarm-active')) {
document.body.classList.add('alarm-active');
terminalBox.classList.add('screen-shake');
// Rastgele uyarı mesajı seç
const warnings = ["TRACE INITIATED", "DDoS DETECTED", "KERNEL PANIC", "SYSTEM BREACH", "IP LEAK WARNING"];
warningMsg.innerText = warnings[Math.floor(Math.random() * warnings.length)];
warningMsg.style.display = 'block';
}
} else {
// Sakinleştiyse alarmı kapat
document.body.classList.remove('alarm-active');
terminalBox.classList.remove('screen-shake');
warningMsg.style.display = 'none';
}
// Sayacı kademeli düşür
if (typingSpeedCounter > 0) typingSpeedCounter -= 5;
// Hex akışını normale döndür
if(cpuVal < 40 && !document.body.classList.contains('alarm-active')) {
clearInterval(hexInterval);
hexInterval = setInterval(updateHex, 500);
}
}, 300);
// ==========================================
// 6. RASTGELE KIVILCIMLAR
// ==========================================
function createSpark() {
const sparkChars = '01X7A!&#>{}';
const rect = terminalBox.getBoundingClientRect();
for (let i = 0; i < 2; i++) {
const spark = document.createElement('span');
spark.className = 'typing-spark';
spark.innerText = sparkChars[Math.floor(Math.random() * sparkChars.length)];
spark.style.left = (rect.left + Math.random() * rect.width) + 'px';
spark.style.top = (rect.top + Math.random() * rect.height) + 'px';
const angle = Math.random() * Math.PI * 2;
const distance = Math.random() * 100 + 30;
spark.style.setProperty('--tx', `${Math.cos(angle) * distance}px`);
spark.style.setProperty('--ty', `${Math.sin(angle) * distance}px`);
spark.style.setProperty('--rot', `${Math.random() * 360 - 180}deg`);
document.body.appendChild(spark);
setTimeout(() => spark.remove(), 600);
}
}
</script>
</body>
</html>
