mirror of
https://github.com/the1812/Bilibili-Evolved.git
synced 2025-11-04 21:22:45 +08:00
104 lines
3.0 KiB
TypeScript
104 lines
3.0 KiB
TypeScript
import { wrapSwitchOptions } from '@/components/switch-options'
|
|
|
|
const name = 'simplifyComments'
|
|
export const component = wrapSwitchOptions({
|
|
name: 'simplifyOptions',
|
|
switchProps: {
|
|
checkedIcon: 'mdi-checkbox-marked-circle',
|
|
notCheckedIcon: 'mdi-checkbox-blank-circle-outline',
|
|
},
|
|
dimAt: false,
|
|
switches: {
|
|
userLevel: {
|
|
defaultValue: true,
|
|
displayName: '用户等级',
|
|
},
|
|
decorateAndTime: {
|
|
defaultValue: true,
|
|
displayName: '装扮 & 时间',
|
|
},
|
|
subReplyNewLine: {
|
|
defaultValue: true,
|
|
displayName: '回复换行',
|
|
},
|
|
replyEditor: {
|
|
defaultValue: true,
|
|
displayName: '编辑框',
|
|
},
|
|
fansMedal: {
|
|
defaultValue: false,
|
|
displayName: '粉丝勋章',
|
|
},
|
|
eventBanner: {
|
|
defaultValue: true,
|
|
displayName: '小喇叭横幅',
|
|
},
|
|
},
|
|
})({
|
|
name,
|
|
displayName: '简化评论区',
|
|
entry: async ({ metadata, settings }) => {
|
|
const { addStyle, getDefaultStyleID } = await import('@/core/style')
|
|
const { isContainerStyleQuerySupported } = await import('@/core/container-query')
|
|
const { addComponentListener } = await import('@/core/settings')
|
|
addComponentListener(
|
|
metadata.name,
|
|
(value: boolean) => {
|
|
document.body.classList.toggle('simplify-comment', value)
|
|
},
|
|
true,
|
|
)
|
|
|
|
// 等 Firefox 支持 [Container Style Queries](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_containment/Container_size_and_style_queries#container_style_queries_2) 可去除此判断
|
|
if (isContainerStyleQuerySupported()) {
|
|
const { shadowRootStyles } = await import('@/core/shadow-root')
|
|
const v3Style = await import('./comments-v3.scss').then(m => m.default)
|
|
shadowRootStyles.toggleWithComponent(metadata.name, { id: name, style: v3Style })
|
|
} else {
|
|
const { shadowRootStyles } = await import('@/core/shadow-root')
|
|
const firefoxStyles = require.context('./comments-v3-firefox', false, /\.scss$/)
|
|
|
|
Object.keys(settings.options).forEach(key => {
|
|
if (!key.startsWith('switch-')) {
|
|
return
|
|
}
|
|
const id = `${component.name}.${key}`
|
|
const styleName = lodash.kebabCase(key.replace(/^switch-/, ''))
|
|
const path = `./${styleName}.scss`
|
|
if (!firefoxStyles.keys().includes(path)) {
|
|
return
|
|
}
|
|
|
|
addComponentListener(
|
|
id,
|
|
(value: boolean) => {
|
|
if (value) {
|
|
const style = firefoxStyles(path) as string
|
|
addStyle(style, styleName)
|
|
shadowRootStyles.addStyle({
|
|
id,
|
|
style,
|
|
})
|
|
} else {
|
|
document.getElementById(getDefaultStyleID(styleName))?.remove()
|
|
shadowRootStyles.removeStyle(id)
|
|
}
|
|
},
|
|
true,
|
|
)
|
|
})
|
|
}
|
|
},
|
|
instantStyles: [
|
|
{
|
|
name: `${name}v1`,
|
|
style: () => import('./comments.scss'),
|
|
},
|
|
{
|
|
name: `${name}v2`,
|
|
style: () => import('./comments-v2.scss'),
|
|
},
|
|
],
|
|
tags: [componentsTags.style],
|
|
})
|