170 lines
5.5 KiB
TypeScript
170 lines
5.5 KiB
TypeScript
import { Component, OnInit } from '@angular/core';
|
|
import {VideoAll} from "../../../utils/interfaces/video";
|
|
import {Advert} from "../../../utils/interfaces/advert";
|
|
import {MessageService} from "../../../utils/services/message/message.service";
|
|
import {FictitiousVideosService} from "../../../utils/services/fictitiousDatas/fictitiousVideos/fictitious-videos.service";
|
|
import {FictitiousAdvertsService} from "../../../utils/services/fictitiousDatas/fictitiousAdverts/fictitious-adverts.service";
|
|
import {ThemeService} from "../../../utils/services/theme/theme.service";
|
|
import {ActivatedRoute, Router} from "@angular/router";
|
|
import {AddVideoToPlaylistsService} from "../../utils/services/addVideoToPlaylists/add-video-to-playlists.service";
|
|
import {PlaylistDB} from "../../../utils/interfaces/playlist";
|
|
import {DomSanitizer, SafeResourceUrl} from "@angular/platform-browser";
|
|
import {HttpParams} from "@angular/common/http";
|
|
|
|
|
|
|
|
let TAB_PLATEFORM = [
|
|
{ name: "youtube", isSelected: false },
|
|
{ name: "dailymotion", isSelected: false }
|
|
];
|
|
|
|
|
|
|
|
@Component({
|
|
selector: 'app-page-watching-video',
|
|
templateUrl: './page-watching-video.component.html',
|
|
styleUrls: ['./page-watching-video.component.scss']
|
|
})
|
|
export class PageWatchingVideoComponent implements OnInit
|
|
{
|
|
tabPlateform = TAB_PLATEFORM;
|
|
video = {
|
|
title: "",
|
|
videoId: "",
|
|
views: 0,
|
|
publishedAt: null,
|
|
description: "",
|
|
source: ""
|
|
};
|
|
search: string = "";
|
|
ad1: any = { title: "", url: "", images: [] };
|
|
ad2: any = { title: "", url: "", images: [] };
|
|
from: string = "";
|
|
|
|
playlist: PlaylistDB;
|
|
videosInPlaylist: any[] = [];
|
|
|
|
hiddenDescription: boolean = true;
|
|
iframeStyle: string = "";
|
|
containerStyle: string = "";
|
|
|
|
|
|
constructor( private messageService: MessageService,
|
|
private fictitiousVideosService: FictitiousVideosService,
|
|
private fictitiousAdvertsService: FictitiousAdvertsService,
|
|
public themeService: ThemeService,
|
|
private activatedRoute: ActivatedRoute,
|
|
private router: Router,
|
|
private _sanitizer: DomSanitizer ) { }
|
|
|
|
|
|
ngOnInit(): void
|
|
{
|
|
// Ask for videos
|
|
const videoId = this.activatedRoute.snapshot.paramMap.get('videoId');
|
|
let params1 = new HttpParams();
|
|
let source = "" ;
|
|
if(this.activatedRoute.snapshot.paramMap.get('source') === "Youtube") source = "yt" ;
|
|
else source = "dm"
|
|
params1 = params1.append("source", source);
|
|
this.messageService
|
|
.get("video/get/"+videoId, params1)
|
|
.subscribe(ret => this.findVideoCallback(ret), err => this.findVideoCallback(err));
|
|
|
|
// Ask for adverts
|
|
let params2 = new HttpParams();
|
|
params2 = params2.append("quantity", 2);
|
|
this.messageService
|
|
.get("user/ad", params2)
|
|
.subscribe(ret => this.findAdCallback(ret), err => this.findAdCallback(err));
|
|
|
|
|
|
if(this.router.url.includes("fromSearch")) this.from = "search" ;
|
|
else if(this.router.url.includes("fromHistory")) this.from = "history";
|
|
else if(this.router.url.includes("fromMyPlaylists"))
|
|
{
|
|
this.from = "myPlaylists";
|
|
const _idPlaylist = this.activatedRoute.snapshot.paramMap.get('_idPlaylist');
|
|
this.playlist = this.fictitiousVideosService.getPlaylistBy_id(_idPlaylist);
|
|
const allVideo = this.fictitiousVideosService.get_TAB_VIDEO();
|
|
this.videosInPlaylist = [];
|
|
for(let _idVideo of this.playlist.videoIds)
|
|
{
|
|
const video = allVideo.find(video => video._id === _idVideo);
|
|
this.videosInPlaylist.push(video);
|
|
}
|
|
}
|
|
|
|
// style
|
|
if(this.from === 'search' || this.from === 'history')
|
|
{
|
|
this.containerStyle = "margin: 0 auto; width: 64vw;"
|
|
this.iframeStyle = "width: 64vw; height: 60vh;" ;
|
|
}
|
|
else {
|
|
this.containerStyle = "margin: 0 auto; width: 48vw;"
|
|
this.iframeStyle = "width: 48vw; height: 45vh;" ;
|
|
}
|
|
}
|
|
|
|
|
|
findVideoCallback(retour: any): void
|
|
{
|
|
if(retour.status !== "success") {
|
|
console.log(retour);
|
|
}
|
|
else {
|
|
this.video = retour.data;
|
|
}
|
|
}
|
|
|
|
|
|
findAdCallback(retour: any): void
|
|
{
|
|
if(retour !== "success") {
|
|
console.log(retour);
|
|
}
|
|
else {
|
|
this.ad1 = retour.data[0];
|
|
this.ad2 = retour.data[1];
|
|
}
|
|
}
|
|
|
|
|
|
onSearch()
|
|
{
|
|
|
|
}
|
|
|
|
|
|
onAddToPlaylist(): void
|
|
{
|
|
//this.addVideoToPlaylistsService.run(this.video);
|
|
}
|
|
|
|
|
|
onRetour(): void
|
|
{
|
|
if(this.from === 'search') this.router.navigateByUrl("/user/search");
|
|
else if(this.from === 'myPlaylists') this.router.navigateByUrl("/user/myPlaylists");
|
|
else if(this.from === 'history') this.router.navigateByUrl("/user/history");
|
|
}
|
|
|
|
|
|
safeUrl(videoId: string, source: string): SafeResourceUrl
|
|
{
|
|
let videoUrl = "" ;
|
|
if(source === 'Youtube') videoUrl = "https://www.youtube.com/embed/" + videoId + "?autoplay=1";
|
|
else if(source === 'Dailymotion') videoUrl = "https://www.dailymotion.com/embed/video/" + videoId + "?autoplay=true";
|
|
return this._sanitizer.bypassSecurityTrustResourceUrl(videoUrl);
|
|
}
|
|
|
|
|
|
// retourne la classe CSS de videoCell
|
|
getClassOfVideoCell(video0: VideoAll): string
|
|
{
|
|
if(video0 === this.video) return "videoCell videoCellFocus" ;
|
|
else return "videoCell" ;
|
|
}
|
|
|
|
}
|