map-generator/app/Views/projects/index.php

<?php
/**
 * Vue de la liste des projets (cartes)
 */
include __DIR__ . '/../partials/header.php';
?>

<main class="main-content">
    <div class="container-fluid">
        <div class="row">
            <div class="col-12">
                <!-- En-tête de la page -->
                <div class="d-flex align-items-center justify-content-between mb-4">
                    <div>
                        <h1 class="h3 mb-0">
                            <i class="bi bi-folder me-2"></i>Mes projets
                        </h1>
                        <p class="text-muted mb-0">Gérez vos cartes et projets</p>
                    </div>
                    <div>
                        <a href="/projects/new" class="btn btn-primary">
                            <i class="bi bi-plus-circle me-1"></i>Nouveau projet
                        </a>
                    </div>
                </div>

                <!-- Statistiques globales -->
                <div class="row mb-4">
                    <div class="col-md-3">
                        <div class="card bg-primary text-white">
                            <div class="card-body">
                                <div class="d-flex align-items-center">
                                    <div class="flex-grow-1">
                                        <h6 class="card-title mb-1">Total cartes</h6>
                                        <h4 class="mb-0"><?php echo $stats['total_maps']; ?></h4>
                                    </div>
                                    <div>
                                        <i class="bi bi-map h1 mb-0 opacity-75"></i>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-3">
                        <div class="card bg-success text-white">
                            <div class="card-body">
                                <div class="d-flex align-items-center">
                                    <div class="flex-grow-1">
                                        <h6 class="card-title mb-1">Dimensions moyennes</h6>
                                        <h4 class="mb-0"><?php echo $stats['average_width']; ?> × <?php echo $stats['average_height']; ?></h4>
                                    </div>
                                    <div>
                                        <i class="bi bi-aspect-ratio h1 mb-0 opacity-75"></i>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-6">
                        <div class="card bg-info text-white">
                            <div class="card-body">
                                <div class="d-flex align-items-center">
                                    <div class="flex-grow-1">
                                        <h6 class="card-title mb-1">Dernière carte créée</h6>
                                        <?php if ($stats['latest_map']): ?>
                                            <h5 class="mb-0"><?php echo htmlspecialchars($stats['latest_map']['name']); ?></h5>
                                            <small><?php echo date('d/m/Y H:i', strtotime($stats['latest_map']['created_at'])); ?></small>
                                        <?php else: ?>
                                            <h5 class="mb-0">Aucune carte</h5>
                                        <?php endif; ?>
                                    </div>
                                    <div>
                                        <i class="bi bi-clock-history h1 mb-0 opacity-75"></i>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

                <!-- Liste des cartes -->
                <div class="card">
                    <div class="card-header">
                        <h5 class="card-title mb-0">
                            <i class="bi bi-grid me-2"></i>Vos cartes
                        </h5>
                    </div>
                    <div class="card-body">
                        <?php if (empty($maps)): ?>
                            <!-- Aucune carte -->
                            <div class="text-center py-5">
                                <i class="bi bi-folder-x display-1 text-muted mb-3"></i>
                                <h5 class="text-muted">Aucune carte trouvée</h5>
                                <p class="text-muted">Vous n'avez encore créé aucune carte. Commencez par créer votre premier projet !</p>
                                <a href="/projects/new" class="btn btn-primary">
                                    <i class="bi bi-plus-circle me-1"></i>Créer ma première carte
                                </a>
                            </div>
                        <?php else: ?>
                            <!-- Grille des cartes -->
                            <div class="row g-4">
                                <?php foreach ($maps as $map): ?>
                                    <div class="col-lg-4 col-md-6">
                                        <div class="card h-100 map-card" data-map-id="<?php echo $map['id']; ?>">
                                            <div class="card-body d-flex flex-column">
                                                <!-- En-tête de la carte -->
                                                <div class="d-flex align-items-start justify-content-between mb-3">
                                                    <div class="flex-grow-1">
                                                        <h6 class="card-title mb-1">
                                                            <?php echo htmlspecialchars($map['name']); ?>
                                                        </h6>
                                                        <small class="text-muted">
                                                            <i class="bi bi-calendar me-1"></i>
                                                            <?php echo date('d/m/Y H:i', strtotime($map['created_at'])); ?>
                                                        </small>
                                                    </div>
                                                    <div class="dropdown">
                                                        <button class="btn btn-sm btn-outline-secondary" type="button" data-bs-toggle="dropdown">
                                                            <i class="bi bi-three-dots-vertical"></i>
                                                        </button>
                                                        <ul class="dropdown-menu">
                                                            <li>
                                                                <a class="dropdown-item load-map-btn" href="#" data-map-id="<?php echo $map['id']; ?>">
                                                                    <i class="bi bi-folder-open me-2"></i>Charger
                                                                </a>
                                                            </li>
                                                            <li>
                                                                <a class="dropdown-item" href="#" onclick="duplicateMap(<?php echo $map['id']; ?>)">
                                                                    <i class="bi bi-copy me-2"></i>Dupliquer
                                                                </a>
                                                            </li>
                                                            <li>
                                                                <a class="dropdown-item" href="#" onclick="exportMap(<?php echo $map['id']; ?>)">
                                                                    <i class="bi bi-download me-2"></i>Exporter
                                                                </a>
                                                            </li>
                                                            <li><hr class="dropdown-divider"></li>
                                                            <li>
                                                                <a class="dropdown-item text-danger" href="#" onclick="deleteMap(<?php echo $map['id']; ?>, '<?php echo htmlspecialchars($map['name']); ?>')">
                                                                    <i class="bi bi-trash me-2"></i>Supprimer
                                                                </a>
                                                            </li>
                                                        </ul>
                                                    </div>
                                                </div>

                                                <!-- Informations de la carte -->
                                                <div class="mb-3">
                                                    <div class="row text-center">
                                                        <div class="col-6">
                                                            <small class="text-muted d-block">Dimensions</small>
                                                            <strong><?php echo $map['width']; ?> × <?php echo $map['height']; ?></strong>
                                                        </div>
                                                        <div class="col-6">
                                                            <small class="text-muted d-block">Taille</small>
                                                            <strong><?php echo number_format($map['width'] * $map['height']); ?> cases</strong>
                                                        </div>
                                                    </div>
                                                </div>

                                                <!-- Description -->
                                                <?php if (!empty($map['description'])): ?>
                                                    <p class="card-text small text-muted mb-3">
                                                        <?php echo htmlspecialchars(substr($map['description'], 0, 100)); ?>
                                                        <?php if (strlen($map['description']) > 100): ?>...<?php endif; ?>
                                                    </p>
                                                <?php endif; ?>

                                                <!-- Actions principales -->
                                                <div class="mt-auto">
                                                    <div class="d-grid gap-2">
                                                        <button class="btn btn-primary btn-sm load-map-btn" data-map-id="<?php echo $map['id']; ?>">
                                                            <i class="bi bi-folder-open me-1"></i>Charger cette carte
                                                        </button>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                <?php endforeach; ?>
                            </div>

                            <!-- Pagination -->
                            <div class="d-flex justify-content-center mt-4">
                                <nav aria-label="Navigation des cartes">
                                    <ul class="pagination">
                                        <li class="page-item disabled">
                                            <span class="page-link">Précédent</span>
                                        </li>
                                        <li class="page-item active">
                                            <span class="page-link">1</span>
                                        </li>
                                        <li class="page-item disabled">
                                            <span class="page-link">Suivant</span>
                                        </li>
                                    </ul>
                                </nav>
                            </div>
                        <?php endif; ?>
                    </div>
                </div>
            </div>
        </div>
    </div>
