CoolFace
Apppublic

aheedsajid/AuthentiCheck

sourceHugging Faceupdated 1y agoView on Hugging Face
0likes
index.html123 linesDownload Raw Back to root
1<html lang="en">2<head>3    <meta charset="UTF-8">4    <meta name="viewport" content="width=device-width, initial-scale=1.0">5    <title>AuthentiCheck - AI Product Authentication</title>6    <link href="https://fonts.googleapis.com/css2?family=Space+Mono:wght@400;700&display=swap" rel="stylesheet">7    <link rel="stylesheet" href="style.css">8</head>9<body>10    <div class="container">11        <header class="hero">12            <div class="hero-content">13                <h1 class="hero-title">14                    <span class="gradient-text">AuthentiCheck</span>15                </h1>16                <p class="hero-subtitle">AI-powered product authentication in seconds. Check if the product is real or fake!</p>17                <div class="hero-visual">18                    <div class="scan-animation">19                        <div class="scan-line"></div>20                        <div class="scan-grid"></div>21                    </div>22                </div>23            </div>24        </header>25 26        <main class="main-content">27            <div class="auth-section">28                <div class="card glass">29                    <div class="card-header">30                        <h2>API Configuration</h2>31                        <div class="status-indicator" id="apiStatus">32                            <span class="status-dot"></span>33                            <span class="status-text">API Key Required</span>34                        </div>35                    </div>36                    <div class="api-info">37                        <p>Get your free API key from <a href="https://rapidapi.com/projectunpack/api/product-authentication-api-fake-vs-real-item-detector" target="_blank" rel="noopener noreferrer">RapidAPI</a></p>38                    </div>39                    <div class="input-group">40                        <input 41                            type="password" 42                            id="apiKey" 43                            placeholder="Enter your RapidAPI key..."44                            class="api-input"45                        >46                        <button class="btn btn-primary" onclick="saveApiKey()">47                            <span class="btn-text">Save Key</span>48                            <div class="btn-loader"></div>49                        </button>50                    </div>51                </div>52            </div>53 54            <div class="check-section">55                <div class="card glass">56                    <div class="card-header">57                        <h2>Product Authentication</h2>58                        <div class="upload-stats">59                            <span id="uploadCount">0</span> items checked60                        </div>61                    </div>62                    63                    <div class="input-group">64                        <input 65                            type="text" 66                            id="imageUrlInput" 67                            placeholder="Enter product image URL..."68                            class="api-input"69                        >70                        <!-- No direct upload button needed here, it's for URL input -->71                    </div>72                    <p class="input-hint">Supports JPG, PNG, WebP up to 10MB</p>73 74                    <div class="action-buttons">75                        <button class="btn btn-secondary" onclick="clearAll()">76                            Clear77                        </button>78                        <button class="btn btn-primary btn-large" onclick="checkAuthenticity()" disabled id="checkBtn">79                            <span class="btn-text">Analyze Product</span>80                            <div class="btn-loader"></div>81                        </button>82                    </div>83                </div>84            </div>85 86            <div class="result-section" id="resultSection" style="display: none;">87                <div class="card glass">88                    <div class="result-header">89                        <h2>Authentication Result</h2>90                        <div class="result-badge" id="resultBadge">91                            <span class="badge-icon"></span>92                            <span class="badge-text">Analyzing...</span>93                        </div>94                    </div>95                    96                    <div class="result-content">97                        <div class="result-image">98                            <img id="resultImage" src="" alt="Analyzed product">99                        </div>100                        101                        <div class="result-details">102                            <div class="detail-item">103                                <label>Brand</label>104                                <span id="resultBrand">-</span>105                            </div>106                            <div class="detail-item">107                                <label>Status</label>108                                <span id="resultStatus">-</span>109                            </div>110                            <div class="detail-item">111                                <label>Description</label>112                                <p id="resultDescription">-</p>113                            </div>114                        </div>115                    </div>116                </div>117            </div>118        </main>119    </div>120 121    <script src="script.js"></script>122</body>123</html>