141 lines
4.2 KiB
HTML
141 lines
4.2 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="fr">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Cyber Dashboard</title>
|
|
<link rel="stylesheet" href="style.css">
|
|
</head>
|
|
<body>
|
|
|
|
<!-- Notification overlay (ANSSI / geo) -->
|
|
<div id="notif-overlay" class="hidden">
|
|
<div id="notif-content">
|
|
<div id="notif-icon">ⓘ</div>
|
|
<div id="notif-message"></div>
|
|
<div id="notif-bar"><div id="notif-bar-inner"></div></div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Alert overlay -->
|
|
<div id="alert-overlay" class="hidden">
|
|
<div id="alert-content">
|
|
<div id="alert-icon">⚠</div>
|
|
<div id="alert-image"></div>
|
|
<div id="alert-message"></div>
|
|
<div id="alert-html"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Header -->
|
|
<header>
|
|
<div class="header-left">
|
|
<span class="logo">■ CYBER DASHBOARD</span>
|
|
</div>
|
|
<div class="header-right">
|
|
<span id="header-clock"></span>
|
|
</div>
|
|
</header>
|
|
|
|
<!-- Dashboard grid -->
|
|
<main class="grid">
|
|
|
|
<!-- Widget 1: Kaspersky Live Map -->
|
|
<section class="widget" id="widget-kaspersky">
|
|
<div class="widget-header">
|
|
<span class="widget-title">KASPERSKY CYBERMAP</span>
|
|
<span class="widget-status ok">LIVE</span>
|
|
</div>
|
|
<div class="widget-body iframe-container">
|
|
<iframe
|
|
src="https://cybermap.kaspersky.com/en/widget/dynamic/dark"
|
|
frameborder="0"
|
|
title="Kaspersky Cybermap"
|
|
></iframe>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Widget 2: ANSSI / CERT-FR -->
|
|
<section class="widget" id="widget-anssi">
|
|
<div class="widget-header">
|
|
<span class="widget-title">CERT-FR / ANSSI</span>
|
|
<span class="widget-status" id="anssi-status">...</span>
|
|
</div>
|
|
<div class="widget-body">
|
|
<ul id="anssi-list" class="feed-list">
|
|
<li class="feed-loading">Chargement...</li>
|
|
</ul>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Widget 3: Géopolitique -->
|
|
<section class="widget" id="widget-geo">
|
|
<div class="widget-header">
|
|
<span class="widget-title">SITUATION GÉOPOLITIQUE</span>
|
|
<span class="widget-status" id="geo-status">...</span>
|
|
</div>
|
|
<div class="widget-body">
|
|
<ul id="geo-list" class="feed-list">
|
|
<li class="feed-loading">Chargement...</li>
|
|
</ul>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Widget 6: Emploi du temps -->
|
|
<section class="widget" id="widget-calendar">
|
|
<div class="widget-header">
|
|
<span class="widget-title">EMPLOI DU TEMPS</span>
|
|
<span class="widget-status" id="cal-status">...</span>
|
|
</div>
|
|
<div class="widget-body">
|
|
<ul id="cal-list" class="feed-list">
|
|
<li class="feed-loading">Chargement...</li>
|
|
</ul>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Widget 5: Root-me ranking -->
|
|
<section class="widget" id="widget-placeholder">
|
|
<div class="widget-header">
|
|
<span class="widget-title">ROOT-ME RANKING</span>
|
|
<span class="widget-status" id="rootme-status">...</span>
|
|
</div>
|
|
<div class="widget-body">
|
|
<ul id="rootme-list" class="feed-list">
|
|
<li class="feed-loading">Chargement...</li>
|
|
</ul>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Widget 4: Clock + server info -->
|
|
<section class="widget" id="widget-clock">
|
|
<div class="widget-header">
|
|
<span class="widget-title">SYSTÈME</span>
|
|
<span class="widget-status" id="ws-status">WS...</span>
|
|
</div>
|
|
<div class="widget-body clock-widget">
|
|
<div id="clock-time"></div>
|
|
<div id="clock-date"></div>
|
|
<div class="server-info">
|
|
<div class="info-row">
|
|
<span class="info-label">SERVEUR</span>
|
|
<span class="info-value" id="info-host"></span>
|
|
</div>
|
|
<div class="info-row">
|
|
<span class="info-label">WEBSOCKET</span>
|
|
<span class="info-value" id="info-ws"></span>
|
|
</div>
|
|
<div class="info-row">
|
|
<span class="info-label">ALERTE</span>
|
|
<span class="info-value" id="info-alert">INACTIVE</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
</main>
|
|
|
|
<script src="app.js"></script>
|
|
</body>
|
|
</html>
|