1berry/metube
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

upgrade to angular 19

Browse Source
This commit is contained in:
Alex Shnitman 2025-06-02 23:16:32 +03:00
parent 91f1e21df0
commit b7ef408d5d
9 changed files with 3006 additions and 2311 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
app/main.py
View File

@ -241,7 +241,7 @@ def get_custom_dirs():
@routes.get(config.URL_PREFIX) @routes.get(config.URL_PREFIX)
def index(request): def index(request):
response = web.FileResponse(os.path.join(config.BASE_DIR, 'ui/dist/metube/index.html')) response = web.FileResponse(os.path.join(config.BASE_DIR, 'ui/dist/metube/browser/index.html'))
if 'metube_theme' not in request.cookies: if 'metube_theme' not in request.cookies:
response.set_cookie('metube_theme', config.DEFAULT_THEME) response.set_cookie('metube_theme', config.DEFAULT_THEME)
return response return response
@ -271,11 +271,11 @@ if config.URL_PREFIX != '/':
routes.static(config.URL_PREFIX + 'download/', config.DOWNLOAD_DIR, show_index=config.DOWNLOAD_DIRS_INDEXABLE) routes.static(config.URL_PREFIX + 'download/', config.DOWNLOAD_DIR, show_index=config.DOWNLOAD_DIRS_INDEXABLE)
routes.static(config.URL_PREFIX + 'audio_download/', config.AUDIO_DOWNLOAD_DIR, show_index=config.DOWNLOAD_DIRS_INDEXABLE) routes.static(config.URL_PREFIX + 'audio_download/', config.AUDIO_DOWNLOAD_DIR, show_index=config.DOWNLOAD_DIRS_INDEXABLE)
routes.static(config.URL_PREFIX, os.path.join(config.BASE_DIR, 'ui/dist/metube')) routes.static(config.URL_PREFIX, os.path.join(config.BASE_DIR, 'ui/dist/metube/browser'))
try: try:
app.add_routes(routes) app.add_routes(routes)
except ValueError as e: except ValueError as e:
if 'ui/dist/metube' in str(e): if 'ui/dist/metube/browser' in str(e):
raise RuntimeError('Could not find the frontend UI static assets. Please run `node_modules/.bin/ng build` inside the ui folder') from e raise RuntimeError('Could not find the frontend UI static assets. Please run `node_modules/.bin/ng build` inside the ui folder') from e
raise e raise e

21
ui/angular.json
View File

