<?php
define('APP_NAME', 'Board Room');
define('APP_VERSION', '1.2');
define('APP_UPDATE_DATE', '2026/06/01');
define('APP_DESCRIPTION', '理事会ポータル — 共通パスワード閲覧');

require_once __DIR__ . '/lib/boardroom-auth.php';
require_once __DIR__ . '/lib/news-lib.php';
boardroom_session_start();

if (isset($_GET['logout'])) {
    boardroom_logout();
    header('Location: Board-Room.php');
    exit;
}

$loginError = '';
if ($_SERVER['REQUEST_METHOD'] === 'POST' && isset($_POST['boardroom_password'])) {
    $r = boardroom_login((string)$_POST['boardroom_password']);
    if ($r['ok']) {
        header('Location: Board-Room.php');
        exit;
    }
    $loginError = $r['message'];
}

$newsDir = __DIR__ . '/data/News-Archive/';
$files = is_dir($newsDir) ? glob($newsDir . '*.txt') : [];
if ($files) {
    rsort($files);
}

$newsList = [];
if ($files) {
    foreach ($files as $i => $file) {
        if ($i >= 3) {
            break;
        }
        $parsed = news_parse_file($file);
        $newsList[] = [
            'id'          => basename($file),
            'date'        => $parsed['date'],
            'title'       => $parsed['title'],
            'body'        => $parsed['body'],
            'categories'  => $parsed['categories'],
            'description' => $parsed['description'],
        ];
    }
}

$dataProtected = boardroom_path_is_protected('data');
$showLogin = $dataProtected && !boardroom_is_logged_in();
$folderHome = 'data/index.php';
?>
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Board Room — ウェルブ六甲道5番街1番館管理組合</title>
<style>
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

body {
  font-family: 'Hiragino Sans', 'Hiragino Kaku Gothic ProN', 'Noto Sans JP', sans-serif;
  background: #f2f4f8;
  color: #2a3050;
  font-size: 14px;
  line-height: 1.6;
}

