227 lines
15 KiB
PHP
227 lines
15 KiB
PHP
<?php
|
|
require_once 'db/config.php';
|
|
session_start();
|
|
$db = db();
|
|
|
|
$user_role = 'user';
|
|
if (isset($_SESSION['user_id'])) {
|
|
$stmt = $db->prepare("SELECT role FROM users WHERE id = ?");
|
|
$stmt->execute([$_SESSION['user_id']]);
|
|
$u_data = $stmt->fetch();
|
|
$user_role = $u_data['role'] ?? 'user';
|
|
}
|
|
|
|
$view = isset($_GET['view']) ? $_GET['view'] : 'sector';
|
|
$galaxy_id = isset($_GET['galaxy_id']) ? (int)$_GET['galaxy_id'] : 1;
|
|
$sector_id = isset($_GET['sector_id']) ? (int)$_GET['sector_id'] : 1;
|
|
|
|
// Fetch Dynamic Types and Statuses
|
|
$object_types_db = $db->query("SELECT * FROM celestial_object_types")->fetchAll(PDO::FETCH_ASSOC);
|
|
$statuses_db = $db->query("SELECT * FROM celestial_object_statuses")->fetchAll(PDO::FETCH_ASSOC);
|
|
|
|
$object_types_map = []; foreach($object_types_db as $ot) $object_types_map[$ot['slug']] = $ot;
|
|
$statuses_map = []; foreach($statuses_db as $s) $statuses_map[$s['slug']] = $s;
|
|
|
|
// Grid size: 6x6 = 36 slots per sector
|
|
$grid_size = 36;
|
|
|
|
// Mock Resources
|
|
$resources = [
|
|
'Metal' => ['val' => '136 053', 'max' => '1 210 000', 'prod' => '+1 980', 'icon' => 'fa-cube'],
|
|
'Crystal' => ['val' => '127 322', 'max' => '1 010 000', 'prod' => '+1 703', 'icon' => 'fa-gem'],
|
|
'Deuterium' => ['val' => '32 277', 'max' => '50 000', 'prod' => '+28', 'icon' => 'fa-flask'],
|
|
'Energy' => ['val' => '2 100', 'max' => '2 100', 'prod' => '', 'icon' => 'fa-bolt'],
|
|
'Dark Matter' => ['val' => '4 930', 'max' => '', 'prod' => '', 'icon' => 'fa-atom']
|
|
];
|
|
|
|
if ($view === 'sector') {
|
|
$stmt = $db->prepare("SELECT p.*, c.name as city_name, c.type as city_type FROM planets p LEFT JOIN cities c ON p.id = c.planet_id WHERE p.galaxy_id = ? AND p.sector_id = ? AND p.slot BETWEEN 1 AND ?");
|
|
$stmt->execute([$galaxy_id, $sector_id, $grid_size]);
|
|
$objects_raw = $stmt->fetchAll();
|
|
$grid = array_fill(1, $grid_size, null);
|
|
foreach ($objects_raw as $obj) { $grid[$obj['slot']] = $obj; }
|
|
|
|
$stmt = $db->prepare("SELECT name FROM sectors WHERE id = ?");
|
|
$stmt->execute([$sector_id]);
|
|
$sector_info = $stmt->fetch();
|
|
$sector_display_name = $sector_info['name'] ?? "Secteur $sector_id";
|
|
$page_title = "$sector_display_name [G$galaxy_id]";
|
|
} else {
|
|
$stmt = $db->prepare("SELECT sector_id, slot, status, type FROM planets WHERE galaxy_id = ? ORDER BY sector_id, slot ASC");
|
|
$stmt->execute([$galaxy_id]);
|
|
$all_planets = $stmt->fetchAll();
|
|
$sector_data = [];
|
|
$active_sectors = [];
|
|
foreach ($all_planets as $p) {
|
|
$sector_data[$p['sector_id']][$p['slot']] = ['status' => $p['status'], 'type' => $p['type']];
|
|
if (!in_array($p['sector_id'], $active_sectors)) { $active_sectors[] = (int)$p['sector_id']; }
|
|
}
|
|
$page_title = "Galaxie $galaxy_id";
|
|
}
|
|
|
|
function getStatusColor($status, $statuses_map) {
|
|
return $statuses_map[$status]['color'] ?? 'rgba(255,255,255,0.05)';
|
|
}
|
|
?>
|
|
<!DOCTYPE html>
|
|
<html lang="fr">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title><?php echo $page_title; ?></title>
|
|
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css" rel="stylesheet">
|
|
<link href="assets/css/custom.css?v=<?php echo time(); ?>" rel="stylesheet">
|
|
<style>
|
|
body { background: #000; margin: 0; padding: 0; font-family: Arial, sans-serif; color: #fff; background-image: radial-gradient(circle at 50% 50%, #1a2a4a 0%, #000 70%); background-attachment: fixed; }
|
|
#main-wrapper { display: flex; flex-direction: column; min-height: 100vh; background: rgba(0, 0, 0, 0.4); }
|
|
header#top-bar { padding: 10px; background: rgba(10, 15, 30, 0.95); border-bottom: 2px solid #2d3545; display: flex; flex-direction: column; align-items: center; gap: 10px; }
|
|
.resource-container { display: flex; gap: 10px; flex-wrap: wrap; justify-content: center; }
|
|
.user-auth-bar { width: 100%; display: flex; justify-content: flex-end; padding: 0 20px; box-sizing: border-box; font-size: 12px; margin-bottom: 5px; }
|
|
.user-auth-bar a { color: #88c0d0; text-decoration: none; margin-left: 15px; display: flex; align-items: center; gap: 5px; }
|
|
.user-auth-bar a:hover { text-decoration: underline; color: #fff; }
|
|
.user-auth-bar .username { color: #ebcb8b; font-weight: bold; }
|
|
.resource-box { background: #0a0a0a; border: 1px solid #3b4252; padding: 5px 15px; text-align: left; min-width: 140px; position: relative; }
|
|
.resource-box i { position: absolute; right: 10px; top: 50%; transform: translateY(-50%); opacity: 0.3; font-size: 20px; }
|
|
.resource-name { font-size: 10px; color: #8c92a3; text-transform: uppercase; }
|
|
.resource-value { font-size: 13px; font-weight: bold; color: #fff; }
|
|
.resource-prod { font-size: 10px; color: #22c55e; }
|
|
#game-container { flex-grow: 1; padding: 20px; display: flex; flex-direction: column; align-items: center; }
|
|
.nav-panel { background: rgba(20, 30, 50, 0.95); border: 1px solid #4c566a; padding: 15px; width: 200px; margin-bottom: 20px; box-shadow: 0 0 15px rgba(0,0,0,0.5); }
|
|
.nav-panel h3 { margin: 0 0 10px 0; font-size: 14px; text-transform: uppercase; color: #88c0d0; border-bottom: 1px solid #4c566a; padding-bottom: 5px; }
|
|
.nav-panel div { margin-bottom: 8px; font-size: 12px; }
|
|
.nav-panel label { display: inline-block; width: 60px; color: #8c92a3; }
|
|
.nav-panel input { width: 60px; background: #000; border: 1px solid #4c566a; color: #fff; padding: 2px 5px; text-align: center; }
|
|
.nav-panel button { width: 100%; background: #4c566a; border: none; color: #fff; padding: 5px; margin-top: 10px; cursor: pointer; text-transform: uppercase; font-weight: bold; }
|
|
.nav-panel button:hover { background: #5e81ac; }
|
|
.galaxy-map { background: rgba(0, 0, 0, 0.9); border: 2px solid #2d3545; padding: 1px; display: grid; grid-template-columns: repeat(6, 120px); grid-template-rows: repeat(6, 100px); gap: 1px; position: relative; }
|
|
.sector-grid { display: grid; grid-template-columns: repeat(6, 160px); grid-template-rows: repeat(6, 130px); gap: 10px; }
|
|
.sector-card { background: rgba(10, 15, 30, 0.9); border: 1px solid #3b4252; display: flex; flex-direction: column; align-items: center; justify-content: center; cursor: pointer; transition: all 0.2s; text-decoration: none; color: #fff; padding: 10px; position: relative; }
|
|
.sector-card:hover { border-color: #88c0d0; background: rgba(20, 30, 50, 0.95); transform: translateY(-2px); box-shadow: 0 0 15px rgba(136, 192, 208, 0.2); }
|
|
.sector-card.empty { opacity: 0.7; }
|
|
.mini-map { display: grid; grid-template-columns: repeat(6, 8px); gap: 2px; margin-bottom: 12px; background: rgba(0,0,0,0.7); padding: 5px; border: 1px solid #4c566a; }
|
|
.mini-dot { width: 8px; height: 8px; background: rgba(255,255,255,0.05); }
|
|
.slot { background: #050505; border: 1px solid #1a1a1a; display: flex; flex-direction: column; align-items: center; justify-content: center; position: relative; cursor: pointer; transition: all 0.2s; }
|
|
.slot:hover { background: #111; border-color: #3b82f6; z-index: 10; }
|
|
.slot-id { position: absolute; top: 2px; left: 5px; font-size: 9px; color: #444; }
|
|
.object-icon { font-size: 24px; margin-bottom: 5px; }
|
|
.object-name { font-size: 10px; font-weight: bold; color: #3b82f6; text-align: center; }
|
|
.object-status { font-size: 9px; color: #8c92a3; }
|
|
.city-label { font-size: 8px; color: #ebcb8b; margin-top: 2px; }
|
|
.legend { margin-top: 20px; background: rgba(10, 15, 30, 0.95); border: 1px solid #2d3545; padding: 10px 20px; display: flex; gap: 15px; font-size: 10px; flex-wrap: wrap; max-width: 1000px; justify-content: center; }
|
|
.legend-item { display: flex; align-items: center; gap: 5px; }
|
|
.dot { width: 8px; height: 8px; border-radius: 1px; }
|
|
.breadcrumb { margin-bottom: 20px; font-size: 14px; color: #88c0d0; }
|
|
.breadcrumb a { color: #fff; text-decoration: none; }
|
|
.breadcrumb a:hover { text-decoration: underline; }
|
|
.admin-footer { position: fixed; bottom: 0; left: 0; width: 100%; background: rgba(0,0,0,0.8); padding: 5px 20px; display: flex; justify-content: flex-end; gap: 15px; border-top: 1px solid #2d3545; }
|
|
.admin-footer a { color: #fff; text-decoration: none; font-size: 11px; font-weight: bold; padding: 5px 10px; border-radius: 3px; }
|
|
.btn-mj { background: #ebcb8b; color: #000 !important; }
|
|
.btn-adm { background: #bf616a; }
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div id="main-wrapper">
|
|
<header id="top-bar">
|
|
<div class="user-auth-bar">
|
|
<?php if (isset($_SESSION['user_id'])): ?>
|
|
<span>Bienvenue, <span class="username">@<?php echo htmlspecialchars($_SESSION['username']); ?></span></span>
|
|
<a href="profile.php"><i class="fa-solid fa-user-gear"></i> Profil</a>
|
|
<a href="auth.php?logout=1" style="color: #bf616a;"><i class="fa-solid fa-right-from-bracket"></i> Déconnexion</a>
|
|
<?php else: ?>
|
|
<a href="auth.php?page=login"><i class="fa-solid fa-right-to-bracket"></i> Connexion</a>
|
|
<a href="auth.php?page=register"><i class="fa-solid fa-user-plus"></i> S'inscrire</a>
|
|
<?php endif; ?>
|
|
</div>
|
|
<div class="resource-container">
|
|
<?php foreach($resources as $name => $res): ?>
|
|
<div class="resource-box">
|
|
<div class="resource-name"><?php echo $name; ?></div>
|
|
<div class="resource-value"><?php echo $res['val']; ?></div>
|
|
<div class="resource-prod"><?php echo $res['prod']; ?></div>
|
|
<i class="fa-solid <?php echo $res['icon']; ?>"></i>
|
|
</div>
|
|
<?php endforeach; ?>
|
|
</div>
|
|
</header>
|
|
|
|
<main id="game-container">
|
|
<div class="breadcrumb">
|
|
<a href="?view=galaxy&galaxy_id=<?php echo $galaxy_id; ?>">Galaxie <?php echo $galaxy_id; ?></a>
|
|
<?php if($view === 'sector'): ?> > <?php echo htmlspecialchars($sector_display_name); ?> <?php endif; ?>
|
|
</div>
|
|
|
|
<div style="display: flex; gap: 40px; align-items: flex-start; width: 100%; max-width: 1100px; justify-content: center;">
|
|
<div class="nav-panel">
|
|
<h3>Univers</h3>
|
|
<form method="GET"><input type="hidden" name="view" value="<?php echo $view; ?>">
|
|
<div><label>Galaxie</label><input type="number" name="galaxy_id" value="<?php echo $galaxy_id; ?>" min="1"></div>
|
|
<?php if($view === 'sector'): ?><div><label>Secteur</label><input type="number" name="sector_id" value="<?php echo $sector_id; ?>" min="1"></div><?php endif; ?>
|
|
<button type="submit">Localiser</button>
|
|
</form>
|
|
<?php if($view === 'sector'): ?><button onclick="location.href='?view=galaxy&galaxy_id=<?php echo $galaxy_id; ?>'" style="background: #3b4252; margin-top: 5px;">Vue Galaxie</button><?php endif; ?>
|
|
</div>
|
|
|
|
<?php if($view === 'sector'): ?>
|
|
<div class="galaxy-map">
|
|
<?php for($i=1; $i<=$grid_size; $i++): ?>
|
|
<div class="slot">
|
|
<span class="slot-id"><?php echo $i; ?></span>
|
|
<?php if (isset($grid[$i])): $obj = $grid[$i]; ?>
|
|
<div class="object-icon">
|
|
<?php
|
|
$icon = $object_types_map[$obj['type']]['icon'] ?? 'fa-earth-europe';
|
|
$color = getStatusColor($obj['status'], $statuses_map);
|
|
?>
|
|
<i class="fa-solid <?php echo $icon; ?>" style="color: <?php echo $color; ?>;"></i>
|
|
</div>
|
|
<span class="object-name"><?php echo htmlspecialchars($obj['name']); ?></span>
|
|
<span class="object-status"><?php echo $statuses_map[$obj['status']]['name'] ?? ucfirst($obj['status']); ?></span>
|
|
<?php if (!empty($obj['city_name'])): ?>
|
|
<span class="city-label"><i class="fa-solid fa-city"></i> <?php echo htmlspecialchars($obj['city_name']); ?></span>
|
|
<?php endif; ?>
|
|
<?php else: ?>
|
|
<div style="opacity: 0.05;"><i class="fa-solid fa-circle fa-sm"></i></div>
|
|
<?php endif; ?>
|
|
</div>
|
|
<?php endfor; ?>
|
|
</div>
|
|
<?php else: ?>
|
|
<div class="sector-grid">
|
|
<?php for($s=1; $s<=$grid_size; $s++): $isActive = in_array($s, $active_sectors); ?>
|
|
<a href="?view=sector&galaxy_id=<?php echo $galaxy_id; ?>§or_id=<?php echo $s; ?>" class="sector-card <?php echo $isActive ? '' : 'empty'; ?>">
|
|
<div class="mini-map">
|
|
<?php for($p=1; $p<=$grid_size; $p++):
|
|
$dotColor = 'rgba(255,255,255,0.05)';
|
|
if (isset($sector_data[$s][$p])) { $dotColor = getStatusColor($sector_data[$s][$p]['status'], $statuses_map); }
|
|
?>
|
|
<div class="mini-dot" style="background-color: <?php echo $dotColor; ?>;"></div>
|
|
<?php endfor; ?>
|
|
</div>
|
|
<div style="font-size: 10px; color: #88c0d0;">SECTEUR</div>
|
|
<div style="font-size: 20px; font-weight: bold;"><?php echo $s; ?></div>
|
|
<?php if($isActive): ?><div style="font-size: 8px; color: #a3be8c; margin-top: 5px;"><i class="fa-solid fa-check"></i> Actif</div>
|
|
<?php else: ?><div style="font-size: 8px; color: #4c566a; margin-top: 5px;">Inexploré</div><?php endif; ?>
|
|
</a>
|
|
<?php endfor; ?>
|
|
</div>
|
|
<?php endif; ?>
|
|
</div>
|
|
|
|
<div class="legend">
|
|
<?php foreach($statuses_db as $s): ?>
|
|
<div class="legend-item"><span class="dot" style="background: <?php echo $s['color']; ?>;"></span> <?php echo $s['name']; ?></div>
|
|
<?php endforeach; ?>
|
|
</div>
|
|
</main>
|
|
</div>
|
|
|
|
<?php if ($user_role === 'admin' || $user_role === 'gm'): ?>
|
|
<div class="admin-footer">
|
|
<a href="gm_console.php" target="_blank" class="btn-mj"><i class="fa-solid fa-headset"></i> CONSOLE MG</a>
|
|
<?php if ($user_role === 'admin'): ?>
|
|
<a href="admin.php" target="_blank" class="btn-adm"><i class="fa-solid fa-shield-halved"></i> CONSOLE ADMIN</a>
|
|
<?php endif; ?>
|
|
</div>
|
|
<?php endif; ?>
|
|
</body>
|
|
</html>
|