94 lines
3.1 KiB
Cheetah
94 lines
3.1 KiB
Cheetah
<!DOCTYPE html>
|
||
<html lang="en">
|
||
{{ template "head" . }}
|
||
|
||
<body>
|
||
<header></header>
|
||
|
||
<div class="column">
|
||
<h1>Dashboard</h1>
|
||
<div class="columns is-mobile">
|
||
<div class="column is-2">
|
||
<aside class="menu">
|
||
|
||
<p class="menu-label">GoDownloader</p>
|
||
|
||
<ul class="menu-list">
|
||
<li><a class="nav-link" onclick="toggleMenuGoDownload(); return false;">GoDownloader</a>
|
||
<ul id="menuDownload" hidden>
|
||
<li><a hx-get="/downloads" class="nav-link" hx-target="#content" hx-swap="innerHTML">Téléchargements</a></li>
|
||
</ul>
|
||
|
||
</li>
|
||
<p class="menu-label">Library</p>
|
||
|
||
<li><a hx-get="/library" class="nav-link"
|
||
onclick="toggleMenu(); return false;"
|
||
hx-target="#content" hx-swap-oob="beforeend">Library</a>
|
||
<li>
|
||
<ul class="menu-list" id="libraryMenu" hidden>
|
||
<li>
|
||
<a class="is-active">Choise Library</a>
|
||
<ul id="paths-list">
|
||
{{range .paths}}
|
||
<li>
|
||
<a
|
||
href="/api/paths/{{.ID}}/media"
|
||
class="path-link"
|
||
hx-get="/api/paths/{{.ID}}/media"
|
||
hx-target="#content"
|
||
hx-swap="innerHTML">
|
||
{{.PathName}}
|
||
<i class="fas fa-ellipsis-v"></i>
|
||
</a>
|
||
</li>
|
||
{{end}}
|
||
|
||
</ul>
|
||
</li>
|
||
</ul>
|
||
</li>
|
||
<li><a hx-get="/folders" class="nav-link" hx-target="#content" hx-swap-oob="beforeend">Folders</a></li>
|
||
<li><a hx-get="/settings" class="nav-link" hx-target="#content" hx-swap-oob="beforeend">Settings</a></li>
|
||
</li>
|
||
</ul>
|
||
</aside>
|
||
</div>
|
||
<div class="column is-10">
|
||
<div id="loading-spinner" class="has-text-centered" style="display:none; position: absolute; top: 1rem; right: 1rem; z-index: 50;">
|
||
<button class="button is-loading is-white is-large" aria-label="Loading"></button>
|
||
</div>
|
||
<div id="content">
|
||
<!-- Le contenu spécifique sera chargé ici -->
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<footer></footer>
|
||
|
||
|
||
|
||
</body>
|
||
<script>
|
||
// static/js/spinner.js
|
||
// Écoute tous les événements HTMX et affiche/masque le spinner global
|
||
document.body.addEventListener('htmx:send', () => {
|
||
const s = document.getElementById('loading-spinner');
|
||
if (s) s.style.display = 'block';
|
||
});
|
||
document.body.addEventListener('htmx:afterOnLoad', () => {
|
||
const s = document.getElementById('loading-spinner');
|
||
if (s) s.style.display = 'none';
|
||
});
|
||
// En cas d’erreur réseau
|
||
document.body.addEventListener('htmx:afterRequest', (evt) => {
|
||
if (evt.detail.xhr.status >= 400) {
|
||
const s = document.getElementById('loading-spinner');
|
||
if (s) s.style.display = 'none';
|
||
}
|
||
});
|
||
|
||
</script>
|
||
|
||
</html> |