Add custom style API

This commit is contained in:
the1812 2019-11-25 22:43:35 +08:00
parent 80511491c3
commit b2992f40e7
10 changed files with 866 additions and 687 deletions

View File

@ -56,6 +56,13 @@ declare global {
count: number count: number
date: string date: string
} }
interface CustomStyle {
style: string
name: string
displayName: string
enabled: boolean
mode?: 'default' | 'instant' | 'important'
}
interface MonkeyInfo { interface MonkeyInfo {
script: { script: {
author: string; author: string;
@ -385,6 +392,7 @@ declare global {
hideRelatedVideos: boolean, hideRelatedVideos: boolean,
defaultMedalID: number, defaultMedalID: number,
autoMatchMedal: boolean, autoMatchMedal: boolean,
customStyles: CustomStyle[],
latestVersionLink: string, latestVersionLink: string,
currentVersion: string, currentVersion: string,
} }

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -34,7 +34,7 @@
// ==/UserScript== // ==/UserScript==
Vue.config.productionTip = false Vue.config.productionTip = false
Vue.config.devtools = false Vue.config.devtools = false
import { logError, raiseEvent, loadLazyPanel, contentLoaded, fixed } from './utils' import { logError, raiseEvent, loadLazyPanel, contentLoaded, fixed, isOffline, getUID, scriptVersion, getCsrf, formatCount, escapeFilename } from './utils'
import { settings, loadSettings, settingsChangeHandlers } from './settings' import { settings, loadSettings, settingsChangeHandlers } from './settings'
import { Ajax, setupAjaxHook } from './ajax' import { Ajax, setupAjaxHook } from './ajax'
import { loadResources } from './resource-loader' import { loadResources } from './resource-loader'
@ -50,6 +50,7 @@ import { resourceManifest } from './resource-manifest'
import { StyleManager } from './style-manager' import { StyleManager } from './style-manager'
import { ResourceManager } from './resource-manager' import { ResourceManager } from './resource-manager'
import { getScriptBlocker } from './script-blocker' import { getScriptBlocker } from './script-blocker'
import { installStyle, uninstallStyle } from './custom-styles'
(async () => { (async () => {
if (await GM.getValue('customNavbar') === true if (await GM.getValue('customNavbar') === true
@ -163,6 +164,14 @@ import { getScriptBlocker } from './script-blocker'
formatDuration, formatDuration,
getDpiSourceSet, getDpiSourceSet,
getScriptBlocker, getScriptBlocker,
isOffline,
getUID,
scriptVersion,
getCsrf,
formatCount,
escapeFilename,
installStyle,
uninstallStyle,
resources, resources,
theWorld: waitTime => { theWorld: waitTime => {
if (waitTime > 0) { if (waitTime > 0) {

View File

@ -0,0 +1,16 @@
export const installStyle = style => {
settings.customStyles.push(Object.assign({
enabled: true,
mode: 'default',
}, style))
settings.customStyles = settings.customStyles
console.log(`已安装自定义样式'${style.displayName}'`)
}
export const uninstallStyle = name => {
const styleIndex = settings.customStyles.findIndex(it => it.name === name)
if (styleIndex !== -1) {
settings.customStyles.splice(styleIndex, 1)
settings.customStyles = settings.customStyles
console.log(`已卸载自定义样式.`)
}
}

View File

@ -151,6 +151,7 @@ export class ResourceManager {
// loadingToast.dismiss() // loadingToast.dismiss()
// } // }
this.applyReloadables() // reloadables run sync this.applyReloadables() // reloadables run sync
this.styleManager.applyCustomStyles()
// await this.applyDropdownOptions(); // await this.applyDropdownOptions();
// this.applyWidgets() // No need to wait the widgets // this.applyWidgets() // No need to wait the widgets
if (!isOffline() && settings.scriptDownloadMode === 'bundle') { if (!isOffline() && settings.scriptDownloadMode === 'bundle') {

View File

@ -173,6 +173,7 @@ export const settings = {
hideRelatedVideos: false, hideRelatedVideos: false,
defaultMedalID: 0, defaultMedalID: 0,
autoMatchMedal: false, autoMatchMedal: false,
customStyles: [],
cache: {}, cache: {},
} }
const fixedSettings = { const fixedSettings = {

View File

@ -73,5 +73,13 @@ export class StyleManager {
this.fetchStyleByKey(key) this.fetchStyleByKey(key)
} }
} }
for (const style of settings.customStyles.filter(it => it.mode === 'instant' && it.enabled)) {
this.applyStyleFromText(style.style, this.getDefaultStyleId(style.name))
}
}
applyCustomStyles() {
for (const style of settings.customStyles.filter(it => it.mode !== 'instant' && it.enabled)) {
this[style.mode === 'important' ? 'applyImportantStyleFromText' : 'applyStyleFromText'](style.style, this.getDefaultStyleId(style.name))
}
} }
} }