Newer
Older
2025-shino / archive.html
<!DOCTYPE html>
<html lang="ja">
<head>
  <meta charset="UTF-8">
  <title>グループ履歴アーカイブ</title>
  <meta name="viewport" content="width=device-width, initial-scale=1.0">

  <link rel="stylesheet" href="style.css">
  <link rel="stylesheet" href="https://unpkg.com/leaflet/dist/leaflet.css">

  <script src="https://unpkg.com/leaflet/dist/leaflet.js"></script>
  <script src="https://cdn.jsdelivr.net/npm/@supabase/supabase-js"></script>
</head>

<body class="fadeIn">

  <div id="header" class="fadeInUp">
    <div id="groupNameBox">
      <b>アーカイブ閲覧モード</b><br>
      グループ:<span id="groupName"></span><br>
      ホスト:<span id="hostName"></span>
    </div>

    <button id="backBtn" class="exit-btn cute">戻る</button>
  </div>

  <div class="map-body">

    <!-- 左(情報) -->
    <div class="member-area card fadeInUp">

      <h3>過去の位置履歴(最後の位置)</h3>
      <ul id="memberList"></ul>

      <h3>最終待ち合わせ</h3>
      <div id="lastTarget">読み込み中…</div>

    </div>

    <!-- 右(地図) -->
    <div class="map-area fadeInUp">
      <div id="map"></div>

      <h3>チャット履歴</h3>
      <div id="chatList" style="height:260px;"></div>
    </div>

  </div>

  <script src="archive.js"></script>
</body>
</html>