From 25dee4921ba04d2c0ad959779b1bf1daf93fd6ee Mon Sep 17 00:00:00 2001 From: marcobaobao Date: Thu, 9 Jun 2022 11:48:05 +0200 Subject: [PATCH] code optimisation --- frontend/src/App.tsx | 2 +- frontend/src/Home.tsx | 5 +++-- frontend/src/Settings.tsx | 3 +-- server/src/core/Process.ts | 3 +-- server/src/core/downloadArchive.ts | 9 ++++++--- server/src/core/downloader.ts | 2 +- server/src/main.ts | 12 ++++++------ server/src/utils/BetterLogger.ts | 15 ++++++++++++++- server/src/utils/logger.ts | 11 ++++++++--- 9 files changed, 41 insertions(+), 21 deletions(-) diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx index d8711d4..a1cb40d 100755 --- a/frontend/src/App.tsx +++ b/frontend/src/App.tsx @@ -164,7 +164,7 @@ function AppContent() { flexWrap: 'wrap', }}> -  {settings.serverAddr} +  {status.connected ? settings.serverAddr : 'not connected'} diff --git a/frontend/src/Home.tsx b/frontend/src/Home.tsx index 96ded18..40b7f28 100644 --- a/frontend/src/Home.tsx +++ b/frontend/src/Home.tsx @@ -30,6 +30,7 @@ export default function Home({ socket }: Props) { const [url, setUrl] = useState(''); const [workingUrl, setWorkingUrl] = useState(''); const [showBackdrop, setShowBackdrop] = useState(false); + const [showToast, setShowToast] = useState(true); /* -------------------- Effects -------------------- */ /* WebSocket connect event handler*/ @@ -330,10 +331,10 @@ export default function Home({ socket }: Props) { } dispatch(disconnected())} + onClose={() => setShowToast(false)} /> ); diff --git a/frontend/src/Settings.tsx b/frontend/src/Settings.tsx index d253a75..2500bb5 100644 --- a/frontend/src/Settings.tsx +++ b/frontend/src/Settings.tsx @@ -62,7 +62,7 @@ export default function Settings({ socket }: Props) { } /** - * Language toggler handler + * Theme toggler handler */ const handleThemeChange = (event: SelectChangeEvent) => { dispatch(setTheme(event.target.value as ThemeUnion)); @@ -76,7 +76,6 @@ export default function Settings({ socket }: Props) { dispatch(alreadyUpdated()) } - return ( diff --git a/server/src/core/Process.ts b/server/src/core/Process.ts index 2ba0255..e1861ba 100644 --- a/server/src/core/Process.ts +++ b/server/src/core/Process.ts @@ -5,11 +5,10 @@ import { ISettings } from '../interfaces/ISettings'; import { availableParams } from '../utils/params'; import Logger from '../utils/BetterLogger'; -const log = new Logger(); +const log = Logger.instance; /** * Represents a download process that spawns yt-dlp. - * @constructor * @param url - The downlaod url. * @param params - The cli arguments passed by the frontend. * @param settings - The download settings passed by the frontend. diff --git a/server/src/core/downloadArchive.ts b/server/src/core/downloadArchive.ts index 58354c7..b0551bb 100644 --- a/server/src/core/downloadArchive.ts +++ b/server/src/core/downloadArchive.ts @@ -1,15 +1,18 @@ import { resolve } from "path"; +import { readdir } from "fs"; + const archived = [ { id: 1, - title: 'AleXa (알렉사) – Voting Open in American Song Contest Grand Final!', - path: resolve('downloads/AleXa (알렉사) – Voting Open in American Song Contest Grand Final!.webm'), - img: 'https://i.ytimg.com/vi/WbBUz7pjUnM/hq720.jpg?sqp=-oaymwEcCNAFEJQDSFXyq4qpAw4IARUAAIhCGAFwAcABBg==&rs=AOn4CLAi5MNtvpgnY9aRpdFlhAfhdV7Zlg', + title: '', + path: resolve(''), + img: '', }, ] export function listDownloaded(ctx: any, next: any) { + //readdir() ctx.body = archived next() } diff --git a/server/src/core/downloader.ts b/server/src/core/downloader.ts index 455a188..64b0575 100644 --- a/server/src/core/downloader.ts +++ b/server/src/core/downloader.ts @@ -12,7 +12,7 @@ import ProcessPool from './ProcessPool'; // settings read from settings.json let settings: ISettings; let coldRestart = true; -const log = new Logger(); +const log = Logger.instance; const pool = new ProcessPool(); diff --git a/server/src/main.ts b/server/src/main.ts index ee41db1..588d0e7 100644 --- a/server/src/main.ts +++ b/server/src/main.ts @@ -1,4 +1,4 @@ -import { logger, splash } from './utils/logger'; +import { splash } from './utils/logger'; import { join } from 'path'; import { Server } from 'socket.io'; import { ytdlpUpdater } from './utils/updater'; @@ -16,7 +16,7 @@ import { streamer } from './core/streamer'; const app = new Koa(); const server = createServer(app.callback()); const router = new Router(); -const log = new Logger(); +const log = Logger.instance; const io = new Server(server, { cors: { origin: "*", @@ -44,14 +44,14 @@ router.get('/stream/:filepath', (ctx, next) => { // WebSocket listeners io.on('connection', socket => { - logger('ws', `${socket.handshake.address} connected!`) + log.info('ws', `${socket.handshake.address} connected!`) socket.on('send-url', (args) => { - logger('ws', args?.url) + log.info('ws', args?.url) download(socket, args) }) socket.on('send-url-format-selection', (args) => { - logger('ws', `Formats ${args?.url}`) + log.info('ws', `Formats ${args?.url}`) if (args.url) getFormatsAndInfo(socket, args?.url) }) socket.on('abort', (args) => { @@ -72,7 +72,7 @@ io.on('connection', socket => { }) io.on('disconnect', (socket) => { - logger('ws', `${socket.handshake.address} disconnected`) + log.info('ws', `${socket.handshake.address} disconnected`) }) app.use(serve(join(__dirname, 'frontend'))) diff --git a/server/src/utils/BetterLogger.ts b/server/src/utils/BetterLogger.ts index 678fabb..0852464 100644 --- a/server/src/utils/BetterLogger.ts +++ b/server/src/utils/BetterLogger.ts @@ -4,9 +4,22 @@ const ansi = { cyan: '\u001b[36m', green: '\u001b[32m', yellow: '\u001b[93m', + bold: '\u001b[1m', + normal: '\u001b[22m', } class Logger { + private static _instance: Logger; + + constructor() { }; + + static get instance() { + if (this._instance) { + return this._instance + } + this._instance = new Logger() + return this._instance; + } /** * Print a standard info message * @param {string} proto the context/protocol/section outputting the message @@ -39,7 +52,7 @@ class Logger { } private formatter(proto: any, args: any) { - return `[${proto}]\t${args}\n` + return `${ansi.bold}[${proto}]${ansi.normal}\t${args}\n` } } diff --git a/server/src/utils/logger.ts b/server/src/utils/logger.ts index 0762b85..2676348 100644 --- a/server/src/utils/logger.ts +++ b/server/src/utils/logger.ts @@ -11,8 +11,13 @@ export const logger = (proto: string, args: string) => { /** * CLI splash */ + export const splash = () => { - console.log("-------------------------------------------------") - console.log("yt-dlp-webUI - A web-ui for yt-dlp, simply enough") - console.log("-------------------------------------------------") + console.log(" __ ____ __ __ ______") + console.log(" __ __/ /________/ / /__ _ _____ / / / / / / _/") + console.log(" / // / __/___/ _ / / _ \ | |/|/ / -_) _ \/ /_/ // / ") + console.log(" \_, /\__/ \_,_/_/ .__/ |__,__/\__/_.__/\____/___/ ") + console.log("/___/ /_/ \n") + console.log(" yt-dlp-webUI - A web-ui for yt-dlp, simply enough") + console.log("---------------------------------------------------\n") } \ No newline at end of file