DRMDTool/templates/select

106 lines
3.7 KiB
Plaintext

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Select Items to Download</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 {
border-bottom: 1px solid #333;
padding-bottom: 10px;
}
.season {
margin-bottom: 20px;
background-color: #2d2d2d;
padding: 10px;
border-radius: 4px;
}
.season-title {
font-size: 1.2em;
font-weight: bold;
margin-bottom: 10px;
display: flex;
align-items: center;
}
.season-checkbox {
margin-right: 10px;
}
.item {
margin-left: 20px;
}
button, input[type="submit"] {
background-color: #4CAF50;
color: white;
border: none;
padding: 10px 15px;
margin: 5px;
border-radius: 4px;
cursor: pointer;
}
button:hover, input[type="submit"]:hover {
background-color: #45a049;
}
</style>
</head>
<body>
<h1>Select Items to Download</h1>
<form action="/process" method="post">
<input type="hidden" name="filenames" value="{{.Filenames}}">
{{range $filename, $fileItems := .AllItems}}
<h2>{{$filename}}</h2>
{{range $season, $items := $fileItems}}
<div class="season">
<div class="season-title">
<input type="checkbox" class="season-checkbox" id="season-{{$filename}}-{{$season}}" checked onchange="toggleSeason('{{$filename}}-{{$season}}')">
<label for="season-{{$filename}}-{{$season}}">{{$season}}</label>
</div>
{{range $item := $items}}
<div class="item">
<label>
<input type="checkbox" name="items" value="{{$filename}}:{{$item.Filename}}" checked class="episode-{{$filename}}-{{$season}}">
{{$item.Filename}}
</label>
</div>
{{end}}
</div>
{{end}}
{{end}}
<div>
<button type="button" onclick="selectAll(true)">Select All</button>
<button type="button" onclick="selectAll(false)">Select None</button>
<input type="submit" value="Start Download">
</div>
</form>
<script>
function selectAll(checked) {
var checkboxes = document.getElementsByName('items');
for (var i = 0; i < checkboxes.length; i++) {
checkboxes[i].checked = checked;
}
var seasonCheckboxes = document.getElementsByClassName('season-checkbox');
for (var i = 0; i < seasonCheckboxes.length; i++) {
seasonCheckboxes[i].checked = checked;
}
}
function toggleSeason(season) {
var seasonCheckbox = document.getElementById('season-' + season);
var episodeCheckboxes = document.getElementsByClassName('episode-' + season);
for (var i = 0; i < episodeCheckboxes.length; i++) {
episodeCheckboxes[i].checked = seasonCheckbox.checked;
}
}
</script>
</body>
</html>