a { color: #4a90e2; text-decoration: none; }
a:hover { text-decoration: underline; }

.top-strip {
  background: #142038;
  padding: 7px 32px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 12px;
  color: #5a6e90;
}
.top-strip a { color: #5a6e90; font-size: 12px; }
.top-strip a:hover { color: #a8c8f8; }
.top-strip-right { display: flex; gap: 20px; }

.site-header { background: #1a2744; padding: 28px 32px 24px; }
.header-inner { max-width: 1200px; margin: 0 auto; }
.header-brand { display: flex; align-items: flex-start; gap: 14px; margin-bottom: 18px; }
.header-icon {
  width: 48px; height: 48px; border-radius: 10px;
  background: rgba(74,144,226,0.2); border: 1px solid rgba(74,144,226,0.35);
  display: flex; align-items: center; justify-content: center;
  font-size: 22px; flex-shrink: 0;
}
.header-title { font-size: 20px; font-weight: 700; color: #fff; line-height: 1.35; letter-spacing: 0.02em; }
.header-desc { font-size: 12px; color: #7a90b8; margin-top: 6px; line-height: 1.7; }
.header-notice {
  background: rgba(255,255,255,0.06); border-left: 3px solid #4a90e2;
  border-radius: 6px; padding: 11px 14px; font-size: 12px; color: #8aa8cc; line-height: 1.75;
}
.header-notice strong { color: #c0d4f0; }

.status-bar { max-width: 1200px; margin: 0 auto; padding: 0 32px; }
.status-bar-inner {
  background: #fff; border: 1px solid #e4e7ef; border-top: none;
  border-radius: 0 0 10px 10px; padding: 10px 18px;
  display: flex; align-items: center; gap: 10px; font-size: 12px; flex-wrap: wrap;
}
.status-badge {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 4px 12px; border-radius: 20px; font-weight: 500; font-size: 12px;
}
.status-badge.public  { background: #eafaf1; color: #1e7e45; border: 1px solid #b8eed0; }
.status-badge.private { background: #f5f3ff; color: #6b3dbf; border: 1px solid #d8ccff; }
.status-badge.active  { font-weight: 700; }
.status-badge.inactive { opacity: 0.4; }
.status-login { margin-left: auto; font-size: 12px; color: #6b7280; }
.status-login a { color: #4a90e2; }

.page-wrap { max-width: 1200px; margin: 24px auto 48px; padding: 0 32px; }
.two-pane { display: grid; grid-template-columns: 1fr 180px; gap: 22px; align-items: start; }
.left-col  { display: flex; flex-direction: column; gap: 18px; }

.card { background: #fff; border: 1px solid #e4e7ef; border-radius: 12px; overflow: hidden; }
.card-header {
  padding: 13px 18px; border-bottom: 1px solid #f0f2f6;
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
}
.card-header-left { display: flex; align-items: center; gap: 8px; }
.card-title { font-size: 14px; font-weight: 600; color: #1a2744; }
.card-title-icon { font-size: 15px; }

.news-list { list-style: none; }
.news-item {
  display: flex; align-items: center; gap: 12px;
  padding: 11px 18px; border-bottom: 1px solid #f4f5f8; transition: background 0.12s;
}
.news-item:last-child { border-bottom: none; }
.news-item:hover { background: #f7f9ff; }
.news-date { font-size: 12px; color: #8a96b0; white-space: nowrap; font-variant-numeric: tabular-nums; flex-shrink: 0; }
.news-cats { display: flex; gap: 4px; flex-shrink: 0; }
.news-cat { display: inline-block; font-size: 11px; font-weight: 600; padding: 2px 8px; border-radius: 20px; background: #eef4ff; color: #4a90e2; white-space: nowrap; }
.news-title { font-size: 13px; color: #2a3050; flex: 1; min-width: 0; }
.news-desc { font-size: 12px; color: #7b8399; }
.news-link { font-size: 12px; flex-shrink: 0; }

.admin-links { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.admin-link {
  font-size: 11px; color: #6b7280; padding: 3px 9px;
  border-radius: 5px; background: #f4f5f7; border: 1px solid #e4e7ef; transition: background 0.1s;
}
.admin-link:hover { background: #eef4ff; color: #4a90e2; text-decoration: none; }

.side-col { display: flex; flex-direction: column; gap: 16px; }
.notice-card { background: #f5f3ff; border: 1px solid #e0d8ff; border-radius: 12px; padding: 15px 16px; }
.notice-card-title { font-size: 13px; font-weight: 600; color: #4a3080; margin-bottom: 7px; }
.notice-card p { font-size: 12px; color: #6a5090; line-height: 1.75; }

.folder-card { background: #fff; border: 1px solid #e4e7ef; border-radius: 12px; overflow: hidden; }

.iframe-toolbar {
  display: flex; align-items: center; gap: 8px;
  padding: 9px 14px; background: #f8f9fb; border-bottom: 1px solid #eef0f4;
}
.iframe-toolbar-btn {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 5px 13px; border-radius: 6px; border: 1px solid #dde1ea;
  background: #fff; color: #3a4060; font-size: 12px; font-weight: 500;
  cursor: pointer; transition: background 0.12s, border-color 0.12s;
  font-family: inherit;
}
.iframe-toolbar-btn:hover { background: #eef4ff; border-color: #4a90e2; color: #4a90e2; }
.iframe-toolbar-btn:disabled { opacity: 0.35; cursor: not-allowed; }
.iframe-toolbar-btn.home { background: #1a2744; color: #fff; border-color: #1a2744; }
.iframe-toolbar-btn.home:hover { background: #4a90e2; border-color: #4a90e2; }
.iframe-path {
  flex: 1; font-size: 12px; color: #8a93a8;
  padding: 4px 10px; background: #fff; border: 1px solid #e4e7ef;
  border-radius: 5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}

.folder-iframe { width: 100%; height: 620px; border: none; display: block; background: #fafbfc; }
.folder-locked-msg { padding: 40px 20px; text-align: center; color: #9aa0b8; font-size: 13px; }

.login-box { padding: 20px 18px; }
.login-box h3 { font-size: 14px; color: #1a2744; margin-bottom: 8px; }
.login-box p  { font-size: 13px; color: #6b7280; margin-bottom: 12px; }
.login-box label { display: block; font-size: 12px; font-weight: 600; color: #4a5070; margin-bottom: 5px; }
.login-box input[type=password] {
  width: 100%; padding: 9px 12px; font-size: 13px;
  border: 1px solid #d8dce8; border-radius: 7px; outline: none; background: #f8f9fb; margin-bottom: 10px;
}
.login-box input[type=password]:focus { border-color: #4a90e2; box-shadow: 0 0 0 3px rgba(74,144,226,0.12); }
.login-box button {
  padding: 9px 20px; background: #1a2744; color: #fff; border: none;
  border-radius: 7px; cursor: pointer; font-size: 13px; font-weight: 600; transition: background 0.15s; font-family: inherit;
}
.login-box button:hover { background: #4a90e2; }
.err { color: #c0392b; font-size: 12px; margin-bottom: 8px; }

.site-footer { background: #1a2744; padding: 20px 32px; text-align: center; font-size: 12px; color: #4a6080; }
.footer-inner { max-width: 1200px; margin: 0 auto; display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 10px; }
.footer-brand { display: flex; align-items: center; gap: 10px; color: #8aa8cc; }
.footer-brand img { height: 30px; vertical-align: middle; opacity: 0.85; }

@media (max-width: 860px) {
  .two-pane { grid-template-columns: 1fr; }
  .site-header, .status-bar, .page-wrap { padding-left: 16px; padding-right: 16px; }
  .top-strip { padding: 7px 16px; }
  .footer-inner { flex-direction: column; text-align: center; }
  .folder-iframe { height: 420px; }
}
</style>
</head>
<body>

<div class="top-strip">
  <span><?= htmlspecialchars(APP_NAME) ?> v<?= APP_VERSION ?></span>
  <div class="top-strip-right">
    <?php if (boardroom_is_logged_in()): ?>
      <span>ログイン中 — <a href="?logout=1">ログアウト</a></span>
    <?php elseif ($showLogin): ?>
      <a href="#folder-login">ログイン</a>
    <?php endif; ?>
    <a href="R-Scope-manual.php" target="_blank">📖 取扱説明</a>
    <a href="R-Scope.php" target="_blank">管理者</a>
  </div>
</div>

<header class="site-header">
  <div class="header-inner">
    <div class="header-brand">
      <div class="header-icon">🏢</div>
      <div>
        <div class="header-title">ウェルブ六甲道5番街1番館管理組合</div>
        <div class="header-desc">
          管理組合の議事録など様々な資料を閲覧することができます。<br>
          管理会社所管の業務を除き、理事会で作成した資料を保存しています。
        </div>
      </div>
    </div>
    <div class="header-notice">
      <strong>資料により閲覧制限があります。</strong>　規約に定める関係者で閲覧希望の方は理事会へ書面をもって申請して下さい。<br>
      内容については管理組合員・関係者のみ閲覧できます。関係者以外への公開は固く禁じます。
    </div>
  </div>
</header>

<div class="status-bar">
  <div class="status-bar-inner">
    <span class="status-badge public <?= !$dataProtected ? 'active' : 'inactive' ?>">📂 共有資料は公開状態です</span>
    <span class="status-badge private <?= $dataProtected ? 'active' : 'inactive' ?>">🔒 非公開です（閲覧にはパスワードが必要です）</span>
    <?php if (boardroom_is_logged_in()): ?>
      <span class="status-login">ログイン中 — <a href="?logout=1">ログアウト</a></span>
    <?php endif; ?>
  </div>
</div>

<div class="page-wrap">
  <div class="two-pane">
    <div class="left-col">

      <div class="card">
        <div class="card-header">
          <div class="card-header-left">
            <span class="card-title-icon">🔔</span>
            <span class="card-title">NEWS</span>
          </div>
          <div class="admin-links">
            <a href="data/file-lister.php?path=News-Archive" target="folder-frame" class="admin-link">📂 News Archive</a>
            <a href="news_edit.php" target="folder-frame" class="admin-link">📝 News Edit</a>
          </div>
        </div>
        <ul class="news-list">
          <?php foreach ($newsList as $n): ?>
          <li class="news-item">
            <span class="news-date"><?= htmlspecialchars($n['date']) ?></span>
            <span class="news-cats"><?= news_category_labels_html($n['categories']) ?></span>
            <span class="news-title">
              <?= htmlspecialchars($n['title']) ?>
              <?php if ($n['description'] !== ''): ?>
                <span class="news-desc"> — <?= htmlspecialchars($n['description']) ?></span>
              <?php endif; ?>
            </span>
            <a href="news_view.php?id=<?= urlencode($n['id']) ?>" target="folder-frame" class="news-link">View →</a>
          </li>
          <?php endforeach; ?>
        </ul>
      </div>

      <div class="folder-card">
        <div class="card-header">
          <div class="card-header-left">
            <span class="card-title-icon">📁</span>
            <span class="card-title">文書フォルダ</span>
          </div>
        </div>

        <?php if ($showLogin): ?>
          <div class="login-box" id="folder-login">
            <h3>🔒 パスワードが必要です</h3>
            <p>理事会関係者用パスワードを入力してください。</p>
            <?php if (!boardroom_has_password()): ?>
              <p class="err">パスワード未設定です。R-Scope で「🔑 理事会パスワード」を設定してください。</p>
            <?php else: ?>
              <?php if ($loginError !== ''): ?><p class="err"><?= htmlspecialchars($loginError) ?></p><?php endif; ?>
              <form method="post">
                <label>パスワード</label>
                <input type="password" name="boardroom_password" autofocus required autocomplete="current-password">
                <button type="submit">ログイン</button>
              </form>
            <?php endif; ?>
          </div>
          <div class="folder-locked-msg">🔒 ログイン後に文書フォルダが表示されます。</div>
        <?php else: ?>
          <div class="iframe-toolbar">
            <button class="iframe-toolbar-btn" id="btn-back"    onclick="iframeBack()"    disabled>◀ 戻る</button>
            <button class="iframe-toolbar-btn" id="btn-forward" onclick="iframeForward()" disabled>進む ▶</button>
            <button class="iframe-toolbar-btn home"             onclick="iframeHome()">🏠 フォルダ一覧に戻る</button>
            <span class="iframe-path" id="iframe-path"><?= htmlspecialchars($folderHome) ?></span>
          </div>
          <iframe
            id="folder-frame"
            name="folder-frame"
            src="<?= htmlspecialchars($folderHome) ?>"
            class="folder-iframe"
            onload="iframeOnLoad(this)"
          ></iframe>
        <?php endif; ?>
      </div>

    </div>

    <div class="side-col">
      <div class="notice-card">
        <div class="notice-card-title">🔒 非公開資料について</div>
        <p>鍵マークのフォルダはパスワードが必要です。閲覧希望の方は担当者まで申請して下さい。</p>
      </div>
      <div class="card">
        <div class="card-header">
          <div class="card-header-left">
            <span class="card-title-icon">ℹ️</span>
            <span class="card-title">このサイトについて</span>
          </div>
        </div>
        <div style="padding:13px 16px; font-size:12px; color:#6b7280; line-height:1.8;">
          <p><?= htmlspecialchars(APP_DESCRIPTION) ?></p>
          <p style="margin-top:6px; color:#9aa0b8;"><?= htmlspecialchars(APP_NAME) ?> v<?= APP_VERSION ?></p>
        </div>
      </div>
      <div class="card">
        <div class="card-header">
          <div class="card-header-left">
            <span class="card-title-icon">🔧</span>
            <span class="card-title">管理ツール</span>
          </div>
        </div>
        <div style="padding:12px 14px; display:flex; flex-direction:column; gap:6px;">
          <a href="data/file-lister.php" target="folder-frame" class="admin-link" style="display:block;">📋 Lister</a>
          <a href="R-Scope.php" target="_blank" class="admin-link" style="display:block;">🗂 R-Scope</a>
          <a href="R-Scope-manual.php" target="_blank" class="admin-link" style="display:block;">📖 取扱説明書</a>
          <a href="PROJECT-MAP.md" target="_blank" class="admin-link" style="display:block;">📋 構成マップ</a>
        </div>
      </div>
    </div>

  </div>
</div>

<footer class="site-footer">
  <div class="footer-inner">
    <div class="footer-brand">
      <img src="welv-logo-small-1-1.png" alt="Welv Logo">
      <span>ウェルブ六甲道5番街1番館管理組合</span>
    </div>
    <span><?= htmlspecialchars(APP_NAME) ?> v<?= APP_VERSION ?> — Session Login / .protected（Apache 不要）</span>
    <div class="footer-brand">
      <img src="ReNote_logo_64.png" alt="ReNote Consortium">
      <span>最終更新日：<?= APP_UPDATE_DATE ?></span>
    </div>
  </div>
</footer>

<?php if (!$showLogin): ?>
<script>
const HOME_URL = <?= json_encode($folderHome, JSON_UNESCAPED_SLASHES) ?>;
const frame    = document.getElementById('folder-frame');
const btnBack  = document.getElementById('btn-back');
const btnFwd   = document.getElementById('btn-forward');
const pathEl   = document.getElementById('iframe-path');

let stack    = [HOME_URL];
let stackIdx = 0;
let isNavigating = false;

function iframeNormalizeUrl(url) {
  if (!url || typeof url !== 'string') return null;
  try {
    const u = new URL(url, window.location.href);
    if (u.protocol === 'chrome-error:' || u.protocol === 'about:') return null;
    if (u.origin !== window.location.origin) return null;
    return u.pathname + u.search;
  } catch (e) {
    return null;
  }
}

function iframeSetPathLabel(path) {
  pathEl.textContent = path || HOME_URL;
}

function updateButtons() {
  btnBack.disabled = (stackIdx <= 0);
  btnFwd.disabled  = (stackIdx >= stack.length - 1);
}

function iframeOnLoad(f) {
  if (isNavigating) {
    isNavigating = false;
    return;
  }
  let href = '';
  try {
    href = f.contentWindow.location.href;
  } catch (e) {
    return;
  }
  const norm = iframeNormalizeUrl(href);
  if (!norm) return;
  const current = iframeNormalizeUrl(stack[stackIdx]) || stack[stackIdx];
  if (norm === current) return;
  stack = stack.slice(0, stackIdx + 1);
  stack.push(norm);
  stackIdx++;
  iframeSetPathLabel(norm);
  updateButtons();
}

function iframeGoTo(path) {
  const norm = iframeNormalizeUrl(path) || path;
  if (!norm) return;
  isNavigating = true;
  frame.src = norm;
  iframeSetPathLabel(norm);
}

function iframeBack() {
  if (stackIdx <= 0) return;
  stackIdx--;
  iframeGoTo(stack[stackIdx]);
  updateButtons();
}

function iframeForward() {
  if (stackIdx >= stack.length - 1) return;
  stackIdx++;
  iframeGoTo(stack[stackIdx]);
  updateButtons();
}

function iframeHome() {
  stack    = [HOME_URL];
  stackIdx = 0;
  iframeGoTo(HOME_URL);
  updateButtons();
}
</script>
<?php endif; ?>

</body>
</html>
