2025-04-27 20:18:00 -04:00

91 lines
3.2 KiB
HTML

<html>
<head>
<title>YDL</title>
<link rel="apple-touch-icon" sizes="180x180" href="static/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="static/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="static/favicon-16x16.png">
<link rel="manifest" href="static/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>
<!-- <div id="glass"></div> -->
<!-- {navBar} -->
<form id="ydl_download">
<input class="downloader" name="url" type="text" id="download_field" placeholder="Enter URL">
<select class="downloader" name="location" id="download_location">
<option value="/nsfw">NSFW</option>
<option value="/podcasts">Podcast</option>
<option value="/asmr">ASMR</option>
<option value="/youtube">YouTube</option>
</select><br>
<button class="downloader" type="submit">Download</button>
</form>
<div id="downloadResult"></div>
<script>
function clearInput() {
$('#download_field').val(''); // Clear the input field
}
$(document).ready(function () {
$('#ydl_download').submit(function (event) {
event.preventDefault(); // Prevent default form submission
alert("File is now downloading..."); // Placeholder, can be replaced with a loading spinner
$.ajax({
type: 'POST',
url: '/ydl', // URL for handling the request on the server
data: $('#ydl_download').serializeArray(), // Serialize form data
success: function (data) {
$('#downloadResult').html(data); // Show server response
alert("File has finished downloading"); // Update as necessary
clearInput(); // Clear the form fields after download is finished
},
error: function () {
alert("An error occurred during the download process. Please try again.");
}
});
});
});
</script>
<!-- <script type="text/javascript" src="/static/javascript/ydl.js"></script> -->
</html>