File size: 6,751 Bytes
5888c6a 17f30cf a47415e 5888c6a cc27e70 5888c6a dd82717 a47415e 5888c6a |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 |
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Answer Evaluation System</title>
<link rel="stylesheet" href="/static/css/style.css">
<link rel="stylesheet" href="{{ request.url_for('static', path='css/style.css') }}">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css">
</head>
<body>
<div class="container">
<div style="background-color: #fff8dc; border: 1px solid #f0c36d; padding: 10px; border-radius: 5px; margin-bottom: 20px;">
⚠️ <strong>Note:</strong> This is a prototype model trained on limited data. Accuracy may vary.<br>
Try the sample image files below to see expected performance.
</div>
<header>
<h1>Answer Evaluation System</h1>
<p>Upload images of question, student answer, and reference answer for evaluation</p>
</header>
<div class="evaluation-flow">
<div class="flow-step active">
<div class="step-icon"><i class="fas fa-upload"></i></div>
<div class="step-label">Upload Files</div>
</div>
<div class="flow-connector"></div>
<div class="flow-step">
<div class="step-icon"><i class="fas fa-cogs"></i></div>
<div class="step-label">Preprocessing</div>
</div>
<div class="flow-connector"></div>
<div class="flow-step">
<div class="step-icon"><i class="fas fa-brain"></i></div>
<div class="step-label">Evaluating Answer</div>
</div>
<div class="flow-connector"></div>
<div class="flow-step">
<div class="step-icon"><i class="fas fa-percentage"></i></div>
<div class="step-label">Score</div>
</div>
</div>
<div class="upload-section">
<form id="evaluation-form" method="post" action="/evaluate" enctype="multipart/form-data">
<div class="upload-cards">
<div class="upload-card">
<div class="card-header">
<i class="fas fa-question-circle"></i>
<h3>Question</h3>
</div>
<div class="upload-area" id="question-upload">
<i class="fas fa-cloud-upload-alt"></i>
<p>Drag & Drop or Click to Upload</p>
<input type="file" name="question" id="question-input" accept="image/png, image/jpeg, image/jpg" hidden>
</div>
<div class="preview" id="question-preview"></div>
</div>
<div class="upload-card">
<div class="card-header">
<i class="fas fa-user-graduate"></i>
<h3>Student Answer</h3>
</div>
<div class="upload-area" id="student-upload">
<i class="fas fa-cloud-upload-alt"></i>
<p>Drag & Drop or Click to Upload</p>
<input type="file" name="student_answer" id="student-input" accept="image/png, image/jpeg, image/jpg" hidden>
</div>
<div class="preview" id="student-preview"></div>
</div>
<div class="upload-card">
<div class="card-header">
<i class="fas fa-check-circle"></i>
<h3>Reference Answer</h3>
</div>
<div class="upload-area" id="reference-upload">
<i class="fas fa-cloud-upload-alt"></i>
<p>Drag & Drop or Click to Upload</p>
<input type="file" name="reference_answer" id="reference-input" accept="image/png, image/jpeg, image/jpg" hidden>
</div>
<div class="preview" id="reference-preview"></div>
</div>
</div>
<button type="submit" id="evaluate-btn" disabled>
<i class="fas fa-calculator"></i> Evaluate Answer
</button>
</form>
</div>
<div class="results-section" style="display: none;">
<div class="results-header">
<h2>Evaluation Results</h2>
<button id="new-evaluation-btn"><i class="fas fa-redo"></i> New Evaluation</button>
</div>
<div class="extracted-text">
<div class="text-section">
<h3><i class="fas fa-question-circle"></i> Question</h3>
<div class="text-content" id="question-text"></div>
</div>
<div class="text-section">
<h3><i class="fas fa-user-graduate"></i> Student Answer</h3>
<div class="text-content" id="student-text"></div>
</div>
<div class="text-section">
<h3><i class="fas fa-check-circle"></i> Reference Answer</h3>
<div class="text-content" id="reference-text"></div>
</div>
</div>
<div class="score-display">
<div class="score-circle">
<div class="score-value" id="score-value">0%</div>
<svg class="score-svg" width="200" height="200">
<circle class="score-background" cx="100" cy="100" r="90"></circle>
<circle class="score-progress" cx="100" cy="100" r="90"></circle>
</svg>
</div>
<div class="score-label">Similarity Score</div>
<div class="score-message" id="score-message"></div>
</div>
</div>
<div class="loading-overlay" style="display: none;">
<div class="loading-content">
<div class="spinner"></div>
<div class="loading-step" id="loading-step">Uploading files...</div>
</div>
</div>
</div>
<footer>
<p>© 2025 Answer Evaluation System | Powered by XLNet</p>
<p>21B91A6131, 21B91A6106, 21B91A6119, 21B91A6121</p>
<p>Guided By: A. L. Lavanya, Assistant Professor, CSE, SRKREC.</p>
</footer>
<script src="/static/js/main.js"></script>
<script src="{{ request.url_for('static', path='js/main.js') }}"></script>
</body>
</html> |