implementation du bouton 'retour' dans la page 'user/watching'
This commit is contained in:
parent
f2ced83246
commit
ad0397e8ad
9 changed files with 219 additions and 66 deletions
|
|
@ -62,7 +62,7 @@
|
|||
<!-- Grilles des videos -->
|
||||
<mat-grid-tile colspan="7" rowspan="1" class="celluleGrilleVideo">
|
||||
<div class="conteneurVideosGrid">
|
||||
<app-video-grid [tabVideo]="tabVideo" [search]="search"></app-video-grid>
|
||||
<app-video-grid [tabVideo]="tabVideo" [search]="search" [sources]="sources" [indexPage]="indexPage"></app-video-grid>
|
||||
</div>
|
||||
</mat-grid-tile>
|
||||
|
||||
|
|
|
|||
|
|
@ -3,6 +3,7 @@ import {MessageService} from "../../../utils/services/message/message.service";
|
|||
import {VideoAll} from "../../../utils/interfaces/video";
|
||||
import {ThemeService} from "../../../utils/services/theme/theme.service";
|
||||
import {HttpParams} from "@angular/common/http";
|
||||
import {ActivatedRoute} from "@angular/router";
|
||||
|
||||
|
||||
|
||||
|
|
@ -25,28 +26,55 @@ export class PageSearchComponent implements OnInit
|
|||
search: string = "";
|
||||
ad1: any;
|
||||
ad2: any;
|
||||
sources: string = "" ;
|
||||
indexPage: number = 0;
|
||||
|
||||
|
||||
constructor( private messageService: MessageService,
|
||||
public themeService: ThemeService ) { }
|
||||
public themeService: ThemeService,
|
||||
private activatedRoute: ActivatedRoute ) { }
|
||||
|
||||
|
||||
ngOnInit(): void
|
||||
{
|
||||
// parametre de la route
|
||||
this.activatedRoute
|
||||
.queryParams
|
||||
.subscribe(paramsFromOldPage => {
|
||||
if(paramsFromOldPage.hasOwnProperty("search")) this.search = paramsFromOldPage.search;
|
||||
if(paramsFromOldPage.hasOwnProperty("sources"))
|
||||
{
|
||||
this.sources = paramsFromOldPage.sources;
|
||||
if(this.sources === "yt") {
|
||||
this.tabPlateform[0].isSelected = true;
|
||||
this.tabPlateform[1].isSelected = false;
|
||||
}
|
||||
else if(this.sources === "dm") {
|
||||
this.tabPlateform[0].isSelected = false;
|
||||
this.tabPlateform[1].isSelected = true;
|
||||
}
|
||||
else if(this.sources === "yt,dm") {
|
||||
this.tabPlateform[0].isSelected = true;
|
||||
this.tabPlateform[1].isSelected = true;
|
||||
}
|
||||
}
|
||||
if(paramsFromOldPage.hasOwnProperty("indexPage")) this.indexPage = parseInt(paramsFromOldPage.indexPage, 10);
|
||||
this.onSearch();
|
||||
});
|
||||
|
||||
// Ask for ads
|
||||
let params = new HttpParams();
|
||||
params = params.append("quantity", 2);
|
||||
this.messageService
|
||||
.get("user/ad", params)
|
||||
.subscribe(ret => this.adCallback(ret), err => this.adCallback(err));
|
||||
|
||||
this.onSearch();
|
||||
}
|
||||
|
||||
|
||||
adCallback(retour: any): void
|
||||
{
|
||||
if(retour.status !== "success") {
|
||||
//console.log(retour);
|
||||
console.log(retour);
|
||||
}
|
||||
else {
|
||||
this.ad1 = retour.data[0];
|
||||
|
|
@ -60,12 +88,11 @@ export class PageSearchComponent implements OnInit
|
|||
let params = new HttpParams();
|
||||
params = params.append('q', this.search);
|
||||
|
||||
let sources = "";
|
||||
if(this.tabPlateform[0].isSelected && this.tabPlateform[1].isSelected) sources += "yt,dm" ;
|
||||
else if((!this.tabPlateform[0].isSelected) && this.tabPlateform[1].isSelected) sources += "dm" ;
|
||||
else if(this.tabPlateform[0].isSelected && (!this.tabPlateform[1].isSelected)) sources += "yt" ;
|
||||
else sources += "" ;
|
||||
params = params.append('sources', sources);
|
||||
if(this.tabPlateform[0].isSelected && this.tabPlateform[1].isSelected) this.sources = "yt,dm" ;
|
||||
else if((!this.tabPlateform[0].isSelected) && this.tabPlateform[1].isSelected) this.sources = "dm" ;
|
||||
else if(this.tabPlateform[0].isSelected && (!this.tabPlateform[1].isSelected)) this.sources = "yt" ;
|
||||
else this.sources = "" ;
|
||||
params = params.append('sources', this.sources);
|
||||
|
||||
this.messageService
|
||||
.get("video/search", params)
|
||||
|
|
|
|||
|
|
@ -2,7 +2,7 @@
|
|||
|
||||
|
||||
<!-- Grille -->
|
||||
<div style="height: 93%; background-color: white; padding-top: 7px;">
|
||||
<div style="height: 93%; background-color: white; padding-top: 7px;" *ngIf="tabVideoExists()">
|
||||
<mat-grid-list cols="3" rowHeight="33%">
|
||||
<mat-grid-tile colspan="1" rowspan="1" *ngFor="let k of [0,1,2,3,4,5,6,7,8]">
|
||||
<div class="myCell" *ngIf="indexPage+k < tabVideo.length" [title]="tabVideo[indexPage+k].title">
|
||||
|
|
@ -55,13 +55,13 @@
|
|||
|
||||
|
||||
<!-- Paginator -->
|
||||
<div class="paginatorContainer">
|
||||
<div class="paginatorContainer" *ngIf="tabVideoExists()">
|
||||
|
||||
<!-- btn précédent -->
|
||||
<button mat-button class="btnPaginator" [disabled]="indexPage<=0" (click)="indexPage=indexPage-9"> < Précédent </button>
|
||||
|
||||
<!-- numeros de page -->
|
||||
<span *ngFor="let page of [1,2,3,4,5,6,7,8,9,10]" (click)="indexPage=(page-1)*9">
|
||||
<span *ngFor="let page of tabPage" (click)="indexPage=(page-1)*9">
|
||||
<span *ngIf="page===((indexPage/9)+1)">
|
||||
<span style="text-decoration: underline; cursor: pointer;font-weight: bold;">{{page}}</span>
|
||||
</span>
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
import {Component, Input } from '@angular/core';
|
||||
import {Component, Input, OnChanges, OnInit, SimpleChanges} from '@angular/core';
|
||||
import {VideoAll} from "../../../utils/interfaces/video";
|
||||
import {AddVideoToPlaylistsService} from "../../utils/services/addVideoToPlaylists/add-video-to-playlists.service";
|
||||
import {Router} from "@angular/router";
|
||||
|
|
@ -11,11 +11,13 @@ import {MessageService} from "../../../utils/services/message/message.service";
|
|||
templateUrl: './video-grid.component.html',
|
||||
styleUrls: ['./video-grid.component.scss']
|
||||
})
|
||||
export class VideoGridComponent
|
||||
export class VideoGridComponent implements OnChanges
|
||||
{
|
||||
@Input() tabVideo: VideoAll[] = [];
|
||||
@Input() search: string = '';
|
||||
indexPage: number = 0;
|
||||
@Input() search: string = "";
|
||||
@Input() sources: string = "";
|
||||
@Input() indexPage: number = 0;
|
||||
tabPage: number[] = [];
|
||||
|
||||
|
||||
constructor( private addVideoToPlaylistsService: AddVideoToPlaylistsService,
|
||||
|
|
@ -23,6 +25,19 @@ export class VideoGridComponent
|
|||
private messageService: MessageService ) {}
|
||||
|
||||
|
||||
ngOnChanges(changes: SimpleChanges): void
|
||||
{
|
||||
if(this.tabVideoExists())
|
||||
{
|
||||
const nbVideo = this.tabVideo.length;
|
||||
let nbPage = Math.floor(nbVideo/9);
|
||||
if((nbVideo%9) !== 0) nbPage += 1;
|
||||
this.tabPage = [];
|
||||
for(let i=1 ; i<=nbPage ; i++) this.tabPage.push(i);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
onAddToPlaylist(video: VideoAll): void
|
||||
{
|
||||
this.addVideoToPlaylistsService.run(video.videoId, video.source, video.interest);
|
||||
|
|
@ -41,16 +56,26 @@ export class VideoGridComponent
|
|||
const data = { source: video.source, interest: video.interest };
|
||||
this.messageService
|
||||
.post("video/create/"+video.videoId, data)
|
||||
.subscribe(ret => this.onVideoCallback(ret), err => this.onVideoCallback(err));
|
||||
|
||||
const url = '/user/watching/fromSearch/'+video.videoId+'/'+video.source+'/'+this.search;
|
||||
this.router.navigateByUrl(url);
|
||||
.subscribe(ret => this.onVideoCallback(ret,video), err => this.onVideoCallback(err,video));
|
||||
}
|
||||
|
||||
|
||||
onVideoCallback(retour: any): void
|
||||
onVideoCallback(retour: any, video: VideoAll): void
|
||||
{
|
||||
if(retour.status !== "success") console.log(retour);
|
||||
if(retour.status !== "success") {
|
||||
console.log(retour);
|
||||
}
|
||||
else {
|
||||
const params = {
|
||||
videoId: video.videoId,
|
||||
source: video.source,
|
||||
from: "search",
|
||||
search: this.search,
|
||||
sources: this.sources,
|
||||
indexPage: this.indexPage
|
||||
};
|
||||
this.router.navigate(['/user/watching'], { queryParams: params });
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
|
@ -93,4 +118,12 @@ export class VideoGridComponent
|
|||
else return ellapsedTimeInYears + " ans" ;
|
||||
}
|
||||
|
||||
|
||||
tabVideoExists(): boolean
|
||||
{
|
||||
if((this.tabVideo === null) || (this.tabVideo === undefined)) return false;
|
||||
else if(this.tabVideo.length === 0) return false;
|
||||
else return true;
|
||||
}
|
||||
|
||||
}
|
||||
|
|
|
|||
Reference in a new issue