mirror of
https://github.com/gotson/komga.git
synced 2026-05-08 21:00:16 +02:00
refactor(webui): simplify logger
This commit is contained in:
parent
6bb7135088
commit
3cdd1e6177
5 changed files with 47 additions and 53 deletions
5
komga-webui/package-lock.json
generated
5
komga-webui/package-lock.json
generated
|
|
@ -15,7 +15,6 @@
|
|||
"js-file-downloader": "^1.1.22",
|
||||
"language-tags": "^1.0.5",
|
||||
"lodash": "^4.17.21",
|
||||
"loglevel": "^1.7.1",
|
||||
"qs": "^6.10.1",
|
||||
"screenfull": "^5.1.0",
|
||||
"vue": "^2.6.14",
|
||||
|
|
@ -13986,6 +13985,7 @@
|
|||
"version": "1.7.1",
|
||||
"resolved": "https://registry.npmjs.org/loglevel/-/loglevel-1.7.1.tgz",
|
||||
"integrity": "sha512-Hesni4s5UkWkwCGJMQGAh71PaLUmKFM60dHvq0zi/vDhhrzuk+4GgNbTXJ12YYQJn6ZKBDNIjYcuQGKudvqrIw==",
|
||||
"dev": true,
|
||||
"engines": {
|
||||
"node": ">= 0.6.0"
|
||||
},
|
||||
|
|
@ -32809,7 +32809,8 @@
|
|||
"loglevel": {
|
||||
"version": "1.7.1",
|
||||
"resolved": "https://registry.npmjs.org/loglevel/-/loglevel-1.7.1.tgz",
|
||||
"integrity": "sha512-Hesni4s5UkWkwCGJMQGAh71PaLUmKFM60dHvq0zi/vDhhrzuk+4GgNbTXJ12YYQJn6ZKBDNIjYcuQGKudvqrIw=="
|
||||
"integrity": "sha512-Hesni4s5UkWkwCGJMQGAh71PaLUmKFM60dHvq0zi/vDhhrzuk+4GgNbTXJ12YYQJn6ZKBDNIjYcuQGKudvqrIw==",
|
||||
"dev": true
|
||||
},
|
||||
"loose-envify": {
|
||||
"version": "1.4.0",
|
||||
|
|
|
|||
|
|
@ -17,7 +17,6 @@
|
|||
"js-file-downloader": "^1.1.22",
|
||||
"language-tags": "^1.0.5",
|
||||
"lodash": "^4.17.21",
|
||||
"loglevel": "^1.7.1",
|
||||
"qs": "^6.10.1",
|
||||
"screenfull": "^5.1.0",
|
||||
"vue": "^2.6.14",
|
||||
|
|
|
|||
|
|
@ -129,13 +129,13 @@ export default Vue.extend({
|
|||
immediate: true,
|
||||
},
|
||||
currentPage(val, old) {
|
||||
this.$logDebug('[watch:currentPage]', `old:${old}`, `new:${val}`)()
|
||||
this.$debug('[watch:currentPage]', `old:${old}`, `new:${val}`)
|
||||
this.$emit('update:page', val)
|
||||
},
|
||||
page(val, old) {
|
||||
this.$logDebug('[watch:page]', `old:${old}`, `new:${val}`)()
|
||||
this.$debug('[watch:page]', `old:${old}`, `new:${val}`)
|
||||
const spreadIndex = this.toSpreadIndex(val)
|
||||
this.$logDebug('[watch:page]', `toSpreadIndex:${spreadIndex}`)()
|
||||
this.$debug('[watch:page]', `toSpreadIndex:${spreadIndex}`)
|
||||
this.carouselPage = spreadIndex
|
||||
},
|
||||
pageLayout: {
|
||||
|
|
@ -179,7 +179,7 @@ export default Vue.extend({
|
|||
return this.carouselPage + 1
|
||||
},
|
||||
currentPage(): number {
|
||||
this.$logDebug('[currentPage]', `carouselPage:${this.carouselPage}`, `spreads.length:${this.spreads.length}`)()
|
||||
this.$debug('[currentPage]', `carouselPage:${this.carouselPage}`, `spreads.length:${this.spreads.length}`)
|
||||
if (this.carouselPage >= 0 && this.carouselPage < this.spreads.length && this.spreads.length > 0) {
|
||||
return this.spreads[this.carouselPage][0].number
|
||||
}
|
||||
|
|
@ -254,7 +254,7 @@ export default Vue.extend({
|
|||
}
|
||||
},
|
||||
toSpreadIndex(i: number): number {
|
||||
this.$logDebug('[toSpreadIndex]', `i:${i}`, `isDoublePages:${this.isDoublePages}`)()
|
||||
this.$debug('[toSpreadIndex]', `i:${i}`, `isDoublePages:${this.isDoublePages}`)
|
||||
if (this.spreads.length > 0) {
|
||||
if (this.isDoublePages) {
|
||||
for (let j = 0; j < this.spreads.length; j++) {
|
||||
|
|
|
|||
|
|
@ -1,60 +1,54 @@
|
|||
import _Vue from 'vue'
|
||||
import log from 'loglevel'
|
||||
import _, {isArray, isObject} from 'lodash'
|
||||
import {format} from 'date-fns'
|
||||
|
||||
export default {
|
||||
install(Vue: typeof _Vue) {
|
||||
if (process.env.VUE_APPlog_LEVEL)
|
||||
log.setLevel(process.env.VUE_APPlog_LEVEL as any)
|
||||
let isDebug = false
|
||||
if (process.env.VUE_APP_LOG_LEVEL || window.localStorage['loglevel'])
|
||||
isDebug = true
|
||||
|
||||
Vue.prototype.$logTrace = function (...msg: any[]) {
|
||||
const loggerName = _.get(this, 'logger') || _.get(this, '$options.name')
|
||||
const logger = loggerName ? log.getLogger(loggerName) : log
|
||||
return logger.trace.bind(logger, getPrefix('TRACE', loggerName), ...(stringArgs(msg)))
|
||||
}
|
||||
Object.defineProperty(Vue.prototype, '$debug', {
|
||||
get: function () {
|
||||
// eslint-disable-next-line no-console
|
||||
return isDebug ? console.log.bind(console, timestamp(), 'DEBUG ---') : noop
|
||||
},
|
||||
})
|
||||
|
||||
Vue.prototype.$logDebug = function (...msg: any[]) {
|
||||
const loggerName = _.get(this, 'logger') || _.get(this, '$options.name')
|
||||
const logger = loggerName ? log.getLogger(loggerName) : log
|
||||
return logger.debug.bind(logger, getPrefix('DEBUG', loggerName), ...(stringArgs(msg)))
|
||||
}
|
||||
Object.defineProperty(Vue.prototype, '$info', {
|
||||
get: function () {
|
||||
// eslint-disable-next-line no-console
|
||||
return isDebug ? console.log.bind(console, timestamp(), 'INFO ---') : noop
|
||||
},
|
||||
})
|
||||
|
||||
Vue.prototype.$logInfo = function (...msg: any[]) {
|
||||
const loggerName = _.get(this, 'logger') || _.get(this, '$options.name')
|
||||
const logger = loggerName ? log.getLogger(loggerName) : log
|
||||
return logger.info.bind(logger, getPrefix('INFO', loggerName), ...(stringArgs(msg)))
|
||||
}
|
||||
Object.defineProperty(Vue.prototype, '$warn', {
|
||||
get: function () {
|
||||
// eslint-disable-next-line no-console
|
||||
return isDebug ? console.warn.bind(console, timestamp(), 'WARN ---') : noop
|
||||
},
|
||||
})
|
||||
|
||||
Vue.prototype.$logWarn = function (...msg: any[]) {
|
||||
const loggerName = _.get(this, 'logger') || _.get(this, '$options.name')
|
||||
const logger = loggerName ? log.getLogger(loggerName) : log
|
||||
return logger.warn.bind(logger, getPrefix('WARN', loggerName), ...(stringArgs(msg)))
|
||||
}
|
||||
|
||||
Vue.prototype.$logError = function (...msg: any[]) {
|
||||
const loggerName = _.get(this, 'logger') || _.get(this, '$options.name')
|
||||
const logger = loggerName ? log.getLogger(loggerName) : log
|
||||
return logger.error.bind(logger, getPrefix('ERROR', loggerName), ...(stringArgs(msg)))
|
||||
}
|
||||
Object.defineProperty(Vue.prototype, '$err', {
|
||||
get: function () {
|
||||
// eslint-disable-next-line no-console
|
||||
return isDebug ? console.error.bind(console, timestamp(), 'ERROR ---') : noop
|
||||
},
|
||||
})
|
||||
},
|
||||
}
|
||||
|
||||
function stringArgs(msg: any[]): any[] {
|
||||
return msg.map(m => isObject(m) || isArray(m) ? JSON.stringify(m) : m)
|
||||
function timestamp() {
|
||||
return format(new Date(), 'yyyy-MM-dd HH:mm:ss.SSS')
|
||||
}
|
||||
|
||||
function getPrefix(level: string, loggerName: string): string {
|
||||
const timestamp = format(new Date(), 'yyyy-MM-dd HH:mm:ss.SSS')
|
||||
return `${timestamp} ${level} --- ${loggerName} :`
|
||||
function noop() {
|
||||
}
|
||||
|
||||
declare module 'vue/types/vue' {
|
||||
interface Vue {
|
||||
$logTrace(...msg: any[]): (...msg: any[]) => void;
|
||||
$logDebug(...msg: any[]): (...msg: any[]) => void;
|
||||
$logInfo(...msg: any[]): (...msg: any[]) => void;
|
||||
$logWarn(...msg: any[]): (...msg: any[]) => void;
|
||||
$logError(...msg: any[]): (...msg: any[]) => void;
|
||||
$debug(...msg: any[]): void;
|
||||
$info(...msg: any[]): void;
|
||||
$warn(...msg: any[]): void;
|
||||
$err(...msg: any[]): void;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -420,7 +420,7 @@ export default Vue.extend({
|
|||
if (screenfull.isEnabled) screenfull.on('change', this.fullscreenChanged)
|
||||
},
|
||||
async mounted() {
|
||||
this.$logDebug('[mounted]', 'route.query:', this.$route.query)()
|
||||
this.$debug('[mounted]', 'route.query:', this.$route.query)
|
||||
|
||||
this.readingDirection = this.$store.state.persistedState.webreader.readingDirection
|
||||
this.animations = this.$store.state.persistedState.webreader.animations
|
||||
|
|
@ -453,7 +453,7 @@ export default Vue.extend({
|
|||
// route update means either:
|
||||
// - going to previous/next book, in this case the query.page is not set, so it will default to first page
|
||||
// - pressing the back button of the browser and navigating to the previous book, in this case the query.page is set, so we honor it
|
||||
this.$logDebug('[beforeRouteUpdate]', 'to.query:', to.query)()
|
||||
this.$debug('[beforeRouteUpdate]', 'to.query:', to.query)
|
||||
this.setup(to.params.bookId, Number(to.query.page))
|
||||
}
|
||||
next()
|
||||
|
|
@ -628,7 +628,7 @@ export default Vue.extend({
|
|||
this.shortcuts[e.key]?.execute(this)
|
||||
},
|
||||
async setup(bookId: string, page?: number) {
|
||||
this.$logDebug('[setup]', `bookId:${bookId}`, `page:${page}`)()
|
||||
this.$debug('[setup]', `bookId:${bookId}`, `page:${page}`)
|
||||
this.book = await this.$komgaBooks.getBook(bookId)
|
||||
this.series = await this.$komgaSeries.getOneSeries(this.book.seriesId)
|
||||
|
||||
|
|
@ -653,7 +653,7 @@ export default Vue.extend({
|
|||
pageDtos.forEach((p: any) => p['url'] = this.getPageUrl(p))
|
||||
this.pages = pageDtos as PageDtoWithUrl[]
|
||||
|
||||
this.$logDebug('[setup]', `pages count:${this.pagesCount}`, 'read progress:', this.book.readProgress)()
|
||||
this.$debug('[setup]', `pages count:${this.pagesCount}`, 'read progress:', this.book.readProgress)
|
||||
if (page && page >= 1 && page <= this.pagesCount) {
|
||||
this.goTo(page)
|
||||
} else if (this.book.readProgress?.completed === false) {
|
||||
|
|
@ -734,7 +734,7 @@ export default Vue.extend({
|
|||
}
|
||||
},
|
||||
goTo(page: number) {
|
||||
this.$logDebug('[goTo]', `page:${page}`)()
|
||||
this.$debug('[goTo]', `page:${page}`)
|
||||
this.page = page
|
||||
this.markProgress(page)
|
||||
},
|
||||
|
|
|
|||
Loading…
Reference in a new issue