diff --git a/README.md b/README.md index 537e523..2f54a81 100644 --- a/README.md +++ b/README.md @@ -11,7 +11,7 @@ * 兼容YouTube直播评论栏的样式 * 金瓜子礼物模仿醒目留言显示 * 高亮舰队、房管、主播的用户名 -* 支持屏蔽弹幕、限制最大速度等设置 +* 支持屏蔽弹幕、合并相似弹幕等设置 * 自带样式生成器 ## 使用方法 diff --git a/frontend/package-lock.json b/frontend/package-lock.json index ee699ec..1e3c5af 100644 --- a/frontend/package-lock.json +++ b/frontend/package-lock.json @@ -9723,6 +9723,7 @@ "fsevents": { "version": "1.2.9", "resolved": "https://registry.npm.taobao.org/fsevents/download/fsevents-1.2.9.tgz", + "integrity": "sha512-oeyj2H3EjjonWcFjD5NvZNE9Rqe4UW+nQBU2HNeKw0koVLEFIhtyETyAakeAM3de7Z/SW5kcA+fZUait9EApnw==", "dev": true, "optional": true, "requires": { @@ -18954,6 +18955,11 @@ "integrity": "sha1-qVT5Ma66UI0we78Gnv8MAclhFvc=", "dev": true }, + "serialize-javascript": { + "version": "2.1.1", + "resolved": "https://registry.npmjs.org/serialize-javascript/-/serialize-javascript-2.1.1.tgz", + "integrity": "sha512-MPLPRpD4FNqWq9tTIjYG5LesFouDhdyH0EPY3gVK4DRD5+g4aDqdNSzLIwceulo3Yj+PL1bPh6laE5+H6LTcrQ==" + }, "serve-index": { "version": "1.9.1", "resolved": "https://registry.npm.taobao.org/serve-index/download/serve-index-1.9.1.tgz", diff --git a/frontend/public/static/img/tutorial/tutorial-1.png b/frontend/public/static/img/tutorial/tutorial-1.png new file mode 100644 index 0000000..bb36aae Binary files /dev/null and b/frontend/public/static/img/tutorial/tutorial-1.png differ diff --git a/frontend/public/static/img/tutorial/tutorial-2.png b/frontend/public/static/img/tutorial/tutorial-2.png new file mode 100644 index 0000000..a69ca2d Binary files /dev/null and b/frontend/public/static/img/tutorial/tutorial-2.png differ diff --git a/frontend/public/static/img/tutorial/tutorial-3.png b/frontend/public/static/img/tutorial/tutorial-3.png new file mode 100644 index 0000000..a7ffbc0 Binary files /dev/null and b/frontend/public/static/img/tutorial/tutorial-3.png differ diff --git a/frontend/public/static/img/tutorial/tutorial-4.png b/frontend/public/static/img/tutorial/tutorial-4.png new file mode 100644 index 0000000..55c9c5d Binary files /dev/null and b/frontend/public/static/img/tutorial/tutorial-4.png differ diff --git a/frontend/public/static/img/tutorial/tutorial-5.png b/frontend/public/static/img/tutorial/tutorial-5.png new file mode 100644 index 0000000..3a4cf61 Binary files /dev/null and b/frontend/public/static/img/tutorial/tutorial-5.png differ diff --git a/frontend/src/lang/en.js b/frontend/src/lang/en.js index 0f5bbee..dda15ee 100644 --- a/frontend/src/lang/en.js +++ b/frontend/src/lang/en.js @@ -2,6 +2,7 @@ export default { sidebar: { home: 'Home', stylegen: 'Style generator', + help: 'Help', projectAddress: 'Project address', giftRecord: 'Super Chat record' }, @@ -106,5 +107,13 @@ export default { result: 'Result', copy: 'Copy', resetConfig: 'Reset config' + }, + help: { + help: 'Help', + p1: '1. Copy the room ID from the Bilibili live room webpage', + p2: '2. Enter the room ID into the room ID on the home page. Copy the room URL after saving the configuration', + p3: '3. Generate styles with the style generator. Copy the CSS', + p4: '4. Add browser source in OBS', + p5: '5. Enter the previously copied room URL at URL, and enter the previously copied CSS at custom CSS' } } diff --git a/frontend/src/lang/ja.js b/frontend/src/lang/ja.js index e4b9e2e..0093c4e 100644 --- a/frontend/src/lang/ja.js +++ b/frontend/src/lang/ja.js @@ -1,7 +1,8 @@ -export default { +export default { sidebar: { home: 'トップページ', stylegen: 'スタイルジェネレータ', + help: 'ヘルプ', projectAddress: 'プロジェクトアドレス', giftRecord: 'スーパーチャット記録' }, @@ -106,5 +107,13 @@ result: '結果', copy: 'コピー', resetConfig: 'デフォルトに戻す' + }, + help: { + help: 'ヘルプ', + p1: '1. ビリビリの生放送ウェブから生放送ルームIDをこぴーする', + p2: '2. ホームページでコピーしたIDを入力し、配置を保存すると、ルームのURLをこぴーする', + p3: '3. スタイルジェネレータでお好みのコメント様子を選び、出力したCSSをコピーする', + p4: '4. OBSでブラウザを新規作成する', + p5: '5. プロパティでこぴーしたURLを入力し、カスタムCSSでスタイルジェネレータのCSSを入力する' } } diff --git a/frontend/src/lang/zh.js b/frontend/src/lang/zh.js index b6a01c7..f22afbf 100644 --- a/frontend/src/lang/zh.js +++ b/frontend/src/lang/zh.js @@ -2,6 +2,7 @@ export default { sidebar: { home: '首页', stylegen: '样式生成器', + help: '帮助', projectAddress: '项目地址', giftRecord: '打赏记录' }, @@ -106,5 +107,13 @@ export default { result: '结果', copy: '复制', resetConfig: '恢复默认设置' + }, + help: { + help: '帮助', + p1: '1. 从B站直播间网页复制房间ID', + p2: '2. 把房间ID输入到首页的房间ID，保存配置后复制房间URL', + p3: '3. 使用样式生成器生成样式，复制CSS', + p4: '4. 在OBS中添加浏览器源', + p5: '5. URL处输入之前复制的房间URL，自定义CSS处输入之前复制的CSS' } } diff --git a/frontend/src/layout/Sidebar.vue b/frontend/src/layout/Sidebar.vue index fcbade6..b314b9b 100644 --- a/frontend/src/layout/Sidebar.vue +++ b/frontend/src/layout/Sidebar.vue @@ -13,6 +13,9 @@ {{$t('sidebar.stylegen')}} + + {{$t('sidebar.help')}} + {{$t('sidebar.projectAddress')}} diff --git a/frontend/src/main.js b/frontend/src/main.js index 7f9eb3d..2f99a73 100644 --- a/frontend/src/main.js +++ b/frontend/src/main.js @@ -9,6 +9,7 @@ import App from './App.vue' import Layout from './layout' import Home from './views/Home.vue' import StyleGenerator from './views/StyleGenerator' +import Help from './views/Help' import Room from './views/Room.vue' import NotFound from './views/NotFound.vue' @@ -37,7 +38,8 @@ const router = new VueRouter({ component: Layout, children: [ {path: '', component: Home}, - {path: 'stylegen', name: 'stylegen', component: StyleGenerator} + {path: 'stylegen', name: 'stylegen', component: StyleGenerator}, + {path: 'help', name: 'help', component: Help} ] }, {path: '/room/:roomId', name: 'room', component: Room}, diff --git a/frontend/src/views/Help.vue b/frontend/src/views/Help.vue new file mode 100644 index 0000000..250130a --- /dev/null +++ b/frontend/src/views/Help.vue @@ -0,0 +1,21 @@ + + +