DRMDTool/templates/index
2024-09-06 18:31:42 +02:00

112 lines
3.1 KiB
Plaintext

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Simple Downloader</title>
<style>
body {
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
background-color: #1e1e1e;
color: #d4d4d4;
line-height: 1.6;
padding: 20px;
max-width: 800px;
margin: 0 auto;
box-sizing: border-box;
}
h1, h2 {
border-bottom: 1px solid #333;
padding-bottom: 10px;
word-wrap: break-word;
}
form {
margin-bottom: 20px;
display: flex;
flex-direction: column;
}
input[type="file"], input[type="submit"] {
background-color: #2d2d2d;
color: #d4d4d4;
border: 1px solid #444;
padding: 8px 12px;
border-radius: 4px;
margin-bottom: 10px;
max-width: 100%;
}
input[type="submit"] {
cursor: pointer;
background-color: #4CAF50;
color: white;
}
input[type="submit"]:hover {
background-color: #45a049;
}
ul {
list-style-type: none;
padding: 0;
}
li {
background-color: #2d2d2d;
margin-bottom: 10px;
padding: 10px;
border-radius: 4px;
word-wrap: break-word;
}
.job-title {
font-size: 1.1em;
font-weight: bold;
margin-bottom: 5px;
}
.job-title a {
color: #58a6ff;
text-decoration: none;
}
.job-title a:hover {
text-decoration: underline;
}
.job-info {
font-size: 0.9em;
color: #a0a0a0;
}
.progress-text {
display: inline-block;
width: 5em;
}
@media (max-width: 600px) {
body {
padding: 10px;
}
h1, h2 {
font-size: 1.5em;
}
input[type="file"], input[type="submit"] {
font-size: 16px;
}
}
</style>
</head>
<body>
<h1>Simple Downloader</h1>
<form action="/upload" method="post" enctype="multipart/form-data">
<input type="file" name="file" accept=".drmd">
<input type="submit" value="Upload and Process">
</form>
<h2>Currently Running Jobs</h2>
<ul>
{{range $filename, $info := .Jobs}}
<li>
<div class="job-title">
<a href="/progress?filename={{$filename}}">{{$filename}}</a>
</div>
<div class="job-info">
Progress: <span class="progress-text">{{printf "%5.1f%%" $info.Percentage}}</span> Current file: {{$info.CurrentFile}}
</div>
</li>
{{else}}
<li>No active jobs</li>
{{end}}
</ul>
</body>
</html>