diff --git a/src/app/app.module.ts b/src/app/app.module.ts index 848842d..832ab45 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -27,7 +27,7 @@ import {MatGridListModule} from "@angular/material/grid-list"; import { PageMyPlaylistsComponent } from './user/myPlaylists/page-my-playlists/page-my-playlists.component'; import { PlaylistListComponent } from './user/myPlaylists/playlist-list/playlist-list.component'; import {VideoListComponent} from "./user/myPlaylists/video-list/video-list.component"; -import { PopupCreatePlaylistComponent } from './user/utils/components/popup-create-playlist/popup-create-playlist.component'; +import { PopupCreatePlaylistComponent } from './user/myPlaylists/popup-create-playlist/popup-create-playlist.component'; import { PageHistoryUserComponent } from './user/history/page-history-user/page-history-user.component'; import {MatTableModule} from '@angular/material/table'; import { NgbModule } from '@ng-bootstrap/ng-bootstrap'; diff --git a/src/app/user/history/page-history-user/page-history-user.component.html b/src/app/user/history/page-history-user/page-history-user.component.html index 9de05f6..07ef9dd 100644 --- a/src/app/user/history/page-history-user/page-history-user.component.html +++ b/src/app/user/history/page-history-user/page-history-user.component.html @@ -7,7 +7,7 @@
- +

