diff --git a/komga-webui/package-lock.json b/komga-webui/package-lock.json index 54ff4d2b0..146a9a9d7 100644 --- a/komga-webui/package-lock.json +++ b/komga-webui/package-lock.json @@ -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", diff --git a/komga-webui/package.json b/komga-webui/package.json index 96522a724..f94c8c614 100644 --- a/komga-webui/package.json +++ b/komga-webui/package.json @@ -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", diff --git a/komga-webui/src/components/readers/PagedReader.vue b/komga-webui/src/components/readers/PagedReader.vue index 1def81c77..0384541ba 100644 --- a/komga-webui/src/components/readers/PagedReader.vue +++ b/komga-webui/src/components/readers/PagedReader.vue @@ -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++) { diff --git a/komga-webui/src/plugins/logger.plugin.ts b/komga-webui/src/plugins/logger.plugin.ts index 814f72166..cdaf1df2b 100644 --- a/komga-webui/src/plugins/logger.plugin.ts +++ b/komga-webui/src/plugins/logger.plugin.ts @@ -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; } } diff --git a/komga-webui/src/views/BookReader.vue b/komga-webui/src/views/BookReader.vue index ecdf23c7d..d7a30fd67 100644 --- a/komga-webui/src/views/BookReader.vue +++ b/komga-webui/src/views/BookReader.vue @@ -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) },