<?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 = 'topic';
$pageType = 'topic';
$bodyClass = 'topic-page';
$hideTabBar = true;
$showBack = true;
$headerTitle = '话题详情';
$userId = $_SESSION['user_id'];

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

// 将页面特定资源添加到视图数据中
$this->assign('pageCssFiles', $pageCssFiles);
$this->assign('pageJsFiles', $pageJsFiles);

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

<script>
const BASE_URL = '<?php echo Helper::getBaseUrl(); ?>';

// 话题页面配置
window.HuSNS_Topic = {
    apiUrls: {
        like: '<?php echo $this->url('mobileApi/like'); ?>',
        unlike: '<?php echo $this->url('mobileApi/unlike'); ?>'
    }
};
</script>

<div class="topic-content">
    <?php if (!empty($keyword)): ?>
    <!-- 话题头部 -->
    <div class="topic-header">
        <!-- 左侧：图标 -->
        <div class="topic-header-left">
            <div class="topic-icon"><?php echo $this->escape(mb_substr($keyword, 0, 1, 'UTF-8')); ?></div>
        </div>
        
        <!-- 中间：名称、描述和统计 -->
        <div class="topic-header-center">
            <div class="topic-name">#<?php echo $this->escape($keyword); ?>#</div>
            <div class="topic-description">相关动态</div>
            <div class="topic-stats">
                <span class="topic-stat-value"><?php echo $total ?? 0; ?></span>
                <span class="topic-stat-label">帖子</span>
            </div>
        </div>
        
        <!-- 右侧：操作按钮 -->
        <div class="topic-header-right">
            <button class="topic-action-button" onclick="shareTopic('<?php echo $this->escape($keyword); ?>')">分享</button>
        </div>
    </div>
    
    <!-- 内容标签 -->
    <div class="topic-tabs">
        <div class="topic-tab-bar">
            <a href="<?php echo $this->url('mobile/topic?keyword=' . urlencode($keyword) . '&tab=latest'); ?>" class="topic-tab-item <?php echo (isset($tab) && $tab === 'latest') || !isset($tab) ? 'active' : ''; ?>">最新</a>
            <a href="<?php echo $this->url('mobile/topic?keyword=' . urlencode($keyword) . '&tab=hot'); ?>" class="topic-tab-item <?php echo isset($tab) && $tab === 'hot' ? 'active' : ''; ?>">热门</a>
        </div>
    </div>
    
    <!-- 话题内容列表 -->
    <div class="topic-content-list">
        <?php if (!empty($posts)): ?>
        <?php foreach ($posts as $post): ?>
        <div class="post-item" data-id="<?php echo $post['id']; ?>">
            <div class="post-header">
                <a href="<?php echo $this->url('mobile/user?id=' . $post['user_id']); ?>">
                    <?php echo $this->avatar($post['avatar'] ?? null, $post['username'] ?? '', 'small'); ?>
                </a>
                <div class="post-user-info">
                    <div class="post-username"><?php echo $this->escape($post['username']); ?></div>
                    <div class="post-time"><?php echo $post['time_ago'] ?? Helper::formatTime($post['created_at']); ?></div>
                </div>
            </div>
            
            <a href="<?php echo $this->url('mobile/detail?id=' . $post['id']); ?>" style="text-decoration:none;color:inherit;">
                <div class="post-content">
                    <?php echo $post['content']; ?>
                </div>
                
                <?php if (!empty($post['images'])): ?>
                <?php
                $imageCount = count($post['images']);
                $gridClass = 'single';
                if ($imageCount === 2) $gridClass = 'double';
                elseif ($imageCount === 3) $gridClass = 'triple';
                elseif ($imageCount === 4) $gridClass = 'quad';
                elseif ($imageCount > 4) $gridClass = 'many';
                ?>
                <div class="post-images">
                    <div class="image-grid <?php echo $gridClass; ?>">
                        <?php foreach (array_slice($post['images'], 0, 9) as $img): ?>
                        <img class="post-image" src="<?php echo $this->uploadUrl($img); ?>" alt="" loading="lazy">
                        <?php endforeach; ?>
                    </div>
                </div>
                <?php endif; ?>
                
                <?php if (!empty($post['videos'])): ?>
                <?php foreach ($post['videos'] as $video): ?>
                <?php
                // 兼容新旧数据格式
                if (is_array($video) && isset($video['path'])) {
                    $videoPath = $video['path'];
                } else {
                    $videoPath = $video;
                }
                ?>
                <div class="moment-video-thumbnail" data-video="<?php echo $this->uploadUrl($videoPath); ?>" onclick="HuSNS.openVideoPlayer('<?php echo $this->uploadUrl($videoPath); ?>')">
                    <img class="moment-video-poster" src="" alt="视频缩略图" loading="lazy">
                    <div class="moment-video-play-btn">▶</div>
                    <div class="moment-video-badge">视频</div>
                </div>
                <?php endforeach; ?>
                <?php endif; ?>
                
                <?php
                $location = $post['location'] ?? [];
                $locationName = $location['name'] ?? '';
                $locationLat = $location['lat'] ?? '';
                $locationLng = $location['lng'] ?? '';
                $hasCoords = !empty($locationLat) && !empty($locationLng) && $locationLat !== '0' && $locationLng !== '0';

                if (!empty($locationName)):
                    if ($hasCoords):
                ?>
                <div class="moment-location-card" onclick="HuSNS.showLocationMap('<?php echo $this->escape($locationName); ?>', '<?php echo $locationLat; ?>', '<?php echo $locationLng; ?>')">
                    <span class="location-pin">
                        <svg viewBox="0 0 24 24">
                            <path d="M12 2C8.13 2 5 5.13 5 9c0 5.25 7 13 7 13s7-7.75 7-13c0-3.87-3.13-7-7-7zm0 9.5c-1.38 0-2.5-1.12-2.5-2.5s1.12-2.5 2.5-2.5 2.5 1.12 2.5 2.5-1.12 2.5-2.5 2.5z"/>
                        </svg>
                    </span>
                    <span class="location-text"><?php echo $this->escape($locationName); ?></span>
                </div>
                <?php else: ?>
                <a class="moment-location-link" href="<?php echo $this->url('mobile/hot?location=' . urlencode($locationName)); ?>">
                    <span class="location-pin">
                        <svg viewBox="0 0 24 24">
                            <path d="M12 2C8.13 2 5 5.13 5 9c0 5.25 7 13 7 13s7-7.75 7-13c0-3.87-3.13-7-7-7zm0 9.5c-1.38 0-2.5-1.12-2.5-2.5s1.12-2.5 2.5-2.5 2.5 1.12 2.5 2.5-1.12 2.5-2.5 2.5z"/>
                        </svg>
                    </span>
                    <span class="location-text"><?php echo $this->escape($locationName); ?></span>
                </a>
                <?php
                    endif;
                endif;
                ?>
            </a>
            
            <div class="post-actions" style="position:relative;">
                <button class="action-btn <?php echo !empty($post['is_liked']) ? 'liked' : ''; ?>" data-action="like" data-id="<?php echo $post['id']; ?>">
                    <svg class="action-icon" width="20" height="20" viewBox="0 0 24 24" fill="<?php echo !empty($post['is_liked']) ? '#ff4757' : 'currentColor'; ?>">
                        <path d="M12 21.35l-1.45-1.32C5.4 15.36 2 12.28 2 8.5 2 5.42 4.42 3 7.5 3c1.74 0 3.41.81 4.5 2.09C13.09 3.81 14.76 3 16.5 3 19.58 3 22 5.42 22 8.5c0 3.78-3.4 6.86-8.55 11.54L12 21.35z"/>
                    </svg>
                    <span class="action-count"><?php echo $post['likes']; ?></span>
                </button>
                <button class="action-btn comment-btn" data-post-id="<?php echo $post['id']; ?>">
                    <svg class="action-icon" width="20" height="20" viewBox="0 0 24 24" fill="currentColor">
                        <path d="M21 6h-2v9H6v2c0 .55.45 1 1 1h11l4 4V7c0-.55-.45-1-1-1zm-4 6V3c0-.55-.45-1-1-1H3c-.55 0-1 .45-1 1v14l4-4h10c.55 0 1-.45 1-1z"/>
                    </svg>
                    <span class="action-count"><?php echo $post['comments']; ?></span>
                </button>
                <button class="action-btn" onclick="openShareModal('<?php echo $this->url('mobile/detail?id=' . $post['id']); ?>', '<?php echo $this->escape(mb_substr($post['raw_content'] ?? $post['content'], 0, 50, 'UTF-8')); ?>')">
                    <svg class="action-icon" width="20" height="20" viewBox="0 0 24 24" fill="currentColor">
                        <path d="M18 16.08c-.76 0-1.44.3-1.96.77L8.91 12.7c.05-.23.09-.46.09-.7s-.04-.47-.09-.7l7.05-4.11c.54.5 1.25.81 2.04.81 1.66 0 3-1.34 3-3s-1.34-3-3-3-3 1.34-3 3c0 .24.04.47.09.7L8.04 9.81C7.5 9.31 6.79 9 6 9c-1.66 0-3 1.34-3 3s1.34 3 3 3c.79 0 1.5-.31 2.04-.81l7.12 4.16c-.05.21-.08.43-.08.65 0 1.61 1.31 2.92 2.92 2.92s2.92-1.31 2.92-2.92-1.31-2.92-2.92-2.92z"/>
                    </svg>
                    <span class="action-label">分享</span>
                </button>
                <button class="action-btn <?php echo !empty($post['is_favorited']) ? 'favorited' : ''; ?>" data-action="favorite" data-id="<?php echo $post['id']; ?>">
                    <svg class="action-icon" width="20" height="20" viewBox="0 0 24 24" fill="<?php echo !empty($post['is_favorited']) ? '#ffa502' : 'currentColor'; ?>">
                        <path d="M12 17.27L18.18 21l-1.64-7.03L22 9.24l-7.19-.61L12 2 9.19 8.63 2 9.24l5.46 4.73L5.82 21z"/>
                    </svg>
                    <span class="action-label">收藏</span>
                </button>
                <?php if (!empty($_SESSION['is_admin'])): ?>
                <button class="more-menu-btn" onclick="toggleMoreMenu(this, <?php echo $post['id']; ?>)">
                    <svg width="20" height="20" viewBox="0 0 24 24" fill="currentColor"><path d="M12 8c1.1 0 2-.9 2-2s-.9-2-2-2-2 .9-2 2 .9 2 2 2zm0 2c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm0 6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2z"/></svg>
                </button>
                <div class="more-menu-dropdown" style="z-index: 1000;">
                    <button class="more-menu-item topped" onclick="handlePostAction('top', <?php echo $post['id']; ?>, this)">
                        <svg width="18" height="18" viewBox="0 0 24 24" fill="currentColor"><path d="M16,12V4H17V2H7V4H8V12L6,14V16H18V14L16,12Z"/></svg> <?php echo !empty($post['is_top']) ? '取消置顶' : '置顶'; ?>
                    </button>
                    <button class="more-menu-item essenced" onclick="handlePostAction('essence', <?php echo $post['id']; ?>, this)">
                        <svg width="18" height="18" viewBox="0 0 24 24" fill="currentColor"><path d="M19,3H5A2,2 0 0,0 3,5V19A2,2 0 0,0 5,21H19A2,2 0 0,0 21,19V5A2,2 0 0,0 19,3M19,19H5V5H19V19M17,17L12,12.5L7,17V5H17V17Z"/></svg> <?php echo !empty($post['is_essence']) ? '取消加精' : '加精'; ?>
                    </button>
                    <button class="more-menu-item danger" onclick="handlePostAction('delete', <?php echo $post['id']; ?>, this)">
                        <svg width="18" height="18" viewBox="0 0 24 24" fill="currentColor"><path d="M19,4H15.5L14.5,3H9.5L8.5,4H5V6H19M6,19A2,2 0 0,0 8,21H16A2,2 0 0,0 18,19V7H6V19Z"/></svg> 删除
                    </button>
                </div>
                <?php endif; ?>
            </div>
        </div>
        <?php endforeach; ?>
        <?php else: ?>
        <div class="topic-empty">
            <div class="topic-empty-icon"><span class="iconify" data-icon="mdi:email-open-outline"></span></div>
            <div class="topic-empty-text">暂无内容</div>
            <div class="topic-empty-subtext">成为第一个发布相关内容的人</div>
        </div>
        <?php endif; ?>
    </div>
    <?php else: ?>
    <div class="topic-empty">
        <div class="topic-empty-icon">#</div>
        <div class="topic-empty-text">话题不能为空</div>
        <div class="topic-empty-subtext">请输入话题关键词</div>
    </div>
    <?php endif; ?>
</div>