TheLanc3/YoutubeDL-Material
1
0
Fork 0
mirror of https://github.com/Tzahi12345/YoutubeDL-Material.git synced 2026-03-10 23:00:57 +03:00
Code Issues Packages Projects Releases Wiki Activity

Added support for navigating to files in recent videos (subscription and not). No support for download-only mode yet

Browse Source 
Added navigate to subscription menu item for the files

Sidenav mode is "side" now for testing, likely not a permanent change and will be optional in the future
This commit is contained in:
Isaac Grynsztein
2020-07-18 20:37:43 -04:00
parent cc189a3abd
commit 8384b73c4c
8 changed files with 82 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
src/app/app.component.html
View File

@@ -38,15 +38,15 @@
</div>
<div class="sidenav-container" style="height: calc(100% - 64px)">
<mat-sidenav-container style="height: 100%">
<mat-sidenav #sidenav>
<mat-sidenav mode="side" #sidenav>
<mat-nav-list>
<a *ngIf="postsService.config && (!postsService.config.Advanced.multi_user_mode || postsService.isLoggedIn)" mat-list-item (click)="sidenav.close()" routerLink='/home'><ng-container i18n="Navigation menu Home Page title">Home</ng-container></a>
<a *ngIf="postsService.config && postsService.config.Advanced.multi_user_mode && !postsService.isLoggedIn" mat-list-item (click)="sidenav.close()" routerLink='/login'><ng-container i18n="Navigation menu Login Page title">Login</ng-container></a>
<a *ngIf="postsService.config && allowSubscriptions && (!postsService.config.Advanced.multi_user_mode || (postsService.isLoggedIn && postsService.permissions.includes('subscriptions')))" mat-list-item (click)="sidenav.close()" routerLink='/subscriptions'><ng-container i18n="Navigation menu Subscriptions Page title">Subscriptions</ng-container></a>
<a *ngIf="postsService.config && enableDownloadsManager && (!postsService.config.Advanced.multi_user_mode || (postsService.isLoggedIn && postsService.permissions.includes('downloads_manager')))" mat-list-item (click)="sidenav.close()" routerLink='/downloads'><ng-container i18n="Navigation menu Downloads Page title">Downloads</ng-container></a>
<ng-container *ngIf="postsService.config && allowSubscriptions && subscriptions && (!postsService.config.Advanced.multi_user_mode || (postsService.isLoggedIn && postsService.permissions.includes('subscriptions')))">
<ng-container *ngIf="postsService.config && allowSubscriptions && postsService.subscriptions && (!postsService.config.Advanced.multi_user_mode || (postsService.isLoggedIn && postsService.permissions.includes('subscriptions')))">
<mat-divider></mat-divider>
<a *ngFor="let subscription of subscriptions" mat-list-item (click)="sidenav.close()" [routerLink]="['/subscription', { id: subscription.id }]"><ngx-avatar [style.margin-right]="'10px'" size="32" [name]="subscription.name"></ngx-avatar><ng-container i18n="Navigation menu Downloads Page title">{{subscription.name}}</ng-container></a>
<a *ngFor="let subscription of postsService.subscriptions" mat-list-item (click)="sidenav.close()" [routerLink]="['/subscription', { id: subscription.id }]"><ngx-avatar [style.margin-right]="'10px'" size="32" [name]="subscription.name"></ngx-avatar><ng-container i18n="Navigation menu Downloads Page title">{{subscription.name}}</ng-container></a>
</ng-container>
</mat-nav-list>
</mat-sidenav>

4
src/app/app.component.ts
View File

