Skip to content
This repository was archived by the owner on Dec 1, 2025. It is now read-only.

Commit 5b8934d

Browse files
committed
Revise community interaction documentation to include a quiz for joining the QQ group, enhancing user engagement and compliance with community rules. Update main.html to dynamically link to the community interaction page based on the current language.
1 parent f6bf98b commit 5b8934d

File tree

2 files changed

+206
-13
lines changed

2 files changed

+206
-13
lines changed
Lines changed: 202 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -1,17 +1,5 @@
11
欢迎加入 New API 开源社区!在这里,你可以与其他开发者交流经验,分享想法。
22

3-
## 🤝 加入我们的QQ交流群
4-
5-
我们提供两种方式加入QQ群:
6-
7-
### 方式一:扫描二维码
8-
9-
![QQ群二维码](../assets/qq_3.jpg)
10-
11-
### 方式二:点击链接
12-
13-
[点击这里直接加入QQ群](https://qm.qq.com/q/Y79glR8raU)
14-
153
## 📜 群规则
164

175
为了维护良好的社区氛围,请遵守以下规则:
@@ -27,3 +15,205 @@
2715

2816
!!! tip "温馨提示"
2917
如果您有任何功能建议或bug反馈,建议直接在GitHub上提交issue,这样可以更好地追踪和解决问题。
18+
19+
## 🤝 加入我们的QQ交流群
20+
21+
!!! info "加入前请完成问卷"
22+
请认真阅读上述群规则后,完成以下问卷验证。只有全部答对才能显示QQ群信息。
23+
24+
<div id="quizContainer" style="margin: 20px 0;">
25+
<div style="margin-bottom: 20px; padding: 15px; background: var(--md-code-bg-color); border-radius: 4px;">
26+
<p style="font-weight: 600; margin-bottom: 10px;">1. New API 是什么?</p>
27+
<label style="display: block; margin: 8px 0; cursor: pointer;">
28+
<input type="radio" name="q1" value="a" style="margin-right: 8px;">
29+
<span>一个商业API销售平台</span>
30+
</label>
31+
<label style="display: block; margin: 8px 0; cursor: pointer;">
32+
<input type="radio" name="q1" value="b" style="margin-right: 8px;">
33+
<span>开源的 AI 接口管理与分发系统</span>
34+
</label>
35+
<label style="display: block; margin: 8px 0; cursor: pointer;">
36+
<input type="radio" name="q1" value="c" style="margin-right: 8px;">
37+
<span>一个付费软件</span>
38+
</label>
39+
<label style="display: block; margin: 8px 0; cursor: pointer;">
40+
<input type="radio" name="q1" value="d" style="margin-right: 8px;">
41+
<span>一个公益API站点</span>
42+
</label>
43+
</div>
44+
45+
<div style="margin-bottom: 20px; padding: 15px; background: var(--md-code-bg-color); border-radius: 4px;">
46+
<p style="font-weight: 600; margin-bottom: 10px;">2. 群里可以发布账号求购信息吗?</p>
47+
<label style="display: block; margin: 8px 0; cursor: pointer;">
48+
<input type="radio" name="q2" value="true" style="margin-right: 8px;">
49+
<span>可以</span>
50+
</label>
51+
<label style="display: block; margin: 8px 0; cursor: pointer;">
52+
<input type="radio" name="q2" value="false" style="margin-right: 8px;">
53+
<span>不可以</span>
54+
</label>
55+
</div>
56+
57+
<div style="margin-bottom: 20px; padding: 15px; background: var(--md-code-bg-color); border-radius: 4px;">
58+
<p style="font-weight: 600; margin-bottom: 10px;">3. New API 是否存在收费版本?</p>
59+
<label style="display: block; margin: 8px 0; cursor: pointer;">
60+
<input type="radio" name="q3" value="true" style="margin-right: 8px;">
61+
<span>存在收费版本</span>
62+
</label>
63+
<label style="display: block; margin: 8px 0; cursor: pointer;">
64+
<input type="radio" name="q3" value="false" style="margin-right: 8px;">
65+
<span>不存在收费版本,完全免费开源</span>
66+
</label>
67+
</div>
68+
69+
<div style="margin-bottom: 20px; padding: 15px; background: var(--md-code-bg-color); border-radius: 4px;">
70+
<p style="font-weight: 600; margin-bottom: 10px;">4. 群主和管理员是否有义务为我提供技术支持?</p>
71+
<label style="display: block; margin: 8px 0; cursor: pointer;">
72+
<input type="radio" name="q4" value="true" style="margin-right: 8px;">
73+
<span>有义务提供技术支持</span>
74+
</label>
75+
<label style="display: block; margin: 8px 0; cursor: pointer;">
76+
<input type="radio" name="q4" value="false" style="margin-right: 8px;">
77+
<span>没有义务提供技术支持,应提交 issue</span>
78+
</label>
79+
</div>
80+
81+
<div style="margin-bottom: 20px; padding: 15px; background: var(--md-code-bg-color); border-radius: 4px;">
82+
<p style="font-weight: 600; margin-bottom: 10px;">5. 群内可以购买管理员出售的 API 产品吗?</p>
83+
<label style="display: block; margin: 8px 0; cursor: pointer;">
84+
<input type="radio" name="q5" value="true" style="margin-right: 8px;">
85+
<span>可以购买</span>
86+
</label>
87+
<label style="display: block; margin: 8px 0; cursor: pointer;">
88+
<input type="radio" name="q5" value="false" style="margin-right: 8px;">
89+
<span>不可以,本群不出售任何 API 产品</span>
90+
</label>
91+
</div>
92+
93+
<div id="quizError" style="display: none; padding: 12px; background: #ffebee; color: #c62828; border-radius: 4px; margin-bottom: 15px; border-left: 4px solid #c62828;">
94+
<strong>⚠️ 回答错误!</strong><br>
95+
<span id="errorMessage">请认真阅读群规则后重新作答。</span>
96+
</div>
97+
98+
<button id="submitQuiz" style="width: 100%; padding: 12px 20px; background: #1976d2; color: white; border: none; border-radius: 4px; font-size: 15px; font-weight: 500; cursor: pointer; transition: background 0.3s;">
99+
提交答案
100+
</button>
101+
</div>
102+
103+
<div id="qqGroupInfo" style="display: none; opacity: 0; transition: opacity 0.3s ease-in; margin-top: 20px;">
104+
<h3>方式一:扫描二维码</h3>
105+
<p><img src="/assets/qq_3.jpg" alt="QQ群二维码" style="max-width: 300px; border-radius: 8px; box-shadow: 0 2px 8px rgba(0,0,0,0.1);"></p>
106+
<h3>方式二:点击链接</h3>
107+
<p><a href="https://qm.qq.com/q/Y79glR8raU" target="_blank" style="display: inline-block; padding: 10px 20px; background: #1976d2; color: white; text-decoration: none; border-radius: 4px; font-weight: 500;">点击这里直接加入QQ群</a></p>
108+
</div>
109+
110+
<script>
111+
document.addEventListener('DOMContentLoaded', function() {
112+
const submitBtn = document.getElementById('submitQuiz');
113+
const qqGroupInfo = document.getElementById('qqGroupInfo');
114+
const quizError = document.getElementById('quizError');
115+
const errorMessage = document.getElementById('errorMessage');
116+
const quizContainer = document.getElementById('quizContainer');
117+
118+
// 正确答案
119+
const correctAnswers = {
120+
q1: 'b', // New API 是开源的 AI 接口管理与分发系统
121+
q2: 'false', // 不可以发布求购信息
122+
q3: 'false', // 不存在收费版本
123+
q4: 'false', // 没有义务提供技术支持
124+
q5: 'false' // 不可以购买 API 产品
125+
};
126+
127+
// 错误提示信息
128+
const errorMessages = {
129+
q1: '请再次阅读项目介绍,New API 是一个开源的 AI 接口管理与分发系统。',
130+
q2: '根据群规则第2条:群聊禁止发布任何账号出售、求购相关信息。',
131+
q3: '根据群规则第4条:New API 不存在收费版本,完全免费开源。',
132+
q4: '根据群规则第1条:本群管理和群主没有任何义务为您提供任何技术支持,如有问题请提交 issue。',
133+
q5: '根据群规则第3条:本群不出售任何 API 产品,请勿听信购买任何人的 API 产品(包括管理员的)。'
134+
};
135+
136+
if (submitBtn) {
137+
submitBtn.addEventListener('click', function() {
138+
// 隐藏之前的错误信息
139+
quizError.style.display = 'none';
140+
141+
// 检查是否所有题目都已作答
142+
let allAnswered = true;
143+
let wrongAnswers = [];
144+
145+
for (let question in correctAnswers) {
146+
const selected = document.querySelector(`input[name="${question}"]:checked`);
147+
if (!selected) {
148+
allAnswered = false;
149+
break;
150+
}
151+
152+
// 检查答案是否正确
153+
if (selected.value !== correctAnswers[question]) {
154+
wrongAnswers.push(question);
155+
}
156+
}
157+
158+
if (!allAnswered) {
159+
errorMessage.innerHTML = '请回答所有问题后再提交。';
160+
quizError.style.display = 'block';
161+
quizError.scrollIntoView({ behavior: 'smooth', block: 'center' });
162+
return;
163+
}
164+
165+
if (wrongAnswers.length > 0) {
166+
// 显示第一个错误的详细信息
167+
errorMessage.innerHTML = errorMessages[wrongAnswers[0]];
168+
quizError.style.display = 'block';
169+
quizError.scrollIntoView({ behavior: 'smooth', block: 'center' });
170+
171+
// 将按钮变红并添加摇晃动画
172+
submitBtn.style.background = '#c62828';
173+
submitBtn.style.animation = 'shake 0.5s';
174+
setTimeout(() => {
175+
submitBtn.style.background = '#1976d2';
176+
submitBtn.style.animation = '';
177+
}, 1000);
178+
} else {
179+
// 全部答对,显示 QQ 群信息
180+
quizError.style.display = 'none';
181+
quizContainer.style.display = 'none';
182+
qqGroupInfo.style.display = 'block';
183+
setTimeout(() => {
184+
qqGroupInfo.style.opacity = '1';
185+
}, 10);
186+
187+
// 显示成功消息
188+
const successMsg = document.createElement('div');
189+
successMsg.style.cssText = 'padding: 15px; background: #e8f5e9; color: #2e7d32; border-radius: 4px; margin-bottom: 20px; border-left: 4px solid #4caf50;';
190+
successMsg.innerHTML = '<strong>✅ 恭喜通过验证!</strong><br>感谢您认真阅读群规则,欢迎加入我们的社区!';
191+
qqGroupInfo.parentElement.insertBefore(successMsg, qqGroupInfo);
192+
193+
successMsg.scrollIntoView({ behavior: 'smooth', block: 'center' });
194+
}
195+
});
196+
197+
// 按钮悬停效果
198+
submitBtn.addEventListener('mouseenter', function() {
199+
if (this.style.background !== 'rgb(198, 40, 40)') {
200+
this.style.background = '#1565c0';
201+
}
202+
});
203+
204+
submitBtn.addEventListener('mouseleave', function() {
205+
if (this.style.background !== 'rgb(198, 40, 40)') {
206+
this.style.background = '#1976d2';
207+
}
208+
});
209+
}
210+
});
211+
</script>
212+
213+
<style>
214+
@keyframes shake {
215+
0%, 100% { transform: translateX(0); }
216+
10%, 30%, 50%, 70%, 90% { transform: translateX(-5px); }
217+
20%, 40%, 60%, 80% { transform: translateX(5px); }
218+
}
219+
</style>

newapi/overrides/main.html

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@
44
{% extends "base.html" %}
55
{#- Load translations based on current language -#}
66
{% if page and page.file and "en/" in page.file.src_uri %}
7+
{% set community_url = "/en/support/community-interaction/" %}
78
{% set translations = {
89
"announce": {
910
"follow": "Follow our latest updates on",
@@ -25,6 +26,7 @@
2526
]
2627
} %}
2728
{% elif page and page.file and "ja/" in page.file.src_uri %}
29+
{% set community_url = "/ja/support/community-interaction/" %}
2830
{% set translations = {
2931
"announce": {
3032
"follow": "最新情報は",
@@ -46,6 +48,7 @@
4648
]
4749
} %}
4850
{% else %}
51+
{% set community_url = "/support/community-interaction/" %}
4952
{% set translations = {
5053
"announce": {
5154
"follow": "在",
@@ -80,7 +83,7 @@
8083
<strong>{{ translations.announce.github }}</strong>
8184
</a>
8285
{{ translations.announce.or }}
83-
<a href="https://qm.qq.com/q/Y79glR8raU" target="_blank">
86+
<a href="{{ community_url | url }}">
8487
<span class="twemoji qq">
8588
{% include ".icons/fontawesome/brands/qq.svg" %}
8689
</span>

0 commit comments

Comments
 (0)