EvaluationEfficiencyOptimiz.../server/templates/main.html

44 lines
1.4 KiB
HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Image Viewer</title>
<link rel="stylesheet" href="/static/style.css">
</head>
<body>
<div class="container">
<div class="image-viewer">
<img id="display-image" src="/public/floris/Yaw_example.png" alt="Selected Image">
<button onclick="generateImage()">Generate Image</button>
<button onclick="downloadImage()">Download Image</button>
</div>
<div class="image-list">
<h3>Available Images</h3>
<ul id="image-list">
{% for image in images %}
<li onclick="selectImage('{{ image }}')">{{ image }}</li>
{% endfor %}
</ul>
</div>
</div>
<script>
function selectImage(imageName) {
const imgElement = document.getElementById('display-image');
imgElement.src = `/public/floris/${imageName}`;
}
function generateImage() {
alert("Image generation functionality not implemented yet.");
}
function downloadImage() {
const imgElement = document.getElementById('display-image');
const imageName = imgElement.src.split('/').pop();
window.location.href = `/floris/download_image/${imageName}`;
}
</script>
</body>
</html>