优化表情选择器样式，调整emoji大小设置

web/main.js

@@ -1,6 +1,16 @@
+/**
+ * NodeCrypt 聊天应用主入口文件
+ * 负责初始化界面、绑定事件及协调各模块功能
+ */
+
+// === 工具模块导入 ===
 import { processImage, setupImageSend } from './util.image.js';
 import { setupEmojiPicker } from './util.emoji.js';
 import { openSettingsPanel, closeSettingsPanel, initSettings, notifyMessage } from './util.settings.js';
+import { escapeHTML, textToHTML } from './util.string.js';
+import { $, $$, $id, on, off, addClass, removeClass } from './util.dom.js';
+
+// === 核心功能模块导入 ===
 import { 
   roomsData, 
   activeRoomIndex, 
@@ -17,6 +27,7 @@ import {
   updateChatInputStyle, 
   setupInputPlaceholder 
 } from './chat.js';
+// === 界面相关模块导入 ===
 import { 
   renderUserList, 
   renderMainHeader, 
@@ -27,17 +38,26 @@ import {
   setupTabs,
   autofillRoomPwd
 } from './ui.js';
-import { escapeHTML, textToHTML } from './util.string.js';
-import { $, $$, $id, on, off, addClass, removeClass } from './util.dom.js';
 
-// 全局配置
+// === 全局配置 ===
+
+/**
+ * 应用全局配置
+ * rsaPublic: RSA公钥，用于加密通信
+ * wsAddress: WebSocket服务器地址
+ * debug: 是否开启调试模式
+ */
 window.config = {
   rsaPublic: 'MIIBIjANBgkqhkiG9w0BAQEFAAOCAQ8AMIIBCgKCAQEA7+gGYn7Wavs/WpcubvlJX9IBhv4eQtOdcedmquodYVQl5l2Jd64cNj/okIxMpQqtvJW/zvN6BNHAgBKyB5D6Yf9qHN0FwdXnAsSVxlAHA2guMOpXQFjyYj01BRrRAGMOyYkYlhQ+cvgoJzaE2skO/aYqYzrqOnexaUFLYN+1xEITqrTwpKnCPdlhGArrXYFTmloBOJy18CYlNyJkdbsUN/Q7Lxyq3bkLsPx2Gr80wh4rUQltc+VY5CYqjxuRwV65o04hspfS9VHXnT5OSAElDDNBys1u3hr3j1WDXSB9+v9ksA8NCi8j+iN7ADaqMGPA82EaSbYcFpd9alLHBGa9GwIDAQAB', 
   wsAddress: 'wss://crypt.works/ws',
   debug: true
 };
 
-// 将关键函数暴露给全局，以便其他模块调用
+// === 全局函数导出 ===
+
+/**
+ * 将核心函数暴露给全局作用域，便于跨模块调用
+ */
 window.addSystemMsg = addSystemMsg;
 window.joinRoom = joinRoom; 
 window.notifyMessage = notifyMessage;
@@ -45,10 +65,13 @@ window.setupEmojiPicker = setupEmojiPicker;
 
 // 页面初始化
 window.addEventListener('DOMContentLoaded', () => {
+  // 获取主要UI元素
   const loginContainer = $id('login-container');
   const chatContainer = $id('chat-container');
   const loginForm = $id('login-form');
 
+  // === 登录相关初始化 ===
+  
   // 绑定初始登录表单
   if (loginForm) {
     loginForm.addEventListener('submit', loginFormHandler(null));
@@ -56,7 +79,9 @@ window.addEventListener('DOMContentLoaded', () => {
   
   // 绑定"进入新房间"按钮
   const joinBtn = $('.join-room');
-  if (joinBtn) joinBtn.onclick = openLoginModal;
+  if (joinBtn) {
+    joinBtn.onclick = openLoginModal;
+  }
 
   // 禁止主登录页输入框输入空格
   preventSpaceInput($id('userName'));
@@ -65,7 +90,8 @@ window.addEventListener('DOMContentLoaded', () => {
 
   // 自动填充URL参数中的房间信息
   autofillRoomPwd();
-
+  // === 界面组件初始化 ===
+  
   // 设置各种UI组件
   setupInputPlaceholder();
   setupMoreBtnMenu();
@@ -76,16 +102,15 @@ window.addEventListener('DOMContentLoaded', () => {
   initSettings();
 
   // 设置按钮点击事件
-  let settingsBtn = $id('settings-btn');
+  const settingsBtn = $id('settings-btn');
   if (settingsBtn) {
     settingsBtn.onclick = (e) => {
       e.stopPropagation();
       openSettingsPanel();
     };
   }
-
   // 点击其它区域关闭设置面板
-  document.addEventListener('click', function(ev) {
+  document.addEventListener('click', (ev) => {
     const panel = $id('settings-panel');
     if (panel && panel.style.display === 'block') {
       const card = panel.querySelector('.settings-panel-card');
@@ -94,12 +119,13 @@ window.addEventListener('DOMContentLoaded', () => {
       }
     }
   });
+  // === 消息收发功能 ===
 
   // 自动聚焦到输入框并设置消息发送逻辑
   const input = document.querySelector('.input-message-input');
   if (input) {
     input.focus();
-    input.addEventListener('keydown', function(e) {
+    input.addEventListener('keydown', (e) => {
       if (e.key === 'Enter' && !e.shiftKey) {
         e.preventDefault();
         const text = input.innerText.trim();
@@ -128,7 +154,7 @@ window.addEventListener('DOMContentLoaded', () => {
     });
   }
 
-  // 附件按钮和图片发送、粘贴图片功能
+  // 图片发送功能
   setupImageSend({
     inputSelector: '.input-message-input',
     attachBtnSelector: '.chat-attach-btn',
@@ -156,23 +182,26 @@ window.addEventListener('DOMContentLoaded', () => {
     }
   });
 
-  // 初始化UI
-  renderMainHeader();
-  renderUserList();  setupTabs();
+    // 移动端适配辅助函数
+  const isMobile = () => {
+    return window.innerWidth <= 768;
+  };
   
-  // 监听房间点击和成员tab点击（移动端）
+  // 初始化UI组件
+  renderMainHeader();
+  renderUserList();
+  setupTabs();
+  
+  // 移动端侧边栏处理
   const roomList = $id('room-list');
   const sidebar = $id('sidebar');
   const rightbar = $id('rightbar');
   const sidebarMask = $id('mobile-sidebar-mask');
   const rightbarMask = $id('mobile-rightbar-mask');
   
-  const isMobile = () => {
-    return window.innerWidth <= 768;
-  }
-  
+  // 监听房间列表点击（移动端）
   if (roomList) {
-    roomList.addEventListener('click', function() {
+    roomList.addEventListener('click', () => {
       if (isMobile()) {
         if (sidebar) sidebar.classList.remove('mobile-open');
         if (sidebarMask) sidebarMask.classList.remove('active');
@@ -180,9 +209,10 @@ window.addEventListener('DOMContentLoaded', () => {
     });
   }
   
+  // 监听成员标签点击（移动端）
   const memberTabs = $id('member-tabs');
   if (memberTabs) {
-    memberTabs.addEventListener('click', function() {
+    memberTabs.addEventListener('click', () => {
       if (isMobile()) {
         if (rightbar) removeClass(rightbar, 'mobile-open');
         if (rightbarMask) removeClass(rightbarMask, 'active');
@@ -191,12 +221,20 @@ window.addEventListener('DOMContentLoaded', () => {
   }
 });
 
-// 清空消息区（UI占位）
+// === 辅助函数 ===
+
+/**
+ * 清空消息区域
+ * 用于UI重置或切换房间
+ */
 function clearChat() {
   $id("chat-area").innerHTML = "";
 }
 
-// Telegram风格输入框占位符逻辑
+/**
+ * Telegram风格输入框自动增高
+ * 随着用户输入内容增加，输入框自动调整高度
+ */
 function autoGrowInput() {
   const input = $('.input-message-input');
   if (!input) return;

web/util.emoji.js

@@ -27,7 +27,6 @@ const addEmojiPickerStyles = () => {
   style.id = 'emoji-picker-styles';
   style.textContent = `
     emoji-picker {
-      --emoji-size: 1.25rem;
       --background: #fff;
       --border-color: rgba(0, 0, 0, 0.1);
       --border-radius: 10px;