diff --git a/package.json b/package.json index dd9a09c..baf5802 100644 --- a/package.json +++ b/package.json @@ -14,8 +14,10 @@ "dependencies": { "@angular/animations": "^12.2.11", "@angular/cdk": "^12.2.11", + "@angular/cli": "~12.2.11", "@angular/common": "^12.2.11", "@angular/compiler": "^12.2.11", + "@angular/compiler-cli": "~12.2.11", "@angular/core": "^12.2.11", "@angular/forms": "^12.2.11", "@angular/material": "^12.2.11", @@ -24,28 +26,27 @@ "@angular/router": "^12.2.11", "@ng-bootstrap/ng-bootstrap": "^10.0.0", "angular-responsive-carousel": "^2.1.2", - "bootstrap": "^5.1.3", - "jquery": "^3.6.0", - "popper": "^1.0.1", - "rxjs": "~6.6.0", - "tslib": "^2.0.0", - "zone.js": "~0.11.3", - "@angular/cli": "~12.2.11", - "@angular/compiler-cli": "~12.2.11", - "typescript": "~4.3.5", "body-parser": "^1.19.0", + "bootstrap": "^5.1.3", + "chart.js": "^2.9.3", "cookie-parser": "^1.4.5", "cors": "^2.8.5", "dotenv": "^10.0.0", "express": "^4.17.1", + "jquery": "^3.6.0", "jsonwebtoken": "^8.5.1", - "mongoose": "^6.0.12" + "mongoose": "^6.0.12", + "ng2-charts": "^2.2.3", + "popper": "^1.0.1", + "rxjs": "~6.6.0", + "tslib": "^2.0.0", + "typescript": "~4.3.5", + "zone.js": "~0.11.3" }, "devDependencies": { + "@angular-devkit/build-angular": "~12.2.11", "@angular/cli": "~12.2.11", "@angular/compiler-cli": "~12.2.11", - "typescript": "~4.3.5", - "@angular-devkit/build-angular": "~12.2.11", "@angular/localize": "^12.2.11", "@types/jasmine": "~3.6.0", "@types/node": "^12.11.1", @@ -59,6 +60,7 @@ "karma-jasmine-html-reporter": "^1.5.0", "protractor": "~7.0.0", "ts-node": "~8.3.0", - "tslint": "~6.1.0" + "tslint": "~6.1.0", + "typescript": "~4.3.5" } } diff --git a/src/app/admin/adList/page-ad-list-admin/page-ad-list-admin.component.html b/src/app/admin/adList/page-ad-list-admin/page-ad-list-admin.component.html index 41e464d..d5d233a 100644 --- a/src/app/admin/adList/page-ad-list-admin/page-ad-list-admin.component.html +++ b/src/app/admin/adList/page-ad-list-admin/page-ad-list-admin.component.html @@ -21,7 +21,7 @@ - +
@@ -30,18 +30,18 @@ non visible
- +
- Tags - + Sujets + - {{formControlTags.value ? formControlTags.value[0] : ''}} - - (+{{formControlTags.value.length - 1}} {{formControlTags.value?.length === 2 ? 'autre' : 'autres'}}) + {{formControlInterests.value ? formControlInterests.value[0] : ''}} + + (+{{formControlInterests.value.length - 1}} {{formControlInterests.value?.length === 2 ? 'autre' : 'autres'}}) - {{topping}} + {{topping}}
diff --git a/src/app/admin/userList/popup-create-user/popup-create-user.component.ts b/src/app/admin/userList/popup-create-user/popup-create-user.component.ts index 1b88942..141fe53 100644 --- a/src/app/admin/userList/popup-create-user/popup-create-user.component.ts +++ b/src/app/admin/userList/popup-create-user/popup-create-user.component.ts @@ -38,6 +38,7 @@ export class PopupCreateUserComponent implements OnInit dateOfBirth: null, gender: "man", interests: [], + company: "", isActive: false, isAccepted: false, createdAt: new Date(), @@ -65,19 +66,15 @@ export class PopupCreateUserComponent implements OnInit checkField(): void { if(this.user.login.length === 0) { - this.errorMessage = "Veuillez remplir le champ 'login'."; + this.errorMessage = "Veuillez remplir le champ 'pseudo'."; this.hasError = true; } else if(this.user.email.length === 0) { this.errorMessage = "Veuillez remplir le champ 'email'."; this.hasError = true; } - if((this.user.role.name === 'user') && ((this.user.dateOfBirth === undefined) || (this.user.dateOfBirth === null))) { - this.errorMessage = "Veuillez remplir le champ 'date de naissance'."; - this.hasError = true; - } else if(!this.isValidEmail(this.user.email)) { - this.errorMessage = "Email invalide"; + this.errorMessage = "Email invalide."; this.hasError = true; } else if(this.password.length === 0) { @@ -88,6 +85,14 @@ export class PopupCreateUserComponent implements OnInit this.errorMessage = "Le mot de passe est différent de sa confirmation."; this.hasError = true; } + else if((this.user.role.name === 'user') && ((this.user.dateOfBirth === undefined) || (this.user.dateOfBirth === null))) { + this.errorMessage = "Veuillez remplir le champ 'date de naissance'."; + this.hasError = true; + } + else if((this.user.role.name === 'advertiser') && (this.user.company.length === 0)) { + this.errorMessage = "Veuillez remplir le champ 'entreprise'."; + this.hasError = true; + } else { this.errorMessage = "" ; this.hasError = false; diff --git a/src/app/admin/userList/popup-visualize-user/popup-visualize-user.component.html b/src/app/admin/userList/popup-visualize-user/popup-visualize-user.component.html index 89124e7..3e0bf70 100644 --- a/src/app/admin/userList/popup-visualize-user/popup-visualize-user.component.html +++ b/src/app/admin/userList/popup-visualize-user/popup-visualize-user.component.html @@ -62,7 +62,7 @@
Rôle:
Utilisateur - Annonceur + Annonceur Admin
diff --git a/src/app/admin/navbar-admin/navbar-admin.component.html b/src/app/admin/utils/navbar-admin/navbar-admin.component.html similarity index 60% rename from src/app/admin/navbar-admin/navbar-admin.component.html rename to src/app/admin/utils/navbar-admin/navbar-admin.component.html index 563792a..90f0cbc 100644 --- a/src/app/admin/navbar-admin/navbar-admin.component.html +++ b/src/app/admin/utils/navbar-admin/navbar-admin.component.html @@ -6,24 +6,29 @@ - + + + + + + + + +
+ Période de création:   + + Date de début + + +   -   + + Date de fin + + +
+ + + + + + + +
+ +
+ -
- - -
- + + + + + + + @@ -30,13 +117,13 @@ - - - + + + @@ -58,19 +145,10 @@ - + - - - - - - @@ -82,10 +160,7 @@ insert_photo - + + + + + + + + +
+ +
- + +
+ diff --git a/src/app/advertiser/adList/popup-add-or-update-ad/popup-add-or-update-ad.component.scss b/src/app/advertiser/adList/popup-add-or-update-ad/popup-add-or-update-ad.component.scss index 7fb592c..b299124 100644 --- a/src/app/advertiser/adList/popup-add-or-update-ad/popup-add-or-update-ad.component.scss +++ b/src/app/advertiser/adList/popup-add-or-update-ad/popup-add-or-update-ad.component.scss @@ -8,7 +8,10 @@ h1 { text-align: center; font-size: large; - padding-bottom: 10px; +} + +.col-6, .col-8 { + border-left: solid 1px #a4a4a4; } diff --git a/src/app/advertiser/adList/popup-add-or-update-ad/popup-add-or-update-ad.component.ts b/src/app/advertiser/adList/popup-add-or-update-ad/popup-add-or-update-ad.component.ts index a4af930..b8e97fa 100644 --- a/src/app/advertiser/adList/popup-add-or-update-ad/popup-add-or-update-ad.component.ts +++ b/src/app/advertiser/adList/popup-add-or-update-ad/popup-add-or-update-ad.component.ts @@ -9,11 +9,11 @@ const ADVERT_VIDE: Advert = { _id: "", userId: "", title: "", - advertiser: "", + url: "", images: [], - tags: [], + interests: [], comment: "", - views: 0, + views: [], isVisible: true, isActive: true, createdAt: new Date(), @@ -47,15 +47,15 @@ export class PopupAddOrUpdateAdComponent implements OnInit if(this.data.action === "add") { this.advert = Object.assign({}, ADVERT_VIDE); - this.advert.tags = []; - this.urlBackend = "advertiser/add/ad" ; + this.advert.interests = []; + this.urlBackend = "url/add/ad" ; this.title = "Ajouter annonce" ; } else { this.advert = Object.assign({}, this.data.advert); - this.advert.tags = this.data.advert.tags.slice(); - this.urlBackend = "advertiser/update/ad" ; + this.advert.interests = this.data.advert.interests.slice(); + this.urlBackend = "url/update/ad" ; this.title = "Modifier annonce" ; } } @@ -86,32 +86,15 @@ export class PopupAddOrUpdateAdComponent implements OnInit onEventInputTags(myTags: string[]): void { - this.advert.tags = myTags; + this.advert.interests = myTags; } - // Lorsque l'annonceur selectionne des fichiers - onSelectFile(event) + onRemoveImgAlreadyPresent(image) { - const nbFileSelected = event.target.files.length ; - for(let i=0 ; i file); - this.tabSelectedFile.splice(index, 1); + const index = this.advert.images.indexOf(image); + console.log("idx: " + index); + this.advert.images.slice(index, 1); } } diff --git a/src/app/advertiser/adList/popup-delete-ad-advertiser/popup-delete-ad-advertiser.component.ts b/src/app/advertiser/adList/popup-delete-ad-advertiser/popup-delete-ad-advertiser.component.ts index 48a45e1..e36d92b 100644 --- a/src/app/advertiser/adList/popup-delete-ad-advertiser/popup-delete-ad-advertiser.component.ts +++ b/src/app/advertiser/adList/popup-delete-ad-advertiser/popup-delete-ad-advertiser.component.ts @@ -34,7 +34,7 @@ export class PopupDeleteAdAdvertiserComponent implements OnInit // --- VRAI CODE --- /* this.messageService - .sendMessage("advertiser/delete/ad", {"advert": this.advert}) + .sendMessage("url/delete/ad", {"advert": this.advert}) .subscribe( retour => { if(retour.status === "error") { diff --git a/src/app/advertiser/adList/popup-visualize-ad-advertiser/popup-visualize-ad-advertiser.component.html b/src/app/advertiser/adList/popup-visualize-ad-advertiser/popup-visualize-ad-advertiser.component.html index 4263967..0efdb23 100644 --- a/src/app/advertiser/adList/popup-visualize-ad-advertiser/popup-visualize-ad-advertiser.component.html +++ b/src/app/advertiser/adList/popup-visualize-ad-advertiser/popup-visualize-ad-advertiser.component.html @@ -19,7 +19,7 @@
Tags:
-
• {{tag}}
+
• {{tag}}
diff --git a/src/app/advertiser/myProfil/page-profil-advertiser/page-profil-advertiser.component.html b/src/app/advertiser/myProfil/page-profil-advertiser/page-profil-advertiser.component.html index 5900345..9af3317 100644 --- a/src/app/advertiser/myProfil/page-profil-advertiser/page-profil-advertiser.component.html +++ b/src/app/advertiser/myProfil/page-profil-advertiser/page-profil-advertiser.component.html @@ -13,9 +13,15 @@ onerror="this.onerror=null; this.src='assets/profil.png'"> + +
+
Entreprise:
+
{{advertiser.company}}
+
+
-
Login:
+
Pseudo:
{{advertiser.login}}
diff --git a/src/app/advertiser/myProfil/popup-update-advertiser/popup-update-advertiser.component.html b/src/app/advertiser/myProfil/popup-update-advertiser/popup-update-advertiser.component.html index bbbcd85..4951e5c 100644 --- a/src/app/advertiser/myProfil/popup-update-advertiser/popup-update-advertiser.component.html +++ b/src/app/advertiser/myProfil/popup-update-advertiser/popup-update-advertiser.component.html @@ -10,6 +10,12 @@

+ + + Entreprise + +
+ Pseudo diff --git a/src/app/advertiser/myProfil/popup-update-advertiser/popup-update-advertiser.component.ts b/src/app/advertiser/myProfil/popup-update-advertiser/popup-update-advertiser.component.ts index 76e5e05..23827fe 100644 --- a/src/app/advertiser/myProfil/popup-update-advertiser/popup-update-advertiser.component.ts +++ b/src/app/advertiser/myProfil/popup-update-advertiser/popup-update-advertiser.component.ts @@ -39,6 +39,7 @@ export class PopupUpdateAdvertiserComponent implements OnInit dateOfBirth: advertiser0.dateOfBirth, gender: advertiser0.gender, interests: [], + company: advertiser0.company, isActive: advertiser0.isActive, isAccepted: advertiser0.isAccepted, createdAt: advertiser0.createdAt, @@ -67,7 +68,7 @@ export class PopupUpdateAdvertiserComponent implements OnInit checkField() { if(this.advertiserCopy.login.length === 0) { - this.errorMessage = "Veuillez remplir le champ 'login'" ; + this.errorMessage = "Veuillez remplir le champ 'pseudo'" ; this.hasError = true; } else if(this.advertiserCopy.email.length === 0) { diff --git a/src/app/advertiser/navbar-advertiser/navbar-advertiser.component.html b/src/app/advertiser/navbar-advertiser/navbar-advertiser.component.html deleted file mode 100644 index 8c6d946..0000000 --- a/src/app/advertiser/navbar-advertiser/navbar-advertiser.component.html +++ /dev/null @@ -1,32 +0,0 @@ - diff --git a/src/app/advertiser/pages-popularity/pages-popularity.component.html b/src/app/advertiser/pages-popularity/pages-popularity.component.html new file mode 100644 index 0000000..1f59267 --- /dev/null +++ b/src/app/advertiser/pages-popularity/pages-popularity.component.html @@ -0,0 +1,91 @@ +
+
+ + + + + + + + +
+ +
Filtre
+ +
+ +
+ +

+ +
+ +
+ +
+ + + + +
+ + +
+ + +
+
+ + + + + + + + + début + + +   -   + + + + fin + + +   -   + + + + pas d'affichage + + +   -   + + + + unité du pas d'affichage + + jour + semaine + mois + + + + + + + + {{coupleNameViews.name}}, + + + {{coupleNameViews.name}} + + + diff --git a/src/app/advertiser/pages-popularity/pages-popularity.component.scss b/src/app/advertiser/pages-popularity/pages-popularity.component.scss new file mode 100644 index 0000000..6030311 --- /dev/null +++ b/src/app/advertiser/pages-popularity/pages-popularity.component.scss @@ -0,0 +1,47 @@ +.myContainer { + font-size: small; + max-width: 100vw; + height: 100vh; + overflow-x: hidden; + overflow-y: scroll; +} + +input { + font-size: small; + width: 140px; +} + +.filtersContainer { + background-color: white; + width: 60%; + margin: 50px 50px 50px 50px; + padding: 20px 20px 20px 20px; +} + +.chartContainer { + background-color: white; + border: solid 1px black; + padding: 10px 10px 10px 10px; + margin: 50px 50px 50px 50px; +} + + +// --------------------------------------------- +// periode + +.periode { + padding: 10px 10px 0px 10px; +} + +.periode .titleContainer { + text-align: right; + border-right: solid 1px #dcdcdc; + font-weight: bold; +} + + +// ------------------------------------------------------------------------- + +::ng-deep .mat-pseudo-checkbox-checked { + background-color: black !important; +} diff --git a/src/app/advertiser/pages-popularity/pages-popularity.component.spec.ts b/src/app/advertiser/pages-popularity/pages-popularity.component.spec.ts new file mode 100644 index 0000000..f9ff236 --- /dev/null +++ b/src/app/advertiser/pages-popularity/pages-popularity.component.spec.ts @@ -0,0 +1,25 @@ +import { ComponentFixture, TestBed } from '@angular/core/testing'; + +import { PagesPopularityComponent } from './pages-popularity.component'; + +describe('SubjectsPopularityComponent', () => { + let component: PagesPopularityComponent; + let fixture: ComponentFixture; + + beforeEach(async () => { + await TestBed.configureTestingModule({ + declarations: [ PagesPopularityComponent ] + }) + .compileComponents(); + }); + + beforeEach(() => { + fixture = TestBed.createComponent(PagesPopularityComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/src/app/advertiser/pages-popularity/pages-popularity.component.ts b/src/app/advertiser/pages-popularity/pages-popularity.component.ts new file mode 100644 index 0000000..76d82fd --- /dev/null +++ b/src/app/advertiser/pages-popularity/pages-popularity.component.ts @@ -0,0 +1,234 @@ +import { Component, OnInit } from '@angular/core'; +import {FormControl} from "@angular/forms"; +import {ChartDataSets} from "chart.js"; +import {Label} from "ng2-charts"; +import { Router} from "@angular/router"; +import {FictitiousAdvertsService} from "../../utils/services/fictitiousDatas/fictitiousAdverts/fictitious-adverts.service"; +import {FictitiousVideosService} from "../../utils/services/fictitiousDatas/fictitiousVideos/fictitious-videos.service"; +import {ThemeService} from "../../utils/services/theme/theme.service"; + + + +interface CoupleNameViews { + name: string, + views: Date[], +} + + + +@Component({ + selector: 'app-subjects-popularity', + templateUrl: './pages-popularity.component.html', + styleUrls: ['./pages-popularity.component.scss'] +}) +export class PagesPopularityComponent implements OnInit +{ + formControl: FormControl; + allCoupleNameViews: CoupleNameViews[] = []; + + startDate: Date = null; + endDate: Date = null; + step: number = 1; + stepUnity: string = "jour" ; + + oneDay: number = 24*60*60*1000; + oneWeek: number = 7*24*60*60*1000; + + lineChartData: ChartDataSets[] = []; + lineChartLabels: Label[] = []; + chartOptions: any = { + responsive: true, + scales: { + yAxes: [{ display: true, scaleLabel: { display: true, labelString: "vues" } }], + xAxes: [{ scaleLabel: { display: true, labelString: "temps" } }], + } + }; + + + constructor( private router: Router, + public themeService: ThemeService, + private fictitiousAdvertsService: FictitiousAdvertsService, + private fictitiousVideosService: FictitiousVideosService ) {} + + + ngOnInit(): void + { + if(this.router.url.includes("ads")) this.ngOnInitAds(); + else if(this.router.url.includes("subjects")) this.ngOnInitSubjects(); + this.formControl = new FormControl(this.allCoupleNameViews); + this.onApplyFilter(); + } + + + // Sera excuté si on est sur la page 'adsPopularity' + // Remplie l'attribut 'allCoupleNameViews' + ngOnInitAds(): void + { + const allAdverts = this.fictitiousAdvertsService.get_TAB_ADVERT(); + for(let advert of allAdverts) + { + let couple = {name: advert.title, views: advert.views } + this.allCoupleNameViews.push(couple); + } + } + + + // Sera excuté si on est sur la page 'subjectsPopularity' + // Remplie l'attribut 'allCoupleNameViews' + ngOnInitSubjects(): void + { + const allVideos = this.fictitiousVideosService.get_TAB_VIDEO(); + let myMap: Map = new Map(); + + for(let video of allVideos) + { + const key = video.interest; + if(!myMap.has(key)) myMap.set(key, video.watchedDates); + else { + let tabDate = myMap.get(key); + for(let date0 of video.watchedDates) tabDate = this.insertInOrder(tabDate, date0); + myMap.set(key, tabDate); + } + } + + for(const [key, value] of myMap.entries()) + { + let couple = {name: key, views: value } + this.allCoupleNameViews.push(couple); + } + } + + + // Applique le filtre + onApplyFilter(): void + { + // --- initialisation --- + this.lineChartData = []; + this.lineChartLabels = []; + + if(this.step <= 0) this.step = 0; + if(this.endDate === null) this.endDate = new Date(); + if(this.startDate === null) this.startDate = new Date(this.endDate.getTime() - this.oneWeek); // date d'il y a une semaine + + const startTime = this.startDate.getTime(); + const endTime = this.endDate.getTime(); + + + // --- remplissage de 'lineChartLabels' --- + let dataWithZeros = []; + let time = startTime; + const intervals = []; + while(time <= endTime) + { + dataWithZeros.push(0); + this.lineChartLabels.push(this.getLabel(new Date(time))); + intervals.push(time); + time = this.addStep(time); + } + intervals.push(time); + + + // --- remplissage de 'lineChartLabels' --- + for(let coupleNameViews of this.formControl.value) + { + let data = dataWithZeros.slice(); + let label = coupleNameViews.name; + let index = 0; + + for(let date0 of coupleNameViews.views) + { + const time0 = date0.getTime(); + + if(time0 > endTime) break; + + if((startTime <= time0) && (time0 <= endTime)) + { + while((index < intervals.length) && (time0 >= intervals[index])) index += 1; + index = index - 1; + data[index] += 1; + } + } + + this.lineChartData.push({"data": data.slice(), "label": label}); + } + } + + + onNewStartDate(event): void { + this.startDate = new Date(event); + } + + + onNewEndDate(event): void { + this.endDate = new Date(event); + } + + + // Renvoie le bon label pour le graph + getLabel(date0: Date): string + { + if((this.stepUnity === 'jour') && (this.step === 1)) + { + return date0.toLocaleDateString(); + } + else { + const time2 = this.addStep(date0.getTime()) - this.oneDay; + let date2 = new Date(time2); + return date0.toLocaleDateString() + " à " + date2.toLocaleDateString(); + } + } + + + // Ajoute le bon pas à la date 'new Date(time)' + addStep(time: number): number + { + let newDate; + + if(this.stepUnity === 'jour') { + newDate = new Date(time + this.step*this.oneDay); + } + else if(this.stepUnity === 'semaine') { + newDate = new Date(time + this.step*this.oneWeek); + } + else + { + const oldDate = new Date(time); + + let newMonth = oldDate.getMonth() + this.step; + const newYear = oldDate.getFullYear() + (newMonth / 12); + newMonth = newMonth % 12; + const day = this.startDate.getDate(); + + if((newMonth === 1) && ([29, 30, 31].includes(day))) { // si fevrier et si jour n'existe pas + newDate = new Date(newYear, newMonth, 28); + } + else if((day === 31) && ([3, 5, 9, 10].includes(newMonth))) { // si 31 et mois à 30 jours + newDate = new Date(newYear, newMonth, 30); + } + else { + newDate = new Date(newYear, newMonth, day); + } + } + + const _1h = 60*60*1000; + if(newDate.getHours() === 23) return newDate.getTime() + _1h; + else if(newDate.getHours() === 1) return newDate.getTime() - _1h; + else return newDate.getTime(); + } + + + // Insere la date0 dans le tableau tabDate par ordre croissant + insertInOrder(tabDate: Date[], date0: Date): Date[] + { + let i = 0; + let n = tabDate.length; + let time0 = date0.getTime(); + + while((i tabDate[i].getTime())) i++; + if(i === n) tabDate.push(date0); + else tabDate.splice(i, 0, date0); + + return tabDate; + } + +} diff --git a/src/app/utils/directives/dragAndDrop/drag-and-drop.directive.spec.ts b/src/app/advertiser/utils/dragAndDrop/drag-and-drop.directive.spec.ts similarity index 100% rename from src/app/utils/directives/dragAndDrop/drag-and-drop.directive.spec.ts rename to src/app/advertiser/utils/dragAndDrop/drag-and-drop.directive.spec.ts diff --git a/src/app/utils/directives/dragAndDrop/drag-and-drop.directive.ts b/src/app/advertiser/utils/dragAndDrop/drag-and-drop.directive.ts similarity index 100% rename from src/app/utils/directives/dragAndDrop/drag-and-drop.directive.ts rename to src/app/advertiser/utils/dragAndDrop/drag-and-drop.directive.ts diff --git a/src/app/advertiser/utils/navbar-advertiser/navbar-advertiser.component.html b/src/app/advertiser/utils/navbar-advertiser/navbar-advertiser.component.html new file mode 100644 index 0000000..1b16354 --- /dev/null +++ b/src/app/advertiser/utils/navbar-advertiser/navbar-advertiser.component.html @@ -0,0 +1,41 @@ + diff --git a/src/app/advertiser/navbar-advertiser/navbar-advertiser.component.scss b/src/app/advertiser/utils/navbar-advertiser/navbar-advertiser.component.scss similarity index 93% rename from src/app/advertiser/navbar-advertiser/navbar-advertiser.component.scss rename to src/app/advertiser/utils/navbar-advertiser/navbar-advertiser.component.scss index a78eea8..285d629 100644 --- a/src/app/advertiser/navbar-advertiser/navbar-advertiser.component.scss +++ b/src/app/advertiser/utils/navbar-advertiser/navbar-advertiser.component.scss @@ -1,6 +1,6 @@ .navbar { background-color: black; - height: 50px; + height: 60px; font-size: medium; color: white; } @@ -23,16 +23,22 @@ } -// Recherche, Mes Playlists, Historique +.monLi { + margin: 0px 10px 0px 10px; +} + + .nav-link { color: white; } .nav-link:hover { color: grey; } +.myActiveLink { + text-decoration: underline; +} -// Bonton deconnexion .btnDeconnexion { font-size: medium; margin: 0px 10px 0px 10px @@ -42,11 +48,6 @@ } -.monLi { - margin: 0px 10px 0px 10px; -} - - img { border: solid 2px white; border-radius: 50px; diff --git a/src/app/advertiser/navbar-advertiser/navbar-advertiser.component.spec.ts b/src/app/advertiser/utils/navbar-advertiser/navbar-advertiser.component.spec.ts similarity index 100% rename from src/app/advertiser/navbar-advertiser/navbar-advertiser.component.spec.ts rename to src/app/advertiser/utils/navbar-advertiser/navbar-advertiser.component.spec.ts diff --git a/src/app/advertiser/navbar-advertiser/navbar-advertiser.component.ts b/src/app/advertiser/utils/navbar-advertiser/navbar-advertiser.component.ts similarity index 50% rename from src/app/advertiser/navbar-advertiser/navbar-advertiser.component.ts rename to src/app/advertiser/utils/navbar-advertiser/navbar-advertiser.component.ts index d28eab6..0b9440d 100644 --- a/src/app/advertiser/navbar-advertiser/navbar-advertiser.component.ts +++ b/src/app/advertiser/utils/navbar-advertiser/navbar-advertiser.component.ts @@ -1,4 +1,5 @@ import { Component } from '@angular/core'; +import {Router} from "@angular/router"; @@ -9,9 +10,19 @@ import { Component } from '@angular/core'; }) export class NavbarAdvertiserComponent { + routes: string[] = [ + "/advertiser", // 0 + "/advertiser/adList", // 1 + "/advertiser/adsPopularity", // 2 + "/advertiser/subjectsPopularity", // 3 + "/advertiser/myProfil" // 4 + ]; + + url = this.router.url; + urlImage: string = "https://www.figurines-goodies.com/1188-large_default/dewey-duck-tales-disney-funko-pop.jpg" ; - constructor() { } + constructor(private router: Router) { } onDeconnexion(): void {} } diff --git a/src/app/app-routing.module.ts b/src/app/app-routing.module.ts index db7db74..470c44c 100644 --- a/src/app/app-routing.module.ts +++ b/src/app/app-routing.module.ts @@ -12,6 +12,7 @@ import {PageProfilAdminComponent} from "./admin/myProfil/page-profil-admin/page- import {PageAdListAdminComponent} from "./admin/adList/page-ad-list-admin/page-ad-list-admin.component"; import {PageUserListComponent} from "./admin/userList/page-user-list/page-user-list.component"; import {PageWatchingVideoComponent} from "./user/watching/page-watching-video/page-watching-video.component"; +import {PagesPopularityComponent} from "./advertiser/pages-popularity/pages-popularity.component"; const routes: Routes = [ @@ -27,7 +28,6 @@ const routes: Routes = [ { path: 'user/myPlaylists', component: PageMyPlaylistsComponent }, { path: 'user/history', component: PageHistoryUserComponent }, { path: 'user/myProfil', component: PageProfilUserComponent }, - { path: 'user/watching/fromSearch/:videoId/:source/:search', component: PageWatchingVideoComponent }, { path: 'user/watching/fromMyPlaylists/:videoId/:_idPlaylist', component: PageWatchingVideoComponent }, { path: 'user/watching/fromHistory/:videoId/:source', component: PageWatchingVideoComponent }, @@ -36,6 +36,8 @@ const routes: Routes = [ { path: 'advertiser', component: PageAdListAdvertiserComponent }, { path: 'advertiser/adList', component: PageAdListAdvertiserComponent }, { path: 'advertiser/myProfil', component: PageProfilAdvertiserComponent }, + { path: 'advertiser/adsPopularity', component: PagesPopularityComponent }, + { path: 'advertiser/subjectsPopularity', component: PagesPopularityComponent }, // Admin { path: 'admin', component: PageUserListComponent }, diff --git a/src/app/app.component.scss b/src/app/app.component.scss index 14a2c1c..22a5665 100644 --- a/src/app/app.component.scss +++ b/src/app/app.component.scss @@ -5,3 +5,20 @@ //color: green; justify-content: center; } + + +// 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/app.module.ts b/src/app/app.module.ts index 1a5fb3f..28aa609 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -22,7 +22,6 @@ 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"; -import { IframeTrackerDirective } from './utils/directives/iframe-tracker/iframe-tracker.directive'; 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'; @@ -36,22 +35,22 @@ import { PageAdListAdvertiserComponent } from './advertiser/adList/page-ad-list- import { PopupDeleteAdAdvertiserComponent } from './advertiser/adList/popup-delete-ad-advertiser/popup-delete-ad-advertiser.component'; import { PopupAddOrUpdateAdComponent } from './advertiser/adList/popup-add-or-update-ad/popup-add-or-update-ad.component'; import { PopupVisualizeAdAdvertiserComponent } from './advertiser/adList/popup-visualize-ad-advertiser/popup-visualize-ad-advertiser.component'; -import { InputTagsComponent } from './advertiser/adList/input-tags/input-tags.component'; +import { InputInterestsAdComponent } from './advertiser/adList/input-interests-ad/input-interests-ad.component'; import {MatChipsModule} from "@angular/material/chips"; import {MatAutocompleteModule} from "@angular/material/autocomplete"; import {MatSelectModule} from "@angular/material/select"; import { PopupVisualizeImagesAdvertiserComponent } from './advertiser/adList/popup-visualize-images-advertiser/popup-visualize-images-advertiser.component'; import {IvyCarouselModule} from "angular-responsive-carousel"; import { DragAndDropComponent } from './advertiser/adList/drag-and-drop/drag-and-drop.component'; -import { DragAndDropDirective } from './utils/directives/dragAndDrop/drag-and-drop.directive'; +import { DragAndDropDirective } from './advertiser/utils/dragAndDrop/drag-and-drop.directive'; import { PageProfilUserComponent } from './user/myProfil/page-profil-user/page-profil-user.component'; import { NavbarUserComponent } from './user/utils/components/navbar-user/navbar-user.component'; -import { NavbarAdvertiserComponent } from './advertiser/navbar-advertiser/navbar-advertiser.component'; -import { NavbarAdminComponent } from './admin/navbar-admin/navbar-admin.component'; +import { NavbarAdvertiserComponent } from './advertiser/utils/navbar-advertiser/navbar-advertiser.component'; +import { NavbarAdminComponent } from './admin/utils/navbar-admin/navbar-admin.component'; import { PageProfilAdvertiserComponent } from './advertiser/myProfil/page-profil-advertiser/page-profil-advertiser.component'; import { PopupUpdateAdvertiserComponent } from './advertiser/myProfil/popup-update-advertiser/popup-update-advertiser.component'; import { PopupUpdateUserComponent } from './user/myProfil/popup-update-user/popup-update-user.component'; -import { NavbarBeforeConnexionComponent } from './beforeConnexion/navbar-before-connexion/navbar-before-connexion.component'; +import { NavbarBeforeConnexionComponent } from './beforeConnexion/utils/navbar-before-connexion/navbar-before-connexion.component'; import {MatRadioModule} from "@angular/material/radio"; import { InputInterestsProfilComponent } from './user/myProfil/input-interests-profil/input-interests-profil.component'; import { PageProfilAdminComponent } from './admin/myProfil/page-profil-admin/page-profil-admin.component'; @@ -70,6 +69,9 @@ import { PopupCreateUserComponent } from './admin/userList/popup-create-user/pop import { InputInterestsAdminComponent } from './admin/userList/input-interests-admin/input-interests-admin.component'; import { PageWatchingVideoComponent } from './user/watching/page-watching-video/page-watching-video.component'; import {MatDatepickerModule} from "@angular/material/datepicker"; +import { PagesPopularityComponent } from './advertiser/pages-popularity/pages-popularity.component'; +import { ChartsModule } from 'ng2-charts'; +import { PopupDeletePlaylistComponent } from './user/myPlaylists/popup-delete-playlist/popup-delete-playlist.component'; @NgModule({ @@ -82,7 +84,6 @@ import {MatDatepickerModule} from "@angular/material/datepicker"; AdvertComponent, VideoGridComponent, PopupAddVideoToPlaylistsComponent, - IframeTrackerDirective, PageMyPlaylistsComponent, VideoListComponent, PlaylistListComponent, @@ -93,7 +94,7 @@ import {MatDatepickerModule} from "@angular/material/datepicker"; PopupDeleteAdAdvertiserComponent, PopupAddOrUpdateAdComponent, PopupVisualizeAdAdvertiserComponent, - InputTagsComponent, + InputInterestsAdComponent, PopupVisualizeImagesAdvertiserComponent, DragAndDropComponent, DragAndDropDirective, @@ -119,6 +120,8 @@ import {MatDatepickerModule} from "@angular/material/datepicker"; PopupCreateUserComponent, InputInterestsAdminComponent, PageWatchingVideoComponent, + PagesPopularityComponent, + PopupDeletePlaylistComponent, ], imports: [ BrowserModule, @@ -148,6 +151,7 @@ import {MatDatepickerModule} from "@angular/material/datepicker"; MatStepperModule, MatPaginatorModule, MatDatepickerModule, + ChartsModule ], providers: [], bootstrap: [AppComponent] diff --git a/src/app/beforeConnexion/login/page-login/page-login.component.html b/src/app/beforeConnexion/login/page-login/page-login.component.html index 6213943..48258aa 100644 --- a/src/app/beforeConnexion/login/page-login/page-login.component.html +++ b/src/app/beforeConnexion/login/page-login/page-login.component.html @@ -1,38 +1,36 @@
-
-
+
- + -
-
- - -
-

StreamNotFound

- User Icon -
- - -
- - - -
- {{errorMessage}} -
- - - - - +
+
+ +
+

StreamNotFound

+ User Icon
+ + +
+ + + +
+ {{errorMessage}} +
+ + + + + +
- -
+ +
diff --git a/src/app/beforeConnexion/login/page-login/page-login.component.scss b/src/app/beforeConnexion/login/page-login/page-login.component.scss index d56bb24..8924202 100644 --- a/src/app/beforeConnexion/login/page-login/page-login.component.scss +++ b/src/app/beforeConnexion/login/page-login/page-login.component.scss @@ -144,15 +144,10 @@ input[type=text]::placeholder, input[type=password]::placeholder { color: #cccccc; } -.myContainer { - height: 100vh; - width: 100vw; -} - .bg{ margin: 0; padding: 0; - height: 80vh; + height: 100vh; width: 100vw; overflow-y: hidden; overflow-x: hidden; diff --git a/src/app/beforeConnexion/login/page-login/page-login.component.ts b/src/app/beforeConnexion/login/page-login/page-login.component.ts index 68130da..008a81f 100644 --- a/src/app/beforeConnexion/login/page-login/page-login.component.ts +++ b/src/app/beforeConnexion/login/page-login/page-login.component.ts @@ -12,7 +12,7 @@ import {ThemeService} from "../../../utils/services/theme/theme.service"; }) export class PageLoginComponent implements OnInit { - pseudo: string = "" ; + email: string = "" ; password: string = "" ; hasError: boolean = false; errorMessage: string = ""; @@ -33,8 +33,8 @@ export class PageLoginComponent implements OnInit if(!this.hasError) { let data = { - login: this.pseudo, - hashPass: this.password + email: this.email, + hashPass: this.hashage(this.password) }; this.messageService .sendMessage('user/auth', data) @@ -58,8 +58,8 @@ export class PageLoginComponent implements OnInit checkError(): void { - if(this.pseudo === "") { - this.errorMessage = "Veuillez remplir le champ login" ; + if(this.email === "") { + this.errorMessage = "Veuillez remplir le champ email" ; this.hasError = true; } else if(this.password === "") { @@ -72,4 +72,16 @@ export class PageLoginComponent implements OnInit } } + // Fonction de hashage (faible) + hashage(input: string): string + { + let hash = 0; + for (let i = 0; i < input.length; i++) { + let ch = input.charCodeAt(i); + hash = ((hash << 5) - hash) + ch; + hash = hash & hash; + } + return hash.toString(); + } + } diff --git a/src/app/beforeConnexion/register/page-register/page-register.component.html b/src/app/beforeConnexion/register/page-register/page-register.component.html index 98a606a..42ad1a5 100644 --- a/src/app/beforeConnexion/register/page-register/page-register.component.html +++ b/src/app/beforeConnexion/register/page-register/page-register.component.html @@ -63,7 +63,7 @@ - Login + Pseudo
@@ -124,9 +124,16 @@ + + + Entreprise + + +
+ - Login + Pseudo
diff --git a/src/app/beforeConnexion/register/page-register/page-register.component.ts b/src/app/beforeConnexion/register/page-register/page-register.component.ts index 0ad0be0..c109478 100644 --- a/src/app/beforeConnexion/register/page-register/page-register.component.ts +++ b/src/app/beforeConnexion/register/page-register/page-register.component.ts @@ -32,6 +32,7 @@ export class PageRegisterComponent dateOfBirth: null, gender: "man", interests: [], + company: "", isActive: false, isAccepted: false, createdAt: new Date(), @@ -94,8 +95,12 @@ export class PageRegisterComponent // Check les champs saisies par l'utilisateur checkField(): void { - if(this.user.login.length === 0) { - this.errorMessage = "Veuillez remplir le champ 'login'."; + if((this.user.role.name === 'advertiser') && (this.user.company.length === 0)) { + this.errorMessage = "Veuillez remplir le champ 'entreprise'."; + this.hasError = true; + } + else if(this.user.login.length === 0) { + this.errorMessage = "Veuillez remplir le champ 'pseudo'."; this.hasError = true; } else if(this.user.email.length === 0) { diff --git a/src/app/beforeConnexion/navbar-before-connexion/navbar-before-connexion.component.html b/src/app/beforeConnexion/utils/navbar-before-connexion/navbar-before-connexion.component.html similarity index 100% rename from src/app/beforeConnexion/navbar-before-connexion/navbar-before-connexion.component.html rename to src/app/beforeConnexion/utils/navbar-before-connexion/navbar-before-connexion.component.html diff --git a/src/app/beforeConnexion/navbar-before-connexion/navbar-before-connexion.component.scss b/src/app/beforeConnexion/utils/navbar-before-connexion/navbar-before-connexion.component.scss similarity index 98% rename from src/app/beforeConnexion/navbar-before-connexion/navbar-before-connexion.component.scss rename to src/app/beforeConnexion/utils/navbar-before-connexion/navbar-before-connexion.component.scss index a78eea8..e1fefaa 100644 --- a/src/app/beforeConnexion/navbar-before-connexion/navbar-before-connexion.component.scss +++ b/src/app/beforeConnexion/utils/navbar-before-connexion/navbar-before-connexion.component.scss @@ -1,6 +1,6 @@ .navbar { background-color: black; - height: 50px; + height: 60px; font-size: medium; color: white; } diff --git a/src/app/beforeConnexion/navbar-before-connexion/navbar-before-connexion.component.spec.ts b/src/app/beforeConnexion/utils/navbar-before-connexion/navbar-before-connexion.component.spec.ts similarity index 100% rename from src/app/beforeConnexion/navbar-before-connexion/navbar-before-connexion.component.spec.ts rename to src/app/beforeConnexion/utils/navbar-before-connexion/navbar-before-connexion.component.spec.ts diff --git a/src/app/beforeConnexion/navbar-before-connexion/navbar-before-connexion.component.ts b/src/app/beforeConnexion/utils/navbar-before-connexion/navbar-before-connexion.component.ts similarity index 100% rename from src/app/beforeConnexion/navbar-before-connexion/navbar-before-connexion.component.ts rename to src/app/beforeConnexion/utils/navbar-before-connexion/navbar-before-connexion.component.ts 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 07ef9dd..d14ad31 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 @@ -33,9 +33,9 @@ -
+ diff --git a/src/app/user/history/page-history-user/page-history-user.component.scss b/src/app/user/history/page-history-user/page-history-user.component.scss index 2ab71d2..bbd894d 100644 --- a/src/app/user/history/page-history-user/page-history-user.component.scss +++ b/src/app/user/history/page-history-user/page-history-user.component.scss @@ -26,6 +26,7 @@ input { position: relative; width: 20vw; height: 15vh; + cursor: pointer; } .imgPlay { 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 5f1ff69..6999167 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 @@ -11,6 +11,15 @@ import {Router} from "@angular/router"; +interface VideoHistory { + imageUrl: string, + title: string, + date: Date, + source: string, +} + + + @Component({ selector: 'app-page-history-user', templateUrl: './page-history-user.component.html', @@ -37,8 +46,10 @@ export class PageHistoryUserComponent implements AfterViewInit this.userHistoryService.clearTabVideoUrlClicked(); // --- FAUX CODE --- - const tabVideo: VideoAll[] = this.fictitiousVideosService.getTabVideoAll(8); - this.dataSource = new MatTableDataSource(tabVideo); + const tabVideoAll: VideoAll[] = this.fictitiousVideosService.getTabVideoAll(8); + let tabVideoHistory: VideoHistory[] = []; + for(let videoAll of tabVideoAll) tabVideoHistory.push(this.videoAllToVideoHistory(videoAll)); + this.dataSource = new MatTableDataSource(tabVideoHistory); this.dataSource.sort = this.sort; this.dataSource.paginator = this.paginator; this.dataSource = this.dataSource; @@ -67,15 +78,6 @@ export class PageHistoryUserComponent implements AfterViewInit } - // Retourne la source de la video en fonction de l'url - getSourceByUrl(url: string): string - { - if(url.includes("youtu")) return "Youtube" ; - else if(url.includes("daily")) return "Dailymotion" ; - else return "???" ; - } - - // Supprime la video onDelete(video: VideoAll): void { @@ -109,4 +111,15 @@ export class PageHistoryUserComponent implements AfterViewInit this.router.navigateByUrl(url); } + + videoAllToVideoHistory(videoAll: VideoAll): VideoHistory + { + return { + imageUrl: videoAll.imageUrl, + title: videoAll.title, + date: videoAll.watchedDates[videoAll.watchedDates.length-1], + source: videoAll.source, + } + } + } diff --git a/src/app/user/myPlaylists/playlist-list/playlist-list.component.html b/src/app/user/myPlaylists/playlist-list/playlist-list.component.html index 87ac8b3..a1c5285 100644 --- a/src/app/user/myPlaylists/playlist-list/playlist-list.component.html +++ b/src/app/user/myPlaylists/playlist-list/playlist-list.component.html @@ -9,23 +9,35 @@ +
- + +
+
+
+ {{playlist.name}}
+ {{playlist.videoIds.length}} vidéo + {{playlist.videoIds.length}} vidéos +
+
+ +
+
+
+
- +
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 832cbfb..0376ee3 100644 --- a/src/app/user/myPlaylists/playlist-list/playlist-list.component.scss +++ b/src/app/user/myPlaylists/playlist-list/playlist-list.component.scss @@ -15,7 +15,9 @@ text-align: center; margin: 0px 0px 0px 0px; padding: 10px 0px 10px 0px; - background-color: #dcdcdc; + //background-color: #dcdcdc; + background: linear-gradient(top, rgba(38,38,38,0.8), #e6e6e6 25%, #fff 38%, #c5c5c5 87%, rgba(38,38,38,0.8)); + background: -webkit-linear-gradient(top, #c5c5c5, #e6e6e6 25%, #fff 38%, #c5c5c5 87%, #c5c5c5); font-size: large; border-bottom: solid 1px black; border-top-left-radius: 10px; @@ -35,23 +37,36 @@ height: 60vh; overflow-y: scroll; padding: 0px; + overflow-x: hidden; } .playlistContainer { max-width: 100%; padding: 0px; + overflow-x: hidden; } + .btnPlaylist { background-color: white; padding: 20px; border-bottom: solid 1px black; - width: 100%; + //width: 100%; + width: 35vw; + overflow-x: hidden; } .btnPlaylist:hover { background-color: #f0f0f0; } +.btnPlaylistFocus { + background-color: #e6e6e6; +} +.btnPlaylistFocus:hover { + background-color: #e6e6e6; +} + + .playListCount { color: gray; font-style: italic; @@ -70,4 +85,10 @@ .btnCreerPlaylist { margin: 0px 0px 0px 0px; + border-bottom-left-radius: 10px; + border-bottom-right-radius: 10px; + background: linear-gradient(top, rgba(38,38,38,0.8), #e6e6e6 25%, #fff 38%, #c5c5c5 87%, rgba(38,38,38,0.8)); + background: -webkit-linear-gradient(top, #c5c5c5, #e6e6e6 25%, #fff 38%, #c5c5c5 87%, #c5c5c5); + //background: linear-gradient(180deg, #e6e6e6 0%, rgba(0,0,0,0.25) 49%, rgba(38,38,38,0.6) 51%, rgba(0,0,0,0.25) 100%); } + 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 191e2e1..1a95744 100644 --- a/src/app/user/myPlaylists/playlist-list/playlist-list.component.ts +++ b/src/app/user/myPlaylists/playlist-list/playlist-list.component.ts @@ -1,11 +1,11 @@ import {Component, EventEmitter, Input, OnInit, Output} from '@angular/core'; import {ThemeService} from "../../../utils/services/theme/theme.service"; 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 "../popup-create-playlist/popup-create-playlist.component"; import {FictitiousVideosService} from "../../../utils/services/fictitiousDatas/fictitiousVideos/fictitious-videos.service"; +import {PopupDeletePlaylistComponent} from "../popup-delete-playlist/popup-delete-playlist.component"; @@ -18,8 +18,9 @@ export class PlaylistListComponent implements OnInit { allPlaylists: PlaylistDB[] = []; // toutes les playlists @Output() eventEmitter = new EventEmitter(); // pour envoyer au parent la playlist selectionner - search: string = "" ; // contenu de la barre de recherche + search: string = "" ; // contenu de la barre de recherche tabPlaylist: PlaylistDB[] = []; // playlist affichées + playlistFocusedOn: PlaylistDB; constructor( public themeService: ThemeService, @@ -30,15 +31,14 @@ export class PlaylistListComponent implements OnInit ngOnInit(): void { - //this.allPlaylists = this.fictitiousVideosService.getRandomTabPlaylistDB(10, 10); this.allPlaylists = this.fictitiousVideosService.getNoRandomTabPlaylistDB(10); this.tabPlaylist = [].concat(this.allPlaylists); } + // s'execute lorsqu'on écrit sur la barre de recherche whileSearch() { - console.log("whileSearch"); this.tabPlaylist = []; for(let playlist of this.allPlaylists) { @@ -47,6 +47,7 @@ export class PlaylistListComponent implements OnInit } + // click sur créer playlist onCreatePlaylist(): void { const config = { data: this.tabPlaylist }; @@ -55,16 +56,52 @@ export class PlaylistListComponent implements OnInit .afterClosed() .subscribe(playlist => { - const config = { duration: 1000, panelClass: "custom-class" }; + const config = { duration: 1500, panelClass: "custom-class" }; if((playlist === null) || (playlist === undefined)) { this.snackBar.open("Opération annulée", "", config); } else { this.allPlaylists.push(playlist); this.tabPlaylist.push(playlist); - this.snackBar.open("La playlist a bien été créée ✔", "", config); + this.snackBar.open(`La playlist '${playlist.name}' a bien été créée ✔`, "", config); } }); } + + // click sur supprimer playlist + onDeletePlaylist(playlist: PlaylistDB): void + { + const config = {data: playlist}; + this.dialog + .open(PopupDeletePlaylistComponent, config) + .afterClosed() + .subscribe(retour => { + + const config = { duration: 1500, panelClass: "custom-class" }; + if((retour === null) || (retour === undefined)) { + this.snackBar.open("Opération annulée", "", config); + } + else { + let index = this.allPlaylists.indexOf(playlist); + if(index >= 0) this.allPlaylists.splice(index, 1); + + index = this.tabPlaylist.indexOf(playlist); + if(index >= 0) this.tabPlaylist.splice(index, 1); + + this.eventEmitter.emit(null); + this.playlistFocusedOn = null; + this.snackBar.open(`La playlist '${playlist.name}' a bien été suprimée ✔`, "", config); + } + }); + } + + + // retourne la class CSS de conteneur de playlist + getClassOfPlaylistContainer(playlist: PlaylistDB): string + { + if(playlist === this.playlistFocusedOn) return "row btnPlaylist btnPlaylistFocus" ; + else return "row btnPlaylist" ; + } + } diff --git a/src/app/user/myPlaylists/popup-delete-playlist/popup-delete-playlist.component.html b/src/app/user/myPlaylists/popup-delete-playlist/popup-delete-playlist.component.html new file mode 100644 index 0000000..0335139 --- /dev/null +++ b/src/app/user/myPlaylists/popup-delete-playlist/popup-delete-playlist.component.html @@ -0,0 +1,8 @@ + + Êtes-vous sûr de vouloir supprimer {{playlist.name}} ? + + + + + + diff --git a/src/app/user/myPlaylists/popup-delete-playlist/popup-delete-playlist.component.scss b/src/app/user/myPlaylists/popup-delete-playlist/popup-delete-playlist.component.scss new file mode 100644 index 0000000..e69de29 diff --git a/src/app/user/myPlaylists/popup-delete-playlist/popup-delete-playlist.component.spec.ts b/src/app/user/myPlaylists/popup-delete-playlist/popup-delete-playlist.component.spec.ts new file mode 100644 index 0000000..83d1cf7 --- /dev/null +++ b/src/app/user/myPlaylists/popup-delete-playlist/popup-delete-playlist.component.spec.ts @@ -0,0 +1,25 @@ +import { ComponentFixture, TestBed } from '@angular/core/testing'; + +import { PopupDeletePlaylistComponent } from './popup-delete-playlist.component'; + +describe('PopupDeletePlaylistComponent', () => { + let component: PopupDeletePlaylistComponent; + let fixture: ComponentFixture; + + beforeEach(async () => { + await TestBed.configureTestingModule({ + declarations: [ PopupDeletePlaylistComponent ] + }) + .compileComponents(); + }); + + beforeEach(() => { + fixture = TestBed.createComponent(PopupDeletePlaylistComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/src/app/user/myPlaylists/popup-delete-playlist/popup-delete-playlist.component.ts b/src/app/user/myPlaylists/popup-delete-playlist/popup-delete-playlist.component.ts new file mode 100644 index 0000000..0160eb6 --- /dev/null +++ b/src/app/user/myPlaylists/popup-delete-playlist/popup-delete-playlist.component.ts @@ -0,0 +1,28 @@ +import {Component, Inject, OnInit} from '@angular/core'; +import {MAT_DIALOG_DATA, MatDialogRef} from "@angular/material/dialog"; +import {MessageService} from "../../../utils/services/message/message.service"; + +@Component({ + selector: 'app-popup-delete-playlist', + templateUrl: './popup-delete-playlist.component.html', + styleUrls: ['./popup-delete-playlist.component.scss'] +}) +export class PopupDeletePlaylistComponent implements OnInit +{ + playlist; + + constructor( public dialogRef: MatDialogRef, + @Inject(MAT_DIALOG_DATA) public data, + private messageService: MessageService ) { } + + ngOnInit(): void + { + this.playlist = this.data; + } + + onValidate(): void + { + this.dialogRef.close(true); + } + +} diff --git a/src/app/user/myPlaylists/video-list/video-list.component.html b/src/app/user/myPlaylists/video-list/video-list.component.html index e6ee4f5..fa9faf4 100644 --- a/src/app/user/myPlaylists/video-list/video-list.component.html +++ b/src/app/user/myPlaylists/video-list/video-list.component.html @@ -37,26 +37,24 @@ - + - -
+
-
- + 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 f38b820..e3af7ce 100644 --- a/src/app/user/myPlaylists/video-list/video-list.component.scss +++ b/src/app/user/myPlaylists/video-list/video-list.component.scss @@ -1,5 +1,7 @@ .myContainer { - background-color: white ; + //background-color: white ; + background: linear-gradient(top, rgba(38,38,38,0.8), #e6e6e6 25%, #fff 38%, #c5c5c5 87%, rgba(38,38,38,0.8)); + background: -webkit-linear-gradient(top, #c5c5c5, #e6e6e6 25%, #fff 38%, #c5c5c5 87%, #c5c5c5); text-align: center; width: 35vw; margin: 1vh 0vh 3vh 0vh; @@ -13,7 +15,9 @@ .topBorder { margin: 0px 0px 0px 0px; - background-color: #dcdcdc; + //background-color: #dcdcdc; + background: linear-gradient(top, rgba(38,38,38,0.8), #e6e6e6 25%, #fff 38%, #c5c5c5 87%, rgba(38,38,38,0.8)); + background: -webkit-linear-gradient(top, #c5c5c5, #e6e6e6 25%, #fff 38%, #c5c5c5 87%, #c5c5c5); text-align: left; padding: 5px 0px 5px 5px; border-bottom: solid 1px black; @@ -45,6 +49,7 @@ position: relative; width: 20vw; height: 15vh; + cursor: pointer; } .imgPlay { @@ -67,7 +72,9 @@ .bottomBorder { margin: 0px 0px 0px 0px; - background-color: #dcdcdc; + //background-color: #dcdcdc; + background: linear-gradient(top, rgba(38,38,38,0.8), #e6e6e6 25%, #fff 38%, #c5c5c5 87%, rgba(38,38,38,0.8)); + background: -webkit-linear-gradient(top, #c5c5c5, #e6e6e6 25%, #fff 38%, #c5c5c5 87%, #c5c5c5); border-top: solid 1px black; border-bottom: solid 1px black; font-size: large; diff --git a/src/app/user/myPlaylists/video-list/video-list.component.ts b/src/app/user/myPlaylists/video-list/video-list.component.ts index dce50ad..a98cd24 100644 --- a/src/app/user/myPlaylists/video-list/video-list.component.ts +++ b/src/app/user/myPlaylists/video-list/video-list.component.ts @@ -21,7 +21,7 @@ export class VideoListComponent implements OnChanges { @Input() playlist: PlaylistDB; videosInPlaylist: VideoAll[] = []; - allUserVideos: VideoAll[] = this.fictitiousVideosService.getAllVideoAll(); + allUserVideos: VideoAll[] = this.fictitiousVideosService.get_TAB_VIDEO(); constructor( private messageService: MessageService, diff --git a/src/app/user/myProfil/page-profil-user/page-profil-user.component.html b/src/app/user/myProfil/page-profil-user/page-profil-user.component.html index fa22205..7e69ded 100644 --- a/src/app/user/myProfil/page-profil-user/page-profil-user.component.html +++ b/src/app/user/myProfil/page-profil-user/page-profil-user.component.html @@ -37,7 +37,7 @@
-
Login:
+
Pseudo:
{{user.login}}
diff --git a/src/app/user/myProfil/popup-update-user/popup-update-user.component.html b/src/app/user/myProfil/popup-update-user/popup-update-user.component.html index 6544c05..1e583c7 100644 --- a/src/app/user/myProfil/popup-update-user/popup-update-user.component.html +++ b/src/app/user/myProfil/popup-update-user/popup-update-user.component.html @@ -39,7 +39,7 @@
- +
diff --git a/src/app/user/myProfil/popup-update-user/popup-update-user.component.ts b/src/app/user/myProfil/popup-update-user/popup-update-user.component.ts index cf1b889..806b6c9 100644 --- a/src/app/user/myProfil/popup-update-user/popup-update-user.component.ts +++ b/src/app/user/myProfil/popup-update-user/popup-update-user.component.ts @@ -39,6 +39,7 @@ export class PopupUpdateUserComponent implements OnInit dateOfBirth: user0.dateOfBirth, gender: user0.gender, interests: [], + company: "", isActive: user0.isActive, isAccepted: user0.isAccepted, createdAt: user0.createdAt, @@ -67,7 +68,7 @@ export class PopupUpdateUserComponent implements OnInit checkField() { if(this.userCopy.login.length === 0) { - this.errorMessage = "Veuillez remplir le champ 'login'." ; + this.errorMessage = "Veuillez remplir le champ 'pseudo'." ; this.hasError = true; } else if(this.userCopy.email.length === 0) { diff --git a/src/app/user/search/video-grid/video-grid.component.html b/src/app/user/search/video-grid/video-grid.component.html index 8dc071a..3cb869c 100644 --- a/src/app/user/search/video-grid/video-grid.component.html +++ b/src/app/user/search/video-grid/video-grid.component.html @@ -2,7 +2,7 @@ -
+
@@ -16,16 +16,16 @@ - + - + ytb dlm - +
{{tronquage(tabVideo[indexPage+k].title)}}
@@ -54,7 +54,7 @@ -
+
  diff --git a/src/app/user/search/video-grid/video-grid.component.scss b/src/app/user/search/video-grid/video-grid.component.scss index ae339eb..6819fd8 100644 --- a/src/app/user/search/video-grid/video-grid.component.scss +++ b/src/app/user/search/video-grid/video-grid.component.scss @@ -7,12 +7,19 @@ mat-grid-list { mat-grid-tile { margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; - border: solid 1px black; } .myCell { - margin: 0px 0px 0px 0px; - padding: 7px 0px 0px 0px; + margin: 7px 0px 0px 0px; + padding: 0px 0px 0px 0px; + background-color: white; + border: solid 1px black; + border-bottom-left-radius: 2px; + border-bottom-right-radius: 2px; + cursor: pointer; +} +.myCell:hover { + background-color: #d2d2d2; } @@ -20,22 +27,22 @@ mat-grid-tile { .imgsContainer { - width: 20vw; + //width: 20vw; + width: 18vw; height: 15vh; } .imgPlay { position: absolute; - margin-left: 9vw; - width: 3vw; + margin-left: 8vw; + width: 2.5vw; margin-top: 5vh; - height: 6vh; + height: 5vh; padding: 0px 0px 0px 0px; } .imgVideo { - border: solid 1px black; - width: 20vw; + width: 18vw; height: 15vh; padding: 0px 0px 0px 0px; } @@ -44,9 +51,16 @@ mat-grid-tile { // --------------------------------------------------------------------------------------------- +.mat-grid-list-info-video { + margin: 0px 0px 0px 0px; + font-size: small; +} + .mat-grid-tile-info-video { border: none; font-size: x-small; + //background: linear-gradient(top, rgba(38,38,38,0.8), #e6e6e6 25%, #fff 38%, #c5c5c5 87%, rgba(38,38,38,0.8)); + //background: -webkit-linear-gradient(top, #c5c5c5, #e6e6e6 25%, #fff 38%, #c5c5c5 87%, #c5c5c5); } mat-icon { @@ -57,10 +71,11 @@ mat-icon { // --------------------------------------------------------------------------------------------- -.btnContainer { +.paginatorContainer { margin: 0px 0px 0px 0px; - padding: 0px 0px 0px 0px; + padding: 5px 0px 0px 0px; text-align: center; + background-color: white; } .btnPaginator { diff --git a/src/app/user/utils/components/advert/advert.component.html b/src/app/user/utils/components/advert/advert.component.html index 3bcedd5..c7e90f0 100644 --- a/src/app/user/utils/components/advert/advert.component.html +++ b/src/app/user/utils/components/advert/advert.component.html @@ -2,6 +2,7 @@
@@ -10,6 +11,7 @@ @@ -17,4 +19,5 @@ diff --git a/src/app/user/utils/components/advert/advert.component.ts b/src/app/user/utils/components/advert/advert.component.ts index d8effca..a088499 100644 --- a/src/app/user/utils/components/advert/advert.component.ts +++ b/src/app/user/utils/components/advert/advert.component.ts @@ -1,6 +1,6 @@ import {Component, Input, OnInit} from '@angular/core'; import {Advert} from "../../../../utils/interfaces/advert"; -import {ThemeService} from "../../../../utils/services/theme/theme.service"; +import {Router} from "@angular/router"; @@ -15,16 +15,17 @@ export class AdvertComponent implements OnInit @Input() from: string = "search"; idxImage: number = 0; - - constructor(public themeService: ThemeService) { } - + constructor(private router: Router) { } ngOnInit(): void { const nbImages = this.ad.images.length; this.idxImage = Math.floor(Math.random() * nbImages); + } - + onClick(): void + { + document.location.href = this.ad.url; } } diff --git a/src/app/user/utils/components/navbar-user/navbar-user.component.html b/src/app/user/utils/components/navbar-user/navbar-user.component.html index 57153fb..eb7bf23 100644 --- a/src/app/user/utils/components/navbar-user/navbar-user.component.html +++ b/src/app/user/utils/components/navbar-user/navbar-user.component.html @@ -6,27 +6,33 @@ + + +
+ power_settings_new + + + Titre Tags Sujets - - {{tag}}, - {{tag}} + + {{interest}}, + {{interest}} Vues - {{advert.views}} - Visible - check - + {{advert.countViews}} Date Date - {{video.watchedDates[video.watchedDates.length-1] | date:'dd/LL/YYYY à HH:mm:ss'}} + {{video.date | date:'dd/LL/YYYY à HH:mm:ss'}}