<?php
/**
 * HuSNS - 一款免费开源的社交平台
 * 
 * @author  HYR
 * @QQ      281900864
 * @website https://huyourui.com
 * @license MIT
 * @声明    严禁用于违法违规用途 */
// 检查登录状态
$userId = isset($_SESSION['user_id']) ? $_SESSION['user_id'] : null;
if (!$userId) {
    // 使用弹窗登录，不跳转页面
    $this->assign('showLoginModal', true);
}

$currentPage = 'publish';
$pageType = 'publish';
$bodyClass = 'publish-page';
$hideTabBar = true;
$showBack = true;
$headerTitle = '发布帖子';

// 获取用户加入的圈子
require_once ROOT_PATH . 'content/circle/CircleModel.php';
$circleModel = new CircleModel();
$userCircles = $circleModel->getUserCircles($userId, 50);

// 页面特定CSS和JS文件
$pageCssFiles = [$this->themeUrl() . '/app/css/publish.css'];
$pageJsFiles = [$this->themeUrl() . '/app/js/publish-page.js'];

$this->setLayout('app');
?>

<script>
// 发布页面配置
window.HuSNS_Publish = {
    apiUrls: {
        publish: '<?php echo Helper::getBaseUrl(); ?>/?r=mobileApi/publish'
    },
    redirectUrls: {
        home: '<?php echo $this->url('mobile'); ?>'
    }
};
</script>

<div class="publish-content">
    <form class="publish-form" id="publishForm" enctype="multipart/form-data">
        <?php echo $this->csrf(); ?>
        <div class="publish-header">
            <?php echo $this->avatar($user['avatar'] ?? null, $user['username'] ?? '', 'small'); ?>
            <div class="publish-user-info">
                <div class="publish-username"><?php echo $this->escape($user['username'] ?? ''); ?></div>
            </div>
        </div>
        
        <div class="publish-content-input">
            <textarea class="content-textarea" name="content" placeholder="分享你的想法..." id="contentInput"></textarea>
        </div>
        
        <!-- 工具栏 -->
        <div class="publish-toolbar">
            <div class="toolbar-item" id="mediaToolbarItem" onclick="showMediaUpload()">
                <span class="toolbar-icon">📷</span>
                <span class="toolbar-text">图片/视频</span>
            </div>
            <div class="toolbar-item" id="circleToolbarItem" onclick="togglePublishCircleSelect()">
                <span class="toolbar-icon">🏘️</span>
                <span class="toolbar-text">圈子</span>
            </div>
            <div class="toolbar-item" onclick="insertTopic()">
                <span class="toolbar-icon">🏷️</span>
                <span class="toolbar-text">话题</span>
            </div>
            <div class="toolbar-item" onclick="insertAt()">
                <span class="toolbar-icon">@</span>
                <span class="toolbar-text">@</span>
            </div>
        </div>
        
        <!-- 圈子选择区域 -->
        <div class="circle-select-section" id="circleSelectSection">
            <div class="circle-select-header">
                <span class="circle-select-title">选择圈子（发布到指定圈子）</span>
                <span class="circle-select-close" onclick="togglePublishCircleSelect()">×</span>
            </div>
            <div class="circle-list">
                <div class="circle-tag" data-circle-id="0" onclick="selectPublishCircle(0, '')">
                    不发布到圈子
                </div>
                <?php foreach ($userCircles as $circle): ?>
                <div class="circle-tag" data-circle-id="<?php echo $circle['id']; ?>" 
                     onclick="selectPublishCircle(<?php echo $circle['id']; ?>, '<?php echo $this->escape($circle['name']); ?>')">
                    <img class="circle-avatar-mini" src="<?php echo $circle['avatar'] ? $this->uploadUrl($circle['avatar']) : $this->asset('images/default-avatar.png'); ?>" alt="">
                    <?php echo $this->escape($circle['name']); ?>
                </div>
                <?php endforeach; ?>
            </div>
        </div>
        
        <!-- 媒体上传区域 -->
        <div class="media-upload-section" id="mediaUploadSection">
            <div class="media-upload-container" id="mediaPreviewContainer">
                <label class="add-media-btn" for="mediaInput">
                    <span class="add-media-icon">📷</span>
                    <span class="add-media-text">添加图片/视频</span>
                </label>
                <input type="file" id="mediaInput" name="media[]" multiple accept="image/*,video/*">
            </div>
        </div>
        
        <!-- 视频预览 -->
        <div class="video-preview-container" id="videoPreviewContainer">
            <div class="video-preview-item">
                <video id="videoPreviewPlayer" controls playsinline style="width:100%;border-radius:8px;max-height:300px;"></video>
                <div class="remove-video" onclick="removeVideo()">×</div>
            </div>
        </div>
        
        <div class="compression-info" id="compressionInfo"></div>
        
        <!-- 隐藏字段 -->
        <input type="hidden" name="circle_id" id="circleId" value="0">
        <input type="hidden" name="circle_name" id="circleName" value="">
    </form>
    
    <!-- 发布按钮 -->
    <div class="publish-actions">
        <button class="publish-btn" id="publishBtn" onclick="submitForm()">发布</button>
    </div>
</div>