|
|
<!doctype html> |
|
|
<html style="height:100%;"> |
|
|
<head> |
|
|
<title>Download Annotations</title> |
|
|
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> |
|
|
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"> |
|
|
</head> |
|
|
<body> |
|
|
<header class="flex items-center justify-between bg-white p-4 sm:p-6 rounded-lg shadow-md mb-8 flex-wrap"> |
|
|
|
|
|
<div class="flex items-center space-x-4 mb-4 sm:mb-0 w-full sm:w-auto justify-center sm:justify-start"> |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<img src="{{ url_for('static', filename='images/logo_black.png') }}" alt="KrongAI" class="squared-full shadow-sm" height="120cqh"> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="flex-grow text-center mb-4 sm:mb-0 order-first sm:order-none w-full sm:w-auto"> |
|
|
<h1 class="text-3xl sm:text-4xl font-bold text-gray-800 leading-tight"> |
|
|
🇰🇭 By Cambodian, for the development of AI 🇰🇭 |
|
|
</h1> |
|
|
</div> |
|
|
|
|
|
|
|
|
|
|
|
<div class="w-full sm:w-auto flex justify-center sm:justify-end"> |
|
|
|
|
|
<div class="w-[128px] h-0 sm:h-[60px]"></div> |
|
|
</div> |
|
|
</header> |
|
|
|
|
|
<div class="container" style="margin-top:20px;"> |
|
|
<center> |
|
|
<div class="jumbotron"> |
|
|
<h2>Download the Annotations as CSV File</h2> |
|
|
<button id="downloadButton" style="margin-top:10px;" class="btn btn-success">Download</button> |
|
|
<div id="messageBox" class="mt-8 p-4 bg-blue-100 border border-blue-400 text-blue-700 rounded-lg hidden" role="alert"> |
|
|
<p id="messageText" class="font-medium"></p> |
|
|
</div> |
|
|
<script> |
|
|
document.getElementById('downloadButton').addEventListener('click', function() { |
|
|
var messageBox = document.getElementById('messageBox'); |
|
|
var messageText = document.getElementById('messageText'); |
|
|
messageText.textContent = 'Thank you for helping our Cambodia!'; |
|
|
messageBox.classList.remove('hidden', 'bg-red-100', 'border-red-400', 'text-red-700', 'bg-green-100', 'border-green-400', 'text-green-700', 'bg-blue-100', 'border-blue-400', 'text-blue-700'); |
|
|
messageBox.classList.add('bg-green-100', 'border-green-400', 'text-green-700'); |
|
|
messageBox.classList.remove('hidden'); |
|
|
|
|
|
|
|
|
var link = document.createElement('a'); |
|
|
link.href = "{{ url_for('download', download='annotations.csv') }}"; |
|
|
link.download = 'my_file.txt'; |
|
|
document.body.appendChild(link); |
|
|
link.click(); |
|
|
document.body.removeChild(link); |
|
|
|
|
|
|
|
|
setTimeout(function() { |
|
|
|
|
|
window.location.href = "{{ url_for('index') }}"; |
|
|
}, 3000); |
|
|
}); |
|
|
</script> |
|
|
</div> |
|
|
</center> |
|
|
</div> |
|
|
|
|
|
<footer class="mt-8 mb-4 text-center text-gray-500 text-sm w-full max-w-4xl"> |
|
|
Thanks Huggingface 🤗 |
|
|
</footer> |
|
|
</body> |
|
|
</html> |
|
|
|