@@ -46,8 +46,6 @@ export class AppComponent implements OnInit {
@ViewChild('hamburgerMenu', { read: ElementRef }) hamburgerMenuButton: ElementRef;
navigator: string = null;
subscriptions = null;
constructor(public postsService: PostsService, public snackBar: MatSnackBar, private dialog: MatDialog,
public router: Router, public overlayContainer: OverlayContainer, private elementRef: ElementRef) {
@@ -92,7 +90,7 @@ export class AppComponent implements OnInit {
// gets the subscriptions
if (this.allowSubscriptions) {
this.postsService.getAllSubscriptions().subscribe(res => {
this.subscriptions = res['subscriptions'];
this.postsService.subscriptions = res['subscriptions'];
})
}
}

2
src/app/components/recent-videos/recent-videos.component.html
View File

@@ -2,7 +2,7 @@
<div class="container">
<div class="row justify-content-center">
<div *ngFor="let file of files" class="col-6 col-lg-4 mb-2 mt-2 file-col">
<app-unified-file-card [file_obj]="file"></app-unified-file-card>
<app-unified-file-card (goToFile)="goToFile($event)" (goToSubscription)="goToSubscription($event)" [file_obj]="file"></app-unified-file-card>
</div>
</div>
</div>

40
src/app/components/recent-videos/recent-videos.component.ts
View File

@@ -1,5 +1,6 @@
import { Component, OnInit } from '@angular/core';
import { PostsService } from 'app/posts.services';
import { Router } from '@angular/router';
@Component({
selector: 'app-recent-videos',
@@ -12,7 +13,7 @@ export class RecentVideosComponent implements OnInit {
subscription_files_received = false;
files: any[] = null;
constructor(private postsService: PostsService) { }
constructor(private postsService: PostsService, private router: Router) { }
ngOnInit(): void {
this.postsService.service_initialized.subscribe(init => {
@@ -30,6 +31,43 @@ export class RecentVideosComponent implements OnInit {
});
}
goToFile(file) {
if (this.postsService.config['Extra']['download_only_mode']) {
this.downloadFile(file);
} else {
this.navigateToFile(file);
}
}
navigateToFile(file) {
localStorage.setItem('player_navigator', this.router.url);
if (file.sub_id) {
const sub = this.postsService.getSubscriptionByID(file.sub_id)
if (sub.streamingOnly) {
this.router.navigate(['/player', {name: file.id,
url: file.requested_formats ? file.requested_formats[0].url : file.url}]);
} else {
this.router.navigate(['/player', {fileNames: file.id,
type: file.isAudio ? 'audio' : 'video', subscriptionName: sub.name,
subPlaylist: sub.isPlaylist, uuid: this.postsService.user ? this.postsService.user.uid : null}]);
}
} else {
this.router.navigate(['/player', {type: file.isAudio ? 'audio' : 'video', uid: file.uid}]);
}
}
downloadFile(file) {
if (file.sub_id) {
} else {
}
}
goToSubscription(file) {
this.router.navigate(['/subscription', {id: file.sub_id}]);
}
sortFiles(a, b) {
// uses the 'registered' flag as the timestamp
const result = b.registered - a.registered;

1
src/app/components/unified-file-card/unified-file-card.component.html
View File

@@ -5,6 +5,7 @@
<button [matMenuTriggerFor]="action_menu" class="menuButton" mat-icon-button><mat-icon>more_vert</mat-icon></button>
<mat-menu #action_menu="matMenu">
<button (click)="openFileInfoDialog()" mat-menu-item><mat-icon>info</mat-icon><ng-container i18n="Video info button">Info</ng-container></button>
<button (click)="navigateToSubscription()" mat-menu-item *ngIf="file_obj.sub_id"><mat-icon>{{file_obj.isAudio ? 'library_music' : 'video_library'}}</mat-icon>&nbsp;<ng-container i18n="Go to subscription menu item">Go to subscription</ng-container></button>
<button (click)="deleteFile()" mat-menu-item>
<mat-icon>restore</mat-icon><ng-container i18n="Delete and redownload subscription video button">Delete and redownload</ng-container>
</button>

32
src/app/components/unified-file-card/unified-file-card.component.ts
View File

@@ -1,4 +1,6 @@
import { Component, OnInit, Input } from '@angular/core';
import { Component, OnInit, Input, Output, EventEmitter } from '@angular/core';
import { MatDialog } from '@angular/material/dialog';
import { VideoInfoDialogComponent } from 'app/dialogs/video-info-dialog/video-info-dialog.component';
@Component({
selector: 'app-unified-file-card',
@@ -14,28 +16,46 @@ export class UnifiedFileCardComponent implements OnInit {
type = null;
use_youtubedl_archive = false;
isSubscriptionFile: boolean = null;
@Input() file_obj = null;
@Output() goToFile = new EventEmitter<any>();
@Output() goToSubscription = new EventEmitter<any>();
constructor() { }
/*
Planned sizes:
small: 150x175
medium: 200x200
big: 250x200
*/
constructor(private dialog: MatDialog) { }
ngOnInit(): void {
this.file_length = fancyTimeFormat(this.file_obj.duration);
}
deleteFile(blacklistMode = false) {
if (this.file_obj.sub_id) {
}
}
navigateToFile() {
this.goToFile.emit(this.file_obj);
}
navigateToSubscription() {
this.goToSubscription.emit(this.file_obj);
}
openFileInfoDialog() {
this.dialog.open(VideoInfoDialogComponent, {
data: {
file: this.file_obj,
},
minWidth: '50vw'
})
}
}
function fancyTimeFormat(time) {

1
src/app/main/main.component.html
View File

@@ -183,6 +183,7 @@
<ng-template #nofile>
</ng-template>
<app-recent-videos></app-recent-videos>
<div style="margin: 20px" *ngIf="fileManagerEnabled && (!postsService.isLoggedIn || postsService.permissions.includes('filemanager'))">
<mat-accordion>
<mat-expansion-panel (opened)="accordionOpened('audio')" (closed)="accordionClosed('audio')" (mouseleave)="accordionLeft('audio')" (mouseenter)="accordionEntered('audio')" class="big">

10
src/app/posts.services.ts
View File

@@ -47,6 +47,7 @@ export class PostsService implements CanActivate {
open_create_default_admin_dialog = new BehaviorSubject<boolean>(false);
config = null;
subscriptions = null;
constructor(private http: HttpClient, private router: Router, @Inject(DOCUMENT) private document: Document,
public snackBar: MatSnackBar) {
console.log('PostsService Initialized...');
@@ -113,6 +114,15 @@ export class PostsService implements CanActivate {
this.theme = this.THEMES_CONFIG[theme];
}
getSubscriptionByID(sub_id) {
for (let i = 0; i < this.subscriptions.length; i++) {
if (this.subscriptions[i]['id'] === sub_id) {
return this.subscriptions[i];
}
}
return null;
}
startHandshake(url: string) {
return this.http.get(url + 'geturl');
}