🎯 g5se 온라인 가위바위보 토너먼트 - 실시간 대진표 & 우승자 기록

g5se가 설치된 디렉터리(루트에 `index.php`·`app/`이 있는 곳)에서 작업을 시작합니다. (g5se 설치는 https://github.com/gnuboard/g5se 참고)

**1단계: 기본 페이지 골격 생성**

`app/modules/rps-tournament/index.php` 파일을 생성하고 다음 내용을 작성하세요:

```php
<?php
include_once('./_common.php');

// SQLite DB 초기화
@mkdir(G5_DATA_PATH.'/modules', 0707, true);
$db_path = G5_DATA_PATH.'/modules/rps_tournament.sqlite';
$db = new PDO('sqlite:'.$db_path);
$db->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);

// 테이블 생성 (첫 접근 시)
$db->exec("
    CREATE TABLE IF NOT EXISTS tournaments (
        id INTEGER PRIMARY KEY AUTOINCREMENT,
        name TEXT NOT NULL,
        player_count INTEGER NOT NULL,
        status TEXT DEFAULT 'ongoing',
        winner_name TEXT,
        created_at DATETIME DEFAULT CURRENT_TIMESTAMP
    )
");

$db->exec("
    CREATE TABLE IF NOT EXISTS matches (
        id INTEGER PRIMARY KEY AUTOINCREMENT,
        tournament_id INTEGER NOT NULL,
        round INTEGER NOT NULL,
        match_number INTEGER NOT NULL,
        player1_name TEXT,
        player2_name TEXT,
        player1_choice TEXT,
        player2_choice TEXT,
        winner_name TEXT,
        FOREIGN KEY(tournament_id) REFERENCES tournaments(id)
    )
");

require_once(G5_THEME_PATH.'/modern/_head.inc.php');
include_once('./head.sub.php');
?>
<div class="m-shell">
    <?php require G5_THEME_PATH.'/modern/_nav.inc.php'; ?>
    <main class="m-container" style="padding: 32px 20px 48px;">
        <style>
            .tournament-header {
                text-align: center;
                margin-bottom: 40px;
            }
            .tournament-header h1 {
                font-size: 2rem;
                font-weight: 700;
                color: var(--m-text);
                margin-bottom: 8px;
            }
            .tournament-header p {
                font-size: 1rem;
                color: var(--m-text-muted);
            }
            .tab-buttons {
                display: flex;
                gap: 12px;
                justify-content: center;
                margin-bottom: 32px;
            }
            .tab-btn {
                padding: 12px 24px;
                background: var(--m-surface);
                border: 2px solid #e0e0e0;
                border-radius: var(--m-radius-lg);
                font-weight: 600;
                cursor: pointer;
                transition: all 0.2s;
            }
            .tab-btn.active {
                background: #4CAF50;
                color: white;
                border-color: #4CAF50;
            }
            .content-section {
                display: none;
            }
            .content-section.active {
                display: block;
            }
            .create-form {
                max-width: 500px;
                margin: 0 auto;
                padding: 32px;
                background: var(--m-surface);
                border-radius: var(--m-radius-lg);
                box-shadow: var(--m-shadow);
            }
            .form-group {
                margin-bottom: 20px;
            }
            .form-group label {
                display: block;
                font-weight: 600;
                margin-bottom: 8px;
                color: var(--m-text);
            }
            .form-group input, .form-group select, .form-group textarea {
                width: 100%;
                padding: 12px;
                border: 2px solid #e0e0e0;
                border-radius: 8px;
                font-size: 1rem;
                background: var(--m-surface);
                color: var(--m-text);
            }
            .form-group textarea {
                min-height: 120px;
                resize: vertical;
            }
            .submit-btn {
                width: 100%;
                padding: 14px;
                background: #4CAF50;
                color: white;
                border: none;
                border-radius: 8px;
                font-size: 1.1rem;
                font-weight: 700;
                cursor: pointer;
                transition: background 0.2s;
            }
            .submit-btn:hover {
                background: #45a049;
            }
        </style>

        <div class="tournament-header">
            <h1>🎯 가위바위보 토너먼트</h1>
            <p>친구들과 함께 즐기는 실시간 대진표 & 우승자 기록</p>
        </div>

        <div class="tab-buttons">
            <button class="tab-btn active" onclick="showTab('create')">새 토너먼트</button>
            <button class="tab-btn" onclick="showTab('ongoing')">진행 중</button>
            <button class="tab-btn" onclick="showTab('archive')">명예의 전당</button>
        </div>

        <div id="create-section" class="content-section active">
            <form method="POST" class="create-form">
                <input type="hidden" name="action" value="create_tournament">
                <div class="form-group">
                    <label>토너먼트 이름</label>
                    <input type="text" name="tournament_name" placeholder="예: 2024 봄 챔피언십" required>
                </div>
                <div class="form-group">
                    <label>참가자 수</label>
                    <select name="player_count" required>
                        <option value="4">4명 (2라운드)</option>
                        <option value="8">8명 (3라운드)</option>
                        <option value="16">16명 (4라운드)</option>
                    </select>
                </div>
                <div class="form-group">
                    <label>참가자 이름 (한 줄에 한 명씩)</label>
                    <textarea name="player_names" placeholder="홍길동\n김철수\n이영희\n박민수" required></textarea>
                </div>
                <button type="submit" class="submit-btn">🚀 토너먼트 시작</button>
            </form>
        </div>

        <div id="ongoing-section" class="content-section">
            <p style="text-align:center; color: var(--m-text-muted);">진행 중인 토너먼트가 없습니다.</p>
        </div>

        <div id="archive-section" class="content-section">
            <p style="text-align:center; color: var(--m-text-muted);">완료된 토너먼트가 없습니다.</p>
        </div>

        <script>
            function showTab(tab) {
                document.querySelectorAll('.tab-btn').forEach(btn => btn.classList.remove('active'));
                document.querySelectorAll('.content-section').forEach(sec => sec.classList.remove('active'));
                
                event.target.classList.add('active');
                document.getElementById(tab + '-section').classList.add('active');
            }
        </script>
    </main>
    <?php require G5_THEME_PATH.'/modern/_footer.inc.php'; ?>
</div>
<?php include_once('./tail.sub.php'); ?>
```

이 파일은 자동으로 `/rps-tournament` URL에 매핑됩니다.

**2단계: 토너먼트 생성 & 대진표 자동 생성 로직 구현**

`app/modules/rps-tournament/index.php` 파일의 `include_once('./_common.php');` 바로 아래에 다음 로직을 추가하세요:

```php
// 토너먼트 생성 처리
if ($_SERVER['REQUEST_METHOD'] === 'POST' && isset($_POST['action']) && $_POST['action'] === 'create_tournament') {
    $tournament_name = trim($_POST['tournament_name']);
    $player_count = (int)$_POST['player_count'];
    $player_names = array_filter(array_map('trim', explode("\n", $_POST['player_names'])));
    
    if (count($player_names) !== $player_count) {
        echo "<script>alert('참가자 수가 맞지 않습니다. {$player_count}명을 입력해주세요.'); history.back();</script>";
        exit;
    }
    
    // 토너먼트 생성
    $stmt = $db->prepare("INSERT INTO tournaments (name, player_count, status) VALUES (?, ?, 'ongoing')");
    $stmt->execute([$tournament_name, $player_count]);
    $tournament_id = $db->lastInsertId();
    
    // 1라운드 대진 생성 (순서대로 매칭)
    shuffle($player_names); // 무작위 배치
    $match_number = 1;
    for ($i = 0; $i < count($player_names); $i += 2) {
        $stmt = $db->prepare("
            INSERT INTO matches (tournament_id, round, match_number, player1_name, player2_name)
            VALUES (?, 1, ?, ?, ?)
        ");
        $stmt->execute([$tournament_id, $match_number, $player_names[$i], $player_names[$i+1]]);
        $match_number++;
    }
    
    echo "<script>alert('토너먼트가 생성되었습니다!'); location.href='/rps-tournament';</script>";
    exit;
}
```

그리고 "진행 중" 탭 섹션을 다음과 같이 수정하세요:

```php
<div id="ongoing-section" class="content-section">
    <style>
        .tournament-list {
            display: grid;
            gap: 20px;
            max-width: 800px;
            margin: 0 auto;
        }
        .tournament-card {
            padding: 24px;
            background: var(--m-surface);
            border-radius: var(--m-radius-lg);
            box-shadow: var(--m-shadow);
        }
        .tournament-card h3 {
            font-size: 1.3rem;
            font-weight: 700;
            color: var(--m-text);
            margin-bottom: 12px;
        }
        .tournament-meta {
            display: flex;
            gap: 16px;
            font-size: 0.9rem;
            color: var(--m-text-muted);
            margin-bottom: 16px;
        }
        .view-bracket-btn {
            display: inline-block;
            padding: 10px 20px;
            background: #2196F3;
            color: white;
            border-radius: 8px;
            text-decoration: none;
            font-weight: 600;
            transition: background 0.2s;
        }
        .view-bracket-btn:hover {
            background: #1976D2;
        }
    </style>
    
    <?php
    $stmt = $db->query("SELECT * FROM tournaments WHERE status = 'ongoing' ORDER BY created_at DESC");
    $ongoing = $stmt->fetchAll(PDO::FETCH_ASSOC);
    
    if (empty($ongoing)) {
        echo '<p style="text-align:center; color: var(--m-text-muted);">진행 중인 토너먼트가 없습니다.</p>';
    } else {
        echo '<div class="tournament-list">';
        foreach ($ongoing as $t) {
            $created = date('Y-m-d H:i', strtotime($t['created_at']));
            echo "
                <div class='tournament-card'>
                    <h3>🏆 ".htmlspecialchars($t['name'])."</h3>
                    <div class='tournament-meta'>
                        <span>👥 {$t['player_count']}명</span>
                        <span>📅 {$created}</span>
                    </div>
                    <a href='/rps-tournament?view={$t['id']}' class='view-bracket-btn'>대진표 보기</a>
                </div>
            ";
        }
        echo '</div>';
    }
    ?>
</div>
```

**3단계: 토너먼트 대진표 시각화 & 경기 결과 입력 UI**

`app/modules/rps-tournament/index.php` 파일의 `// SQLite DB 초기화` 섹션 바로 아래에 다음 로직을 추가하세요:

```php
// 특정 토너먼트 조회
if (isset($_GET['view'])) {
    $tournament_id = (int)$_GET['view'];
    $stmt = $db->prepare("SELECT * FROM tournaments WHERE id = ?");
    $stmt->execute([$tournament_id]);
    $tournament = $stmt->fetch(PDO::FETCH_ASSOC);
    
    if (!$tournament) {
        echo "<script>alert('존재하지 않는 토너먼트입니다.'); location.href='/rps-tournament';</script>";
        exit;
    }
    
    // 라운드별 경기 조회
    $stmt = $db->prepare("SELECT * FROM matches WHERE tournament_id = ? ORDER BY round, match_number");
    $stmt->execute([$tournament_id]);
    $all_matches = $stmt->fetchAll(PDO::FETCH_ASSOC);
    
    $rounds = [];
    foreach ($all_matches as $m) {
        $rounds[$m['round']][] = $m;
    }
    
    require_once(G5_THEME_PATH.'/modern/_head.inc.php');
    include_once('./head.sub.php');
    ?>
    <div class="m-shell">
        <?php require G5_THEME_PATH.'/modern/_nav.inc.php'; ?>
        <main class="m-container" style="padding: 32px 20px 48px;">
            <style>
                .bracket-header {
                    text-align: center;
                    margin-bottom: 32px;
                }
                .bracket-header h1 {
                    font-size: 1.8rem;
                    font-weight: 700;
                    color: var(--m-text);
                    margin-bottom: 8px;
                }
                .bracket-header .status-badge {
                    display: inline-block;
                    padding: 6px 16px;
                    background: #4CAF50;
                    color: white;
                    border-radius: 20px;
                    font-size: 0.9rem;
                    font-weight: 600;
                }
                .rounds-container {
                    display: flex;
                    gap: 32px;
                    overflow-x: auto;
                    padding: 20px;
                    justify-content: center;
                }
                .round-column {
                    min-width: 280px;
                }
                .round-title {
                    text-align: center;
                    font-size: 1.1rem;
                    font-weight: 700;
                    color: var(--m-text);
                    margin-bottom: 20px;
                }
                .match-card {
                    padding: 16px;
                    background: var(--m-surface);
                    border: 2px solid #e0e0e0;
                    border-radius: var(--m-radius-lg);
                    margin-bottom: 16px;
                }
                .match-card.completed {
                    border-color: #4CAF50;
                }
                .player-row {
                    display: flex;
                    justify-content: space-between;
                    align-items: center;
                    padding: 10px;
                    margin-bottom: 8px;
                    background: rgba(0,0,0,0.02);
                    border-radius: 6px;
                }
                .player-row.winner {
                    background: #4CAF50;
                    color: white;
                    font-weight: 700;
                }
                .player-name {
                    font-weight: 600;
                }
                .rps-buttons {
                    display: flex;
                    gap: 8px;
                    margin-top: 12px;
                }
                .rps-btn {
                    flex: 1;
                    padding: 8px;
                    background: #2196F3;
                    color: white;
                    border: none;
                    border-radius: 6px;
                    cursor: pointer;
                    font-size: 1.2rem;
                    transition: background 0.2s;
                }
                .rps-btn:hover {
                    background: #1976D2;
                }
            </style>

            <div class="bracket-header">
                <h1>🏆 <?php echo htmlspecialchars($tournament['name']); ?></h1>
                <span class="status-badge"><?php echo $tournament['status'] === 'ongoing' ? '진행 중' : '완료'; ?></span>
            </div>

            <div class="rounds-container">
                <?php
                $round_names = [1 => '1라운드', 2 => '준결승', 3 => '준준결승', 4 => '16강'];
                foreach ($rounds as $round_num => $matches) {
                    echo "<div class='round-column'>";
                    echo "<div class='round-title'>{$round_names[$round_num]}</div>";
                    
                    foreach ($matches as $match) {
                        $is_completed = !empty($match['winner_name']);
                        echo "<div class='match-card ".($is_completed ? 'completed' : '').">";
                        
                        // Player 1
                        $p1_winner = ($match['winner_name'] === $match['player1_name']);
                        echo "<div class='player-row ".($p1_winner ? 'winner' : '').">";
                        echo "<span class='player-name'>".htmlspecialchars($match['player1_name']).".";
                        if ($match['player1_choice']) echo " (".htmlspecialchars($match['player1_choice']).")";
                        echo "</span>";
                        if ($p1_winner) echo "<span>🏆</span>";
                        echo "</div>";
                        
                        // Player 2
                        $p2_winner = ($match['winner_name'] === $match['player2_name']);
                        echo "<div class='player-row ".($p2_winner ? 'winner' : '').">";
                        echo "<span class='player-name'>".htmlspecialchars($match['player2_name']).".";
                        if ($match['player2_choice']) echo " (".htmlspecialchars($match['player2_choice']).")";
                        echo "</span>";
                        if ($p2_winner) echo "<span>🏆</span>";
                        echo "</div>";
                        
                        // 결과 입력 버튼 (미완료 경기만)
                        if (!$is_completed) {
                            echo "
                                <form method='POST' style='margin-top: 12px;'>
                                    <input type='hidden' name='action' value='set_result'>
                                    <input type='hidden' name='match_id' value='{$match['id']}'>
                                    <input type='hidden' name='tournament_id' value='{$tournament_id}'>
                                    <div style='margin-bottom: 8px; font-size: 0.9rem; color: var(--m-text-muted);'>Player 1 선택:</div>
                                    <div class='rps-buttons'>
                                        <button type='submit' name='p1_choice' value='가위' class='rps-btn'>✌️</button>
                                        <button type='submit' name='p1_choice' value='바위' class='rps-btn'>✊</button>
                                        <button type='submit' name='p1_choice' value='보' class='rps-btn'>🖐</button>
                                    </div>
                                    <div style='margin: 12px 0 8px; font-size: 0.9rem; color: var(--m-text-muted);'>Player 2 선택:</div>
                                    <div class='rps-buttons'>
                                        <button type='submit' name='p2_choice' value='가위' class='rps-btn'>✌️</button>
                                        <button type='submit' name='p2_choice' value='바위' class='rps-btn'>✊</button>
                                        <button type='submit' name='p2_choice' value='보' class='rps-btn'>🖐</button>
                                    </div>
                                </form>
                            ";
                        }
                        
                        echo "</div>";
                    }
                    
                    echo "</div>";
                }
                ?>
            </div>

            <div style="text-align: center; margin-top: 32px;">
                <a href="/rps-tournament" style="display: inline-block; padding: 12px 24px; background: var(--m-surface); border: 2px solid #e0e0e0; border-radius: 8px; text-decoration: none; color: var(--m-text); font-weight: 600;">← 목록으로</a>
            </div>
        </main>
        <?php require G5_THEME_PATH.'/modern/_footer.inc.php'; ?>
    </div>
    <?php
    include_once('./tail.sub.php');
    exit;
}
```

이제 "대진표 보기" 버튼을 클릭하면 라운드별 경기 목록과 결과 입력 버튼이 표시됩니다.

**4단계: 경기 결과 처리 & 다음 라운드 자동 생성 로직**

`app/modules/rps-tournament/index.php` 파일의 토너먼트 생성 로직 바로 아래에 다음 코드를 추가하세요:

```php
// 경기 결과 입력 처리
if ($_SERVER['REQUEST_METHOD'] === 'POST' && isset($_POST['action']) && $_POST['action'] === 'set_result') {
    $match_id = (int)$_POST['match_id'];
    $tournament_id = (int)$_POST['tournament_id'];
    $p1_choice = $_POST['p1_choice'] ?? null;
    $p2_choice = $_POST['p2_choice'] ?? null;
    
    if (!$p1_choice || !$p2_choice) {
        echo "<script>alert('양쪽 선택을 모두 입력해주세요.'); history.back();</script>";
        exit;
    }
    
    // 경기 정보 조회
    $stmt = $db->prepare("SELECT * FROM matches WHERE id = ?");
    $stmt->execute([$match_id]);
    $match = $stmt->fetch(PDO::FETCH_ASSOC);
    
    // 승자 결정 로직
    $winner = null;
    if ($p1_choice === $p2_choice) {
        echo "<script>alert('무승부입니다! 다시 선택해주세요.'); history.back();</script>";
        exit;
    } elseif (
        ($p1_choice === '가위' && $p2_choice === '보') ||
        ($p1_choice === '바위' && $p2_choice === '가위') ||
        ($p1_choice === '보' && $p2_choice === '바위')
    ) {
        $winner = $match['player1_name'];
    } else {
        $winner = $match['player2_name'];
    }
    
    // 경기 결과 업데이트
    $stmt = $db->prepare("
        UPDATE matches SET player1_choice = ?, player2_choice = ?, winner_name = ?
        WHERE id = ?
    ");
    $stmt->execute([$p1_choice, $p2_choice, $winner, $match_id]);
    
    // 현재 라운드의 모든 경기가 완료되었는지 확인
    $stmt = $db->prepare("
        SELECT COUNT(*) as total, SUM(CASE WHEN winner_name IS NOT NULL THEN 1 ELSE 0 END) as completed
        FROM matches WHERE tournament_id = ? AND round = ?
    ");
    $stmt->execute([$tournament_id, $match['round']]);
    $round_status = $stmt->fetch(PDO::FETCH_ASSOC);
    
    // 라운드 완료 시 다음 라운드 생성
    if ($round_status['total'] == $round_status['completed']) {
        // 현재 라운드 승자 목록
        $stmt = $db->prepare("SELECT winner_name FROM matches WHERE tournament_id = ? AND round = ? ORDER BY match_number");
        $stmt->execute([$tournament_id, $match['round']]);
        $winners = $stmt->fetchAll(PDO::FETCH_COLUMN);
        
        if (count($winners) === 1) {
            // 최종 우승자 결정
            $stmt = $db->prepare("UPDATE tournaments SET status = 'completed', winner_name = ? WHERE id = ?");
            $stmt->execute([$winners[0], $tournament_id]);
            
            echo "<script>alert('🎉 우승자: {$winners[0]}'); location.href='/rps-tournament?view={$tournament_id}';</script>";
            exit;
        } else {
            // 다음 라운드 생성
            $next_round = $match['round'] + 1;
            $match_number = 1;
            for ($i = 0; $i < count($winners); $i += 2) {
                $stmt = $db->prepare("
                    INSERT INTO matches (tournament_id, round, match_number, player1_name, player2_name)
                    VALUES (?, ?, ?, ?, ?)
                ");
                $stmt->execute([$tournament_id, $next_round, $match_number, $winners[$i], $winners[$i+1]]);
                $match_number++;
            }
        }
    }
    
    echo "<script>location.href='/rps-tournament?view={$tournament_id}';</script>";
    exit;
}
```

이제 경기 결과를 입력하면 승자가 자동으로 결정되고, 라운드가 완료되면 다음 라운드가 자동 생성됩니다.

**5단계: 명예의 전당 구현 & 모바일 반응형 디자인**

`app/modules/rps-tournament/index.php` 파일의 "명예의 전당" 탭 섹션을 다음과 같이 수정하세요:

```php
<div id="archive-section" class="content-section">
    <style>
        .hall-of-fame {
            max-width: 900px;
            margin: 0 auto;
        }
        .champion-card {
            display: flex;
            align-items: center;
            gap: 24px;
            padding: 24px;
            background: var(--m-surface);
            border-radius: var(--m-radius-lg);
            box-shadow: var(--m-shadow);
            margin-bottom: 20px;
            border-left: 6px solid #FFD700;
        }
        .champion-trophy {
            font-size: 3rem;
        }
        .champion-info h3 {
            font-size: 1.4rem;
            font-weight: 700;
            color: var(--m-text);
            margin-bottom: 8px;
        }
        .champion-meta {
            display: flex;
            gap: 16px;
            font-size: 0.9rem;
            color: var(--m-text-muted);
        }
        @media (max-width: 768px) {
            .rounds-container {
                flex-direction: column;
            }
            .round-column {
                width: 100%;
            }
            .champion-card {
                flex-direction: column;
                text-align: center;
            }
        }
    </style>
    
    <?php
    $stmt = $db->query("SELECT * FROM tournaments WHERE status = 'completed' ORDER BY created_at DESC");
    $completed = $stmt->fetchAll(PDO::FETCH_ASSOC);
    
    if (empty($completed)) {
        echo '<p style="text-align:center; color: var(--m-text-muted);">완료된 토너먼트가 없습니다.</p>';
    } else {
        echo '<div class="hall-of-fame">';
        foreach ($completed as $t) {
            $created = date('Y-m-d', strtotime($t['created_at']));
            echo "
                <div class='champion-card'>
                    <div class='champion-trophy'>🏆</div>
                    <div class='champion-info'>
                        <h3>".htmlspecialchars($t['winner_name'])."</h3>
                        <div class='champion-meta'>
                            <span>🎯 ".htmlspecialchars($t['name'])."</span>
                            <span>👥 {$t['player_count']}명 참가</span>
                            <span>📅 {$created}</span>
                        </div>
                    </div>
                </div>
            ";
        }
        echo '</div>';
    }
    ?>
</div>
```

그리고 페이지 최상단의 `<style>` 블록에 다음 미디어 쿼리를 추가하세요:

```css
@media (max-width: 768px) {
    .tab-buttons {
        flex-direction: column;
    }
    .tab-btn {
        width: 100%;
    }
    .create-form {
        padding: 20px;
    }
    .rps-buttons {
        flex-direction: column;
    }
    .rps-btn {
        width: 100%;
    }
}
```

마지막으로 대진표 페이지 상단에 토너먼트 정보 요약 카드를 추가하세요 (`.bracket-header` 아래):

```php
<div style="max-width: 600px; margin: 0 auto 32px; padding: 20px; background: var(--m-surface); border-radius: var(--m-radius-lg); box-shadow: var(--m-shadow);">
    <div style="display: flex; justify-content: space-around; text-align: center;">
        <div>
            <div style="font-size: 2rem; font-weight: 700; color: #4CAF50;"><?php echo $tournament['player_count']; ?></div>
            <div style="font-size: 0.9rem; color: var(--m-text-muted);">참가자</div>
        </div>
        <div>
            <div style="font-size: 2rem; font-weight: 700; color: #2196F3;"><?php echo max(array_keys($rounds)); ?></div>
            <div style="font-size: 0.9rem; color: var(--m-text-muted);">총 라운드</div>
        </div>
        <div>
            <div style="font-size: 2rem; font-weight: 700; color: #FF9800;"><?php echo count($all_matches); ?></div>
            <div style="font-size: 0.9rem; color: var(--m-text-muted);">총 경기</div>
        </div>
    </div>
</div>
```