diff --git a/src/app/user/history/page-history-user/page-history-user.component.ts b/src/app/user/history/page-history-user/page-history-user.component.ts index 1164254..5f1ff69 100644 --- a/src/app/user/history/page-history-user/page-history-user.component.ts +++ b/src/app/user/history/page-history-user/page-history-user.component.ts @@ -3,7 +3,6 @@ import {ThemeService} from "../../../utils/services/theme/theme.service"; import {MessageService} from "../../../utils/services/message/message.service"; import {MatTableDataSource} from "@angular/material/table"; import {MatSort} from "@angular/material/sort"; -import {VideoUrlService} from "../../utils/services/videoUrl/video-url.service"; import {UserHistoryService} from "../../utils/services/userHistory/userHistory.service"; import {MatPaginator} from "@angular/material/paginator"; import {FictitiousVideosService} from "../../../utils/services/fictitiousDatas/fictitiousVideos/fictitious-videos.service"; @@ -28,7 +27,6 @@ export class PageHistoryUserComponent implements AfterViewInit constructor( public themeService: ThemeService, private messageService: MessageService, private fictitiousVideosService: FictitiousVideosService, - public videoUrlService: VideoUrlService, private userHistoryService: UserHistoryService, private router: Router ) { } diff --git a/src/app/user/myPlaylists/playlist-list/playlist-list.component.scss b/src/app/user/myPlaylists/playlist-list/playlist-list.component.scss index 451a75f..832cbfb 100644 --- a/src/app/user/myPlaylists/playlist-list/playlist-list.component.scss +++ b/src/app/user/myPlaylists/playlist-list/playlist-list.component.scss @@ -5,6 +5,8 @@ margin: 1vh 0vh 3vh 0vh; padding: 0px; border: solid 2px black; + border-radius: 10px; + box-shadow: 10px 5px 5px black; } // SearchBar ----------------------------------------------------------- @@ -16,16 +18,16 @@ background-color: #dcdcdc; font-size: large; border-bottom: solid 1px black; + border-top-left-radius: 10px; + border-top-right-radius: 10px; } .inputSearchBar { width: 70%; -} -.btnRechercher { - border: solid black 1px; border-radius: 5px; } + // Liste des playlists ------------------------------------------------- .playlistListContainer { @@ -62,6 +64,8 @@ background-color: #dcdcdc; font-size: large; border-top: solid 1px black; + border-bottom-left-radius: 10px; + border-bottom-right-radius: 10px; } .btnCreerPlaylist { diff --git a/src/app/user/myPlaylists/playlist-list/playlist-list.component.ts b/src/app/user/myPlaylists/playlist-list/playlist-list.component.ts index ad82e78..191e2e1 100644 --- a/src/app/user/myPlaylists/playlist-list/playlist-list.component.ts +++ b/src/app/user/myPlaylists/playlist-list/playlist-list.component.ts @@ -4,7 +4,7 @@ import {PlaylistDB} from "../../../utils/interfaces/playlist"; import {MessageService} from "../../../utils/services/message/message.service"; import {MatDialog} from "@angular/material/dialog"; import {MatSnackBar} from "@angular/material/snack-bar"; -import {PopupCreatePlaylistComponent} from "../../utils/components/popup-create-playlist/popup-create-playlist.component"; +import {PopupCreatePlaylistComponent} from "../popup-create-playlist/popup-create-playlist.component"; import {FictitiousVideosService} from "../../../utils/services/fictitiousDatas/fictitiousVideos/fictitious-videos.service"; @@ -49,7 +49,7 @@ export class PlaylistListComponent implements OnInit onCreatePlaylist(): void { - const config = { width: '30%', data: this.tabPlaylist }; + const config = { data: this.tabPlaylist }; this.dialog .open(PopupCreatePlaylistComponent, config ) .afterClosed() @@ -57,7 +57,7 @@ export class PlaylistListComponent implements OnInit const config = { duration: 1000, panelClass: "custom-class" }; if((playlist === null) || (playlist === undefined)) { - this.snackBar.open("Opération annulée ❌", "", config); + this.snackBar.open("Opération annulée", "", config); } else { this.allPlaylists.push(playlist); diff --git a/src/app/user/utils/components/popup-create-playlist/popup-create-playlist.component.html b/src/app/user/myPlaylists/popup-create-playlist/popup-create-playlist.component.html similarity index 100% rename from src/app/user/utils/components/popup-create-playlist/popup-create-playlist.component.html rename to src/app/user/myPlaylists/popup-create-playlist/popup-create-playlist.component.html diff --git a/src/app/user/utils/components/popup-create-playlist/popup-create-playlist.component.scss b/src/app/user/myPlaylists/popup-create-playlist/popup-create-playlist.component.scss similarity index 100% rename from src/app/user/utils/components/popup-create-playlist/popup-create-playlist.component.scss rename to src/app/user/myPlaylists/popup-create-playlist/popup-create-playlist.component.scss diff --git a/src/app/user/utils/components/popup-create-playlist/popup-create-playlist.component.spec.ts b/src/app/user/myPlaylists/popup-create-playlist/popup-create-playlist.component.spec.ts similarity index 100% rename from src/app/user/utils/components/popup-create-playlist/popup-create-playlist.component.spec.ts rename to src/app/user/myPlaylists/popup-create-playlist/popup-create-playlist.component.spec.ts diff --git a/src/app/user/utils/components/popup-create-playlist/popup-create-playlist.component.ts b/src/app/user/myPlaylists/popup-create-playlist/popup-create-playlist.component.ts similarity index 94% rename from src/app/user/utils/components/popup-create-playlist/popup-create-playlist.component.ts rename to src/app/user/myPlaylists/popup-create-playlist/popup-create-playlist.component.ts index 8613b38..b9ecbbb 100644 --- a/src/app/user/utils/components/popup-create-playlist/popup-create-playlist.component.ts +++ b/src/app/user/myPlaylists/popup-create-playlist/popup-create-playlist.component.ts @@ -1,7 +1,7 @@ import {Component, Inject, OnInit} from '@angular/core'; import {MAT_DIALOG_DATA, MatDialogRef} from "@angular/material/dialog"; -import {MessageService} from "../../../../utils/services/message/message.service"; -import {PlaylistDB} from "../../../../utils/interfaces/playlist"; +import {MessageService} from "../../../utils/services/message/message.service"; +import {PlaylistDB} from "../../../utils/interfaces/playlist"; diff --git a/src/app/user/myPlaylists/video-list/video-list.component.scss b/src/app/user/myPlaylists/video-list/video-list.component.scss index 109aa1f..f38b820 100644 --- a/src/app/user/myPlaylists/video-list/video-list.component.scss +++ b/src/app/user/myPlaylists/video-list/video-list.component.scss @@ -5,6 +5,8 @@ margin: 1vh 0vh 3vh 0vh; padding: 0px; border: solid 2px black; + border-radius: 10px; + box-shadow: 10px 5px 5px black; } // TopBorder -------------------------------------------------------- @@ -15,6 +17,8 @@ text-align: left; padding: 5px 0px 5px 5px; border-bottom: solid 1px black; + border-top-left-radius: 10px; + border-top-right-radius: 10px; } .spanPlayListTitle { @@ -67,4 +71,6 @@ border-top: solid 1px black; border-bottom: solid 1px black; font-size: large; + border-bottom-left-radius: 10px; + border-bottom-right-radius: 10px; } diff --git a/src/app/user/search/page-search/page-search.component.html b/src/app/user/search/page-search/page-search.component.html index d61e844..c9154c2 100644 --- a/src/app/user/search/page-search/page-search.component.html +++ b/src/app/user/search/page-search/page-search.component.html @@ -10,34 +10,39 @@ - -
-
-
+ +
- -
-
-   - -
+ +
+
+ +
- - -
-
- -   - - image - -   - -
-
-
-
+ + +
+ + +   + + logo + +   + + + +   + + logo + +   + +
+
diff --git a/src/app/user/search/page-search/page-search.component.scss b/src/app/user/search/page-search/page-search.component.scss index dec9f62..f80fc45 100644 --- a/src/app/user/search/page-search/page-search.component.scss +++ b/src/app/user/search/page-search/page-search.component.scss @@ -17,13 +17,10 @@ //-------------------------------------------------------------------------------------------- .inputSearchBar { - width: 50%; + width: 40%; font-size: large; -} -.btnRechercher { - border: solid black 1px; + border-bottom: 10px; border-radius: 5px; - font-size: large; } //-------------------------------------------------------------------------------------------- @@ -70,3 +67,24 @@ -ms-transform: translateY(-50%); transform: translateY(-50%); } + + + +// ------------------------------------------------------------------------- + + +// aura +::ng-deep .mat-checkbox-ripple .mat-ripple-element { + background-color: grey !important; +} + +// contenu coche +::ng-deep .mat-checkbox-checked.mat-accent .mat-checkbox-background { + background-color: black !important; +} + +// indeterminate +::ng-deep .mat-checkbox .mat-checkbox-frame { + border: solid 1px black !important; + background-color: white !important; +} diff --git a/src/app/user/utils/services/addVideoToPlaylists/add-video-to-playlists.service.ts b/src/app/user/utils/services/addVideoToPlaylists/add-video-to-playlists.service.ts index fa45fb1..88aadaf 100644 --- a/src/app/user/utils/services/addVideoToPlaylists/add-video-to-playlists.service.ts +++ b/src/app/user/utils/services/addVideoToPlaylists/add-video-to-playlists.service.ts @@ -77,7 +77,7 @@ export class AddVideoToPlaylistsService case "annulation": case null: case undefined: - message = "Annulation de l'opération" ; + message = "Opération annulée" ; break; } const config = { duration: 1000, panelClass: "custom-class" }; diff --git a/src/app/user/utils/services/videoUrl/video-url.service.spec.ts b/src/app/user/utils/services/videoUrl/video-url.service.spec.ts deleted file mode 100644 index 7ded62b..0000000 --- a/src/app/user/utils/services/videoUrl/video-url.service.spec.ts +++ /dev/null @@ -1,16 +0,0 @@ -import { TestBed } from '@angular/core/testing'; - -import { VideoUrlService } from './video-url.service'; - -describe('VideoUrlService', () => { - let service: VideoUrlService; - - beforeEach(() => { - TestBed.configureTestingModule({}); - service = TestBed.inject(VideoUrlService); - }); - - it('should be created', () => { - expect(service).toBeTruthy(); - }); -}); diff --git a/src/app/user/utils/services/videoUrl/video-url.service.ts b/src/app/user/utils/services/videoUrl/video-url.service.ts deleted file mode 100644 index 4f7c2be..0000000 --- a/src/app/user/utils/services/videoUrl/video-url.service.ts +++ /dev/null @@ -1,56 +0,0 @@ -import { Injectable } from '@angular/core'; -import {DomSanitizer, SafeResourceUrl} from "@angular/platform-browser"; - -@Injectable({ - providedIn: 'root' -}) -export class VideoUrlService -{ - - constructor(private _sanitizer: DomSanitizer) { } - - - safeUrl(videoId: string, source: string): SafeResourceUrl - { - let videoUrl = "" ; - if(source === 'youtube') videoUrl = "https://www.youtube.com/embed/" + videoId; - else if(source === 'dailymotion') videoUrl = "https://www.dailymotion.com/embed/video/" + videoId; - return this._sanitizer.bypassSecurityTrustResourceUrl(videoUrl); - } - - /* - safeUrl(videoUrl: string): SafeResourceUrl - { - if(videoUrl.includes("youtu")) videoUrl = this.youtubeSafeUrl(videoUrl); - if(videoUrl.includes("dailymotion")) videoUrl = this.daylimotionSafeUrl(videoUrl); - return this._sanitizer.bypassSecurityTrustResourceUrl(videoUrl); - } - - - youtubeSafeUrl(videoUrl: string): string - { - if(videoUrl.includes("youtu.be")) - { - //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"); - const tab = videoUrl.split("youtube.com/watch?v="); - videoUrl = tab[0] + "youtube.com/embed/" + tab[1]; - } - return videoUrl; - } - - - daylimotionSafeUrl(videoUrl: string): string - { - //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/app/user/watching/page-watching-video/page-watching-video.component.html b/src/app/user/watching/page-watching-video/page-watching-video.component.html index 2135644..e2179d4 100644 --- a/src/app/user/watching/page-watching-video/page-watching-video.component.html +++ b/src/app/user/watching/page-watching-video/page-watching-video.component.html @@ -11,34 +11,39 @@ - -
-
-
+ +
- -
-
-   - -
+ +
+
+ +
- - -
-
- -   - - image - -   - -
-
-
-
+ + +
+ + +   + + logo + +   + + + +   + + logo + +   + +
+
@@ -147,7 +152,7 @@
-
diff --git a/src/app/user/watching/page-watching-video/page-watching-video.component.scss b/src/app/user/watching/page-watching-video/page-watching-video.component.scss index 823e9cb..52a8508 100644 --- a/src/app/user/watching/page-watching-video/page-watching-video.component.scss +++ b/src/app/user/watching/page-watching-video/page-watching-video.component.scss @@ -17,13 +17,10 @@ //-------------------------------------------------------------------------------------------- .inputSearchBar { - width: 50%; + width: 40%; font-size: large; -} -.btnRechercher { - border: solid black 1px; + border-bottom: 10px; border-radius: 5px; - font-size: large; } //-------------------------------------------------------------------------------------------- @@ -96,3 +93,23 @@ border-bottom: solid 1px black; font-size: large; } + + +// ------------------------------------------------------------------------- + + +// aura +::ng-deep .mat-checkbox-ripple .mat-ripple-element { + background-color: grey !important; +} + +// contenu coche +::ng-deep .mat-checkbox-checked.mat-accent .mat-checkbox-background { + background-color: black !important; +} + +// indeterminate +::ng-deep .mat-checkbox .mat-checkbox-frame { + border: solid 1px black !important; + background-color: white !important; +} diff --git a/src/app/user/watching/page-watching-video/page-watching-video.component.ts b/src/app/user/watching/page-watching-video/page-watching-video.component.ts index 7dd6b24..02ec8df 100644 --- a/src/app/user/watching/page-watching-video/page-watching-video.component.ts +++ b/src/app/user/watching/page-watching-video/page-watching-video.component.ts @@ -6,9 +6,9 @@ import {FictitiousVideosService} from "../../../utils/services/fictitiousDatas/f 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 {VideoUrlService} from "../../utils/services/videoUrl/video-url.service"; import {AddVideoToPlaylistsService} from "../../utils/services/addVideoToPlaylists/add-video-to-playlists.service"; import {PlaylistDB} from "../../../utils/interfaces/playlist"; +import {DomSanitizer, SafeResourceUrl} from "@angular/platform-browser"; @@ -47,7 +47,7 @@ export class PageWatchingVideoComponent implements OnInit public themeService: ThemeService, private activatedRoute: ActivatedRoute, private router: Router, - public videoUrlService: VideoUrlService, + private _sanitizer: DomSanitizer, private addVideoToPlaylistsService: AddVideoToPlaylistsService ) { } @@ -109,4 +109,12 @@ export class PageWatchingVideoComponent implements OnInit 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; + else if(source === 'dailymotion') videoUrl = "https://www.dailymotion.com/embed/video/" + videoId; + return this._sanitizer.bypassSecurityTrustResourceUrl(videoUrl); + } }