Team Ai
Apppublic

aheedsajid/AuthentiCheck

sourceHugging Faceupdated 1y agoView on Hugging Face
0likes
script.js218 linesDownload Raw Back to root
1let apiKey = localStorage.getItem('rapidapi-key');2let uploadCount = parseInt(localStorage.getItem('upload-count') || '0');3let currentImageUrl = null; // Store the current image URL4 5// Initialize the app6document.addEventListener('DOMContentLoaded', () => {7    updateUploadCount();8    updateApiStatus();9    10    // Load API key if exists11    if (apiKey) {12        document.getElementById('apiKey').value = apiKey;13    }14 15    // Event listener for image URL input16    const imageUrlInput = document.getElementById('imageUrlInput');17    imageUrlInput.addEventListener('input', (e) => {18        currentImageUrl = e.target.value.trim();19        updateApiStatus(); // Re-evaluate check button state after URL input20    });21});22 23function updateUploadCount() {24    document.getElementById('uploadCount').textContent = uploadCount;25}26 27function updateApiStatus() {28    const statusIndicator = document.getElementById('apiStatus');29    const statusDot = statusIndicator.querySelector('.status-dot');30    const statusText = statusIndicator.querySelector('.status-text');31    const checkBtn = document.getElementById('checkBtn');32    33    const imageUrlProvided = currentImageUrl && isValidUrl(currentImageUrl);34 35    if (apiKey) {36        statusDot.classList.add('active');37        statusText.textContent = 'API Key Configured';38        // Only enable check button if an image URL is also provided and valid39        checkBtn.disabled = !imageUrlProvided;40    } else {41        statusDot.classList.remove('active');42        statusText.textContent = 'API Key Required';43        checkBtn.disabled = true;44    }45}46 47function saveApiKey() {48    const input = document.getElementById('apiKey');49    const btn = input.nextElementSibling;50    51    if (!input.value.trim()) {52        showNotification('Please enter a valid API key', 'error');53        return;54    }55    56    btn.classList.add('loading');57    58    // Simulate API key validation59    setTimeout(() => {60        apiKey = input.value.trim();61        localStorage.setItem('rapidapi-key', apiKey);62        btn.classList.remove('loading');63        updateApiStatus();64        showNotification('API key saved successfully!', 'success');65    }, 1000);66}67 68function clearAll() {69    document.getElementById('imageUrlInput').value = '';70    currentImageUrl = null;71    document.getElementById('resultSection').style.display = 'none';72    updateApiStatus(); // Update check button state after clearing73}74 75function isValidUrl(string) {76    try {77        new URL(string);78        return true;79    } catch (_) {80        return false;81    }82}83 84async function checkAuthenticity() {85    const checkBtn = document.getElementById('checkBtn');86    87    if (!currentImageUrl || !isValidUrl(currentImageUrl)) {88        showNotification('Please enter a valid image URL to analyze', 'error');89        return;90    }91 92    if (!apiKey) {93        showNotification('Please save your RapidAPI key first.', 'error');94        return;95    }96    97    checkBtn.classList.add('loading');98    99    try {100        const response = await fetch('https://product-authentication-api-fake-vs-real-item-detector.p.rapidapi.com/check', {101            method: 'POST',102            headers: {103                'Content-Type': 'application/json',104                'x-rapidapi-host': 'product-authentication-api-fake-vs-real-item-detector.p.rapidapi.com',105                'x-rapidapi-key': apiKey106            },107            body: JSON.stringify({108                image_url: currentImageUrl // Send the provided image URL to the API109            })110        });111        112        if (!response.ok) {113            throw new Error(`API Error: ${response.status}`);114        }115        116        const result = await response.json();117        displayResult(result); 118        119        // Update upload count120        uploadCount++;121        localStorage.setItem('upload-count', uploadCount.toString());122        updateUploadCount();123        124    } catch (error) {125        console.error('Error:', error);126        showNotification('Authentication check failed. Please try again.', 'error');127        128        // For demo purposes, show a mock result even on error129        const mockResult = {130            status: 'fake', // Changed to fake for an example of error result131            brand: 'Unknown',132            description: 'Could not verify authenticity. Please try another image or check the URL.'133        };134        displayResult(mockResult);135    } finally {136        checkBtn.classList.remove('loading');137    }138}139 140function displayResult(result) {141    const resultSection = document.getElementById('resultSection');142    const resultBadge = document.getElementById('resultBadge');143    const resultImage = document.getElementById('resultImage');144    const resultBrand = document.getElementById('resultBrand');145    const resultStatus = document.getElementById('resultStatus');146    const resultDescription = document.getElementById('resultDescription');147    148    // Update badge149    resultBadge.className = `result-badge ${result.status}`;150    resultBadge.querySelector('.badge-text').textContent = result.status === 'real' ? 'Authentic' : 'Fake';151    152    // Update image - use the URL stored in currentImageUrl153    resultImage.src = currentImageUrl;154    155    // Update details156    resultBrand.textContent = result.brand || 'Unknown';157    resultStatus.textContent = result.status === 'real' ? 'Authentic Product' : 'Counterfeit Product';158    resultDescription.textContent = result.description || 'No description available';159    160    // Show result section with animation161    resultSection.style.display = 'block';162    setTimeout(() => {163        resultSection.scrollIntoView({ behavior: 'smooth' });164    }, 100);165    166    showNotification(`Product analyzed: ${result.status === 'real' ? 'Authentic' : 'Counterfeit'}`, result.status === 'real' ? 'success' : 'warning');167}168 169function showNotification(message, type = 'info') {170    // Create notification element171    const notification = document.createElement('div');172    notification.className = `notification ${type}`;173    notification.textContent = message;174    175    // Style the notification176    Object.assign(notification.style, {177        position: 'fixed',178        top: '20px',179        right: '20px',180        padding: '1rem 1.5rem',181        borderRadius: '12px',182        fontWeight: '600',183        fontSize: '0.875rem',184        zIndex: '1000',185        transform: 'translateX(400px)',186        transition: 'transform 0.3s ease',187        maxWidth: '300px',188        boxShadow: '0 10px 25px rgba(0,0,0,0.1)'189    });190    191    // Set colors based on type192    const colors = {193        success: { bg: '#10B981', color: 'white' },194        error: { bg: '#EF4444', color: 'white' },195        warning: { bg: '#F59E0B', color: 'white' },196        info: { bg: '#3B82F6', color: 'white' }197    };198    199    notification.style.backgroundColor = colors[type].bg;200    notification.style.color = colors[type].color;201    202    document.body.appendChild(notification);203    204    // Animate in205    setTimeout(() => {206        notification.style.transform = 'translateX(0)';207    }, 10);208    209    // Remove after delay210    setTimeout(() => {211        notification.style.transform = 'translateX(400px)';212        setTimeout(() => {213            if (notification.parentNode) {214                notification.parentNode.removeChild(notification);215            }216        }, 300);217    }, 3000);218}