</main>

<!-- Modal de confirmation de suppression -->
<div class="modal fade" id="deleteModal" tabindex="-1">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title">
                    <i class="bi bi-exclamation-triangle text-warning me-2"></i>Confirmer la suppression
                </h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
            </div>
            <div class="modal-body">
                <p>Êtes-vous sûr de vouloir supprimer la carte <strong id="deleteMapName"></strong> ?</p>
                <p class="text-muted small">Cette action est irréversible.</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>

<script>
// Gestionnaire pour charger une carte
document.addEventListener('DOMContentLoaded', function() {
    // Gestionnaire pour les boutons "Charger cette carte"
    document.querySelectorAll('.load-map-btn').forEach(button => {
        button.addEventListener('click', function(e) {
            e.preventDefault();
            const mapId = this.getAttribute('data-map-id');

            // Redirection vers l'accueil avec l'ID de la carte à charger
            window.location.href = '/?load=' + mapId;
        });
    });
});

// Fonction pour dupliquer une carte
function duplicateMap(mapId) {
    if (confirm('Voulez-vous créer une copie de cette carte ?')) {
        // TODO: Implémenter la duplication via AJAX
        alert('Fonction de duplication à implémenter');
    }
}

// Fonction pour exporter une carte
function exportMap(mapId) {
    // TODO: Implémenter l'export
    alert('Fonction d\'export à implémenter');
}

// Fonction pour supprimer une carte
function deleteMap(mapId, mapName) {
    document.getElementById('deleteMapName').textContent = mapName;
    document.getElementById('confirmDeleteBtn').onclick = function() {
        // TODO: Implémenter la suppression via AJAX
        alert('Fonction de suppression à implémenter');
        document.getElementById('deleteModal').querySelector('[data-bs-dismiss="modal"]').click();
    };

    const modal = new bootstrap.Modal(document.getElementById('deleteModal'));
    modal.show();
}
</script>

<?php
include __DIR__ . '/../partials/footer.php';
?>