@ -15,12 +15,15 @@
"prefix": "app", "prefix": "app",
"architect": { "architect": {
"build": { "build": {
"builder": "@angular-devkit/build-angular:browser", "builder": "@angular-devkit/build-angular:application",
"options": { "options": {
"outputPath": "dist/metube", "outputPath": {
"base": "dist/metube"
},
"index": "src/index.html", "index": "src/index.html",
"main": "src/main.ts", "polyfills": [
"polyfills": "src/polyfills.ts", "src/polyfills.ts"
],
"tsConfig": "tsconfig.app.json", "tsConfig": "tsconfig.app.json",
"aot": true, "aot": true,
"assets": [ "assets": [
@ -30,13 +33,15 @@
"src/custom-service-worker.js" "src/custom-service-worker.js"
], ],
"styles": [ "styles": [
"node_modules/bootstrap/dist/css/bootstrap.min.css",
"node_modules/@ng-select/ng-select/themes/default.theme.css",
"src/styles.sass" "src/styles.sass"
], ],
"scripts": [ "scripts": [
"node_modules/bootstrap/dist/js/bootstrap.bundle.min.js", "node_modules/bootstrap/dist/js/bootstrap.bundle.min.js"
], ],
"serviceWorker": true, "serviceWorker": "ngsw-config.json",
"ngswConfigPath": "ngsw-config.json" "browser": "src/main.ts"
}, },
"configurations": { "configurations": {
"production": { "production": {
@ -51,8 +56,6 @@
"sourceMap": false, "sourceMap": false,
"namedChunks": false, "namedChunks": false,
"extractLicenses": true, "extractLicenses": true,
"vendorChunk": false,
"buildOptimizer": true,
"budgets": [ "budgets": [
{ {
"type": "initial", "type": "initial",

5197
ui/package-lock.json generated
View File

File diff suppressed because it is too large Load Diff

52
ui/package.json
View File

@ -11,37 +11,37 @@
}, },
"private": true, "private": true,
"dependencies": { "dependencies": {
"@angular/animations": "^18.2.13", "@angular/animations": "^19.2.14",
"@angular/common": "^18.2.13", "@angular/common": "^19.2.14",
"@angular/compiler": "^18.2.13", "@angular/compiler": "^19.2.14",
"@angular/core": "^18.2.13", "@angular/core": "^19.2.14",
"@angular/forms": "^18.2.13", "@angular/forms": "^19.2.14",
"@angular/localize": "^18.2.13", "@angular/localize": "^19.2.14",
"@angular/platform-browser": "^18.2.13", "@angular/platform-browser": "^19.2.14",
"@angular/platform-browser-dynamic": "^18.2.13", "@angular/platform-browser-dynamic": "^19.2.14",
"@angular/router": "^18.2.13", "@angular/router": "^19.2.14",
"@angular/service-worker": "^18.2.13", "@angular/service-worker": "^19.2.14",
"@fortawesome/angular-fontawesome": "~0.15.0", "@fortawesome/angular-fontawesome": "~1.0.0",
"@fortawesome/fontawesome-svg-core": "^6.5.0", "@fortawesome/fontawesome-svg-core": "^6.7.0",
"@fortawesome/free-regular-svg-icons": "^6.5.0", "@fortawesome/free-regular-svg-icons": "^6.7.0",
"@fortawesome/free-solid-svg-icons": "^6.5.0", "@fortawesome/free-solid-svg-icons": "^6.7.0",
"@ng-bootstrap/ng-bootstrap": "^17.0.0", "@ng-bootstrap/ng-bootstrap": "^18.0.0",
"@ng-select/ng-select": "^13.0.0", "@ng-select/ng-select": "^14.0.0",
"bootstrap": "^5.3.0", "bootstrap": "^5.3.6",
"ngx-cookie-service": "^18.0.0", "ngx-cookie-service": "^19.0.0",
"ngx-socket-io": "~4.7.0", "ngx-socket-io": "~4.8.0",
"rxjs": "~7.8.0", "rxjs": "~7.8.0",
"tslib": "^2.6.0", "tslib": "^2.8.1",
"zone.js": "~0.14.4" "zone.js": "~0.15.1"
}, },
"devDependencies": { "devDependencies": {
"@angular-devkit/build-angular": "^18.2.19", "@angular-devkit/build-angular": "^19.2.14",
"@angular/cli": "^18.2.19", "@angular/cli": "^19.2.14",
"@angular/compiler-cli": "^18.2.13", "@angular/compiler-cli": "^19.2.14",
"@types/node": "^18.15.0", "@types/node": "^22.15.29",
"codelyzer": "^6.0.2", "codelyzer": "^6.0.2",
"ts-node": "~10.9.1", "ts-node": "~10.9.1",
"tslint": "~6.1.3", "tslint": "~6.1.3",
"typescript": "~5.4.5" "typescript": "~5.8.3"
} }
} }

7
ui/src/app/app.component.ts
View File

@ -12,9 +12,10 @@ import { Theme, Themes } from './theme';
import {KeyValue} from "@angular/common"; import {KeyValue} from "@angular/common";
@Component({ @Component({
selector: 'app-root', selector: 'app-root',
templateUrl: './app.component.html', templateUrl: './app.component.html',
styleUrls: ['./app.component.sass'], styleUrls: ['./app.component.sass'],
standalone: false
}) })
export class AppComponent implements AfterViewInit { export class AppComponent implements AfterViewInit {
addUrl: string; addUrl: string;

14
ui/src/app/downloads.pipe.ts
View File

@ -1,7 +1,8 @@
import { Pipe, PipeTransform } from '@angular/core'; import { Pipe, PipeTransform } from '@angular/core';
@Pipe({ @Pipe({
name: 'eta' name: 'eta',
standalone: false
}) })
export class EtaPipe implements PipeTransform { export class EtaPipe implements PipeTransform {
transform(value: number, ...args: any[]): any { transform(value: number, ...args: any[]): any {
@ -21,7 +22,8 @@ export class EtaPipe implements PipeTransform {
} }
@Pipe({ @Pipe({
name: 'speed' name: 'speed',
standalone: false
}) })
export class SpeedPipe implements PipeTransform { export class SpeedPipe implements PipeTransform {
transform(value: number, ...args: any[]): any { transform(value: number, ...args: any[]): any {
@ -37,7 +39,8 @@ export class SpeedPipe implements PipeTransform {
} }
@Pipe({ @Pipe({
name: 'encodeURIComponent' name: 'encodeURIComponent',
standalone: false
}) })
export class EncodeURIComponent implements PipeTransform { export class EncodeURIComponent implements PipeTransform {
transform(value: string, ...args: any[]): any { transform(value: string, ...args: any[]): any {
@ -45,8 +48,9 @@ export class EncodeURIComponent implements PipeTransform {
} }
} }
@Pipe({ @Pipe({
name: 'fileSize' name: 'fileSize',
standalone: false
}) })
export class FileSizePipe implements PipeTransform { export class FileSizePipe implements PipeTransform {
transform(value: number): string { transform(value: number): string {

14
ui/src/app/master-checkbox.component.ts
View File

@ -5,13 +5,14 @@ interface Checkable {
} }
@Component({ @Component({
selector: 'app-master-checkbox', selector: 'app-master-checkbox',
template: ` template: `
<div class="form-check"> <div class="form-check">
<input type="checkbox" class="form-check-input" id="{{id}}-select-all" #masterCheckbox [(ngModel)]="selected" (change)="clicked()"> <input type="checkbox" class="form-check-input" id="{{id}}-select-all" #masterCheckbox [(ngModel)]="selected" (change)="clicked()">
<label class="form-check-label" for="{{id}}-select-all"></label> <label class="form-check-label" for="{{id}}-select-all"></label>
</div> </div>
` `,
standalone: false
}) })
export class MasterCheckboxComponent { export class MasterCheckboxComponent {
@Input() id: string; @Input() id: string;
@ -38,13 +39,14 @@ export class MasterCheckboxComponent {
} }
@Component({ @Component({
selector: 'app-slave-checkbox', selector: 'app-slave-checkbox',
template: ` template: `
<div class="form-check"> <div class="form-check">
<input type="checkbox" class="form-check-input" id="{{master.id}}-{{id}}-select" [(ngModel)]="checkable.checked" (change)="master.selectionChanged()"> <input type="checkbox" class="form-check-input" id="{{master.id}}-{{id}}-select" [(ngModel)]="checkable.checked" (change)="master.selectionChanged()">
<label class="form-check-label" for="{{master.id}}-{{id}}-select"></label> <label class="form-check-label" for="{{master.id}}-{{id}}-select"></label>
</div> </div>
` `,
standalone: false
}) })
export class SlaveCheckboxComponent { export class SlaveCheckboxComponent {
@Input() id: string; @Input() id: string;

4
ui/src/styles.sass
View File

@ -1,9 +1,5 @@
/* You can add global styles to this file, and also import other style files */ /* You can add global styles to this file, and also import other style files */
/* Importing Bootstrap SCSS file. */
@import 'node_modules/bootstrap/scss/bootstrap'
@import '~@ng-select/ng-select/themes/default.theme.css'
.navbar .navbar
background-color: var(--bs-dark) !important background-color: var(--bs-dark) !important

2
ui/tsconfig.json
View File

@ -5,8 +5,8 @@
"baseUrl": "./", "baseUrl": "./",
"outDir": "./dist/out-tsc", "outDir": "./dist/out-tsc",
"sourceMap": true, "sourceMap": true,
"esModuleInterop": true,
"declaration": false, "declaration": false,
"downlevelIteration": true,
"experimentalDecorators": true, "experimentalDecorators": true,
"moduleResolution": "node", "moduleResolution": "node",
"importHelpers": true, "importHelpers": true,