realisation de la page mesPlaylists

This commit is contained in:
MiharyR 2021-10-29 23:04:43 +02:00
parent 8784c290ca
commit d0ca04aefc
24 changed files with 842 additions and 36 deletions

View file

@ -22,7 +22,7 @@
<a routerLink="/search"> Rechercher </a>
</li>
<li class="cliquable">
<a routerLink="/search"> Mes playlists </a>
<a routerLink="/myPlaylists"> Mes playlists </a>
</li>
<li class="cliquable">
<a routerLink="/search"> Historique </a>

View file

@ -0,0 +1,16 @@
<div style="text-align: center; margin: 0px; padding: 0px">
<div style="margin: 0px; padding: 0px">
<mat-form-field appearance="fill" style="margin: 0px; padding: 0px">
<mat-label> Nom de la playlist </mat-label>
<input matInput [(ngModel)]="name" style="width: 100%">
</mat-form-field>
<span *ngIf="hasError" class="mat-error"> {{errorMessage}} </span>
</div>
<div style="text-align: right ; margin: 0px; padding: 0px">
<button mat-button (click)="onAnnuler()">Annuler</button>
<button mat-button (click)="onValider()">Creer</button>
</div>
</div>

View file

@ -0,0 +1,25 @@
import { ComponentFixture, TestBed } from '@angular/core/testing';
import { PopupCreatePlaylistComponent } from './popup-create-playlist.component';
describe('PopupCreatePlaylistComponent', () => {
let component: PopupCreatePlaylistComponent;
let fixture: ComponentFixture<PopupCreatePlaylistComponent>;
beforeEach(async () => {
await TestBed.configureTestingModule({
declarations: [ PopupCreatePlaylistComponent ]
})
.compileComponents();
});
beforeEach(() => {
fixture = TestBed.createComponent(PopupCreatePlaylistComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});

View file

@ -0,0 +1,92 @@
import {Component, Inject, OnInit} from '@angular/core';
import {MAT_DIALOG_DATA, MatDialogRef} from "@angular/material/dialog";
import {MessageService} from "../../services/message/message.service";
import {Playlist} from "../../interfaces/playlist";
@Component({
selector: 'app-popup-create-playlist',
templateUrl: './popup-create-playlist.component.html',
styleUrls: ['./popup-create-playlist.component.scss']
})
export class PopupCreatePlaylistComponent implements OnInit
{
name: string = "" ;
hasError: boolean = false;
tabNomPlaylist: string[] = [];
errorMessage: string = "" ;
constructor( public dialogRef: MatDialogRef<PopupCreatePlaylistComponent>,
@Inject(MAT_DIALOG_DATA) public data,
private messageService: MessageService) { }
ngOnInit(): void
{
this.tabNomPlaylist = this.data.map( playlist0 => playlist0.name );
}
onValider(): void
{
// --- FAUX CODE ---
//
this.checkError();
if(!this.hasError)
{
const playlist: Playlist = {
_id: "monId",
user: null,
name: this.name,
videos: [],
};
this.dialogRef.close(playlist);
}
// --- VRAI CODE ---
/*
this.checkError();
if(!this.hasError)
{
this.messageService
.sendMessage("user/create/playlist", {name: this.data.name})
.subscribe(retour => {
if (retour.status === "error") {
console.log(retour);
this.dialogRef.close(null);
} else {
this.dialogRef.close(retour.data.playlist);
}
});
}
*/
}
checkError(): void
{
if(this.name === "") {
this.errorMessage = "Le nom ne peut pas être vide" ;
this.hasError = true;
}
else if(this.tabNomPlaylist.includes(this.name)){
this.errorMessage = "Ce nom est déjà utilisé" ;
this.hasError = true;
}
else {
this.hasError = false;
this.errorMessage = "" ;
}
console.log("em:" + this.errorMessage);
}
onAnnuler(): void
{
this.dialogRef.close(null);
}
}

View file

@ -5,6 +5,5 @@ export interface Playlist
_id: string,
user: any,
name: string,
count: number
videos: Video[]
}

View file

@ -26,7 +26,7 @@ export class AddVideoToPlaylistsService
this._video = video0;
const retour = {
status: "success",
data: this.fictitiousDatasService.getTabPlaylist(4),
data: this.fictitiousDatasService.getTabPlaylist(4, 5),
}
this.afterReceivingPlaylists(retour)
}

View file

@ -3,6 +3,89 @@ import {Video} from "../../interfaces/video";
import {Playlist} from "../../interfaces/playlist";
import {Advert} from "../../interfaces/advert";
const TAB_VIDEO = [
{
_id: "Mowgli",
url: "https://www.youtube.com/watch?v=medPORJ8KO0",
title: "PNL - Mowgli",
description: "dans l'album Que la famille",
views: 11,
},
{
_id: "Mexico",
url: "https://www.youtube.com/watch?v=LZx6oeNeoWM",
title: "PNL - Mexico",
description: "dans l'album Monde chico",
views: 22,
},
{
_id: "Luz de luna",
url: "https://www.youtube.com/watch?v=fGoPhSV2Jic",
title: "PNL - Luz de luna",
description: "dans l'album Dans la legende",
views: 33,
},
{
_id: "Blanka",
url: "https://www.youtube.com/watch?v=u8bHjdljyLw",
title: "PNL - Blanka",
description: "dans l'album Deux frères",
views: 44,
},
{
_id: "Mowgli 2",
url: "https://www.dailymotion.com/video/x7ahxdn",
title: "PNL - Mowgli",
description: "exclu",
views: 55,
},
{
_id: "Etre humain",
url: "https://www.youtube.com/watch?v=gfVo39B92Ow",
title: "Nekfeu - Etre humain",
description: "dans l'album feu",
views: 66,
},
{
_id: "Humanoide",
url: "https://www.youtube.com/watch?v=MiyIg__WNOw",
title: "Nekfeu - Humanoide",
description: "dans l'album Cyborg",
views: 77,
},
{
_id: "Dernier soupir",
url: "https://youtu.be/0GqjIF-4QQM?list=PLqeKQSn3LuAmpF-uIu39RIQRQkUzVol5l",
title: "Nekfeu - Dernier soupir",
description: "dans l'album Les etoiles vagabondes",
views: 88,
},
{
_id: "Dernier soupir",
url: "https://youtu.be/0GqjIF-4QQM?list=PLqeKQSn3LuAmpF-uIu39RIQRQkUzVol5l",
title: "Nekfeu - Dernier soupir",
description: "dans l'album Les etoiles vagabondes",
views: 99,
},
{
_id: "Les prélis",
url: "https://www.dailymotion.com/video/x4trtkd",
title: "Columbine - Les prélis",
description: "dans l'album Enfant terrible",
views: 100,
},
{
_id: "Pierre feuille ciseau",
url: "https://www.dailymotion.com/video/x6agl6i",
title: "Columbine - Pierre feuille ciseau",
description: "exclu",
views: 111,
},
]
@Injectable({
providedIn: 'root'
})
@ -14,39 +97,29 @@ export class FictitiousDatasService
getTabVideo(n: number): Video[]
{
let tabVideo = [];
const l = TAB_VIDEO.length;
let url0 = "" ;
for(let i=0 ; i<n ; i++)
{
if(i%3 === 0) url0 = "https://www.youtube.com/watch?v=medPORJ8KO0";
else if(i%3 === 1) url0 = "https://youtu.be/medPORJ8KO0";
else url0 = "https://www.dailymotion.com/video/x7ahxdn";
const video: Video = {
_id: i.toString(),
url: url0,
title: "video_" + i,
description: "blablabla",
views: 59,
}
tabVideo.push(video)
const idx = Math.floor(Math.random() * l);
tabVideo.push(TAB_VIDEO[idx]);
}
return tabVideo;
}
getTabPlaylist(n: number)
getTabPlaylist(nbPlaylist: number, nbVideoMax: number)
{
let tabTabPlaylist: Playlist[] = [];
for (let i = 0; i < n; i++)
for (let i = 0; i < nbPlaylist; i++)
{
let playlist: Playlist = {
_id: i.toString(),
user: null,
name: "playlist_"+i.toString(),
count: 3,
videos: []
videos: this.getTabVideo(Math.floor(Math.random() * nbVideoMax))
}
tabTabPlaylist.push(playlist);
}