🚀 好友开关组件 - 右侧抽屉演示

✨ 新功能特性

💡 试试拖动右下角的"好友"按钮到其他位置，然后点击查看抽屉效果！

📱 操作说明

1. 找到页面右下角的"好友"按钮

2. 拖动按钮到你喜欢的位置

3. 点击按钮打开右侧好友列表抽屉

4. 在抽屉中可以查看、搜索、添加和删除好友

🔧 快速集成代码

<!-- 1. 引入必要的文件 -->
<script src="./scratch-gui/src/playground/rank-badge-generator.js"></script>
<script src="./scratch-gui/src/components/friend-toggle/FriendListModal.js"></script>
<script src="./scratch-gui/src/components/friend-toggle/FriendToggle.js"></script>

<script>
// 2. 配置API地址
window.CONFIG = {
    DataServerBaseUrl: 'http://localhost:8601'
};

// 3. 设置用户认证令牌
localStorage.setItem('access_token', 'your-access-token');

// 4. 初始化好友开关组件
const friendToggle = new FriendToggle({
    position: 'bottom-right',  // 初始位置
    size: 'medium',            // 大小
    theme: 'default'           // 主题
});
</script>

⚙️ 高级配置选项

// 可配置选项
const friendToggle = new FriendToggle({
    position: 'bottom-right',  // 位置: top-left, top-right, bottom-left, bottom-right
    size: 'medium',            // 大小: small, medium, large
    theme: 'default',          // 主题: default, dark, colorful
    zIndex: 9999              // 层级
});

// 单例模式 - 多次调用返回同一实例
const sameFriendToggle = FriendToggle.getInstance();