{{--
    文件功能：聊天室主界面框架（frame 页面）
    全屏沉浸式布局，不使用统一 layout
    CSS 抽取到 /public/css/chat.css
    JS 抽取到 chat.partials.scripts Blade 模板

    @author ChatRoom Laravel
    @version 1.0.0
--}}
<!DOCTYPE html>
<html lang="zh-CN">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>{{ $room->name ?? '聊天室' }} - 飘落流星</title>
    <meta name="csrf-token" content="{{ csrf_token() }}">
    @php
        // 从 sysparam 读取权限等级配置
        $levelWarn = (int) \App\Models\Sysparam::getValue('level_warn', '5');
        $levelKick = (int) \App\Models\Sysparam::getValue('level_kick', '10');
        $levelMute = (int) \App\Models\Sysparam::getValue('level_mute', '8');
        $levelBan = (int) \App\Models\Sysparam::getValue('level_ban', '12');
        $levelBanip = (int) \App\Models\Sysparam::getValue('level_banip', '14');
        $levelFreeze = (int) \App\Models\Sysparam::getValue('level_freeze', '14');
        $superLevel = (int) \App\Models\Sysparam::getValue('superlevel', '100');
        $myLevel = Auth::user()->user_level;
    @endphp
    <script>
        window.chatContext = {
            roomId: {{ $room->id }},
            username: "{{ $user->username }}",
            userLevel: {{ $user->user_level }},
            superLevel: {{ $superLevel }},
            levelKick: {{ $levelKick }},
            levelMute: {{ $levelMute }},
            levelBan: {{ $levelBan }},
            levelBanip: {{ $levelBanip }},
            sendUrl: "{{ route('chat.send', $room->id) }}",
            leaveUrl: "{{ route('chat.leave', $room->id) }}",
            heartbeatUrl: "{{ route('chat.heartbeat', $room->id) }}",
            fishCastUrl: "{{ route('fishing.cast', $room->id) }}",
            fishReelUrl: "{{ route('fishing.reel', $room->id) }}",
            chatBotUrl: "{{ route('chatbot.chat') }}",
            chatBotClearUrl: "{{ route('chatbot.clear') }}",
            chatBotEnabled: {{ \App\Models\Sysparam::getValue('chatbot_enabled', '0') === '1' ? 'true' : 'false' }}
        };
    </script>
    @vite(['resources/css/app.css', 'resources/js/app.js', 'resources/js/chat.js'])
    <script defer src="https://cdn.jsdelivr.net/npm/alpinejs@3.x.x/dist/cdn.min.js"></script>
    <link rel="stylesheet" href="/css/chat.css">
</head>

<body>
    <div class="chat-layout">

        {{-- ═══════════ 左侧主区域 ═══════════ --}}
        <div class="chat-left">

            {{-- 顶部标题栏 + 公告滚动条（独立文件维护） --}}
            @include('chat.partials.header')

            {{-- 消息窗格（双窗格，默认只显示 say1） --}}
            <div class="message-panes" id="message-panes">
                {{-- 主消息窗 --}}
                <div class="message-pane say1" id="chat-messages-container">
                    <div class="msg-line">
                        <span style="color: #cc0000; font-weight: bold;">【公众窗口】</span>显示公众的发言！
                        <span class="msg-time">({{ now()->format('H:i:s') }})</span><br>
                        <span
                            style="color: #000099;">『{{ $room->name }}』{{ $room->description ?? '欢迎光临！畅所欲言，文明聊天。' }}</span>
                    </div>
                </div>
                {{-- 副消息窗（包厢窗） --}}
                <div class="message-pane say2" id="chat-messages-container2">
                    <div class="msg-line">
                        <span style="color: #cc0000; font-weight: bold;">【包厢窗口】</span>显示包厢名单中聊友的发言！
                        <span class="msg-time">({{ now()->format('H:i:s') }})</span>
                    </div>
                </div>
            </div>

            {{-- 底部输入工具栏（独立文件维护） --}}
            @include('chat.partials.input-bar')
        </div>

        {{-- ═══════════ 竖向工具条（独立文件维护） ═══════════ --}}
        @include('chat.partials.toolbar')

        {{-- ═══════════ 右侧用户面板（独立文件维护） ═══════════ --}}
        @include('chat.partials.right-panel')
    </div>

    {{-- ═══════════ 聊天室交互脚本（独立文件维护） ═══════════ --}}
    @include('chat.partials.user-actions')

    {{-- 全屏特效系统：管理员烟花/下雨/雷电/下雪 --}}
    <script src="/js/effects/effect-manager.js"></script>
    <script src="/js/effects/fireworks.js"></script>
    <script src="/js/effects/rain.js"></script>
    <script src="/js/effects/lightning.js"></script>
    <script src="/js/effects/snow.js"></script>

    @include('chat.partials.scripts')

    {{-- 周卡特效：登录时自动播放（仅持卡用户可见） --}}
    @if (!empty($weekEffect))
        <script>
            /** 周卡特效：延迟1秒待页面完成加载后自动播放 */
            setTimeout(() => {
                if (window.EffectManager) {
                    window.EffectManager.play('{{ $weekEffect }}');
                }
            }, 1000);
        </script>
    @endif

</body>

</html>
