Files
Freedom-Loader/public/index.html
2026-01-18 14:23:17 +01:00

121 lines
4.0 KiB
HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="Content-Security-Policy" content="
default-src 'self' 'unsafe-inline' data:;
style-src 'self' 'unsafe-inline' https://fonts.googleapis.com;
font-src https://fonts.gstatic.com;
img-src 'self' data: https://i.ytimg.com;
">
<title></title>
<link rel="stylesheet" href="styles/styles.css">
<link rel="stylesheet" href="styles/layout/topbar.css">
</head>
<body>
<div class="topbar" id="topbar">
<div class="custom-controls">
<button id="devtools-btn" title="Dev Tools">Tools</button>
<button id="logs-btn" title="Logs">Logs</button>
<button id="website-btn" title="Website">Website</button>
<button id="wiki-btn" title="Wiki">Wiki</button>
<button id="config-btn" title="Configuration">Configuration</button>
</div>
<div class="window-controls">
<button id="minimize-btn" title="Réduire"><img src="assets/icon/minimize.svg"></button>
<button id="maximize-btn" title="Maximiser"><img src="assets/icon/maximize.svg"></button>
<button id="close-btn" title="Fermer"><img src="assets/icon/close.svg"></button>
</div>
</div>
<div class="theme-switcher" id="theme-switcher" style="display: none;">
<label for="themeSelect">Thème :</label>
<select id="themeSelect" aria-label="Choisir le thème"></select>
</div>
<button id="settings-button" class="settings-button" onclick="openPanel()"> <img src="assets/icon/settings.png"> </button>
<div class="settings-panel" id="settings-panel" style="display: none;">
<h3> Settings Panel </h3>
<div class="container">
</div>
</div>
<div class="container" id="container">
<header>
<h1 id="title"> Freedom Loader </h1>
<p id="subtitle"> Because why not? </p>
</header>
<form action="/download" method="POST" id="downloadForm">
<input name="url" placeholder="URL" id="UrlInput">
<label class="checkbox-inline">
<label class="checkbox-mp3">
<input type="checkbox" name="audioOnly" value="1">
<div class="checkmark"></div>
</label>
Audio Only (MP3)
</label>
<select name="quality">
<option value="best">Best Quality</option>
<option value="medium">Medium Quality</option>
<option value="worst">Lowest Quality</option>
<option value="1080">1080p</option>
<option value="720">720p</option>
<option value="480">480p</option>
</select>
<button type="submit" onclick="startProgress()">Download</button>
</form>
</div>
<div class="download-path">
Will be save on <span id="savePath"></span>
<button id="changePath">Edit</button>
</div>
<div id="downloadProgressWrapper">
<div id="downloadProgress"></div>
</div>
<div style="display: flex; gap: 20px;">
<div id="downloadProgressText"></div>
<div id="downloadSpeedText"></div>
</div>
<div id="downloadStatus"></div>
<div class="infos-container">
<div id="loaderBox" class="loader-box" style="display:none;">
<div></div>
<div></div>
<div></div>
<span>Fetching info...</span>
</div>
<div id="videoInfo" style="margin-top: 20px;"></div>
</div>
<span id="version-badge" class="version-badge"></span>
<!-- Scripts -->
<script src="script/custompath.js"></script>
<script src="script/settingsPanel.js"></script>
<script src="script/appVersion.js"></script>
<script src="script/downloadstatus.js"></script>
<script src="script/fetchinfo.js"></script>
<script src="script/progressBar.js"></script>
<script src="script/customthemes.js"></script>
<script type="module" src="script/topbar.js"></script>
</body>
</html>