<?php
/**
 * HuSNS - 一款免费开源的社交平台
 *
 * @author  HYR
 * @QQ      281900864
 * @website https://huyourui.com
 * @license MIT
 * @声明    严禁用于违法违规用途
 */
?>
<!-- 左侧栏 -->
<aside class="sidebar-left">
    <?php if (isset($_SESSION['user_id'])): ?>
    <div class="user-card">
            <img src="/templates/defaultpro/images/avatar_default.png" alt="" style="width:70px;height:70px;border-radius:50%;object-fit:cover;">
            <div class="user-card-name"><?php echo $this->escape($_SESSION['username'] ?? '用户'); ?></div>
            <div class="user-card-bio">这个人很懒，什么都没写</div>
            <div class="user-card-stats">
                <div class="stat-item"><div class="stat-value">-</div><div class="stat-label">动态</div></div>
                <div class="stat-item"><div class="stat-value">-</div><div class="stat-label">关注</div></div>
                <div class="stat-item"><div class="stat-value">-</div><div class="stat-label">粉丝</div></div>
            </div>
        </div>
        <?php else: ?>
        <div class="user-card">
            <img src="/templates/defaultpro/images/avatar_default.png" alt="" style="width:70px;height:70px;border-radius:50%;object-fit:cover;">
            <div class="user-card-name">游客</div>
            <div class="user-card-bio">登录后体验更多功能</div>
            <div class="user-card-stats">
                <div class="stat-item"><div class="stat-value">-</div><div class="stat-label">动态</div></div>
                <div class="stat-item"><div class="stat-value">-</div><div class="stat-label">关注</div></div>
                <div class="stat-item"><div class="stat-value">-</div><div class="stat-label">粉丝</div></div>
            </div>
        </div>
    <?php endif; ?>
    <?php if (!isset($_SESSION['user_id'])): ?>
    <div class="guest-tip">
        <p><a href="<?php echo $this->url('user/login'); ?>">登录</a> | <a href="<?php echo $this->url('user/register'); ?>">注册</a></p>
    </div>
    <?php endif; ?>

    <ul class="menu">
        <li><a href="<?php echo $this->url(); ?>">🏠 首页</a></li>
        <li><a href="<?php echo $this->url('?tab=following'); ?>">❤️ 关注</a></li>
        <li><a href="<?php echo $this->url('post/hot'); ?>">🔥 热门</a></li>
        <li><a href="<?php echo $this->url('post/featured'); ?>">✨ 推荐</a></li>
        <li><a href="<?php echo $this->url('notification'); ?>">💬 消息</a></li>
        <?php if (isset($_SESSION['user_id'])): ?>
        <li><a href="<?php echo $this->url('user/profile'); ?>">👤 我的主页</a></li>
        <li class="active"><a href="<?php echo $this->url('user/edit_profile'); ?>" aria-current="page">✏️ 编辑资料</a></li>
        <?php else: ?>
        <li><a href="<?php echo $this->url('user/login'); ?>">🔑 登录</a></li>
        <li><a href="<?php echo $this->url('user/register'); ?>">📝 注册</a></li>
        <?php endif; ?>
    </ul>

    <div class="side-card">
        <div class="side-title">快捷操作</div>
        <ul class="menu">
            <li><a href="#" onclick="showPublishPopup();return false;">✍️ 发布动态</a></li>
            <li><a href="<?php echo $this->url('user/search'); ?>">🔍 查找用户</a></li>
            <li><a href="<?php echo $this->url('post/topic'); ?>">🏷️ 话题广场</a></li>
        </ul>
    </div>
</aside>

