amelioration du style de la partie user
This commit is contained in:
MiharyR
parent
3dce1f6865
commit
7c24996e73
18 changed files with 137 additions and 148 deletions
|
|
@ -1,16 +0,0 @@
|
|||
<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>
|
||||
|
|
@ -1,25 +0,0 @@
|
|||
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();
|
||||
});
|
||||
});
|
||||
|
|
@ -1,95 +0,0 @@
|
|||
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";
|
||||
|
||||
|
||||
|
||||
@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: PlaylistDB = {
|
||||
_id: "",
|
||||
userId: "userId",
|
||||
name: this.name,
|
||||
videoIds: [],
|
||||
isActive: true,
|
||||
createdAt: new Date(),
|
||||
updatedAt: new Date(),
|
||||
};
|
||||
this.dialogRef.close(playlist);
|
||||
}
|
||||
|
||||
// --- VRAI CODE ---
|
||||
/*
|
||||
this.checkError();
|
||||
if(!this.hasError)
|
||||
{
|
||||
this.messageService
|
||||
.sendMessage("user/create/playlist", {title: this.data.title})
|
||||
.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);
|
||||
}
|
||||
|
||||
}
|
||||
|
|
@ -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" };
|
||||
|
|
|
|||
|
|
@ -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();
|
||||
});
|
||||
});
|
||||
|
|
@ -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);
|
||||
}
|
||||
*/
|
||||
|
||||
}
|
||||
Reference in a new issue