Real-Time IP Tracking Dashboard

// WebSocket connection for real-time updates
const socket = new WebSocket('wss://api.iplogger.icu/realtime');

socket.onopen = function(event) {
    console.log('Real-time connection established');
    
    // Subscribe to specific data streams
    socket.send(JSON.stringify({
        action: 'subscribe',
        streams: ['visits', 'security_alerts', 'performance']
    }));
};

socket.onmessage = function(event) {
    const data = JSON.parse(event.data);
    
    switch(data.type) {
        case 'new_visit':
            updateVisitorCount(data.visitor);
            addToMap(data.location);
            break;
            
        case 'security_alert':
            showAlert(data.alert);
            break;
            
        case 'performance_metric':
            updateMetrics(data.metrics);
            break;
    }
};

// Handle connection errors
socket.onerror = function(error) {
    console.error('WebSocket error:', error);
    attemptReconnection();
};

// Real-time dashboard updates
function updateVisitorCount(visitor) {
    const countElement = document.getElementById('visitor-count');
    const currentCount = parseInt(countElement.textContent);
    countElement.textContent = currentCount + 1;
    
    // Add visitor to live feed
    addToActivityFeed({
        type: 'visit',
        country: visitor.country,
        timestamp: new Date(),
        ip: visitor.ip_hash // Use hashed IP for privacy
    });
}

function updateMetrics(metrics) {
    // Update response time
    document.getElementById('avg-response').textContent = metrics.response_time + 'ms';
    
    // Update charts
    addDataToChart(responseChart, metrics.response_time);
    addDataToChart(trafficChart, metrics.requests_per_minute);
    
    // Check for anomalies
    if (metrics.response_time > ALERT_THRESHOLD) {
        triggerAlert('performance', 'High response time detected');
    }
}

function addToMap(location) {
    // Add marker to real-time world map
    const marker = new MapMarker({
        lat: location.latitude,
        lng: location.longitude,
        country: location.country,
        timestamp: Date.now()
    });
    
    worldMap.addMarker(marker);
    
    // Remove old markers after 5 minutes
    setTimeout(() => {
        worldMap.removeMarker(marker);
    }, 300000);
}

// Configure custom alerts
const alertConfig = {
    security: {
        suspicious_ip: {
            threshold: 5, // requests per minute
            action: 'block_and_notify',
            severity: 'high'
        },
        vpn_detection: {
            enabled: true,
            action: 'flag_and_log',
            severity: 'medium'
        }
    },
    performance: {
        response_time: {
            threshold: 1000, // milliseconds
            duration: 300, // 5 minutes
            action: 'notify_admin'
        },
        error_rate: {
            threshold: 5, // percentage
            action: 'escalate'
        }
    },
    business: {
        conversion_drop: {
            threshold: 20, // percentage decrease
            comparison_period: '24h',
            action: 'notify_marketing'
        }
    }
};

// Alert handler
function handleAlert(alertType, data) {
    const config = alertConfig[alertType.category][alertType.type];
    
    // Log alert
    console.log(`Alert triggered: ${alertType.type}`, data);
    
    // Send notifications based on configuration
    switch(config.action) {
        case 'block_and_notify':
            blockIP(data.ip);
            sendNotification('security_team', alertType, data);
            break;
            
        case 'notify_admin':
            sendNotification('admin', alertType, data);
            break;
            
        case 'escalate':
            escalateAlert(alertType, data);
            break;
    }
}