diff --git a/src/app/app.component.scss b/src/app/app.component.scss index e69de29..14a2c1c 100644 --- a/src/app/app.component.scss +++ b/src/app/app.component.scss @@ -0,0 +1,7 @@ +::ng-deep snack-bar-container.custom-class { + //background: yellow; +} +::ng-deep .custom-class .mat-simple-snackbar { + //color: green; + justify-content: center; +} diff --git a/src/app/app.module.ts b/src/app/app.module.ts index e327b2a..56dedfa 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -23,6 +23,7 @@ import {MatInputModule} from "@angular/material/input"; import {MatDividerModule} from "@angular/material/divider"; import {MatCheckboxModule} from "@angular/material/checkbox"; import {MatFormFieldModule} from "@angular/material/form-field"; +import {MatSnackBarModule} from "@angular/material/snack-bar"; @NgModule({ @@ -36,7 +37,7 @@ import {MatFormFieldModule} from "@angular/material/form-field"; PubComponent, VideoCellComponent, VideoGridComponent, - PopupAddVideoToPlaylistsComponent + PopupAddVideoToPlaylistsComponent, ], imports: [ BrowserModule, @@ -51,7 +52,8 @@ import {MatFormFieldModule} from "@angular/material/form-field"; MatInputModule, MatDividerModule, MatCheckboxModule, - MatFormFieldModule + MatFormFieldModule, + MatSnackBarModule ], providers: [], bootstrap: [AppComponent] diff --git a/src/app/user/search/page-search/page-search.component.ts b/src/app/user/search/page-search/page-search.component.ts index f8109be..51dbe6b 100644 --- a/src/app/user/search/page-search/page-search.component.ts +++ b/src/app/user/search/page-search/page-search.component.ts @@ -1,7 +1,7 @@ import { Component, OnInit } from '@angular/core'; import {MessageService} from "../../../utils/services/message/message.service"; import {FictitiousDatasService} from "../../../utils/services/fictitiousDatas/fictitious-datas.service"; -import {PlaylistService} from "../../../utils/services/playlist/playlist.service"; +import {AddVideoToPlaylistsService} from "../../../utils/services/addVideoToPlaylists/add-video-to-playlists.service"; import {Video} from "../../../utils/interfaces/video"; @@ -31,8 +31,8 @@ export class PageSearchComponent implements OnInit ngOnInit(): void { - // --- DONNEES FICTIVES --- - this.tabVideo = this.fictitiousDatasService.load_pageSeach(7); + // --- FAUX CODE --- + this.tabVideo = this.fictitiousDatasService.getTabVideo(7); // --- VRAI CODE --- @@ -52,11 +52,9 @@ export class PageSearchComponent implements OnInit onSearch() { - // --- DONNEES FICTIVES --- - console.log(this.tabPlateform) + // --- FAUX CODE --- this.tabVideo = []; - console.log(this.tabVideo) - //this.fictitiousDatasService.load_pageSeach(4); + //this.fictitiousDatasService.getTabVideo(4); // --- VRAI CODE --- @@ -66,7 +64,7 @@ export class PageSearchComponent implements OnInit { if(plateform.isSelected) tabPlateformName.push(plateform.name); } - let data = { search: "", plaateforms: tabPlateformName }; + let data = { "search": this.search, "plateforms": tabPlateformName }; this.messageService .sendMessage("user/searchVideo", data) .subscribe(retour => { diff --git a/src/app/user/search/video-cell/video-cell.component.scss b/src/app/user/search/video-cell/video-cell.component.scss index a56bfce..d8a9ec7 100644 --- a/src/app/user/search/video-cell/video-cell.component.scss +++ b/src/app/user/search/video-cell/video-cell.component.scss @@ -1,5 +1,7 @@ .conteneur { text-align: center; - //border: solid black 2px; - //border-radius: 5px; + border: solid black 2px; + border-radius: 5px; + padding-top: 15px; + background-color: #f0f0f0; } diff --git a/src/app/user/search/video-cell/video-cell.component.ts b/src/app/user/search/video-cell/video-cell.component.ts index 3891b2d..5fba3d2 100644 --- a/src/app/user/search/video-cell/video-cell.component.ts +++ b/src/app/user/search/video-cell/video-cell.component.ts @@ -1,6 +1,16 @@ -import {Component, Input, OnInit} from '@angular/core'; +import { + Component, + ElementRef, + EventEmitter, + HostListener, + Input, + OnInit, + Output, + Renderer2, + ViewChild +} from '@angular/core'; import {VideoUrlService} from "../../../utils/services/videoUrl/video-url.service"; -import {PlaylistService} from "../../../utils/services/playlist/playlist.service"; +import {AddVideoToPlaylistsService} from "../../../utils/services/addVideoToPlaylists/add-video-to-playlists.service"; import {Video} from "../../../utils/interfaces/video"; @@ -16,7 +26,7 @@ export class VideoCellComponent implements OnInit constructor( private videoUrlService: VideoUrlService, - private playlistService: PlaylistService ) {} + private addVideoToPlaylistsService: AddVideoToPlaylistsService ) {} ngOnInit(): void @@ -27,7 +37,7 @@ export class VideoCellComponent implements OnInit onAdd(): void { - this.playlistService.addVideoToPlaylists(this.video) - console.log("onAdd:" + this.video.title); + this.addVideoToPlaylistsService.run(this.video); } + } diff --git a/src/app/utils/components/popup-add-video-to-playlists/popup-add-video-to-playlists.component.html b/src/app/utils/components/popup-add-video-to-playlists/popup-add-video-to-playlists.component.html index c3e1dc1..3ba0baf 100644 --- a/src/app/utils/components/popup-add-video-to-playlists/popup-add-video-to-playlists.component.html +++ b/src/app/utils/components/popup-add-video-to-playlists/popup-add-video-to-playlists.component.html @@ -36,6 +36,6 @@ - - + + diff --git a/src/app/utils/components/popup-add-video-to-playlists/popup-add-video-to-playlists.component.ts b/src/app/utils/components/popup-add-video-to-playlists/popup-add-video-to-playlists.component.ts index 381f107..bbfdebf 100644 --- a/src/app/utils/components/popup-add-video-to-playlists/popup-add-video-to-playlists.component.ts +++ b/src/app/utils/components/popup-add-video-to-playlists/popup-add-video-to-playlists.component.ts @@ -1,6 +1,9 @@ import {Component, Inject, OnInit} from '@angular/core'; import {MAT_DIALOG_DATA, MatDialogRef} from "@angular/material/dialog"; import {Video} from "../../interfaces/video"; +import {MessageService} from "../../services/message/message.service"; + + @Component({ selector: 'app-popup-add-video-to-playlists', @@ -14,23 +17,51 @@ export class PopupAddVideoToPlaylistsComponent implements OnInit goToCreatePlaylist = false; newPlaylistName = ""; + constructor( public dialogRef: MatDialogRef, - @Inject(MAT_DIALOG_DATA) public data ) { } + @Inject(MAT_DIALOG_DATA) public data, + private messageService: MessageService) { } ngOnInit(): void { this.video = this.data.video; - const tabPlaylist = this.data.playlists; - for(let playlist of tabPlaylist) + for(let playlist of this.data.playlists) { playlist["isSelected"] = false; this.tabPlaylistAndBool.push(playlist); } } + onValider(): void { + const tabPlaylist = []; + for(let playlist of this.tabPlaylistAndBool) + { + if(playlist.isSelected) { + delete playlist["isSelected"]; + tabPlaylist.push(playlist); + } + } + // --- FAUX CODE --- + this.dialogRef.close("success"); + + // --- VRAI CODE --- + /* + if(!this.goToCreatePlaylist) this.newPlaylistName = ""; + const data = { "video": this.video, "playlists": tabPlaylist, "newPlaylistName": this.newPlaylistName }; + this.messageService + .sendMessage("user/add/vidéo", data) + .subscribe( retour => { this.dialogRef.close(retour.status) }); + */ } + + + onAnnuler(): void + { + this.dialogRef.close("annulation") + } + } diff --git a/src/app/utils/components/pub/pub.component.html b/src/app/utils/components/pub/pub.component.html index 6522d0a..0bbd758 100644 --- a/src/app/utils/components/pub/pub.component.html +++ b/src/app/utils/components/pub/pub.component.html @@ -1,3 +1,6 @@
-

Je suis une pub

+ debut + + + fin
diff --git a/src/app/utils/services/playlist/playlist.service.spec.ts b/src/app/utils/services/addVideoToPlaylists/add-video-to-playlists.service.spec.ts similarity index 56% rename from src/app/utils/services/playlist/playlist.service.spec.ts rename to src/app/utils/services/addVideoToPlaylists/add-video-to-playlists.service.spec.ts index d8b33c6..6097218 100644 --- a/src/app/utils/services/playlist/playlist.service.spec.ts +++ b/src/app/utils/services/addVideoToPlaylists/add-video-to-playlists.service.spec.ts @@ -1,13 +1,13 @@ import { TestBed } from '@angular/core/testing'; -import { PlaylistService } from './playlist.service'; +import { AddVideoToPlaylistsService } from './add-video-to-playlists.service'; describe('PlaylistService', () => { - let service: PlaylistService; + let service: AddVideoToPlaylistsService; beforeEach(() => { TestBed.configureTestingModule({}); - service = TestBed.inject(PlaylistService); + service = TestBed.inject(AddVideoToPlaylistsService); }); it('should be created', () => { diff --git a/src/app/utils/services/addVideoToPlaylists/add-video-to-playlists.service.ts b/src/app/utils/services/addVideoToPlaylists/add-video-to-playlists.service.ts new file mode 100644 index 0000000..19cd2d7 --- /dev/null +++ b/src/app/utils/services/addVideoToPlaylists/add-video-to-playlists.service.ts @@ -0,0 +1,85 @@ +import { Injectable } from '@angular/core'; +import {MessageService} from "../message/message.service"; +import {MatDialog} from "@angular/material/dialog"; +import {PopupAddVideoToPlaylistsComponent} from "../../components/popup-add-video-to-playlists/popup-add-video-to-playlists.component"; +import {FictitiousDatasService} from "../fictitiousDatas/fictitious-datas.service"; +import {Video} from "../../interfaces/video"; +import {MatSnackBar} from "@angular/material/snack-bar"; + +@Injectable({ + providedIn: 'root' +}) +export class AddVideoToPlaylistsService +{ + private _video: Video; + + + constructor( private messageService: MessageService, + public dialog: MatDialog, + private fictitiousDatasService: FictitiousDatasService, + private snackBar: MatSnackBar ) { } + + + // --- FAUX CODE --- + run(video0: Video): void + { + this._video = video0; + const retour = { + status: "success", + data: this.fictitiousDatasService.getTabPlaylist(4), + } + this.afterReceivingPlaylists(retour) + } + + + // --- VRAI CODE --- + /* + run(video0: Video): void + { + this._video = video0; + this.messageService + .sendMessage('user/get/playlists', null) + .subscribe( retour => { this.afterReceivingPlaylists(retour) }); + } + */ + + + private afterReceivingPlaylists(retour): void + { + if(retour.status === "error") console.log(retour.data); + else + { + const config = { + width: '30%', + data: { video: this._video, playlists: retour.data } + }; + this.dialog + .open(PopupAddVideoToPlaylistsComponent, config ) + .afterClosed() + .subscribe(retour => { this.afterClosingDialog(retour); }); + } + } + + + private afterClosingDialog(retour): void + { + let message = "" ; + switch (retour) + { + case "error": + message = "Echec de l'opération ❌" ; + break; + case "success": + message = "La vidéo a bien été ajoutée ✔" ; + break; + case "annulation": + case null: + case undefined: + message = "Annulation de l'opération" ; + break; + } + const config = { duration: 1000, panelClass: "custom-class" }; + this.snackBar.open( message, "", config); + } + +} diff --git a/src/app/utils/services/fictitiousDatas/fictitious-datas.service.ts b/src/app/utils/services/fictitiousDatas/fictitious-datas.service.ts index 99bc4c3..253e1ea 100644 --- a/src/app/utils/services/fictitiousDatas/fictitious-datas.service.ts +++ b/src/app/utils/services/fictitiousDatas/fictitious-datas.service.ts @@ -10,7 +10,7 @@ export class FictitiousDatasService constructor() { } - load_pageSeach(n: number): Video[] + getTabVideo(n: number): Video[] { let tabVideo = []; @@ -34,16 +34,16 @@ export class FictitiousDatasService } - getTabPlaylist() + getTabPlaylist(n: number) { let tabTabPlaylist: Playlist[] = []; - for (let i = 0; i < 4; i++) + for (let i = 0; i < n; i++) { let playlist: Playlist = { _id: i.toString(), user: null, - name: "name_"+i.toString(), + name: "playlist_"+i.toString(), count: 3, videos: [] } diff --git a/src/app/utils/services/playlist/playlist.service.ts b/src/app/utils/services/playlist/playlist.service.ts deleted file mode 100644 index 3dc64ec..0000000 --- a/src/app/utils/services/playlist/playlist.service.ts +++ /dev/null @@ -1,60 +0,0 @@ -import { Injectable } from '@angular/core'; -import {MessageService} from "../message/message.service"; -import {MatDialog} from "@angular/material/dialog"; -import {PopupAddVideoToPlaylistsComponent} from "../../components/popup-add-video-to-playlists/popup-add-video-to-playlists.component"; -import {FictitiousDatasService} from "../fictitiousDatas/fictitious-datas.service"; -import {Video} from "../../interfaces/video"; - -@Injectable({ - providedIn: 'root' -}) -export class PlaylistService -{ - - constructor( private messageService: MessageService, - public dialog: MatDialog, - private fictitiousDatasService: FictitiousDatasService ) { } - - - addVideoToPlaylists(video0: Video): void - { - // --- DONNEES FICTIVES --- - const config = { - width: '30%', - data: { - video: video0, - playlists: this.fictitiousDatasService.getTabPlaylist() - } - } - this.dialog - .open(PopupAddVideoToPlaylistsComponent, config) - .afterClosed() - .subscribe(result => {}); - - - // --- VRAI CODE --- - /* - this.messageService - .sendMessage('user/get/playlists', null) - .subscribe( retour => { - - if(retour.status === "error") console.log(retour.data); - else - { - const config = { - width: '30%', - data: { - video: video0, - playlists: retour.data, - } - }; - this.dialog - .open(PopupAddVideoToPlaylistsComponent, config ) - .afterClosed() - .subscribe(result => {}); - } - }) - */ - } - -} diff --git a/src/app/utils/services/videoUrl/video-url.service.ts b/src/app/utils/services/videoUrl/video-url.service.ts index 9317046..8a6caeb 100644 --- a/src/app/utils/services/videoUrl/video-url.service.ts +++ b/src/app/utils/services/videoUrl/video-url.service.ts @@ -22,13 +22,13 @@ export class VideoUrlService { if(videoUrl.includes("youtu.be")) { - console.log("de la forme: https://youtu.be/blablabla"); + //console.log("de la forme: https://youtu.be/blablabla"); const tab = videoUrl.split("youtu.be/"); videoUrl = tab[0] + "www.youtube.com/embed/" + tab[1]; } else if(videoUrl.includes("youtube.com/watch?v=")) { - console.log("de la forme: https://www.youtube.com/watch?v=blablabla"); + //console.log("de la forme: https://www.youtube.com/watch?v=blablabla"); const tab = videoUrl.split("youtube.com/watch?v="); videoUrl = tab[0] + "youtube.com/embed/" + tab[1]; } @@ -38,7 +38,7 @@ export class VideoUrlService daylimotionSafeUrl(videoUrl: string): string { - console.log("de la forme: https://www.dailymotion.com/video/blablabla"); + //console.log("de la forme: https://www.dailymotion.com/video/blablabla"); const n = "https://www.dailymotion.com/".length; return videoUrl.slice(0, n) + "embed/" + videoUrl.slice(n); } diff --git a/src/assets/ads/Youtube.png b/src/assets/ads/Youtube.png new file mode 100644 index 0000000..5924c8d Binary files /dev/null and b/src/assets/ads/Youtube.png differ diff --git a/src/assets/ads/nutella.png b/src/assets/ads/nutella.png new file mode 100644 index 0000000..88cc9ef Binary files /dev/null and b/src/assets/ads/nutella.png differ