From fede4df965242681301c03a908b35b41eb7b1ce2 Mon Sep 17 00:00:00 2001 From: marcobaobao Date: Fri, 4 Feb 2022 12:47:03 +0100 Subject: [PATCH] Added resolution badge --- README.md | 9 ++-- frontend/src/App.tsx | 3 +- frontend/src/components/StackableResult.tsx | 17 ++++++- package.json | 14 +++--- pnpm-lock.yaml | 54 ++++++++++----------- 5 files changed, 55 insertions(+), 42 deletions(-) diff --git a/README.md b/README.md index 055a280..456d1c6 100644 --- a/README.md +++ b/README.md @@ -16,11 +16,11 @@ Refactoring and JSDoc. 04/01/22: Background jobs now are retrieved!! It's still rudimentary but it leverages on yt-dlp resume feature ``` - + ## Now with dark mode - + ## Settings @@ -48,15 +48,14 @@ docker run -d -p 3022:3022 -v :/usr/src/yt-dlp-webui/downloads yt-dlp- ## Manual installation ``` npm i -npm run build -npm run fetch +npm run build-all // edit the settings.json specifying the download path or // it will default to the following created folder mkdir downloads -node server.js +node dist/main.js ``` diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx index 707d6d4..8fdd874 100755 --- a/frontend/src/App.tsx +++ b/frontend/src/App.tsx @@ -294,6 +294,7 @@ export function App() { formattedLog={message[1]} title={downloadInfoMap.get(message[0])?.title} thumbnail={downloadInfoMap.get(message[0])?.thumbnail} + resolution={downloadInfoMap.get(message[0])?.resolution} progress={progressMap.get(message[0])} /> @@ -321,8 +322,6 @@ export function App() {
setShowSettings(!showSettings)}> - {i18n.t('settingsAnchor')} - {' '} {' '} diff --git a/frontend/src/components/StackableResult.tsx b/frontend/src/components/StackableResult.tsx index 027a12f..95750ba 100644 --- a/frontend/src/components/StackableResult.tsx +++ b/frontend/src/components/StackableResult.tsx @@ -4,15 +4,27 @@ import { Col, ProgressBar } from "react-bootstrap"; +import { Badge4kFill, Badge8kFill, BadgeHdFill } from "react-bootstrap-icons"; type Props = { formattedLog: string, title: string, thumbnail: string, + resolution: string progress: number, } -export function StackableResult({ formattedLog, title, thumbnail, progress }: Props) { +export function StackableResult({ formattedLog, title, thumbnail, resolution, progress }: Props) { + + const guessResolution = (xByY: string): JSX.Element => { + if (!xByY) return null; + if (xByY.includes('4320')) return (); + if (xByY.includes('2160')) return (); + if (xByY.includes('1080')) return (); + if (xByY.includes('720')) return (); + return null; + } + return (
@@ -27,6 +39,9 @@ export function StackableResult({ formattedLog, title, thumbnail, progress }: Pr
+
+ {guessResolution(resolution)} +
{progress ? diff --git a/package.json b/package.json index 7f5a2c8..4de542a 100644 --- a/package.json +++ b/package.json @@ -18,12 +18,6 @@ "license": "ISC", "dependencies": { "@koa/cors": "^3.1.0", - "@types/better-sqlite3": "^7.4.2", - "@types/koa": "^2.13.4", - "@types/koa-static": "^4.0.2", - "@types/koa__cors": "^3.1.1", - "@types/node": "^17.0.13", - "@types/uuid": "^8.3.4", "better-sqlite3": "^7.4.5", "chart.js": "^3.6.0", "koa": "^2.13.4", @@ -43,6 +37,12 @@ "devDependencies": { "@parcel/transformer-yaml": "^2.2.1", "parcel": "^2.0.1", - "typescript": "^4.5.2" + "typescript": "^4.5.2", + "@types/better-sqlite3": "^7.4.2", + "@types/koa": "^2.13.4", + "@types/koa-static": "^4.0.2", + "@types/koa__cors": "^3.1.1", + "@types/node": "^17.0.13", + "@types/uuid": "^8.3.4" } } \ No newline at end of file diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 89b56e2..969998b 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -29,12 +29,6 @@ specifiers: dependencies: '@koa/cors': 3.1.0 - '@types/better-sqlite3': 7.4.2 - '@types/koa': 2.13.4 - '@types/koa-static': 4.0.2 - '@types/koa__cors': 3.1.1 - '@types/node': 17.0.13 - '@types/uuid': 8.3.4 better-sqlite3: 7.5.0 chart.js: 3.7.0 koa: 2.13.4 @@ -53,6 +47,12 @@ dependencies: devDependencies: '@parcel/transformer-yaml': 2.2.1 + '@types/better-sqlite3': 7.4.2 + '@types/koa': 2.13.4 + '@types/koa-static': 4.0.2 + '@types/koa__cors': 3.1.1 + '@types/node': 17.0.13 + '@types/uuid': 8.3.4 parcel: 2.2.1 typescript: 4.5.5 @@ -1192,20 +1192,20 @@ packages: resolution: {integrity: sha512-jOdnI/3qTpHABjM5cx1Hc0sKsPoYCp+DP/GJRGtDlPd7fiV9oXGGIcjW/ZOxLIvjGz8MA+uMZI9metHlgqbgwQ==} dependencies: '@types/node': 17.0.13 - dev: false + dev: true /@types/better-sqlite3/7.4.2: resolution: {integrity: sha512-HUXWMOmRgOrXJ0SKt6kxqUaZtGkr0HCuaEt/76LojT6bkTu0lb0uhr3K1su9T09mskDKyQwNMvT7WithFN10PQ==} dependencies: '@types/node': 17.0.13 - dev: false + dev: true /@types/body-parser/1.19.2: resolution: {integrity: sha512-ALYone6pm6QmwZoAgeyNksccT9Q4AWZQ6PvfwR37GT6r6FWUPguq6sUmNGSMV2Wr761oQoBxwGGa6DR5o1DC9g==} dependencies: '@types/connect': 3.4.35 '@types/node': 17.0.13 - dev: false + dev: true /@types/component-emitter/1.2.11: resolution: {integrity: sha512-SRXjM+tfsSlA9VuG8hGO2nft2p8zjXCK1VcC6N4NXbBbYbSia9kzCChYQajIjzIqOOOuh5Ock6MmV2oux4jDZQ==} @@ -1215,11 +1215,11 @@ packages: resolution: {integrity: sha512-cdeYyv4KWoEgpBISTxWvqYsVy444DOqehiF3fM3ne10AmJ62RSyNkUnxMJXHQWRQQX2eR94m5y1IZyDwBjV9FQ==} dependencies: '@types/node': 17.0.13 - dev: false + dev: true /@types/content-disposition/0.5.4: resolution: {integrity: sha512-0mPF08jn9zYI0n0Q/Pnz7C4kThdSt+6LD4amsrYDDpgBfrVWa3TcCOxKX1zkGgYniGagRv8heN2cbh+CAn+uuQ==} - dev: false + dev: true /@types/cookie/0.4.1: resolution: {integrity: sha512-XW/Aa8APYr6jSVVA1y/DEIZX0/GMKLEVekNG727R8cs56ahETkRAy/3DR7+fJyh7oUgGwNQaRfXCun0+KbWY7Q==} @@ -1232,7 +1232,7 @@ packages: '@types/express': 4.17.13 '@types/keygrip': 1.0.2 '@types/node': 17.0.13 - dev: false + dev: true /@types/cors/2.8.12: resolution: {integrity: sha512-vt+kDhq/M2ayberEtJcIN/hxXy1Pk+59g2FV/ZQceeaTyCtCucjL2Q7FXlFjtWn4n15KCr1NE2lNNFhp0lEThw==} @@ -1244,7 +1244,7 @@ packages: '@types/node': 17.0.13 '@types/qs': 6.9.7 '@types/range-parser': 1.2.4 - dev: false + dev: true /@types/express/4.17.13: resolution: {integrity: sha512-6bSZTPaTIACxn48l50SR+axgrqm6qXFIxrdAKaG6PaJk3+zuUr35hBlgT7vOmJcum+OEaIBLtHV/qloEAFITeA==} @@ -1253,15 +1253,15 @@ packages: '@types/express-serve-static-core': 4.17.28 '@types/qs': 6.9.7 '@types/serve-static': 1.13.10 - dev: false + dev: true /@types/http-assert/1.5.3: resolution: {integrity: sha512-FyAOrDuQmBi8/or3ns4rwPno7/9tJTijVW6aQQjK02+kOQ8zmoNg2XJtAuQhvQcy1ASJq38wirX5//9J1EqoUA==} - dev: false + dev: true /@types/http-errors/1.8.2: resolution: {integrity: sha512-EqX+YQxINb+MeXaIqYDASb6U6FCHbWjkj4a1CKDBks3d/QiB2+PqBLyO72vLDgAO1wUI4O+9gweRcQK11bTL/w==} - dev: false + dev: true /@types/http-proxy/1.17.8: resolution: {integrity: sha512-5kPLG5BKpWYkw/LVOGWpiq3nEVqxiN32rTgI53Sk12/xHFQ2rG3ehI9IO+O3W2QoKeyB92dJkoka8SUm6BX1pA==} @@ -1275,26 +1275,26 @@ packages: /@types/keygrip/1.0.2: resolution: {integrity: sha512-GJhpTepz2udxGexqos8wgaBx4I/zWIDPh/KOGEwAqtuGDkOUJu5eFvwmdBX4AmB8Odsr+9pHCQqiAqDL/yKMKw==} - dev: false + dev: true /@types/koa-compose/3.2.5: resolution: {integrity: sha512-B8nG/OoE1ORZqCkBVsup/AKcvjdgoHnfi4pZMn5UwAPCbhk/96xyv284eBYW8JlQbQ7zDmnpFr68I/40mFoIBQ==} dependencies: '@types/koa': 2.13.4 - dev: false + dev: true /@types/koa-send/4.1.3: resolution: {integrity: sha512-daaTqPZlgjIJycSTNjKpHYuKhXYP30atFc1pBcy6HHqB9+vcymDgYTguPdx9tO4HMOqNyz6bz/zqpxt5eLR+VA==} dependencies: '@types/koa': 2.13.4 - dev: false + dev: true /@types/koa-static/4.0.2: resolution: {integrity: sha512-ns/zHg+K6XVPMuohjpOlpkR1WLa4VJ9czgUP9bxkCDn0JZBtUWbD/wKDZzPGDclkQK1bpAEScufCHOy8cbfL0w==} dependencies: '@types/koa': 2.13.4 '@types/koa-send': 4.1.3 - dev: false + dev: true /@types/koa/2.13.4: resolution: {integrity: sha512-dfHYMfU+z/vKtQB7NUrthdAEiSvnLebvBjwHtfFmpZmB7em2N3WVQdHgnFq+xvyVgxW5jKDmjWfLD3lw4g4uTw==} @@ -1307,17 +1307,17 @@ packages: '@types/keygrip': 1.0.2 '@types/koa-compose': 3.2.5 '@types/node': 17.0.13 - dev: false + dev: true /@types/koa__cors/3.1.1: resolution: {integrity: sha512-O7MBkCocnLrpEvkMrYAp17arUDS+KuS5bXMG/Z4aPSbrO7vrYB6YrqcsTD3Dp2OnAL3j4WME2k/x2kOcyzwNUw==} dependencies: '@types/koa': 2.13.4 - dev: false + dev: true /@types/mime/1.3.2: resolution: {integrity: sha512-YATxVxgRqNH6nHEIsvg6k2Boc1JHI9ZbH5iWFFv/MTkchz3b1ieGDa5T0a9RznNdI0KhVbdbWSN+KWWrQZRxTw==} - dev: false + dev: true /@types/node/17.0.13: resolution: {integrity: sha512-Y86MAxASe25hNzlDbsviXl8jQHb0RDvKt4c40ZJQ1Don0AAL0STLZSs4N+6gLEO55pedy7r2cLwS+ZDxPm/2Bw==} @@ -1332,11 +1332,11 @@ packages: /@types/qs/6.9.7: resolution: {integrity: sha512-FGa1F62FT09qcrueBA6qYTrJPVDzah9a+493+o2PCXsesWHIn27G98TsSMs3WPNbZIEj4+VJf6saSFpvD+3Zsw==} - dev: false + dev: true /@types/range-parser/1.2.4: resolution: {integrity: sha512-EEhsLsD6UsDM1yFhAvy0Cjr6VwmpMWqFBCb9w07wVugF7w9nfajxLuVmngTIpgS6svCnm6Vaw+MZhoDCKnOfsw==} - dev: false + dev: true /@types/react-transition-group/4.4.4: resolution: {integrity: sha512-7gAPz7anVK5xzbeQW9wFBDg7G++aPLAFY0QaSMOou9rJZpbuI58WAuJrgu+qR92l61grlnCUe7AFX8KGahAgug==} @@ -1361,11 +1361,11 @@ packages: dependencies: '@types/mime': 1.3.2 '@types/node': 17.0.13 - dev: false + dev: true /@types/uuid/8.3.4: resolution: {integrity: sha512-c/I8ZRb51j+pYGAu5CrFMRxqZ2ke4y2grEBO5AUjgSkSk+qT2Ea+OdWElz/OiMf5MNpn2b17kuVBwZLQJXzihw==} - dev: false + dev: true /@types/warning/3.0.0: resolution: {integrity: sha1-DSUBJorY+ZYrdA04fEZU9fjiPlI=}