2025-07-11 20:07:36 +01:00
|
|
|
<!DOCTYPE html>
|
|
|
|
|
<html lang="en">
|
|
|
|
|
<head>
|
|
|
|
|
<meta charset="UTF-8">
|
|
|
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
|
|
|
<title>Memory Module Detection - QA Testing Interface</title>
|
|
|
|
|
<link rel="stylesheet" href="{{ url_for('static', filename='style.css') }}">
|
|
|
|
|
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css" rel="stylesheet">
|
|
|
|
|
</head>
|
|
|
|
|
<body>
|
|
|
|
|
<div class="container">
|
|
|
|
|
<header>
|
|
|
|
|
<h1><i class="fas fa-microchip"></i> Memory Module Detection</h1>
|
2025-07-11 22:04:27 +01:00
|
|
|
<p>AI-Powered Motherboard Memory Module Detection</p>
|
|
|
|
|
|
2025-07-11 20:07:36 +01:00
|
|
|
</header>
|
|
|
|
|
|
|
|
|
|
<main>
|
|
|
|
|
<!-- API Information Panel -->
|
|
|
|
|
<section class="panel" id="apiInfoPanel">
|
|
|
|
|
<h2><i class="fas fa-info-circle"></i> API Information</h2>
|
|
|
|
|
<div class="api-info" id="apiInfo">
|
|
|
|
|
<div class="loading">Loading API information...</div>
|
|
|
|
|
</div>
|
|
|
|
|
</section>
|
|
|
|
|
|
|
|
|
|
<!-- Test Options -->
|
|
|
|
|
<section class="panel">
|
|
|
|
|
<h2><i class="fas fa-vial"></i> Test Options</h2>
|
|
|
|
|
<div class="test-options">
|
|
|
|
|
<button class="btn btn-primary" onclick="testHardcodedImage()">
|
|
|
|
|
<i class="fas fa-image"></i> Test Hardcoded Image
|
|
|
|
|
</button>
|
|
|
|
|
<button class="btn btn-secondary" onclick="showUploadSection()">
|
|
|
|
|
<i class="fas fa-upload"></i> Upload Custom Image
|
|
|
|
|
</button>
|
2025-07-11 22:32:49 +01:00
|
|
|
|
2025-07-11 20:07:36 +01:00
|
|
|
<button class="btn btn-info" onclick="runAllTests()">
|
|
|
|
|
<i class="fas fa-play"></i> Run All Tests
|
|
|
|
|
</button>
|
|
|
|
|
</div>
|
|
|
|
|
</section>
|
|
|
|
|
|
|
|
|
|
<!-- Image Upload Section -->
|
|
|
|
|
<section class="panel" id="uploadSection" style="display: none;">
|
|
|
|
|
<h2><i class="fas fa-cloud-upload-alt"></i> Upload Image</h2>
|
|
|
|
|
<div class="upload-area" id="uploadArea">
|
|
|
|
|
<div class="upload-content">
|
|
|
|
|
<i class="fas fa-cloud-upload-alt upload-icon"></i>
|
|
|
|
|
<p>Drag and drop an image here or click to select</p>
|
|
|
|
|
<p class="upload-hint">Supported formats: PNG, JPG, JPEG, GIF, BMP</p>
|
2025-07-11 21:21:24 +01:00
|
|
|
<input type="file" id="fileInput" accept="image/*" style="display: none;" multiple="false">
|
2025-07-11 20:07:36 +01:00
|
|
|
<button class="btn btn-outline" onclick="document.getElementById('fileInput').click()">
|
|
|
|
|
Select Image
|
|
|
|
|
</button>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div class="upload-controls" style="display: none;" id="uploadControls">
|
2025-07-11 20:47:04 +01:00
|
|
|
<div class="confidence-info">
|
|
|
|
|
<p><strong>Confidence Threshold:</strong> 80% (High Precision Mode)</p>
|
2025-07-11 20:07:36 +01:00
|
|
|
</div>
|
|
|
|
|
<button class="btn btn-success" onclick="processUploadedImage()">
|
|
|
|
|
<i class="fas fa-search"></i> Detect Memory Modules
|
|
|
|
|
</button>
|
|
|
|
|
</div>
|
|
|
|
|
</section>
|
|
|
|
|
|
|
|
|
|
<!-- Results Section -->
|
|
|
|
|
<section class="panel" id="resultsSection" style="display: none;">
|
|
|
|
|
<h2><i class="fas fa-chart-bar"></i> Detection Results</h2>
|
|
|
|
|
<div class="results-content" id="resultsContent">
|
|
|
|
|
<!-- Results will be populated here -->
|
|
|
|
|
</div>
|
|
|
|
|
</section>
|
|
|
|
|
|
|
|
|
|
<!-- Test Results Section -->
|
|
|
|
|
<section class="panel" id="testResultsSection" style="display: none;">
|
|
|
|
|
<h2><i class="fas fa-clipboard-check"></i> Test Results</h2>
|
|
|
|
|
<div class="test-results" id="testResults">
|
|
|
|
|
<!-- Test results will be populated here -->
|
|
|
|
|
</div>
|
|
|
|
|
</section>
|
|
|
|
|
</main>
|
|
|
|
|
|
2025-07-11 21:26:26 +01:00
|
|
|
<footer class="footer">
|
2025-07-11 22:04:27 +01:00
|
|
|
<p>© 2025 Memory Module Detection Project</p>
|
2025-07-11 20:07:36 +01:00
|
|
|
</footer>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<!-- Loading Overlay -->
|
|
|
|
|
<div class="loading-overlay" id="loadingOverlay" style="display: none;">
|
|
|
|
|
<div class="loading-content">
|
|
|
|
|
<i class="fas fa-spinner fa-spin"></i>
|
|
|
|
|
<p id="loadingText">Processing...</p>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<script src="{{ url_for('static', filename='script.js') }}"></script>
|
|
|
|
|
</body>
|
|
|
|
|
</html>
|
