278 lines
12 KiB
PHP
278 lines
12 KiB
PHP
<?php
|
|
/**
|
|
* Page d'accueil - MH Wilds - Partage de Quêtes à Couronnes
|
|
*/
|
|
|
|
// Démarrer la session
|
|
session_start();
|
|
|
|
// Définir une constante pour empêcher l'accès direct aux includes
|
|
define('SECURE_ACCESS', true);
|
|
|
|
// Inclure les fichiers nécessaires
|
|
require_once 'includes/config.php';
|
|
require_once 'includes/database.php';
|
|
require_once 'includes/functions.php';
|
|
|
|
// Titre de la page
|
|
$page_title = 'MH Wilds - Partage de Quêtes à Couronnes';
|
|
$page_description = 'Partagez vos quêtes d\'investigation avec couronnes pour Monster Hunter Wilds et complétez votre collection !';
|
|
|
|
// Récupérer le paramètre de tri
|
|
$current_sort = isset($_GET['sort']) ? $_GET['sort'] : 'name_asc';
|
|
|
|
// CSS supplémentaire pour la page d'accueil
|
|
$extra_css = <<<EOT
|
|
<style id="monster-search-styles">
|
|
/* Styles pour le select searchable personnalisé */
|
|
.monster-search-container {
|
|
position: relative;
|
|
}
|
|
|
|
.monster-search-results {
|
|
position: absolute;
|
|
width: 100%;
|
|
max-height: 250px;
|
|
overflow-y: auto;
|
|
background-color: var(--mh-light-bg);
|
|
border: 1px solid var(--mh-accent);
|
|
border-radius: 0.375rem;
|
|
z-index: 1050;
|
|
margin-top: 2px;
|
|
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);
|
|
}
|
|
|
|
.monster-search-item {
|
|
padding: 8px 12px;
|
|
cursor: pointer;
|
|
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
|
|
color: var(--mh-light);
|
|
}
|
|
|
|
.monster-search-item:hover,
|
|
.monster-search-item.active {
|
|
background-color: var(--mh-dark);
|
|
}
|
|
|
|
.monster-search-item:last-child {
|
|
border-bottom: none;
|
|
}
|
|
|
|
.selected-monster {
|
|
font-weight: bold;
|
|
color: var(--mh-accent);
|
|
}
|
|
|
|
.monster-search-no-results {
|
|
padding: 10px;
|
|
text-align: center;
|
|
color: var(--mh-light);
|
|
font-style: italic;
|
|
}
|
|
</style>
|
|
EOT;
|
|
|
|
// Scripts JS supplémentaires
|
|
$extra_js = <<<EOT
|
|
<script src="assets/js/main.js"></script>
|
|
EOT;
|
|
|
|
// Récupérer les données nécessaires avec le tri spécifié
|
|
$monsters = get_all_monsters($current_sort);
|
|
$active_announcements = get_all_announcements(true);
|
|
|
|
// Inclure l'en-tête
|
|
include 'includes/header.php';
|
|
?>
|
|
|
|
<div class="d-flex justify-content-between align-items-center mb-4">
|
|
<h2>Liste des monstres</h2>
|
|
<button class="btn btn-primary" id="addQuestBtn">+ Ajouter ma quête</button>
|
|
</div>
|
|
|
|
<div class="row mb-4">
|
|
<div class="col-md-6">
|
|
<div class="input-group">
|
|
<span class="input-group-text"><i class="bi bi-search">🔍</i></span>
|
|
<input type="text" class="form-control" id="monsterSearch" placeholder="Rechercher un monstre...">
|
|
<button class="btn btn-outline-light" type="button" id="clearSearchBtn">Effacer</button>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<div class="input-group">
|
|
<span class="input-group-text">Trier par</span>
|
|
<select class="form-select" id="monsterSort">
|
|
<option value="name_asc" <?php echo $current_sort === 'name_asc' ? 'selected' : ''; ?>>Nom (A-Z)</option>
|
|
<option value="name_desc" <?php echo $current_sort === 'name_desc' ? 'selected' : ''; ?>>Nom (Z-A)</option>
|
|
<option value="quests_count" <?php echo $current_sort === 'quests_count' ? 'selected' : ''; ?>>Nombre de quêtes</option>
|
|
<option value="recent_quests" <?php echo $current_sort === 'recent_quests' ? 'selected' : ''; ?>>Quêtes récentes</option>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<?php if (!empty($active_announcements)): ?>
|
|
<div id="announcementArea">
|
|
<?php foreach ($active_announcements as $announcement): ?>
|
|
<div class="announcement-item">
|
|
<p><?php echo secure_output($announcement['text']); ?></p>
|
|
<div class="announcement-date">Publiée le <?php echo date('d/m/Y', strtotime($announcement['created_at'])); ?></div>
|
|
</div>
|
|
<?php endforeach; ?>
|
|
</div>
|
|
<?php endif; ?>
|
|
|
|
<div class="row g-4 mb-4" id="monsterList">
|
|
<?php if (empty($monsters)): ?>
|
|
<div class="col-12">
|
|
<div class="empty-message">
|
|
<p>Aucun monstre disponible pour le moment.</p>
|
|
</div>
|
|
</div>
|
|
<?php else: ?>
|
|
<?php foreach ($monsters as $monster): ?>
|
|
<?php
|
|
$smallCrownCount = count_quests_for_monster($monster['id'], 'small');
|
|
$largeCrownCount = count_quests_for_monster($monster['id'], 'large');
|
|
?>
|
|
<div class="col-lg-3 col-md-4 col-sm-6">
|
|
<div class="card monster-card fade-in" data-monster-id="<?php echo $monster['id']; ?>">
|
|
<div class="card-img-container">
|
|
<img src="<?php echo secure_output($monster['image']); ?>" class="card-img-top" alt="<?php echo secure_output($monster['name']); ?>">
|
|
</div>
|
|
<div class="card-body">
|
|
<h5 class="card-title"><?php echo secure_output($monster['name']); ?></h5>
|
|
<div class="d-flex justify-content-between">
|
|
<div>
|
|
<span class="crown-badge small-crown" title="Petites couronnes">
|
|
<i class="bi bi-trophy-fill crown-icon">👑</i> <?php echo $smallCrownCount; ?>
|
|
</span>
|
|
<span class="crown-badge large-crown" title="Grandes couronnes">
|
|
<i class="bi bi-trophy-fill crown-icon">👑</i> <?php echo $largeCrownCount; ?>
|
|
</span>
|
|
</div>
|
|
<button class="btn btn-sm btn-outline-primary">Voir les quêtes</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<?php endforeach; ?>
|
|
<?php endif; ?>
|
|
</div>
|
|
|
|
<!-- Modale de consultation des quêtes -->
|
|
<div class="modal fade" id="questListModal" tabindex="-1" aria-hidden="true">
|
|
<div class="modal-dialog modal-lg">
|
|
<div class="modal-content">
|
|
<div class="modal-header">
|
|
<h5 class="modal-title">Quêtes disponibles pour <span id="modalMonsterName"></span></h5>
|
|
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Fermer"></button>
|
|
</div>
|
|
<div class="modal-body">
|
|
<div class="mb-3">
|
|
<div class="btn-group" role="group">
|
|
<input type="radio" class="btn-check" name="crownFilter" id="filterAll" value="all" checked>
|
|
<label class="btn btn-outline-accent" for="filterAll">Toutes</label>
|
|
|
|
<input type="radio" class="btn-check" name="crownFilter" id="filterSmall" value="small">
|
|
<label class="btn btn-outline-accent" for="filterSmall">Petites couronnes</label>
|
|
|
|
<input type="radio" class="btn-check" name="crownFilter" id="filterLarge" value="large">
|
|
<label class="btn btn-outline-accent" for="filterLarge">Grandes couronnes</label>
|
|
</div>
|
|
</div>
|
|
<div id="questList">
|
|
<!-- La liste des quêtes sera générée dynamiquement en JS -->
|
|
<div class="spinner-border" role="status">
|
|
<span class="visually-hidden">Chargement...</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Modale d'ajout de quête -->
|
|
<div class="modal fade" id="addQuestModal" tabindex="-1" aria-hidden="true">
|
|
<div class="modal-dialog">
|
|
<div class="modal-content">
|
|
<div class="modal-header">
|
|
<h5 class="modal-title">Ajouter une quête</h5>
|
|
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Fermer"></button>
|
|
</div>
|
|
<div class="modal-body">
|
|
<form id="addQuestForm">
|
|
<input type="hidden" name="csrf_token" value="<?php echo generate_csrf_token(); ?>">
|
|
<div class="mb-3">
|
|
<label for="monsterSearchSelect" class="form-label">Monstre</label>
|
|
<div class="monster-search-container">
|
|
<div class="input-group">
|
|
<span class="input-group-text"><i class="bi bi-search">🔍</i></span>
|
|
<input type="text" class="form-control" id="monsterSearchSelect"
|
|
placeholder="Rechercher et sélectionner un monstre..." autocomplete="off">
|
|
<input type="hidden" id="selectedMonsterId" name="selectedMonsterId" required>
|
|
</div>
|
|
<div class="monster-search-results d-none" id="monsterSearchResults">
|
|
<!-- Les résultats seront générés dynamiquement en JS -->
|
|
</div>
|
|
</div>
|
|
<div class="invalid-feedback">Veuillez sélectionner un monstre</div>
|
|
</div>
|
|
<div class="mb-3">
|
|
<label class="form-label">Type de couronne</label>
|
|
<div class="form-check">
|
|
<input class="form-check-input" type="radio" name="crownType" id="smallCrown" value="small" required>
|
|
<label class="form-check-label" for="smallCrown">
|
|
Petite couronne
|
|
</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input" type="radio" name="crownType" id="largeCrown" value="large">
|
|
<label class="form-check-label" for="largeCrown">
|
|
Grande couronne
|
|
</label>
|
|
</div>
|
|
</div>
|
|
<div class="mb-3">
|
|
<label for="playerName" class="form-label">Votre pseudo</label>
|
|
<input type="text" class="form-control" id="playerName" name="playerName" required>
|
|
</div>
|
|
<div class="mb-3">
|
|
<label for="playerId" class="form-label">Votre ID en jeu</label>
|
|
<input type="text" class="form-control" id="playerId" name="playerId" required>
|
|
</div>
|
|
<div class="d-grid">
|
|
<button type="submit" class="btn btn-primary">Ajouter la quête</button>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Modale de confirmation de suppression -->
|
|
<div class="modal fade" id="deleteQuestModal" tabindex="-1" aria-hidden="true">
|
|
<div class="modal-dialog">
|
|
<div class="modal-content">
|
|
<div class="modal-header">
|
|
<h5 class="modal-title">Supprimer la quête</h5>
|
|
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Fermer"></button>
|
|
</div>
|
|
<div class="modal-body">
|
|
<p>Êtes-vous sûr de vouloir supprimer cette quête ?</p>
|
|
<form id="deleteQuestForm">
|
|
<input type="hidden" name="csrf_token" value="<?php echo generate_csrf_token(); ?>">
|
|
<input type="hidden" id="deleteQuestId" name="deleteQuestId">
|
|
</form>
|
|
</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>
|
|
|
|
<?php
|
|
// Inclure le pied de page
|
|
include 'includes/footer.php';
|