JavaScript Integration Guide

Learn how to integrate hogMind into your website using JavaScript

Basic Integration

Add this code to your login form to track failed login attempts:

// hogMind JavaScript Integration
async function trackHogMindFailedAttempt(username) {
    // Get device information
    const deviceInfo = {
        browser: getBrowserInfo(),
        device: getDeviceInfo(),
        device_version: getDeviceVersion(),
        country: await getCountryInfo(),
        region: await getRegionInfo(),
        wifi_name: 'Not available' // Requires special permissions
    };
    
        // Send to hogMind API
        // Use '/hogmind/api/track' for local integration, or 'https://hogmind.forumfox.org/api/track' for external
        try {
            const apiUrl = '/hogmind/api/track'; // Local endpoint (recommended)
            const response = await fetch(apiUrl, {
            method: 'POST',
            headers: {
                'Content-Type': 'application/json'
            },
            body: JSON.stringify({
                username: username,
                ip: await getClientIP(),
                device_info: deviceInfo
            })
        });
        
        if (response.ok) {
            const data = await response.json();
            console.log('hogMind: Attempt tracked', data);
        }
    } catch (error) {
        console.error('hogMind: Error tracking attempt', error);
    }
}

// Helper functions
function getBrowserInfo() {
    const ua = navigator.userAgent;
    if (ua.includes('Chrome')) {
        const match = ua.match(/Chrome\/([0-9.]+)/);
        return 'Chrome ' + (match ? match[1] : '');
    } else if (ua.includes('Firefox')) {
        const match = ua.match(/Firefox\/([0-9.]+)/);
        return 'Firefox ' + (match ? match[1] : '');
    } else if (ua.includes('Safari')) {
        return 'Safari';
    }
    return 'Unknown';
}

function getDeviceInfo() {
    const ua = navigator.userAgent;
    if (ua.includes('Windows')) return 'Windows';
    if (ua.includes('Mac')) return 'macOS';
    if (ua.includes('Linux')) return 'Linux';
    if (ua.includes('Android')) return 'Android';
    if (ua.includes('iPhone')) return 'iOS';
    return 'Unknown';
}

async function getClientIP() {
    try {
        const response = await fetch('https://api.ipify.org?format=json');
        const data = await response.json();
        return data.ip;
    } catch (error) {
        return 'Unknown';
    }
}

async function getCountryInfo() {
    try {
        const ip = await getClientIP();
        const response = await fetch(`https://ipapi.co/${ip}/country_name/`);
        return await response.text();
    } catch (error) {
        return 'Unknown';
    }
}

async function getRegionInfo() {
    try {
        const ip = await getClientIP();
        const response = await fetch(`https://ipapi.co/${ip}/region/`);
        return await response.text();
    } catch (error) {
        return 'Unknown';
    }
}

Usage in Login Form

Integrate with your existing login form:

// Example: Add to your login form submission
document.getElementById('loginForm').addEventListener('submit', async function(e) {
    e.preventDefault();
    
    const username = document.getElementById('username').value;
    const password = document.getElementById('password').value;
    
    // Try to login (your existing login logic)
    const loginSuccess = await attemptLogin(username, password);
    
    if (!loginSuccess) {
        // Track failed attempt with hogMind
        await trackHogMindFailedAttempt(username);
        
        // Show error message
        showError('Invalid username or password');
    } else {
        // Login successful, redirect
        window.location.href = '/dashboard';
    }
});

Complete Example

See example.html for a complete working example.

Back to Main