Skip to content

Commit 2816cee

Browse files
committed
更新i18n,帮助页面正式完工
1 parent a6d5ab9 commit 2816cee

File tree

5 files changed

+101
-39
lines changed

5 files changed

+101
-39
lines changed

client/css/body.css

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -150,10 +150,10 @@ body {
150150
background: #fff;
151151
border-radius: 14px;
152152
box-shadow: 0 2px 16px rgba(60, 80, 100, 0.09); */
153-
display: flex;
154-
flex-direction: row;
155-
justify-content: space-around;
156-
text-align: center;
153+
display: flex;
154+
text-align: center;
155+
align-items: center;
156+
flex-direction: column;
157157
}
158158

159159
.login-container h1 {

client/index.html

Lines changed: 23 additions & 26 deletions
Original file line numberDiff line numberDiff line change
@@ -37,9 +37,8 @@
3737
<div class="flip-card" id="flip-card">
3838
<div class="flip-card-inner">
3939
<!-- 卡片正面 - 登录表单 -->
40-
<div class="flip-card-front">
41-
<!-- 帮助按钮 -->
42-
<button class="help-btn" id="help-btn" type="button" title="使用说明">
40+
<div class="flip-card-front"> <!-- 帮助按钮 -->
41+
<button class="help-btn" id="help-btn" type="button" data-i18n-title="help.usage_guide">
4342
<svg width="40" height="40" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
4443
<circle cx="12" cy="12" r="10" stroke="currentColor" stroke-width="2"/>
4544
<path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
@@ -51,41 +50,43 @@ <h1 id="login-title"></h1>
5150
<!-- 登录表单内容将由JavaScript动态生成 -->
5251
<!-- Login form content will be dynamically generated by JavaScript -->
5352
</form>
54-
</div>
55-
<!-- 卡片背面 - 使用说明 --> <div class="flip-card-back">
56-
<button class="help-btn back-btn" id="back-btn" type="button" title="返回登录">
53+
</div> <!-- 卡片背面 - 使用说明 --> <div class="flip-card-back">
54+
<button class="help-btn back-btn" id="back-btn" type="button" data-i18n-title="help.back_to_login">
5755
<svg width="40" height="40" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
5856
<path d="M15 18L9 12L15 6" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
5957
</svg>
60-
</button> <h2>使用说明</h2>
58+
</button> <h2 data-i18n="help.usage_guide">使用说明</h2>
6159
<div class="help-content">
6260
<div class="help-section">
63-
<h3>🔐 什么是 NodeCrypt?</h3>
64-
<p>NodeCrypt 是一个开源的端到端加密聊天系统,采用无数据库架构设计。所有消息在您的设备上本地加密,服务器和中间人无法解密您的任何聊天内容。</p>
61+
<h3 data-i18n="help.what_is_nodecrypt">🔐 什么是 NodeCrypt?</h3>
62+
<p data-i18n="help.what_is_nodecrypt_desc">NodeCrypt 是一个开源的端到端加密聊天系统,采用无数据库架构设计。所有消息在您的设备上本地加密,服务器和中间人无法解密您的任何聊天内容。</p>
6563
</div>
6664

6765
<div class="help-section">
68-
<h3>🚀 如何开始?</h3>
66+
<h3 data-i18n="help.how_to_start">🚀 如何开始?</h3>
6967
<ol>
70-
<li><strong>输入用户名</strong>:选择一个昵称</li>
71-
<li><strong>输入节点名</strong>:创建或加入现有房间</li>
72-
<li><strong>设置节点密码</strong>:用于排除巧合性</li>
73-
<li><strong>点击"加入房间"</strong>:开始安全聊天</li>
68+
<li><strong data-i18n="help.step_username">输入用户名</strong><span data-i18n="help.step_username_desc">选择一个昵称</span></li>
69+
<li><strong data-i18n="help.step_node_name">输入节点名</strong><span data-i18n="help.step_node_name_desc">创建或加入现有房间</span></li>
70+
<li><strong data-i18n="help.step_password">设置节点密码</strong><span data-i18n="help.step_password_desc">用于排除巧合性</span></li>
71+
<li><strong data-i18n="help.step_join">点击"加入房间"</strong><span data-i18n="help.step_join_desc">开始安全聊天</span></li>
7472
</ol>
7573
</div>
7674

7775
<div class="help-section">
78-
<h3>🔑 安全特性</h3>
76+
<h3 data-i18n="help.security_features">🔑 安全特性</h3>
7977
<ul>
80-
<li><strong>端到端加密</strong>:消息仅您和接收者可解密</li>
81-
<li><strong>无历史记录</strong>:新用户无法看到历史消息</li>
82-
<li><strong>密码保护</strong>:房间密码参与加密过程</li>
83-
<li><strong>匿名通信</strong>:无需注册真实身份</li>
78+
<li><strong data-i18n="help.e2e_encryption">端到端加密</strong><span data-i18n="help.e2e_encryption_desc">消息仅您和接收者可解密</span></li>
79+
<li><strong data-i18n="help.no_history">无历史记录</strong><span data-i18n="help.no_history_desc">新用户无法看到历史消息</span></li>
80+
<li><strong data-i18n="help.password_protection">密码保护</strong><span data-i18n="help.password_protection_desc">房间密码参与加密过程</span></li>
81+
<li><strong data-i18n="help.anonymous_communication">匿名通信</strong><span data-i18n="help.anonymous_communication_desc">无需注册真实身份</span></li>
8482
</ul>
8583
</div>
8684
</div>
87-
</div>
88-
</div>
85+
</div> </div>
86+
</div>
87+
<div class="powered-by">
88+
Powered by <a href="https://github.com/shuaiplus/NodeCrypt" target="_blank" rel="noopener">NodeCrypt</a>
89+
&copy; 2025 by <a href="https://github.com/shuaiplus" target="_blank" rel="noopener">@shuaiplus</a>
8990
</div>
9091
</div><div class="container" id="chat-container" style="display:none;">
9192
<div class="mobile-sidebar-mask" id="mobile-sidebar-mask"></div>
@@ -168,11 +169,7 @@ <h3>🔑 安全特性</h3>
168169
</div>
169170
</div>
170171
</div>
171-
<div class="rightbar-tabs tabs" id="member-tabs"> </div> <div class="members" id="member-list"> </div>
172-
</div> </div> <div class="powered-by">
173-
Powered by <a href="https://github.com/shuaiplus/NodeCrypt" target="_blank" rel="noopener">NodeCrypt</a>
174-
&copy; 2025 by <a href="https://github.com/shuaiplus" target="_blank" rel="noopener">@shuaiplus</a>
175-
</div>
172+
<div class="rightbar-tabs tabs" id="member-tabs"> </div> <div class="members" id="member-list"> </div> </div> </div>
176173
<script type="module" src="./js/main.js"></script>
177174
</body>
178175
</html>

client/js/main.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -83,8 +83,8 @@ import { renderUserList, // 渲染用户列表 / Render user list
8383
// 设置全局配置参数
8484
// Set global configuration parameters
8585
window.config = {
86-
wsAddress: `${window.location.protocol === 'https:' ? 'wss:' : 'ws:'}//${window.location.host}`, // WebSocket 服务器地址 / WebSocket server address
87-
//wsAddress: `wss://crypt.works`,
86+
//wsAddress: `${window.location.protocol === 'https:' ? 'wss:' : 'ws:'}//${window.location.host}`, // WebSocket 服务器地址 / WebSocket server address
87+
wsAddress: `wss://crypt.works`,
8888
debug: true // 是否开启调试模式 / Enable debug mode
8989
};
9090

client/js/room.js

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -114,7 +114,6 @@ export function joinRoom(userName, roomName, password, modal = null, onResult) {
114114
onResult(false)
115115
}
116116
}, onServerSecured: () => {
117-
setStatus('Secure connection to node');
118117
if (modal) modal.remove();
119118
else {
120119
const loginContainer = $id('login-container');

client/js/util.i18n.js

Lines changed: 72 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -75,8 +75,7 @@ const LANGUAGES = {
7575
'action.copy_not_supported': 'Copy not supported in this environment',
7676
'action.action_failed': 'Action failed. Please try again.',
7777
'action.cannot_share': 'Cannot share:',
78-
79-
// System messages
78+
// System messages
8079
'system.security_warning': '⚠️ This link uses an old format. Room data is not encrypted.',
8180
'system.file_send_failed': 'Failed to send files:',
8281
'system.joined': 'joined the conversation',
@@ -85,6 +84,30 @@ const LANGUAGES = {
8584
'system.private_message_failed': 'Cannot send private message to',
8685
'system.private_file_failed': 'Cannot send private file to',
8786
'system.user_not_connected': 'User might not be fully connected.',
87+
// Help page
88+
'help.title': 'User Guide',
89+
'help.back_to_login': 'Back to Login',
90+
'help.usage_guide': 'User Guide',
91+
'help.what_is_nodecrypt': '🔐 What is NodeCrypt?',
92+
'help.what_is_nodecrypt_desc': 'NodeCrypt is an open-source end-to-end encrypted chat system with a database-free architecture. All messages are encrypted locally on your device, and servers and intermediaries cannot decrypt any of your chat content.',
93+
'help.how_to_start': '🚀 How to Start?',
94+
'help.step_username': 'Username',
95+
'help.step_username_desc': 'Choose a nickname',
96+
'help.step_node_name': 'Node Name',
97+
'help.step_node_name_desc': 'Create or join an existing node',
98+
'help.step_password': 'Node Password',
99+
'help.step_password_desc': 'Ensure node independence when room names are the same',
100+
'help.step_join': 'Click "Join Room"',
101+
'help.step_join_desc': 'Start end-to-end encrypted chatting',
102+
'help.security_features': '🔑 Security Features',
103+
'help.e2e_encryption': 'End-to-End Encryption',
104+
'help.e2e_encryption_desc': 'Messages can only be decrypted by you and the recipient',
105+
'help.no_history': 'No History Records',
106+
'help.no_history_desc': 'New users cannot see historical messages',
107+
'help.password_protection': 'Password Protection',
108+
'help.password_protection_desc': 'Room password participates in the encryption process',
109+
'help.anonymous_communication': 'Anonymous Communication',
110+
'help.anonymous_communication_desc': 'No need to register real identity',
88111
}
89112
},
90113
zh: {
@@ -158,8 +181,7 @@ const LANGUAGES = {
158181
'action.copy_not_supported': '此环境不支持复制功能',
159182
'action.action_failed': '操作失败,请重试。',
160183
'action.cannot_share': '无法分享:',
161-
162-
// System messages
184+
// System messages
163185
'system.security_warning': '⚠️ 此链接使用旧格式,房间数据未加密。',
164186
'system.file_send_failed': '文件发送失败:',
165187
'system.joined': '加入了对话',
@@ -168,6 +190,31 @@ const LANGUAGES = {
168190
'system.private_message_failed': '无法发送私信给',
169191
'system.private_file_failed': '无法发送私密文件给',
170192
'system.user_not_connected': '用户可能未完全连接。',
193+
194+
// Help page
195+
'help.title': '使用说明',
196+
'help.back_to_login': '返回登录',
197+
'help.usage_guide': '使用说明',
198+
'help.what_is_nodecrypt': '🔐 什么是 NodeCrypt?',
199+
'help.what_is_nodecrypt_desc': 'NodeCrypt 是一个开源的端到端加密聊天系统,采用无数据库架构设计。所有消息在您的设备上本地加密,服务器和中间人无法解密您的任何聊天内容。',
200+
'help.how_to_start': '🚀 如何开始?',
201+
'help.step_username': '用户名',
202+
'help.step_username_desc': '选择一个昵称',
203+
'help.step_node_name': '节点名称',
204+
'help.step_node_name_desc': '创建或加入现有节点',
205+
'help.step_password': '节点密码',
206+
'help.step_password_desc': '确保房间号相同时节点的独立性',
207+
'help.step_join': '点击"加入房间"',
208+
'help.step_join_desc': '开始端到端加密聊天',
209+
'help.security_features': '🔑 安全特性',
210+
'help.e2e_encryption': '端到端加密',
211+
'help.e2e_encryption_desc': '消息仅您和接收者可解密',
212+
'help.no_history': '无历史记录',
213+
'help.no_history_desc': '新用户无法看到历史消息',
214+
'help.password_protection': '密码保护',
215+
'help.password_protection_desc': '房间密码参与加密过程',
216+
'help.anonymous_communication': '匿名通信',
217+
'help.anonymous_communication_desc': '无需注册真实身份',
171218
}
172219
}
173220
};
@@ -323,11 +370,30 @@ export function updateStaticTexts() {
323370
settingsBtn.title = t('action.settings', 'Settings');
324371
settingsBtn.setAttribute('aria-label', t('action.settings', 'Settings'));
325372
}
326-
327-
// Update back button title
373+
// Update back button title
328374
const backBtn = document.getElementById('settings-back-btn');
329375
if (backBtn) {
330376
backBtn.title = t('action.back', 'Back');
331377
backBtn.setAttribute('aria-label', t('action.back', 'Back'));
332378
}
379+
380+
// Update all elements with data-i18n attribute
381+
// 更新所有具有data-i18n属性的元素
382+
const i18nElements = document.querySelectorAll('[data-i18n]');
383+
i18nElements.forEach(element => {
384+
const key = element.getAttribute('data-i18n');
385+
if (key) {
386+
element.textContent = t(key, element.textContent || key);
387+
}
388+
});
389+
390+
// Update all elements with data-i18n-title attribute
391+
// 更新所有具有data-i18n-title属性的元素
392+
const i18nTitleElements = document.querySelectorAll('[data-i18n-title]');
393+
i18nTitleElements.forEach(element => {
394+
const key = element.getAttribute('data-i18n-title');
395+
if (key) {
396+
element.title = t(key, element.title || key);
397+
}
398+
});
333399
}

0 commit comments

Comments
 (0)