<!-- 中间内容 -->
<section class="home-main">
    <div class="page-settings">
    <h2>编辑个人资料</h2>
    
    <?php if ($this->hasFlash('success')): ?>
    <div class="alert alert-success"><?php echo $this->flash('success'); ?></div>
    <?php endif; ?>
    
    <?php if ($this->hasFlash('error')): ?>
    <div class="alert alert-error"><?php echo $this->flash('error'); ?></div>
    <?php endif; ?>
    
    <form method="post" enctype="multipart/form-data" id="profileForm">
        <?php echo $this->csrf(); ?>
        
        <!-- 头像上传 -->
        <div class="form-group avatar-upload">
            <label>头像</label>
            <div style="display:flex;align-items:center;gap:16px;">
                <img id="avatarPreview" src="<?php echo $this->escape($user['avatar'] ?? '/templates/defaultpro/images/avatar_default.png'); ?>" alt="头像" style="width:100px;height:100px;border-radius:50%;object-fit:cover;">
                <div>
                    <input type="file" name="avatar" accept="image/*" id="avatarInput" data-max-size="2" style="display:none;">
                    <button type="button" class="btn btn-outline" onclick="document.getElementById('avatarInput').click();">选择图片</button>
                    <small style="display:block;margin-top:8px;color:#666;font-size:12px;">建议上传正方形图片，最大2MB</small>
                </div>
            </div>
            <div id="avatarCompressTip" style="color:#666;margin-top:8px;font-size:12px;"></div>
        </div>
        
        <!-- 用户名 -->
        <div class="form-group">
            <label>用户名</label>
            <input type="text" name="username" id="usernameInput" value="<?php echo $this->escape($user['username'] ?? ''); ?>" maxlength="20" minlength="2">
            <small>2-20个字符，支持字母、数字、下划线、中文</small>
        </div>
        
        <!-- 个人简介 -->
        <div class="form-group">
            <label>个人简介</label>
            <textarea name="bio" id="bioInput" rows="3" maxlength="200" placeholder="介绍一下自己吧"><?php echo $this->escape($user['bio'] ?? ''); ?></textarea>
            <small><span id="bioCount">0</span>/200</small>
        </div>
        
        <!-- 邮箱 -->
        <div class="form-group">
            <label>邮箱</label>
            <input type="email" name="email" value="<?php echo $this->escape($user['email'] ?? ''); ?>" readonly>
            <small>如需修改邮箱，请联系管理员</small>
        </div>
        
        <div style="display:flex;gap:12px;">
            <button type="submit" class="btn btn-primary">保存修改</button>
            <a href="<?php echo $this->url('user/profile'); ?>" class="btn">取消</a>
        </div>
    </form>
    </div>
</section>

<!-- 右侧栏 -->
<aside class="sidebar-right">
    <div class="side-card">
        <div class="side-title">推荐关注</div>
        <div id="recommend-users">
            <div class="empty-tip">登录后查看推荐</div>
        </div>
    </div>

    <div class="side-card">
        <div class="side-title">热门话题</div>
        <div id="hot-topics">
            <div class="empty-tip">登录后查看热门话题</div>
        </div>
    </div>
</aside>

<script>
(function() {
    var avatarInput = document.getElementById('avatarInput');
    var avatarPreview = document.getElementById('avatarPreview');
    var avatarCompressTip = document.getElementById('avatarCompressTip');
    var maxSize = parseInt(avatarInput.dataset.maxSize) * 1024 * 1024;
    var maxDimension = 300;
    
    // 头像上传处理
    avatarInput.addEventListener('change', function(e) {
        var file = this.files[0];
        if (!file) return;
        
        if (file.size > maxSize) {
            alert('图片大小超过限制（最大' + avatarInput.dataset.maxSize + 'MB）');
            this.value = '';
            return;
        }
        
        var reader = new FileReader();
        reader.onload = function(event) {
            var img = new Image();
            img.onload = function() {
                var width = img.width;
                var height = img.height;
                
                avatarPreview.src = event.target.result;
                
                if (width > maxDimension || height > maxDimension) {
                    avatarCompressTip.textContent = '图片将自动压缩至 ' + maxDimension + 'px';
                    avatarCompressTip.style.color = '#16a34a';
                } else {
                    avatarCompressTip.textContent = '图片尺寸 ' + width + 'x' + height + '，无需压缩';
                    avatarCompressTip.style.color = '#666';
                }
            };
            img.src = event.target.result;
        };
        reader.readAsDataURL(file);
    });
    
    // 简介字数统计
    var bioInput = document.getElementById('bioInput');
    var bioCount = document.getElementById('bioCount');
    
    bioInput.addEventListener('input', function() {
        bioCount.textContent = this.value.length;
    });
    
    // 初始化字数统计
    bioCount.textContent = bioInput.value.length;
    
    // 表单验证
    var profileForm = document.getElementById('profileForm');
    var usernameInput = document.getElementById('usernameInput');
    
    profileForm.addEventListener('submit', function(e) {
        var username = usernameInput.value.trim();
        
        if (!username) {
            alert('用户名不能为空');
            e.preventDefault();
            return;
        }
        
        if (username.length < 2 || username.length > 20) {
            alert('用户名长度需在2-20个字符之间');
            e.preventDefault();
            return;
        }
        
        if (!/^[a-zA-Z0-9_\u4e00-\u9fa5]+$/.test(username)) {
            alert('用户名只能包含字母、数字、下划线和中文');
            e.preventDefault();
            return;
        }
    });
})();
</script>