2025-03-09 16:15:31 +01:00
<!DOCTYPE html>
< html lang = "fr" >
< head >
< meta charset = "UTF-8" >
< meta name = "viewport" content = "width=device-width, initial-scale=1.0" >
< title > Administration - MH Wilds Couronnes< / title >
<!-- Métadonnées pour le partage -->
< meta property = "og:title" content = "Administration - MH Wilds Couronnes" >
< meta property = "og:description" content = "Interface d'administration pour le site de partage de quêtes à couronnes." >
< meta property = "og:image" content = "img/logo.png" >
< meta property = "og:url" content = "https://votresite.com/admin.html" >
< meta name = "twitter:card" content = "summary_large_image" >
<!-- Favicon -->
< link rel = "icon" href = "img/logo.png" type = "image/png" >
<!-- Bootstrap CSS with dark theme -->
< link href = "https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel = "stylesheet" >
<!-- Notre CSS personnalisé -->
< link rel = "stylesheet" href = "css/styles.css" >
< / head >
< body >
< header class = "bg-dark text-white py-3" >
< div class = "container" >
< div class = "d-flex justify-content-between align-items-center" >
< div class = "d-flex align-items-center" >
< img src = "img/logo.png" alt = "Logo" height = "40" class = "me-2" >
< h1 class = "h2 mb-0" > Administration< / h1 >
< / div >
< div >
< a href = "index.html" class = "btn btn-outline-light me-2" > Retour au site< / a >
< button id = "logoutBtn" class = "btn btn-danger" > Déconnexion< / button >
< / div >
< / div >
< / div >
< / header >
< main class = "container my-4" >
< div class = "row" >
< div class = "col-md-3" >
< div class = "list-group" >
< a href = "#announcementsSection" class = "list-group-item list-group-item-action active" id = "announcementsTab" > Annonces< / a >
< a href = "#monstersSection" class = "list-group-item list-group-item-action" id = "monstersTab" > Monstres< / a >
< a href = "#maintenanceSection" class = "list-group-item list-group-item-action" id = "maintenanceTab" > Maintenance< / a >
< / div >
< / div >
< div class = "col-md-9" >
<!-- Section des annonces -->
< div id = "announcementsSection" class = "admin-section" >
< div class = "card" >
< div class = "card-header d-flex justify-content-between align-items-center" >
< h2 class = "h4 mb-0" > Gestion des annonces< / h2 >
< button class = "btn btn-primary btn-sm" id = "addAnnouncementBtn" > Ajouter une annonce< / button >
< / div >
< div class = "card-body" >
< div class = "table-responsive" >
< table class = "table table-striped" >
< thead >
< tr >
< th > Texte< / th >
< th > Statut< / th >
< th > Actions< / th >
< / tr >
< / thead >
< tbody id = "announcementsList" >
<!-- Liste des annonces générée dynamiquement -->
< / tbody >
< / table >
< / div >
< div id = "emptyAnnouncementsMessage" class = "alert alert-info d-none" >
Aucune annonce pour le moment.
< / div >
< / div >
< / div >
< / div >
<!-- Section des monstres -->
< div id = "monstersSection" class = "admin-section d-none" >
< div class = "card" >
< div class = "card-header d-flex justify-content-between align-items-center" >
< h2 class = "h4 mb-0" > Gestion des monstres< / h2 >
< button class = "btn btn-primary btn-sm" id = "addMonsterBtn" > Ajouter un monstre< / button >
< / div >
< div class = "card-body" >
< div class = "table-responsive" >
< table class = "table table-striped" >
< thead >
< tr >
< th > Image< / th >
< th > Nom< / th >
< th > Quêtes< / th >
< th > Actions< / th >
< / tr >
< / thead >
< tbody id = "monstersList" >
<!-- Liste des monstres générée dynamiquement -->
< / tbody >
< / table >
< / div >
< div id = "emptyMonstersMessage" class = "alert alert-info d-none" >
Aucun monstre pour le moment.
< / div >
< / div >
< / div >
< / div >
<!-- Section de maintenance -->
< div id = "maintenanceSection" class = "admin-section d-none" >
< div class = "card" >
< div class = "card-header" >
< h2 class = "h4 mb-0" > Maintenance du site< / h2 >
< / div >
< div class = "card-body" >
< div class = "mb-4" >
< h3 class = "h5" > Nettoyer les quêtes anciennes< / h3 >
< p > Cette action supprimera toutes les quêtes datant de plus de 7 jours.< / p >
< button class = "btn btn-warning" id = "cleanOldQuestsBtn" > Nettoyer les quêtes anciennes< / button >
< div id = "cleanResult" class = "alert alert-success mt-3 d-none" > < / div >
< / div >
< hr >
< div >
< h3 class = "h5" > Statistiques du site< / h3 >
< ul class = "list-group" >
< li class = "list-group-item d-flex justify-content-between align-items-center" >
Nombre total de monstres
< span class = "badge bg-primary rounded-pill" id = "totalMonstersCount" > 0< / span >
< / li >
< li class = "list-group-item d-flex justify-content-between align-items-center" >
Nombre total de quêtes
< span class = "badge bg-primary rounded-pill" id = "totalQuestsCount" > 0< / span >
< / li >
< li class = "list-group-item d-flex justify-content-between align-items-center" >
Quêtes avec petite couronne
< span class = "badge bg-warning rounded-pill" id = "smallCrownQuestsCount" > 0< / span >
< / li >
< li class = "list-group-item d-flex justify-content-between align-items-center" >
Quêtes avec grande couronne
< span class = "badge bg-secondary rounded-pill" id = "largeCrownQuestsCount" > 0< / span >
< / li >
< / ul >
< / div >
< / div >
< / div >
< / div >
< / div >
< / div >
< / main >
<!-- Modale d'ajout/édition d'annonce -->
< div class = "modal fade" id = "announcementModal" tabindex = "-1" aria-hidden = "true" >
< div class = "modal-dialog" >
< div class = "modal-content" >
< div class = "modal-header" >
< h5 class = "modal-title" id = "announcementModalTitle" > Ajouter une annonce< / h5 >
< button type = "button" class = "btn-close" data-bs-dismiss = "modal" aria-label = "Fermer" > < / button >
< / div >
< div class = "modal-body" >
< form id = "announcementForm" >
< input type = "hidden" id = "announcementId" >
< div class = "mb-3" >
< label for = "announcementText" class = "form-label" > Texte de l'annonce< / label >
< textarea class = "form-control" id = "announcementText" rows = "3" required > < / textarea >
< / div >
< div class = "form-check mb-3" >
< input class = "form-check-input" type = "checkbox" id = "announcementActive" checked >
< label class = "form-check-label" for = "announcementActive" >
Activer l'annonce
< / label >
< / div >
< div class = "d-grid" >
< button type = "submit" class = "btn btn-primary" id = "saveAnnouncementBtn" > Enregistrer< / button >
< / div >
< / form >
< / div >
< / div >
< / div >
< / div >
<!-- Modale d'ajout/édition de monstre -->
< div class = "modal fade" id = "monsterModal" tabindex = "-1" aria-hidden = "true" >
< div class = "modal-dialog" >
< div class = "modal-content" >
< div class = "modal-header" >
< h5 class = "modal-title" id = "monsterModalTitle" > Ajouter un monstre< / h5 >
< button type = "button" class = "btn-close" data-bs-dismiss = "modal" aria-label = "Fermer" > < / button >
< / div >
< div class = "modal-body" >
< form id = "monsterForm" >
< input type = "hidden" id = "monsterId" >
< div class = "mb-3" >
< label for = "monsterName" class = "form-label" > Nom du monstre< / label >
< input type = "text" class = "form-control" id = "monsterName" required >
< / div >
< div class = "mb-3" >
< label for = "monsterImage" class = "form-label" > Chemin de l'image< / label >
< div class = "input-group" >
< span class = "input-group-text" > img/< / span >
< input type = "text" class = "form-control" id = "monsterImage" required placeholder = "Nom_du_monstre.jpg" >
< / div >
< div class = "form-text" > Format recommandé: jpg, 300x200px. Exemple: Rathalos.jpg< / div >
< / div >
< div class = "d-grid" >
< button type = "submit" class = "btn btn-primary" id = "saveMonsterBtn" > Enregistrer< / button >
< / div >
< / form >
< / div >
< / div >
< / div >
< / div >
<!-- Modale de confirmation de suppression -->
< div class = "modal fade" id = "confirmDeleteModal" tabindex = "-1" aria-hidden = "true" >
< div class = "modal-dialog" >
< div class = "modal-content" >
< div class = "modal-header" >
< h5 class = "modal-title" id = "confirmDeleteTitle" > Confirmer la suppression< / h5 >
< button type = "button" class = "btn-close" data-bs-dismiss = "modal" aria-label = "Fermer" > < / button >
< / div >
< div class = "modal-body" >
< p id = "confirmDeleteMessage" > Êtes-vous sûr de vouloir supprimer cet élément ?< / p >
< / div >
< div class = "modal-footer" >
< button type = "button" class = "btn btn-secondary" data-bs-dismiss = "modal" > Annuler< / button >
< button type = "button" class = "btn btn-danger" id = "confirmDeleteBtn" > Supprimer< / button >
< / div >
< / div >
< / div >
< / div >
< footer class = "bg-dark text-white py-3 mt-auto" >
< div class = "container text-center" >
< p class = "mb-0" > Ce site est réalisé dans le cadre de la branche < a href = "https://camelia-studio.org/branches/alt+tab/" target = "_blank" > Alt Tab< / a > de l'association < a href = "https://camelia-studio.org/" target = "_blank" > Camélia Studio< / a > .< / p >
2025-03-09 16:20:13 +01:00
< p class = "mb-0 mt-1" > < small > Images des monstres par Sui Yun - Site sous licence MIT, code source sur < a href = "https://git.crystalyx.net/camelia-studio/Chasse_aux_couronnes" target = "_blank" > Gitea< / a > < / small > < / p >
2025-03-09 16:15:31 +01:00
< / div >
< / footer >
< script src = "https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js" > < / script >
2025-03-09 17:36:38 +01:00
<!-- Charger data.js avant admin.js -->
< script src = "js/data.js" > < / script >
< script src = "js/main.js" > < / script >
2025-03-09 16:15:31 +01:00
< script src = "js/admin.js" > < / script >
< / body >
< / html >
