123 lines
4.0 KiB
HTML
123 lines
4.0 KiB
HTML
<html>
|
|
|
|
<head>
|
|
<title>Dropout.tv</title>
|
|
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
|
|
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
|
|
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
|
|
<link rel="manifest" href="/site.webmanifest">
|
|
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
|
|
<style>
|
|
:root {
|
|
font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
|
|
font-size: 17px;
|
|
background-color: #292F36;
|
|
color: #ccc;
|
|
}
|
|
body {
|
|
text-align: center;
|
|
margin-top: 5em;
|
|
}
|
|
@media (min-width: 1171px) {
|
|
.downloader{
|
|
|
|
height: 50px;
|
|
}
|
|
}
|
|
@media (max-width: 1170px) {
|
|
:root {
|
|
font-size: 40px;
|
|
}
|
|
.downloader{
|
|
height: 125px;
|
|
width: 700px;
|
|
}
|
|
}
|
|
.downloader {
|
|
font-size: 1.25em;
|
|
padding: 0.5em;
|
|
border-radius: 0.5em;
|
|
margin-bottom: 20px;
|
|
}
|
|
</style>
|
|
</head>
|
|
|
|
<body>
|
|
<form id="dropout_download">
|
|
<select class="downloader" name="show" id="download_show">
|
|
{% for item in data %}
|
|
<option value="{{ item['SHOW'] }}">{{ item['SHOW'] }}</option>
|
|
{% endfor %}
|
|
</select>
|
|
<input class="downloader" name="season" type="text" id="download_season" placeholder="Season">
|
|
<!-- <input class="downloader" name="episode" type="text" id="download_episode" placeholder="Episode"><br> -->
|
|
<button class="downloader" type="submit">Download</button> <!-- Added a submit button -->
|
|
</form>
|
|
<div id="downloadResult"></div>
|
|
</body>
|
|
|
|
<script>
|
|
function clearInput() {
|
|
$('#download_field').val(''); // Clear the input field
|
|
}
|
|
|
|
// Handle the form submission with AJAX
|
|
$(document).ready(function () {
|
|
$('#dropout_download').submit(function (event) {
|
|
event.preventDefault(); // Prevent the default form submission
|
|
alert("Episode(s) now downloading");
|
|
|
|
$.ajax({
|
|
type: 'POST', // Use POST method to send data
|
|
url: '/dropout/download', // Target URL for the CherryPy handler
|
|
data: $('#dropout_download').serializeArray(), // Serialize the form data
|
|
success: function (data) {
|
|
$('#downloadResult').html(data); // Display the result in the specified div
|
|
alert("File has finished downloading");
|
|
}
|
|
});
|
|
});
|
|
});
|
|
|
|
let showsData = [];
|
|
|
|
// Load JSON data from the file
|
|
fetch('dropout.json')
|
|
.then(response => response.json())
|
|
.then(data => {
|
|
showsData = data;
|
|
populateShows();
|
|
});
|
|
|
|
function populateShows() {
|
|
const showSelect = document.getElementById("download_show");
|
|
showsData.forEach(show => {
|
|
const option = document.createElement("option");
|
|
option.value = show.SHOW;
|
|
option.text = show.SHOW;
|
|
showSelect.appendChild(option);
|
|
});
|
|
}
|
|
|
|
function updateSeasons() {
|
|
const showSelect = document.getElementById("download_show");
|
|
const seasonSelect = document.getElementById("download_season");
|
|
const selectedShow = showSelect.value;
|
|
|
|
// Clear existing options
|
|
seasonSelect.innerHTML = '';
|
|
|
|
// Find the selected show and update seasons
|
|
const show = showsData.find(s => s.SHOW === selectedShow);
|
|
if (show) {
|
|
show.SEASONS.forEach(season => {
|
|
const option = document.createElement("option");
|
|
option.value = season;
|
|
option.text = "Season " + season;
|
|
seasonSelect.appendChild(option);
|
|
});
|
|
}
|
|
}
|
|
</script>
|
|
|
|
</html> |