restructuration des fichiers (pour pouvoir passer plus facilement plusieurs fronts)
This commit is contained in:
MiharyR
parent
48fb0845f1
commit
ef5dd96747
86 changed files with 1343 additions and 335 deletions
32
src/app/admin/navbar-admin/navbar-admin.component.html
Normal file
32
src/app/admin/navbar-admin/navbar-admin.component.html
Normal file
|
|
@ -0,0 +1,32 @@
|
|||
<nav class="navbar navbar-expand-lg">
|
||||
|
||||
<!-- PolyNotFound -->
|
||||
<a class="navbar-brand" routerLink="/admin/userList"> StreamNotFound </a>
|
||||
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNavDropdown" aria-controls="navbarNavDropdown" aria-expanded="false" aria-label="Toggle navigation">
|
||||
<span class="navbar-toggler-icon"></span>
|
||||
</button>
|
||||
|
||||
<!-- [UserList] [Mes AdList] [Historique] -->
|
||||
<div class="collapse navbar-collapse">
|
||||
<ul class="navbar-nav">
|
||||
<li class="nav-item active monLi">
|
||||
<a class="nav-link" routerLink="/admin/userList"> Liste des utillisateurs </a>
|
||||
</li>
|
||||
<li class="nav-item active monLi">
|
||||
<a class="nav-link" routerLink="/admin/adList"> Liste des pubs </a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<!-- Mon profil -->
|
||||
<img [src]=urlImage
|
||||
onerror="this.onerror=null; this.src='assets/profil.png'"
|
||||
routerLink="/admin/myProfil"
|
||||
alt="">
|
||||
|
||||
<!-- Deconnexion -->
|
||||
<button mat-button class="btnDeconnexion" (click)="onDeconnexion()" routerLink="/">
|
||||
Deconnexion
|
||||
</button>
|
||||
|
||||
</nav>
|
||||
25
src/app/admin/navbar-admin/navbar-admin.component.spec.ts
Normal file
25
src/app/admin/navbar-admin/navbar-admin.component.spec.ts
Normal file
|
|
@ -0,0 +1,25 @@
|
|||
import { ComponentFixture, TestBed } from '@angular/core/testing';
|
||||
|
||||
import { NavbarAdminComponent } from './navbar-admin.component';
|
||||
|
||||
describe('NavbarAdminComponent', () => {
|
||||
let component: NavbarAdminComponent;
|
||||
let fixture: ComponentFixture<NavbarAdminComponent>;
|
||||
|
||||
beforeEach(async () => {
|
||||
await TestBed.configureTestingModule({
|
||||
declarations: [ NavbarAdminComponent ]
|
||||
})
|
||||
.compileComponents();
|
||||
});
|
||||
|
||||
beforeEach(() => {
|
||||
fixture = TestBed.createComponent(NavbarAdminComponent);
|
||||
component = fixture.componentInstance;
|
||||
fixture.detectChanges();
|
||||
});
|
||||
|
||||
it('should create', () => {
|
||||
expect(component).toBeTruthy();
|
||||
});
|
||||
});
|
||||
18
src/app/admin/navbar-admin/navbar-admin.component.ts
Normal file
18
src/app/admin/navbar-admin/navbar-admin.component.ts
Normal file
|
|
@ -0,0 +1,18 @@
|
|||
import { Component, OnInit } from '@angular/core';
|
||||
import {ThemeService} from "../../utils/services/theme/theme.service";
|
||||
|
||||
@Component({
|
||||
selector: 'app-navbar-admin',
|
||||
templateUrl: './navbar-admin.component.html',
|
||||
styleUrls: ['./navbar-admin.component.scss']
|
||||
})
|
||||
export class NavbarAdminComponent
|
||||
{
|
||||
urlImage: string = "" ;
|
||||
|
||||
constructor( public themeService: ThemeService ) { }
|
||||
|
||||
onDeconnexion(): void {
|
||||
|
||||
}
|
||||
}
|
||||
|
|
@ -1,15 +1,17 @@
|
|||
<div title="bobo" class="container" appDragAndDrop (fileDropped)="onFileDropped($event)">
|
||||
<input type="file" #fileDropRef id="fileDropRef" multiple (change)="fileBrowseHandler($event.target.files)" />
|
||||
<h3>Images</h3>
|
||||
<img src="/assets/uploadFile.png" width="50" height="50" style="margin-top: 5px">
|
||||
<img src="/src/assets/uploadFile.png" width="50" height="50" style="margin-top: 5px">
|
||||
<div style="font-style: italic; margin-top: 10px">Glisser déposer</div>
|
||||
<div style="font-style: italic">ou</div>
|
||||
<div style="font-style: italic" for="fileDropRef">Cliquer pour selectionner</div>
|
||||
</div>
|
||||
|
||||
<mat-icon [title]=info_image>info</mat-icon>
|
||||
|
||||
<div class="files-list">
|
||||
<div class="single-file" *ngFor="let file of files; let i = index">
|
||||
<img src="assets/uploadFile.png" width="45px" alt="file">
|
||||
<img src="/assets/uploadFile.png" width="45px" alt="file">
|
||||
<div class="info">
|
||||
<h4 class="name">
|
||||
{{ file?.name }}
|
||||
|
|
@ -1,20 +1,20 @@
|
|||
import { ComponentFixture, TestBed } from '@angular/core/testing';
|
||||
|
||||
import { BarTagsComponent } from './bar-tags.component';
|
||||
import { InputTagsComponent } from './input-tags.component';
|
||||
|
||||
describe('BarTagsComponent', () => {
|
||||
let component: BarTagsComponent;
|
||||
let fixture: ComponentFixture<BarTagsComponent>;
|
||||
let component: InputTagsComponent;
|
||||
let fixture: ComponentFixture<InputTagsComponent>;
|
||||
|
||||
beforeEach(async () => {
|
||||
await TestBed.configureTestingModule({
|
||||
declarations: [ BarTagsComponent ]
|
||||
declarations: [ InputTagsComponent ]
|
||||
})
|
||||
.compileComponents();
|
||||
});
|
||||
|
||||
beforeEach(() => {
|
||||
fixture = TestBed.createComponent(BarTagsComponent);
|
||||
fixture = TestBed.createComponent(InputTagsComponent);
|
||||
component = fixture.componentInstance;
|
||||
fixture.detectChanges();
|
||||
});
|
||||
|
|
@ -5,17 +5,17 @@ import {Observable} from "rxjs";
|
|||
import {map, startWith} from "rxjs/operators";
|
||||
import {MatChipInputEvent} from "@angular/material/chips";
|
||||
import {MatAutocompleteSelectedEvent} from "@angular/material/autocomplete";
|
||||
import {FictitiousDatasService} from "../../utils/services/fictitiousDatas/fictitious-datas.service";
|
||||
import {MessageService} from "../../utils/services/message/message.service";
|
||||
import {FictitiousDatasService} from "../../../utils/services/fictitiousDatas/fictitious-datas.service";
|
||||
import {MessageService} from "../../../utils/services/message/message.service";
|
||||
|
||||
|
||||
|
||||
@Component({
|
||||
selector: 'app-bar-tags',
|
||||
templateUrl: './bar-tags.component.html',
|
||||
styleUrls: ['./bar-tags.component.scss']
|
||||
selector: 'app-input-tags',
|
||||
templateUrl: './input-tags.component.html',
|
||||
styleUrls: ['./input-tags.component.scss']
|
||||
})
|
||||
export class BarTagsComponent implements OnInit
|
||||
export class InputTagsComponent implements OnInit
|
||||
{
|
||||
selectable = true;
|
||||
removable = true;
|
||||
|
|
@ -41,30 +41,19 @@ export class BarTagsComponent implements OnInit
|
|||
// --- FAUX CODE ---
|
||||
this.allTags = this.fictitiousDatasService.getTags();
|
||||
this.allTags.sort();
|
||||
|
||||
// --- VRAI CODE ---
|
||||
/*
|
||||
this.messageService
|
||||
.sendMessage("advertiser/get/tags", null)
|
||||
.subscribe( retour => {
|
||||
|
||||
if(retour.status === "error") console.log(retour);
|
||||
else {
|
||||
this.allTags = retour.data.tags;
|
||||
this.allTags.sort();
|
||||
}
|
||||
});
|
||||
*/
|
||||
}
|
||||
|
||||
|
||||
add(event: MatChipInputEvent): void
|
||||
{
|
||||
const value = (event.value || '').trim();
|
||||
if (value) this.myTags.push(value); // Add our fruit
|
||||
event.chipInput!.clear(); // Clear the input value
|
||||
this.formControl.setValue(null);
|
||||
this.eventEmitter.emit(this.myTags);
|
||||
if (value && (this.allTags.indexOf(value) !== -1))
|
||||
{
|
||||
this.myTags.push(value);
|
||||
event.chipInput!.clear();
|
||||
this.formControl.setValue(null);
|
||||
this.eventEmitter.emit(this.myTags);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
|
@ -2,7 +2,7 @@
|
|||
<div class="myContainer">
|
||||
|
||||
|
||||
<app-nav-bar pour="advertiser"></app-nav-bar><br><br>
|
||||
<app-navbar-advertiser></app-navbar-advertiser><br><br>
|
||||
|
||||
<!-- ---------------------------------------------------------------------------------- -->
|
||||
|
||||
|
|
@ -1,9 +1,9 @@
|
|||
import {Component, OnInit, ViewChild} from '@angular/core';
|
||||
import {MatSort} from "@angular/material/sort";
|
||||
import {ThemeService} from "../../utils/services/theme/theme.service";
|
||||
import {FictitiousDatasService} from "../../utils/services/fictitiousDatas/fictitious-datas.service";
|
||||
import {ThemeService} from "../../../utils/services/theme/theme.service";
|
||||
import {FictitiousDatasService} from "../../../utils/services/fictitiousDatas/fictitious-datas.service";
|
||||
import {MatTableDataSource} from "@angular/material/table";
|
||||
import {Advert} from "../../utils/interfaces/advert";
|
||||
import {Advert} from "../../../utils/interfaces/advert";
|
||||
import {MatDialog} from "@angular/material/dialog";
|
||||
import {PopupAddOrUpdateAdComponent} from "../popup-add-or-update-ad/popup-add-or-update-ad.component";
|
||||
import {MatSnackBar} from "@angular/material/snack-bar";
|
||||
|
|
@ -18,7 +18,7 @@
|
|||
<app-drag-and-drop></app-drag-and-drop>
|
||||
|
||||
<!-- Tags -->
|
||||
<app-bar-tags [myTags]="advert.tags" (eventEmitter)="onEventBarTags($event)"></app-bar-tags>
|
||||
<app-input-tags [myTags]="advert.tags" (eventEmitter)="onEventInputTags($event)"></app-input-tags>
|
||||
|
||||
<!-- Comments -->
|
||||
<mat-form-field class="commentContainer" appearance="fill">
|
||||
|
|
@ -1,8 +1,8 @@
|
|||
import {Component, Inject, OnInit} from '@angular/core';
|
||||
import {Advert} from "../../utils/interfaces/advert";
|
||||
import {Advert} from "../../../utils/interfaces/advert";
|
||||
import {MAT_DIALOG_DATA, MatDialogRef} from "@angular/material/dialog";
|
||||
import {MessageService} from "../../utils/services/message/message.service";
|
||||
import {ThemeService} from "../../utils/services/theme/theme.service";
|
||||
import {MessageService} from "../../../utils/services/message/message.service";
|
||||
import {ThemeService} from "../../../utils/services/theme/theme.service";
|
||||
|
||||
|
||||
const ADVERT_VIDE = {
|
||||
|
|
@ -82,7 +82,7 @@ export class PopupAddOrUpdateAdComponent implements OnInit
|
|||
}
|
||||
|
||||
|
||||
onEventBarTags(myTags: string[]): void
|
||||
onEventInputTags(myTags: string[]): void
|
||||
{
|
||||
this.advert.tags = myTags;
|
||||
}
|
||||
|
|
@ -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 {Advert} from "../../utils/interfaces/advert";
|
||||
import {MessageService} from "../../../utils/services/message/message.service";
|
||||
import {Advert} from "../../../utils/interfaces/advert";
|
||||
|
||||
|
||||
|
||||
|
|
@ -1,7 +1,7 @@
|
|||
import {Component, Inject, OnInit} from '@angular/core';
|
||||
import {ThemeService} from "../../utils/services/theme/theme.service";
|
||||
import {ThemeService} from "../../../utils/services/theme/theme.service";
|
||||
import {MAT_DIALOG_DATA, MatDialog, MatDialogRef} from "@angular/material/dialog";
|
||||
import {Advert} from "../../utils/interfaces/advert";
|
||||
import {Advert} from "../../../utils/interfaces/advert";
|
||||
import {PopupVisualizeImagesComponent} from "../popup-visualize-images/popup-visualize-images.component";
|
||||
|
||||
@Component({
|
||||
|
|
@ -1,6 +1,6 @@
|
|||
import {Component, Inject, OnInit} from '@angular/core';
|
||||
import {MAT_DIALOG_DATA, MatDialog, MatDialogRef} from "@angular/material/dialog";
|
||||
import {ThemeService} from "../../utils/services/theme/theme.service";
|
||||
import {ThemeService} from "../../../utils/services/theme/theme.service";
|
||||
|
||||
@Component({
|
||||
selector: 'app-popup-visualize-images',
|
||||
|
|
@ -0,0 +1 @@
|
|||
<p>page-profil-advertiser works!</p>
|
||||
|
|
@ -0,0 +1,25 @@
|
|||
import { ComponentFixture, TestBed } from '@angular/core/testing';
|
||||
|
||||
import { PageProfilAdvertiserComponent } from './page-profil-advertiser.component';
|
||||
|
||||
describe('PageProfilAdvertiserComponent', () => {
|
||||
let component: PageProfilAdvertiserComponent;
|
||||
let fixture: ComponentFixture<PageProfilAdvertiserComponent>;
|
||||
|
||||
beforeEach(async () => {
|
||||
await TestBed.configureTestingModule({
|
||||
declarations: [ PageProfilAdvertiserComponent ]
|
||||
})
|
||||
.compileComponents();
|
||||
});
|
||||
|
||||
beforeEach(() => {
|
||||
fixture = TestBed.createComponent(PageProfilAdvertiserComponent);
|
||||
component = fixture.componentInstance;
|
||||
fixture.detectChanges();
|
||||
});
|
||||
|
||||
it('should create', () => {
|
||||
expect(component).toBeTruthy();
|
||||
});
|
||||
});
|
||||
|
|
@ -0,0 +1,15 @@
|
|||
import { Component, OnInit } from '@angular/core';
|
||||
|
||||
@Component({
|
||||
selector: 'app-page-profil-advertiser',
|
||||
templateUrl: './page-profil-advertiser.component.html',
|
||||
styleUrls: ['./page-profil-advertiser.component.scss']
|
||||
})
|
||||
export class PageProfilAdvertiserComponent implements OnInit {
|
||||
|
||||
constructor() { }
|
||||
|
||||
ngOnInit(): void {
|
||||
}
|
||||
|
||||
}
|
||||
|
|
@ -0,0 +1 @@
|
|||
<p>popup-update-advertiser works!</p>
|
||||
|
|
@ -0,0 +1,25 @@
|
|||
import { ComponentFixture, TestBed } from '@angular/core/testing';
|
||||
|
||||
import { PopupUpdateAdvertiserComponent } from './popup-update-advertiser.component';
|
||||
|
||||
describe('PopupUpdateAdvertiserComponent', () => {
|
||||
let component: PopupUpdateAdvertiserComponent;
|
||||
let fixture: ComponentFixture<PopupUpdateAdvertiserComponent>;
|
||||
|
||||
beforeEach(async () => {
|
||||
await TestBed.configureTestingModule({
|
||||
declarations: [ PopupUpdateAdvertiserComponent ]
|
||||
})
|
||||
.compileComponents();
|
||||
});
|
||||
|
||||
beforeEach(() => {
|
||||
fixture = TestBed.createComponent(PopupUpdateAdvertiserComponent);
|
||||
component = fixture.componentInstance;
|
||||
fixture.detectChanges();
|
||||
});
|
||||
|
||||
it('should create', () => {
|
||||
expect(component).toBeTruthy();
|
||||
});
|
||||
});
|
||||
|
|
@ -0,0 +1,15 @@
|
|||
import { Component, OnInit } from '@angular/core';
|
||||
|
||||
@Component({
|
||||
selector: 'app-popup-update-advertiser',
|
||||
templateUrl: './popup-update-advertiser.component.html',
|
||||
styleUrls: ['./popup-update-advertiser.component.scss']
|
||||
})
|
||||
export class PopupUpdateAdvertiserComponent implements OnInit {
|
||||
|
||||
constructor() { }
|
||||
|
||||
ngOnInit(): void {
|
||||
}
|
||||
|
||||
}
|
||||
|
|
@ -0,0 +1,23 @@
|
|||
<nav class="navbar navbar-expand-lg">
|
||||
|
||||
<!-- PolyNotFound -->
|
||||
<a class="navbar-brand" routerLink="/advertiser"> StreamNotFound </a>
|
||||
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNavDropdown" aria-controls="navbarNavDropdown" aria-expanded="false" aria-label="Toggle navigation">
|
||||
<span class="navbar-toggler-icon"></span>
|
||||
</button>
|
||||
|
||||
<!-- Vide -->
|
||||
<div class="collapse navbar-collapse"></div>
|
||||
|
||||
<!-- Mon profil -->
|
||||
<img [src]=urlImage
|
||||
onerror="this.onerror=null; this.src='assets/profil.png'"
|
||||
routerLink="/advertiser/myProfil"
|
||||
alt="">
|
||||
|
||||
<!-- Deconnexion -->
|
||||
<button mat-button class="btnDeconnexion" (click)="onDeconnexion()" routerLink="/">
|
||||
Deconnexion
|
||||
</button>
|
||||
|
||||
</nav>
|
||||
|
|
@ -0,0 +1,80 @@
|
|||
.navbar {
|
||||
background-color: black;
|
||||
height: 75px;
|
||||
font-size: x-large;
|
||||
color: white;
|
||||
}
|
||||
|
||||
|
||||
.navbar-expand-lg {
|
||||
border-bottom: solid;
|
||||
border-color: white;
|
||||
border-bottom-width: 2px;
|
||||
}
|
||||
|
||||
|
||||
// PolyNotFound
|
||||
.navbar-brand {
|
||||
font-family: cursive;
|
||||
font-weight: bold;
|
||||
//font-style: oblique 90deg;
|
||||
font-size: xxx-large;
|
||||
margin-left: 30px;
|
||||
color: white;
|
||||
}
|
||||
|
||||
|
||||
// Recherche, Mes Playlists, Historique
|
||||
.nav-link {
|
||||
color: white;
|
||||
}
|
||||
.nav-link:hover {
|
||||
color: grey;
|
||||
}
|
||||
|
||||
|
||||
// Bonton deconnexion
|
||||
.btnDeconnexion {
|
||||
font-size: x-large;
|
||||
margin: 0px 10px 0px 10px
|
||||
}
|
||||
.btnDeconnexion:hover {
|
||||
color: grey;
|
||||
}
|
||||
|
||||
|
||||
.monLi {
|
||||
margin: 0px 10px 0px 10px;
|
||||
}
|
||||
|
||||
|
||||
img {
|
||||
border: solid 2px white;
|
||||
border-radius: 50px;
|
||||
margin: 0px 10px 0px 15px;
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
}
|
||||
img:hover {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
|
||||
// --------------------------------------------------------------------
|
||||
|
||||
|
||||
::ng-deep .mat-slide-toggle-thumb {
|
||||
background-color: #c8c8c8;
|
||||
}
|
||||
|
||||
::ng-deep .mat-slide-toggle-bar {
|
||||
background-color: #ffffff;
|
||||
}
|
||||
|
||||
::ng-deep .mat-slide-toggle.mat-checked:not(.mat-disabled) .mat-slide-toggle-thumb {
|
||||
background-color: #ffffff;
|
||||
}
|
||||
|
||||
::ng-deep .mat-slide-toggle.mat-checked:not(.mat-disabled) .mat-slide-toggle-bar {
|
||||
background-color: #646464;
|
||||
}
|
||||
|
|
@ -0,0 +1,25 @@
|
|||
import { ComponentFixture, TestBed } from '@angular/core/testing';
|
||||
|
||||
import { NavbarAdvertiserComponent } from './navbar-advertiser.component';
|
||||
|
||||
describe('NavbarAdvertiserComponent', () => {
|
||||
let component: NavbarAdvertiserComponent;
|
||||
let fixture: ComponentFixture<NavbarAdvertiserComponent>;
|
||||
|
||||
beforeEach(async () => {
|
||||
await TestBed.configureTestingModule({
|
||||
declarations: [ NavbarAdvertiserComponent ]
|
||||
})
|
||||
.compileComponents();
|
||||
});
|
||||
|
||||
beforeEach(() => {
|
||||
fixture = TestBed.createComponent(NavbarAdvertiserComponent);
|
||||
component = fixture.componentInstance;
|
||||
fixture.detectChanges();
|
||||
});
|
||||
|
||||
it('should create', () => {
|
||||
expect(component).toBeTruthy();
|
||||
});
|
||||
});
|
||||
|
|
@ -0,0 +1,17 @@
|
|||
import { Component } from '@angular/core';
|
||||
import {ThemeService} from "../../utils/services/theme/theme.service";
|
||||
|
||||
@Component({
|
||||
selector: 'app-navbar-advertiser',
|
||||
templateUrl: './navbar-advertiser.component.html',
|
||||
styleUrls: ['./navbar-advertiser.component.scss']
|
||||
})
|
||||
export class NavbarAdvertiserComponent
|
||||
{
|
||||
urlImage: string = "" ;
|
||||
|
||||
constructor( public themeService: ThemeService ) { }
|
||||
|
||||
onDeconnexion(): void {}
|
||||
|
||||
}
|
||||
|
|
@ -1,33 +1,34 @@
|
|||
import { NgModule } from '@angular/core';
|
||||
import { RouterModule, Routes } from '@angular/router';
|
||||
import {PageConnexionComponent} from './pourLes3Roles/page-connexion/page-connexion.component';
|
||||
import {PageRegisterComponent} from './pourLes3Roles/register/page-register/page-register.component';
|
||||
import {PageLoginComponent} from './beforeConnexion/login/page-login/page-login.component';
|
||||
import {PageRegisterComponent} from "./beforeConnexion/register/page-register/page-register.component";
|
||||
import {PageSearchComponent} from "./user/search/page-search/page-search.component";
|
||||
import {PageMyPlaylistsComponent} from "./user/myPlaylists/page-my-playlists/page-my-playlists.component";
|
||||
import {PageHistoryUserComponent} from "./user/history/page-history-user/page-history-user.component";
|
||||
import {PageMyProfilComponent} from "./utils/components/myProfil/page-my-profil/page-my-profil.component";
|
||||
import {PageAdvertiserComponent} from "./advertiser/page-advertiser/page-advertiser.component";
|
||||
import {PageAdvertiserComponent} from "./advertiser/manageAds/page-advertiser/page-advertiser.component";
|
||||
import {PageProfilUserComponent} from "./user/myProfil/page-profil-user/page-profil-user.component";
|
||||
import {PageProfilAdvertiserComponent} from "./advertiser/myProfil/page-profil-advertiser/page-profil-advertiser.component";
|
||||
|
||||
|
||||
const routes: Routes = [
|
||||
{ path: '', component: PageConnexionComponent },
|
||||
{ path: 'login', component: PageConnexionComponent },
|
||||
{ path: '', component: PageLoginComponent },
|
||||
{ path: 'login', component: PageLoginComponent },
|
||||
{ path: 'register', component: PageRegisterComponent },
|
||||
|
||||
{ path: 'user', component: PageSearchComponent },
|
||||
{ path: 'user/search', component: PageSearchComponent },
|
||||
{ path: 'user/myPlaylists', component: PageMyPlaylistsComponent },
|
||||
{ path: 'user/history', component: PageHistoryUserComponent },
|
||||
{ path: 'user/myProfil', component: PageMyProfilComponent },
|
||||
{ path: 'user/myProfil', component: PageProfilUserComponent },
|
||||
|
||||
{ path: 'advertiser', component: PageAdvertiserComponent },
|
||||
{ path: 'advertiser/myProfil', component: PageMyProfilComponent },
|
||||
{ path: 'advertiser/myProfil', component: PageProfilAdvertiserComponent },
|
||||
|
||||
/*
|
||||
{ path: 'admin/userList', component: PageConnexionComponent },
|
||||
{ path: 'admin/addUser', component: PageConnexionComponent },
|
||||
{ path: 'admin/adList', component: PageConnexionComponent },
|
||||
{ path: 'admin/myProfil', component: PageMyProfilComponent }
|
||||
{ path: 'admin/userList', component: PageLoginComponent },
|
||||
{ path: 'admin/addUser', component: PageLoginComponent },
|
||||
{ path: 'admin/adList', component: PageLoginComponent },
|
||||
{ path: 'admin/myProfil', component: PageProfilAdminComponent }
|
||||
*/
|
||||
];
|
||||
|
||||
|
|
|
|||
|
|
@ -3,15 +3,14 @@ import { BrowserModule } from '@angular/platform-browser';
|
|||
|
||||
import { AppRoutingModule } from './app-routing.module';
|
||||
import { AppComponent } from './app.component';
|
||||
import { PageConnexionComponent } from './pourLes3Roles/page-connexion/page-connexion.component';
|
||||
import { PageRegisterComponent } from './pourLes3Roles/register/page-register/page-register.component';
|
||||
import { NavBarComponent } from './utils/components/nav-bar/nav-bar.component';
|
||||
import { PageLoginComponent } from './beforeConnexion/login/page-login/page-login.component';
|
||||
import { PageRegisterComponent } from './beforeConnexion/register/page-register/page-register.component';
|
||||
import {BrowserAnimationsModule} from '@angular/platform-browser/animations';
|
||||
import {MatSlideToggleModule} from '@angular/material/slide-toggle';
|
||||
import {FormsModule, ReactiveFormsModule} from "@angular/forms";
|
||||
import { PageSearchComponent } from './user/search/page-search/page-search.component';
|
||||
import {HttpClientModule} from "@angular/common/http";
|
||||
import { PopupConfirmationComponent } from './pourLes3Roles/register/popup-confirmation/popup-confirmation.component';
|
||||
import { PopupConfirmationComponent } from './beforeConnexion/register/popup-confirmation/popup-confirmation.component';
|
||||
import {MatDialogModule} from '@angular/material/dialog';
|
||||
import {MatButtonModule} from "@angular/material/button";
|
||||
import { AdvertComponent } from './utils/components/advert/advert.component';
|
||||
|
|
@ -36,26 +35,35 @@ import { PageMyProfilComponent } from './utils/components/myProfil/page-my-profi
|
|||
import { PopupPictureProfilUrlComponent } from './utils/components/myProfil/popup-picture-profil-url/popup-picture-profil-url.component';
|
||||
import { NgbModule } from '@ng-bootstrap/ng-bootstrap';
|
||||
import {MatSortModule} from "@angular/material/sort";
|
||||
import { PageAdvertiserComponent } from './advertiser/page-advertiser/page-advertiser.component';
|
||||
import { PopupDeleteAdComponent } from './advertiser/popup-delete-ad/popup-delete-ad.component';
|
||||
import { PopupAddOrUpdateAdComponent } from './advertiser/popup-add-or-update-ad/popup-add-or-update-ad.component';
|
||||
import { PopupVisualizeAdComponent } from './advertiser/popup-visualize-ad/popup-visualize-ad.component';
|
||||
import { BarTagsComponent } from './advertiser/bar-tags/bar-tags.component';
|
||||
import { PageAdvertiserComponent } from './advertiser/manageAds/page-advertiser/page-advertiser.component';
|
||||
import { PopupDeleteAdComponent } from './advertiser/manageAds/popup-delete-ad/popup-delete-ad.component';
|
||||
import { PopupAddOrUpdateAdComponent } from './advertiser/manageAds/popup-add-or-update-ad/popup-add-or-update-ad.component';
|
||||
import { PopupVisualizeAdComponent } from './advertiser/manageAds/popup-visualize-ad/popup-visualize-ad.component';
|
||||
import { InputTagsComponent } from './advertiser/manageAds/input-tags/input-tags.component';
|
||||
import {MatChipsModule} from "@angular/material/chips";
|
||||
import {MatAutocompleteModule} from "@angular/material/autocomplete";
|
||||
import {MatSelectModule} from "@angular/material/select";
|
||||
import { PopupVisualizeImagesComponent } from './advertiser/popup-visualize-images/popup-visualize-images.component';
|
||||
import { PopupVisualizeImagesComponent } from './advertiser/manageAds/popup-visualize-images/popup-visualize-images.component';
|
||||
import {IvyCarouselModule} from "angular-responsive-carousel";
|
||||
import { DragAndDropComponent } from './advertiser/drag-and-drop/drag-and-drop.component';
|
||||
import { DragAndDropComponent } from './advertiser/manageAds/drag-and-drop/drag-and-drop.component';
|
||||
import { DragAndDropDirective } from './utils/directives/dragAndDrop/drag-and-drop.directive';
|
||||
import { PageProfilUserComponent } from './user/myProfil/page-profil-user/page-profil-user.component';
|
||||
import { NavbarUserComponent } from './user/navbar-user/navbar-user.component';
|
||||
import { NavbarAdvertiserComponent } from './advertiser/navbar-advertiser/navbar-advertiser.component';
|
||||
import { NavbarAdminComponent } from './admin/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 {MatRadioModule} from "@angular/material/radio";
|
||||
import { InputInterestsComponent } from './user/myProfil/input-interests/input-interests.component';
|
||||
|
||||
|
||||
@NgModule({
|
||||
declarations: [
|
||||
AppComponent,
|
||||
PageConnexionComponent,
|
||||
PageLoginComponent,
|
||||
PageRegisterComponent,
|
||||
NavBarComponent,
|
||||
PageSearchComponent,
|
||||
PopupConfirmationComponent,
|
||||
AdvertComponent,
|
||||
|
|
@ -75,10 +83,19 @@ import { DragAndDropDirective } from './utils/directives/dragAndDrop/drag-and-dr
|
|||
PopupDeleteAdComponent,
|
||||
PopupAddOrUpdateAdComponent,
|
||||
PopupVisualizeAdComponent,
|
||||
BarTagsComponent,
|
||||
InputTagsComponent,
|
||||
PopupVisualizeImagesComponent,
|
||||
DragAndDropComponent,
|
||||
DragAndDropDirective,
|
||||
PageProfilUserComponent,
|
||||
NavbarUserComponent,
|
||||
NavbarAdvertiserComponent,
|
||||
NavbarAdminComponent,
|
||||
PageProfilAdvertiserComponent,
|
||||
PopupUpdateAdvertiserComponent,
|
||||
PopupUpdateUserComponent,
|
||||
NavbarBeforeConnexionComponent,
|
||||
InputInterestsComponent,
|
||||
],
|
||||
imports: [
|
||||
BrowserModule,
|
||||
|
|
@ -103,7 +120,8 @@ import { DragAndDropDirective } from './utils/directives/dragAndDrop/drag-and-dr
|
|||
ReactiveFormsModule,
|
||||
MatAutocompleteModule,
|
||||
MatSelectModule,
|
||||
IvyCarouselModule
|
||||
IvyCarouselModule,
|
||||
MatRadioModule
|
||||
],
|
||||
providers: [],
|
||||
bootstrap: [AppComponent]
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@
|
|||
<div class="bg">
|
||||
|
||||
|
||||
<app-nav-bar pour="login"></app-nav-bar>
|
||||
<app-navbar-before-connexion pour="login"></app-navbar-before-connexion>
|
||||
|
||||
|
||||
<div class="wrapper fadeInDown">
|
||||
|
|
@ -12,7 +12,7 @@
|
|||
<!-- Icon -->
|
||||
<div class="fadeIn first">
|
||||
<h1 style="font-family: cursive; font-size: 45px; margin-top: 60px; margin-bottom: 20px">StreamNotFound</h1>
|
||||
<img src="assets/logo.png" id="icon" alt="User Icon" style="margin-top: 20px"/>
|
||||
<img src="../../../../assets/logo.png" id="icon" alt="User Icon" style="margin-top: 20px"/>
|
||||
</div>
|
||||
|
||||
<!-- Login Form -->
|
||||
|
|
@ -1,20 +1,20 @@
|
|||
import { ComponentFixture, TestBed } from '@angular/core/testing';
|
||||
|
||||
import { PageConnexionComponent } from './page-connexion.component';
|
||||
import { PageLoginComponent } from './page-login.component';
|
||||
|
||||
describe('PageConnexionComponent', () => {
|
||||
let component: PageConnexionComponent;
|
||||
let fixture: ComponentFixture<PageConnexionComponent>;
|
||||
let component: PageLoginComponent;
|
||||
let fixture: ComponentFixture<PageLoginComponent>;
|
||||
|
||||
beforeEach(async () => {
|
||||
await TestBed.configureTestingModule({
|
||||
declarations: [ PageConnexionComponent ]
|
||||
declarations: [ PageLoginComponent ]
|
||||
})
|
||||
.compileComponents();
|
||||
});
|
||||
|
||||
beforeEach(() => {
|
||||
fixture = TestBed.createComponent(PageConnexionComponent);
|
||||
fixture = TestBed.createComponent(PageLoginComponent);
|
||||
component = fixture.componentInstance;
|
||||
fixture.detectChanges();
|
||||
});
|
||||
|
|
@ -1,16 +1,16 @@
|
|||
import {Component, OnInit} from '@angular/core';
|
||||
import {MessageService} from "../../utils/services/message/message.service";
|
||||
import {MessageService} from "../../../utils/services/message/message.service";
|
||||
import {Router} from "@angular/router";
|
||||
import {ThemeService} from "../../utils/services/theme/theme.service";
|
||||
import {ThemeService} from "../../../utils/services/theme/theme.service";
|
||||
|
||||
|
||||
|
||||
@Component({
|
||||
selector: 'app-page-connexion',
|
||||
templateUrl: './page-connexion.component.html',
|
||||
styleUrls: ['./page-connexion.component.scss']
|
||||
selector: 'app-page-login',
|
||||
templateUrl: './page-login.component.html',
|
||||
styleUrls: ['./page-login.component.scss']
|
||||
})
|
||||
export class PageConnexionComponent implements OnInit
|
||||
export class PageLoginComponent implements OnInit
|
||||
{
|
||||
pseudo: string = "" ;
|
||||
password: string = "" ;
|
||||
|
|
@ -0,0 +1,40 @@
|
|||
<!-- Login -->
|
||||
<div *ngIf="pour === 'login'">
|
||||
<nav class="navbar navbar-expand-lg">
|
||||
|
||||
<!-- PolyNotFound -->
|
||||
<a class="navbar-brand" routerLink=""> StreamNotFound </a>
|
||||
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNavDropdown" aria-controls="navbarNavDropdown" aria-expanded="false" aria-label="Toggle navigation">
|
||||
<span class="navbar-toggler-icon"></span>
|
||||
</button>
|
||||
|
||||
<!-- Rien -->
|
||||
<div class="collapse navbar-collapse"></div>
|
||||
|
||||
<!-- S'inscrire -->
|
||||
<button mat-button class="btnDeconnexion" routerLink="/register">
|
||||
S'inscrire
|
||||
</button>
|
||||
|
||||
</nav>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- --------------------------------------------------------------------------------------------------------- -->
|
||||
|
||||
|
||||
<!-- Register -->
|
||||
<div *ngIf="pour === 'register'">
|
||||
<nav class="navbar navbar-expand-lg">
|
||||
|
||||
<!-- PolyNotFound -->
|
||||
<a class="navbar-brand" routerLink=""> StreamNotFound </a>
|
||||
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNavDropdown" aria-controls="navbarNavDropdown" aria-expanded="false" aria-label="Toggle navigation">
|
||||
<span class="navbar-toggler-icon"></span>
|
||||
</button>
|
||||
|
||||
<!-- Rien -->
|
||||
<div class="collapse navbar-collapse"></div>
|
||||
|
||||
</nav>
|
||||
</div>
|
||||
|
|
@ -0,0 +1,80 @@
|
|||
.navbar {
|
||||
background-color: black;
|
||||
height: 75px;
|
||||
font-size: x-large;
|
||||
color: white;
|
||||
}
|
||||
|
||||
|
||||
.navbar-expand-lg {
|
||||
border-bottom: solid;
|
||||
border-color: white;
|
||||
border-bottom-width: 2px;
|
||||
}
|
||||
|
||||
|
||||
// PolyNotFound
|
||||
.navbar-brand {
|
||||
font-family: cursive;
|
||||
font-weight: bold;
|
||||
//font-style: oblique 90deg;
|
||||
font-size: xxx-large;
|
||||
margin-left: 30px;
|
||||
color: white;
|
||||
}
|
||||
|
||||
|
||||
// Recherche, Mes Playlists, Historique
|
||||
.nav-link {
|
||||
color: white;
|
||||
}
|
||||
.nav-link:hover {
|
||||
color: grey;
|
||||
}
|
||||
|
||||
|
||||
// Bonton deconnexion
|
||||
.btnDeconnexion {
|
||||
font-size: x-large;
|
||||
margin: 0px 10px 0px 10px
|
||||
}
|
||||
.btnDeconnexion:hover {
|
||||
color: grey;
|
||||
}
|
||||
|
||||
|
||||
.monLi {
|
||||
margin: 0px 10px 0px 10px;
|
||||
}
|
||||
|
||||
|
||||
img {
|
||||
border: solid 2px white;
|
||||
border-radius: 50px;
|
||||
margin: 0px 10px 0px 15px;
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
}
|
||||
img:hover {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
|
||||
// --------------------------------------------------------------------
|
||||
|
||||
|
||||
::ng-deep .mat-slide-toggle-thumb {
|
||||
background-color: #c8c8c8;
|
||||
}
|
||||
|
||||
::ng-deep .mat-slide-toggle-bar {
|
||||
background-color: #ffffff;
|
||||
}
|
||||
|
||||
::ng-deep .mat-slide-toggle.mat-checked:not(.mat-disabled) .mat-slide-toggle-thumb {
|
||||
background-color: #ffffff;
|
||||
}
|
||||
|
||||
::ng-deep .mat-slide-toggle.mat-checked:not(.mat-disabled) .mat-slide-toggle-bar {
|
||||
background-color: #646464;
|
||||
}
|
||||
|
|
@ -0,0 +1,25 @@
|
|||
import { ComponentFixture, TestBed } from '@angular/core/testing';
|
||||
|
||||
import { NavbarBeforeConnexionComponent } from './navbar-before-connexion.component';
|
||||
|
||||
describe('NavbarBeforeConnexionComponent', () => {
|
||||
let component: NavbarBeforeConnexionComponent;
|
||||
let fixture: ComponentFixture<NavbarBeforeConnexionComponent>;
|
||||
|
||||
beforeEach(async () => {
|
||||
await TestBed.configureTestingModule({
|
||||
declarations: [ NavbarBeforeConnexionComponent ]
|
||||
})
|
||||
.compileComponents();
|
||||
});
|
||||
|
||||
beforeEach(() => {
|
||||
fixture = TestBed.createComponent(NavbarBeforeConnexionComponent);
|
||||
component = fixture.componentInstance;
|
||||
fixture.detectChanges();
|
||||
});
|
||||
|
||||
it('should create', () => {
|
||||
expect(component).toBeTruthy();
|
||||
});
|
||||
});
|
||||
|
|
@ -0,0 +1,12 @@
|
|||
import {Component, Input} from '@angular/core';
|
||||
|
||||
|
||||
@Component({
|
||||
selector: 'app-navbar-before-connexion',
|
||||
templateUrl: './navbar-before-connexion.component.html',
|
||||
styleUrls: ['./navbar-before-connexion.component.scss']
|
||||
})
|
||||
export class NavbarBeforeConnexionComponent
|
||||
{
|
||||
@Input() pour = "login";
|
||||
}
|
||||
|
|
@ -3,7 +3,6 @@
|
|||
<div class="bg">
|
||||
|
||||
|
||||
<app-nav-bar pour="register"></app-nav-bar>
|
||||
|
||||
|
||||
<div class="wrapper">
|
||||
|
|
@ -11,7 +10,7 @@
|
|||
|
||||
<!-- Icon -->
|
||||
<div style="margin: 10px 0px 20px 0px">
|
||||
<img src="assets/logo.png" id="icon" alt="User Icon" style="margin-top: 20px"/>
|
||||
<img src="../../../../assets/logo.png" id="icon" alt="User Icon" style="margin-top: 20px"/>
|
||||
</div>
|
||||
|
||||
<!-- Login Form -->
|
||||
|
|
@ -2,7 +2,7 @@
|
|||
<div class="myContainer">
|
||||
|
||||
|
||||
<app-nav-bar pour="user"></app-nav-bar><br><br>
|
||||
<app-navbar-user></app-navbar-user><br><br>
|
||||
|
||||
<!-- ---------------------------------------------------------------------------------- -->
|
||||
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@
|
|||
|
||||
<!-- Navbar -->
|
||||
<div style="margin-bottom: 50px">
|
||||
<app-nav-bar pour="user"></app-nav-bar>
|
||||
<app-navbar-user></app-navbar-user>
|
||||
</div>
|
||||
|
||||
<!-- --------------------------------------------------------------------- -->
|
||||
|
|
|
|||
|
|
@ -0,0 +1,43 @@
|
|||
<mat-form-field class="example-chip-list" appearance="fill">
|
||||
|
||||
<!-- ------------------------------------------------------------------------------------ -->
|
||||
|
||||
<mat-label>Tags</mat-label>
|
||||
|
||||
<!-- ------------------------------------------------------------------------------------ -->
|
||||
|
||||
<mat-chip-list #chipList aria-label="Fruit selection">
|
||||
|
||||
<mat-chip
|
||||
*ngFor="let interest of myInterests"
|
||||
[selectable]="selectable"
|
||||
[removable]="removable"
|
||||
(removed)="remove(interest)">
|
||||
{{interest}}
|
||||
<button matChipRemove *ngIf="removable">
|
||||
<mat-icon>cancel</mat-icon>
|
||||
</button>
|
||||
</mat-chip>
|
||||
|
||||
<input
|
||||
placeholder="Tapez un tag et pressez 'Entré' pour l'inserer"
|
||||
#tagInput
|
||||
[formControl]="formControl"
|
||||
[matAutocomplete]="auto"
|
||||
[matChipInputFor]="chipList"
|
||||
[matChipInputSeparatorKeyCodes]="separatorKeysCodes"
|
||||
(matChipInputTokenEnd)="add($event)">
|
||||
|
||||
</mat-chip-list>
|
||||
|
||||
<!-- ------------------------------------------------------------------------------------ -->
|
||||
|
||||
<mat-autocomplete #auto="matAutocomplete" (optionSelected)="selected($event)">
|
||||
<mat-option *ngFor="let interest of filteredInterests | async" [value]="interest">
|
||||
{{interest}}
|
||||
</mat-option>
|
||||
</mat-autocomplete>
|
||||
|
||||
<!-- ------------------------------------------------------------------------------------ -->
|
||||
|
||||
</mat-form-field>
|
||||
|
|
@ -0,0 +1,3 @@
|
|||
mat-form-field {
|
||||
width: 100%;
|
||||
}
|
||||
|
|
@ -0,0 +1,25 @@
|
|||
import { ComponentFixture, TestBed } from '@angular/core/testing';
|
||||
|
||||
import { InputInterestsComponent } from './input-interests.component';
|
||||
|
||||
describe('InputInterestsComponent', () => {
|
||||
let component: InputInterestsComponent;
|
||||
let fixture: ComponentFixture<InputInterestsComponent>;
|
||||
|
||||
beforeEach(async () => {
|
||||
await TestBed.configureTestingModule({
|
||||
declarations: [ InputInterestsComponent ]
|
||||
})
|
||||
.compileComponents();
|
||||
});
|
||||
|
||||
beforeEach(() => {
|
||||
fixture = TestBed.createComponent(InputInterestsComponent);
|
||||
component = fixture.componentInstance;
|
||||
fixture.detectChanges();
|
||||
});
|
||||
|
||||
it('should create', () => {
|
||||
expect(component).toBeTruthy();
|
||||
});
|
||||
});
|
||||
|
|
@ -0,0 +1,82 @@
|
|||
import {Component, ElementRef, EventEmitter, Input, OnInit, Output, ViewChild} from '@angular/core';
|
||||
import {COMMA, ENTER} from "@angular/cdk/keycodes";
|
||||
import {FormControl} from "@angular/forms";
|
||||
import {Observable} from "rxjs";
|
||||
import {FictitiousDatasService} from "../../../utils/services/fictitiousDatas/fictitious-datas.service";
|
||||
import {MessageService} from "../../../utils/services/message/message.service";
|
||||
import {map, startWith} from "rxjs/operators";
|
||||
import {MatChipInputEvent} from "@angular/material/chips";
|
||||
import {MatAutocompleteSelectedEvent} from "@angular/material/autocomplete";
|
||||
|
||||
|
||||
@Component({
|
||||
selector: 'app-input-interests',
|
||||
templateUrl: './input-interests.component.html',
|
||||
styleUrls: ['./input-interests.component.scss']
|
||||
})
|
||||
export class InputInterestsComponent implements OnInit
|
||||
{
|
||||
selectable = true;
|
||||
removable = true;
|
||||
separatorKeysCodes: number[] = [ENTER, COMMA];
|
||||
formControl = new FormControl();
|
||||
filteredInterests: Observable<string[]>;
|
||||
@Input() myInterests: string[] = [];
|
||||
allInterests: string[] = [];
|
||||
@Output() eventEmitter = new EventEmitter<string[]>();
|
||||
@ViewChild('tagInput') tagInput: ElementRef<HTMLInputElement>;
|
||||
|
||||
|
||||
constructor( private fictitiousDatasService: FictitiousDatasService,
|
||||
private messageService: MessageService ) {}
|
||||
|
||||
|
||||
ngOnInit(): void
|
||||
{
|
||||
this.filteredInterests = this.formControl.valueChanges.pipe(
|
||||
startWith(null),
|
||||
map((fruit: string | null) => fruit ? this._filter(fruit) : this.allInterests.slice()));
|
||||
|
||||
// --- FAUX CODE ---
|
||||
this.allInterests = this.fictitiousDatasService.getTags();
|
||||
this.allInterests.sort();
|
||||
}
|
||||
|
||||
|
||||
add(event: MatChipInputEvent): void
|
||||
{
|
||||
const value = (event.value || '').trim();
|
||||
if (value && (this.allInterests.indexOf(value) !== -1))
|
||||
{
|
||||
this.myInterests.push(value);
|
||||
event.chipInput!.clear();
|
||||
this.formControl.setValue(null);
|
||||
this.eventEmitter.emit(this.myInterests);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
remove(tag: string): void
|
||||
{
|
||||
const index = this.myInterests.indexOf(tag);
|
||||
if (index >= 0) this.myInterests.splice(index, 1);
|
||||
this.eventEmitter.emit(this.myInterests);
|
||||
}
|
||||
|
||||
|
||||
selected(event: MatAutocompleteSelectedEvent): void
|
||||
{
|
||||
this.myInterests.push(event.option.viewValue);
|
||||
this.tagInput.nativeElement.value = '';
|
||||
this.formControl.setValue(null);
|
||||
this.eventEmitter.emit(this.myInterests);
|
||||
}
|
||||
|
||||
|
||||
private _filter(value: string): string[]
|
||||
{
|
||||
const filterValue = value.toLowerCase();
|
||||
return this.allInterests.filter(fruit => fruit.toLowerCase().includes(filterValue));
|
||||
}
|
||||
|
||||
}
|
||||
|
|
@ -0,0 +1,70 @@
|
|||
<div [class]="themeService.getClassTheme()">
|
||||
<div class="myContainer">
|
||||
|
||||
<!-- NavBar -->
|
||||
<app-navbar-user></app-navbar-user>
|
||||
|
||||
<!-- Boite -->
|
||||
<div class="boite">
|
||||
|
||||
<!-- Photo de profil -->
|
||||
<div style="text-align: center">
|
||||
<img [src]="user.profilePictureUrl"
|
||||
onerror="this.onerror=null; this.src='assets/profil.png'">
|
||||
</div>
|
||||
|
||||
<!-- login -->
|
||||
<div class="row myRow">
|
||||
<div class="col-6 myLabel">Login:</div>
|
||||
<div class="col-6 myValue"> {{user.login}} </div>
|
||||
</div>
|
||||
|
||||
<!-- mail -->
|
||||
<div class="row myRow">
|
||||
<div class="col-6 myLabel">Mail:</div>
|
||||
<div class="col-6 myValue"> {{user.mail}} </div>
|
||||
</div>
|
||||
|
||||
<!-- dateOfBirth -->
|
||||
<div class="row myRow">
|
||||
<div class="col-6 myLabel">Date de naissance:</div>
|
||||
<div class="col-6 myValue">
|
||||
{{ user.dateOfBirth | date:'dd/LL/YYYY' }}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- gender -->
|
||||
<div class="row myRow">
|
||||
<div class="col-6 myLabel">Sexe:</div>
|
||||
<div class="col-6 myValue">
|
||||
<span *ngIf="user.gender==='man'"> Homme </span>
|
||||
<span *ngIf="user.gender==='woman'"> Femme </span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- interets -->
|
||||
<div class="row myRow">
|
||||
<div class="col-6 myLabel">Centres d'intérêt:</div>
|
||||
<div class="col-6 myValue" style="border-left: solid 1px #e6e6e6">
|
||||
<div *ngFor="let interest of user.interests">• {{interest}}</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- createdAt -->
|
||||
<div class="row myRow">
|
||||
<div class="col-6 myLabel">Date de création:</div>
|
||||
<div class="col-6 myValue">
|
||||
{{ user.createdAt | date:'dd/LL/YYYY à HH:mm:ss' }}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Modifier profil -->
|
||||
<div class="btnContainer">
|
||||
<button mat-button class="myBtn" (click)="onModifier()">Modifier profil</button>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -0,0 +1,61 @@
|
|||
.myContainer {
|
||||
max-width: 100vw;
|
||||
height: 100vh;
|
||||
overflow-x: hidden;
|
||||
}
|
||||
|
||||
|
||||
.boite {
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
width: 25%;
|
||||
margin-top: 10vh;
|
||||
border: solid 3px;
|
||||
border-radius: 10px;
|
||||
padding: 20px 40px 20px 40px;
|
||||
background-color: #ffffff;
|
||||
text-align: center;
|
||||
box-shadow: 10px 5px 5px black;
|
||||
}
|
||||
.lightTheme .boite {
|
||||
border-color: black;
|
||||
}
|
||||
.darkTheme .boite {
|
||||
border-color: white;
|
||||
}
|
||||
|
||||
|
||||
img {
|
||||
margin: 0px 0px 10px 0px;
|
||||
width: 5vw;
|
||||
height: 5vw;
|
||||
border: solid 2px black;
|
||||
border-radius: 50%;
|
||||
font-size: xxx-large;
|
||||
}
|
||||
|
||||
|
||||
.myRow {
|
||||
margin: 15px 0px 15px 0px;
|
||||
}
|
||||
.myLabel {
|
||||
text-align: right;
|
||||
padding: 0px 5px 0px 0px;
|
||||
margin: 0px;
|
||||
font-weight: bold;
|
||||
}
|
||||
.myValue {
|
||||
text-align: left;
|
||||
padding: 0px 0px 0px 5px;
|
||||
margin: 0px;
|
||||
}
|
||||
|
||||
|
||||
.btnContainer {
|
||||
text-align: center;
|
||||
margin-top: 40px;
|
||||
}
|
||||
.myBtn {
|
||||
border: solid 1px black;
|
||||
background-color: white;
|
||||
}
|
||||
|
|
@ -0,0 +1,25 @@
|
|||
import { ComponentFixture, TestBed } from '@angular/core/testing';
|
||||
|
||||
import { PageProfilUserComponent } from './page-profil-user.component';
|
||||
|
||||
describe('PageProfilUserComponent', () => {
|
||||
let component: PageProfilUserComponent;
|
||||
let fixture: ComponentFixture<PageProfilUserComponent>;
|
||||
|
||||
beforeEach(async () => {
|
||||
await TestBed.configureTestingModule({
|
||||
declarations: [ PageProfilUserComponent ]
|
||||
})
|
||||
.compileComponents();
|
||||
});
|
||||
|
||||
beforeEach(() => {
|
||||
fixture = TestBed.createComponent(PageProfilUserComponent);
|
||||
component = fixture.componentInstance;
|
||||
fixture.detectChanges();
|
||||
});
|
||||
|
||||
it('should create', () => {
|
||||
expect(component).toBeTruthy();
|
||||
});
|
||||
});
|
||||
|
|
@ -0,0 +1,53 @@
|
|||
import { Component, OnInit } from '@angular/core';
|
||||
import {ThemeService} from "../../../utils/services/theme/theme.service";
|
||||
import {FictitiousDatasService} from "../../../utils/services/fictitiousDatas/fictitious-datas.service";
|
||||
import {User} from "../../../utils/interfaces/user";
|
||||
import {MatDialog} from "@angular/material/dialog";
|
||||
import {PopupUpdateUserComponent} from "../popup-update-user/popup-update-user.component";
|
||||
import {MatSnackBar} from "@angular/material/snack-bar";
|
||||
|
||||
@Component({
|
||||
selector: 'app-page-profil-user',
|
||||
templateUrl: './page-profil-user.component.html',
|
||||
styleUrls: ['./page-profil-user.component.scss']
|
||||
})
|
||||
export class PageProfilUserComponent implements OnInit
|
||||
{
|
||||
user: User;
|
||||
|
||||
|
||||
constructor( public themeService: ThemeService,
|
||||
private fictitiousDatasService: FictitiousDatasService,
|
||||
public dialog: MatDialog,
|
||||
private snackBar: MatSnackBar ) { }
|
||||
|
||||
|
||||
ngOnInit(): void
|
||||
{
|
||||
this.user = this.fictitiousDatasService.getUser();
|
||||
}
|
||||
|
||||
|
||||
onModifier()
|
||||
{
|
||||
const config = {
|
||||
width: '25%',
|
||||
data: { user: this.user }
|
||||
};
|
||||
this.dialog
|
||||
.open(PopupUpdateUserComponent, config)
|
||||
.afterClosed()
|
||||
.subscribe(retour => {
|
||||
|
||||
if((retour === null) || (retour === undefined))
|
||||
{
|
||||
const config = { duration: 1000, panelClass: "custom-class" };
|
||||
this.snackBar.open( "Opération annulé", "", config);
|
||||
}
|
||||
else
|
||||
{
|
||||
this.user = retour;
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,81 @@
|
|||
<div class="myContainer">
|
||||
|
||||
|
||||
<div class="boite">
|
||||
|
||||
<!-- profil login mail dateOfBirth gender interets -->
|
||||
|
||||
<!-- photo de profil -->
|
||||
<div style="text-align: center">
|
||||
<img [src]="userCopy.profilePictureUrl"
|
||||
onerror="this.onerror=null; this.src='assets/profil.png'">
|
||||
<br>
|
||||
<input matInput type="text" [(ngModel)]="userCopy.profilePictureUrl">
|
||||
</div>
|
||||
<br>
|
||||
|
||||
<!-- login -->
|
||||
<mat-form-field appearance="fill">
|
||||
<mat-label>Pseudo</mat-label>
|
||||
<input matInput type="text" [(ngModel)]="userCopy.login">
|
||||
</mat-form-field>
|
||||
<br>
|
||||
|
||||
<!-- email -->
|
||||
<mat-form-field appearance="fill">
|
||||
<mat-label>Email</mat-label>
|
||||
<input matInput type="text" [(ngModel)]="userCopy.mail">
|
||||
</mat-form-field>
|
||||
<br>
|
||||
|
||||
<!-- dateOfBirth -->
|
||||
<mat-form-field appearance="fill">
|
||||
<mat-label>Date de naissance</mat-label>
|
||||
<input matInput type="date" [(ngModel)]="userCopy.mail">
|
||||
</mat-form-field>
|
||||
<br>
|
||||
|
||||
<!-- gender -->
|
||||
<mat-radio-group [(ngModel)]="userCopy.gender">
|
||||
<mat-radio-button value="man"> Homme </mat-radio-button>
|
||||
<mat-radio-button value="woman"> Femme </mat-radio-button>
|
||||
</mat-radio-group>
|
||||
|
||||
|
||||
<!-- interets -->
|
||||
<app-input-interests [myInterests]="userCopy.interests" (eventEmitter)="onEventInputInterests($event)"></app-input-interests>
|
||||
|
||||
|
||||
<!-- Modifier mot de passe -->
|
||||
Modifier mot de passe:
|
||||
<mat-checkbox [(ngModel)]="changePassword"></mat-checkbox>
|
||||
<br>
|
||||
|
||||
<!-- Nouveau mot de passe -->
|
||||
<div *ngIf="changePassword">
|
||||
<!-- Nouveau mot de passe -->
|
||||
<mat-form-field appearance="fill">
|
||||
<mat-label>Nouveau mot de passe</mat-label>
|
||||
<input matInput type="password" [(ngModel)]="newPassword">
|
||||
</mat-form-field>
|
||||
<br>
|
||||
<!-- Confirmation npuveau mot de passe -->
|
||||
<mat-form-field appearance="fill">
|
||||
<mat-label>Confirmation nouveau mot de passe</mat-label>
|
||||
<input matInput type="password" [(ngModel)]="confirmNewPassword">
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<br>
|
||||
|
||||
<!-- Bouton valider -->
|
||||
<div style="width: 100%; text-align: center">
|
||||
<button mat-button (click)="onValider()"> Enregistrer </button>
|
||||
</div>
|
||||
|
||||
<!-- Message d'erreur -->
|
||||
<div *ngIf="hasError" style="text-align: center; margin-top: 10px;">
|
||||
<span class="mat-error"> {{errorMessage}} </span>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -0,0 +1,8 @@
|
|||
img {
|
||||
margin: 0px 0px 10px 0px;
|
||||
width: 5vw;
|
||||
height: 5vw;
|
||||
border: solid 2px black;
|
||||
border-radius: 50%;
|
||||
font-size: xxx-large;
|
||||
}
|
||||
|
|
@ -0,0 +1,25 @@
|
|||
import { ComponentFixture, TestBed } from '@angular/core/testing';
|
||||
|
||||
import { PopupUpdateUserComponent } from './popup-update-user.component';
|
||||
|
||||
describe('PopupUpdateUserComponent', () => {
|
||||
let component: PopupUpdateUserComponent;
|
||||
let fixture: ComponentFixture<PopupUpdateUserComponent>;
|
||||
|
||||
beforeEach(async () => {
|
||||
await TestBed.configureTestingModule({
|
||||
declarations: [ PopupUpdateUserComponent ]
|
||||
})
|
||||
.compileComponents();
|
||||
});
|
||||
|
||||
beforeEach(() => {
|
||||
fixture = TestBed.createComponent(PopupUpdateUserComponent);
|
||||
component = fixture.componentInstance;
|
||||
fixture.detectChanges();
|
||||
});
|
||||
|
||||
it('should create', () => {
|
||||
expect(component).toBeTruthy();
|
||||
});
|
||||
});
|
||||
|
|
@ -0,0 +1,106 @@
|
|||
import {Component, Inject, OnInit} from '@angular/core';
|
||||
import {MAT_DIALOG_DATA, MatDialogRef} from "@angular/material/dialog";
|
||||
import {User} from "../../../utils/interfaces/user";
|
||||
|
||||
|
||||
|
||||
@Component({
|
||||
selector: 'app-popup-update-user',
|
||||
templateUrl: './popup-update-user.component.html',
|
||||
styleUrls: ['./popup-update-user.component.scss']
|
||||
})
|
||||
export class PopupUpdateUserComponent implements OnInit
|
||||
{
|
||||
userCopy: User;
|
||||
newPassword: string;
|
||||
confirmNewPassword: string = "" ;
|
||||
changePassword: boolean = false ;
|
||||
hasError: boolean = false;
|
||||
errorMessage: string = "" ;
|
||||
|
||||
|
||||
constructor( public dialogRef: MatDialogRef<PopupUpdateUserComponent>,
|
||||
@Inject(MAT_DIALOG_DATA) public data) { }
|
||||
|
||||
|
||||
ngOnInit(): void
|
||||
{
|
||||
const user0 = this.data.user;
|
||||
this.userCopy = {
|
||||
_id: user0._id,
|
||||
login: user0.login,
|
||||
hashPass: user0.hashPass,
|
||||
mail: user0.mail,
|
||||
role: {
|
||||
name: user0.role.name,
|
||||
permission: user0.role.permission,
|
||||
},
|
||||
profilePictureUrl: user0.profilePictureUrl,
|
||||
dateOfBirth: user0.dateOfBirth,
|
||||
gender: user0.gender,
|
||||
interests: [],
|
||||
isActive: user0.isActive,
|
||||
createdAt: user0.createdAt,
|
||||
updatedAt: user0.updatedAt,
|
||||
};
|
||||
for(let interest of user0.interests) this.userCopy.interests.push(interest);
|
||||
}
|
||||
|
||||
|
||||
onValider()
|
||||
{
|
||||
this.checkField();
|
||||
if(!this.hasError)
|
||||
{
|
||||
const retour = {
|
||||
user: this.userCopy,
|
||||
newPassword: this.newPassword
|
||||
};
|
||||
this.dialogRef.close(retour);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
checkField()
|
||||
{
|
||||
if(this.userCopy.login.length === 0) {
|
||||
this.errorMessage = "Veuillez remplir le champ 'login'" ;
|
||||
this.hasError = true;
|
||||
}
|
||||
else if(this.userCopy.mail.length === 0) {
|
||||
this.errorMessage = "Veuillez remplir le champ 'email'" ;
|
||||
this.hasError = true;
|
||||
}
|
||||
else if(!this.isValidEmail(this.userCopy.mail)) {
|
||||
this.errorMessage = "Email invalide" ;
|
||||
this.hasError = true;
|
||||
}
|
||||
else if(this.changePassword) {
|
||||
if (this.newPassword.length === 0) {
|
||||
this.errorMessage = "Veuillez remplir le champ 'mot de passe'" ;
|
||||
this.hasError = true;
|
||||
} else if (this.newPassword !== this.confirmNewPassword) {
|
||||
this.errorMessage = "Le mot de passe est différent de sa confirmation" ;
|
||||
this.hasError = true;
|
||||
}
|
||||
}
|
||||
else {
|
||||
this.errorMessage = "" ;
|
||||
this.hasError = false;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
isValidEmail(email)
|
||||
{
|
||||
let re = /^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
|
||||
return re.test(email);
|
||||
}
|
||||
|
||||
|
||||
onEventInputInterests(myInterets: string[])
|
||||
{
|
||||
this.userCopy.interests = myInterets;
|
||||
}
|
||||
|
||||
}
|
||||
35
src/app/user/navbar-user/navbar-user.component.html
Normal file
35
src/app/user/navbar-user/navbar-user.component.html
Normal file
|
|
@ -0,0 +1,35 @@
|
|||
<nav class="navbar navbar-expand-lg">
|
||||
|
||||
<!-- PolyNotFound -->
|
||||
<a class="navbar-brand" routerLink="/user/search"> StreamNotFound </a>
|
||||
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNavDropdown" aria-controls="navbarNavDropdown" aria-expanded="false" aria-label="Toggle navigation">
|
||||
<span class="navbar-toggler-icon"></span>
|
||||
</button>
|
||||
|
||||
<!-- [Recherche] [Mes Playlists] [Historique] -->
|
||||
<div class="collapse navbar-collapse">
|
||||
<ul class="navbar-nav">
|
||||
<li class="nav-item active monLi">
|
||||
<a class="nav-link" routerLink="/user/search"> Rechercher </a>
|
||||
</li>
|
||||
<li class="nav-item active monLi">
|
||||
<a class="nav-link" routerLink="/user/myPlaylists"> Mes playlists </a>
|
||||
</li>
|
||||
<li class="nav-item active monLi">
|
||||
<a class="nav-link" routerLink="/user/history"> Historique </a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<!-- Mon profil -->
|
||||
<img [src]=urlImage
|
||||
onerror="this.onerror=null; this.src='assets/profil.png'"
|
||||
routerLink="/user/myProfil"
|
||||
alt="">
|
||||
|
||||
<!-- Deconnexion -->
|
||||
<button mat-button class="btnDeconnexion" (click)="onDeconnexion()" routerLink="/">
|
||||
Deconnexion
|
||||
</button>
|
||||
|
||||
</nav>
|
||||
80
src/app/user/navbar-user/navbar-user.component.scss
Normal file
80
src/app/user/navbar-user/navbar-user.component.scss
Normal file
|
|
@ -0,0 +1,80 @@
|
|||
.navbar {
|
||||
background-color: black;
|
||||
height: 75px;
|
||||
font-size: x-large;
|
||||
color: white;
|
||||
}
|
||||
|
||||
|
||||
.navbar-expand-lg {
|
||||
border-bottom: solid;
|
||||
border-color: white;
|
||||
border-bottom-width: 2px;
|
||||
}
|
||||
|
||||
|
||||
// PolyNotFound
|
||||
.navbar-brand {
|
||||
font-family: cursive;
|
||||
font-weight: bold;
|
||||
//font-style: oblique 90deg;
|
||||
font-size: xxx-large;
|
||||
margin-left: 30px;
|
||||
color: white;
|
||||
}
|
||||
|
||||
|
||||
// Recherche, Mes Playlists, Historique
|
||||
.nav-link {
|
||||
color: white;
|
||||
}
|
||||
.nav-link:hover {
|
||||
color: grey;
|
||||
}
|
||||
|
||||
|
||||
// Bonton deconnexion
|
||||
.btnDeconnexion {
|
||||
font-size: x-large;
|
||||
margin: 0px 10px 0px 10px
|
||||
}
|
||||
.btnDeconnexion:hover {
|
||||
color: grey;
|
||||
}
|
||||
|
||||
|
||||
.monLi {
|
||||
margin: 0px 10px 0px 10px;
|
||||
}
|
||||
|
||||
|
||||
img {
|
||||
border: solid 2px white;
|
||||
border-radius: 50px;
|
||||
margin: 0px 10px 0px 15px;
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
}
|
||||
img:hover {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
|
||||
// --------------------------------------------------------------------
|
||||
|
||||
|
||||
::ng-deep .mat-slide-toggle-thumb {
|
||||
background-color: #c8c8c8;
|
||||
}
|
||||
|
||||
::ng-deep .mat-slide-toggle-bar {
|
||||
background-color: #ffffff;
|
||||
}
|
||||
|
||||
::ng-deep .mat-slide-toggle.mat-checked:not(.mat-disabled) .mat-slide-toggle-thumb {
|
||||
background-color: #ffffff;
|
||||
}
|
||||
|
||||
::ng-deep .mat-slide-toggle.mat-checked:not(.mat-disabled) .mat-slide-toggle-bar {
|
||||
background-color: #646464;
|
||||
}
|
||||
|
|
@ -1,20 +1,20 @@
|
|||
import { ComponentFixture, TestBed } from '@angular/core/testing';
|
||||
|
||||
import { NavBarComponent } from './nav-bar.component';
|
||||
import { NavbarUserComponent } from './navbar-user.component';
|
||||
|
||||
describe('NavBarComponent', () => {
|
||||
let component: NavBarComponent;
|
||||
let fixture: ComponentFixture<NavBarComponent>;
|
||||
describe('NavbarUserComponent', () => {
|
||||
let component: NavbarUserComponent;
|
||||
let fixture: ComponentFixture<NavbarUserComponent>;
|
||||
|
||||
beforeEach(async () => {
|
||||
await TestBed.configureTestingModule({
|
||||
declarations: [ NavBarComponent ]
|
||||
declarations: [ NavbarUserComponent ]
|
||||
})
|
||||
.compileComponents();
|
||||
});
|
||||
|
||||
beforeEach(() => {
|
||||
fixture = TestBed.createComponent(NavBarComponent);
|
||||
fixture = TestBed.createComponent(NavbarUserComponent);
|
||||
component = fixture.componentInstance;
|
||||
fixture.detectChanges();
|
||||
});
|
||||
35
src/app/user/navbar-user/navbar-user.component.ts
Normal file
35
src/app/user/navbar-user/navbar-user.component.ts
Normal file
|
|
@ -0,0 +1,35 @@
|
|||
import {Component, OnInit} from '@angular/core';
|
||||
import {ThemeService} from "../../utils/services/theme/theme.service";
|
||||
import {Router} from "@angular/router";
|
||||
|
||||
@Component({
|
||||
selector: 'app-navbar-user',
|
||||
templateUrl: './navbar-user.component.html',
|
||||
styleUrls: ['./navbar-user.component.scss']
|
||||
})
|
||||
export class NavbarUserComponent implements OnInit
|
||||
{
|
||||
urlImage: string = "" ;
|
||||
|
||||
constructor( public themeService: ThemeService,
|
||||
private router: Router) { }
|
||||
|
||||
|
||||
ngOnInit(): void
|
||||
{
|
||||
if(this.router.url.startsWith("/user")) {
|
||||
this.urlImage = "https://www.figurines-goodies.com/1185-thickbox_default/huey-duck-tales-disney-funko-pop.jpg";
|
||||
}
|
||||
else if(this.router.url.startsWith("/advertiser")) {
|
||||
this.urlImage = "https://www.figurines-goodies.com/1188-large_default/dewey-duck-tales-disney-funko-pop.jpg" ;
|
||||
}
|
||||
else if(this.router.url.startsWith("/admin")) {
|
||||
this.urlImage = "https://www.reference-gaming.com/assets/media/product/41195/figurine-pop-duck-tales-n-309-loulou.jpg?format=product-cover-large&k=1519639530" ;
|
||||
}
|
||||
}
|
||||
|
||||
onDeconnexion(): void {
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
|
@ -3,7 +3,7 @@
|
|||
|
||||
<!-- Navbar -->
|
||||
<div style="margin-bottom: 50px">
|
||||
<app-nav-bar pour="user"></app-nav-bar>
|
||||
<app-navbar-user></app-navbar-user>
|
||||
</div>
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -1,7 +1,6 @@
|
|||
<div [class]="themeService.getClassTheme()">
|
||||
<div class="myContainer">
|
||||
|
||||
<app-nav-bar [pour]="forNavbar"></app-nav-bar><br><br>
|
||||
|
||||
<div class="boite">
|
||||
|
||||
|
|
|
|||
|
|
@ -1,178 +0,0 @@
|
|||
<!-- --------------------------------------------------------------------------------------------------------- -->
|
||||
|
||||
|
||||
<!-- Login -->
|
||||
<div *ngIf="pour === 'login'">
|
||||
<nav class="navbar navbar-expand-lg">
|
||||
|
||||
<!-- PolyNotFound -->
|
||||
<a class="navbar-brand" routerLink=""> StreamNotFound </a>
|
||||
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNavDropdown" aria-controls="navbarNavDropdown" aria-expanded="false" aria-label="Toggle navigation">
|
||||
<span class="navbar-toggler-icon"></span>
|
||||
</button>
|
||||
|
||||
<!-- Rien -->
|
||||
<div class="collapse navbar-collapse"></div>
|
||||
|
||||
<!-- Slide -->
|
||||
<mat-slide-toggle (click)="onClick()" style="font-size: x-large; margin: 0px 50px 0px 10px;"></mat-slide-toggle>
|
||||
|
||||
<!-- S'inscrire -->
|
||||
<button mat-button class="btnDeconnexion" routerLink="/register">
|
||||
S'inscrire
|
||||
</button>
|
||||
|
||||
</nav>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- --------------------------------------------------------------------------------------------------------- -->
|
||||
|
||||
|
||||
<!-- Register -->
|
||||
<div *ngIf="pour === 'register'">
|
||||
<nav class="navbar navbar-expand-lg">
|
||||
|
||||
<!-- PolyNotFound -->
|
||||
<a class="navbar-brand" routerLink=""> StreamNotFound </a>
|
||||
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNavDropdown" aria-controls="navbarNavDropdown" aria-expanded="false" aria-label="Toggle navigation">
|
||||
<span class="navbar-toggler-icon"></span>
|
||||
</button>
|
||||
|
||||
<!-- Rien -->
|
||||
<div class="collapse navbar-collapse"></div>
|
||||
|
||||
<!-- Slide -->
|
||||
<mat-slide-toggle (click)="onClick()" style="font-size: x-large; margin: 0px 50px 0px 10px;"></mat-slide-toggle>
|
||||
|
||||
</nav>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- --------------------------------------------------------------------------------------------------------- -->
|
||||
|
||||
|
||||
<!-- User -->
|
||||
<div *ngIf="pour === 'user'">
|
||||
<nav class="navbar navbar-expand-lg">
|
||||
|
||||
<!-- PolyNotFound -->
|
||||
<a class="navbar-brand" routerLink="/user/search"> StreamNotFound </a>
|
||||
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNavDropdown" aria-controls="navbarNavDropdown" aria-expanded="false" aria-label="Toggle navigation">
|
||||
<span class="navbar-toggler-icon"></span>
|
||||
</button>
|
||||
|
||||
<!-- [Recherche] [Mes Playlists] [Historique] -->
|
||||
<div class="collapse navbar-collapse">
|
||||
<ul class="navbar-nav">
|
||||
<li class="nav-item active monLi">
|
||||
<a class="nav-link" routerLink="/user/search"> Rechercher </a>
|
||||
</li>
|
||||
<li class="nav-item active monLi">
|
||||
<a class="nav-link" routerLink="/user/myPlaylists"> Mes playlists </a>
|
||||
</li>
|
||||
<li class="nav-item active monLi">
|
||||
<a class="nav-link" routerLink="/user/history"> Historique </a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<!-- Slide -->
|
||||
<mat-slide-toggle (click)="onClick()" style="font-size: x-large; margin: 0px 10px 0px 10px;"></mat-slide-toggle>
|
||||
|
||||
<!-- Mon profil -->
|
||||
<img [src]=urlImage
|
||||
onerror="this.onerror=null; this.src='assets/profil.png'"
|
||||
routerLink="/user/myProfil"
|
||||
alt="">
|
||||
|
||||
<!-- Deconnexion -->
|
||||
<button mat-button class="btnDeconnexion" (click)="onDeconnexion()" routerLink="/">
|
||||
Deconnexion
|
||||
</button>
|
||||
|
||||
</nav>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- --------------------------------------------------------------------------------------------------------- -->
|
||||
|
||||
|
||||
<!-- Advertiser -->
|
||||
<div *ngIf="pour === 'advertiser'">
|
||||
<nav class="navbar navbar-expand-lg">
|
||||
|
||||
<!-- PolyNotFound -->
|
||||
<a class="navbar-brand" routerLink="/advertiser"> StreamNotFound </a>
|
||||
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNavDropdown" aria-controls="navbarNavDropdown" aria-expanded="false" aria-label="Toggle navigation">
|
||||
<span class="navbar-toggler-icon"></span>
|
||||
</button>
|
||||
|
||||
<!-- Vide -->
|
||||
<div class="collapse navbar-collapse"></div>
|
||||
|
||||
<!-- Slide -->
|
||||
<mat-slide-toggle (click)="onClick()" style="font-size: x-large; margin: 0px 10px 0px 10px;"></mat-slide-toggle>
|
||||
|
||||
<!-- Mon profil -->
|
||||
<img [src]=urlImage
|
||||
onerror="this.onerror=null; this.src='assets/profil.png'"
|
||||
routerLink="/advertiser/myProfil"
|
||||
alt="">
|
||||
|
||||
<!-- Deconnexion -->
|
||||
<button mat-button class="btnDeconnexion" (click)="onDeconnexion()" routerLink="/">
|
||||
Deconnexion
|
||||
</button>
|
||||
|
||||
</nav>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- --------------------------------------------------------------------------------------------------------- -->
|
||||
|
||||
|
||||
<!-- Admin -->
|
||||
<div *ngIf="pour === 'admin'">
|
||||
<nav class="navbar navbar-expand-lg">
|
||||
|
||||
<!-- PolyNotFound -->
|
||||
<a class="navbar-brand" routerLink="/admin/userList"> StreamNotFound </a>
|
||||
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNavDropdown" aria-controls="navbarNavDropdown" aria-expanded="false" aria-label="Toggle navigation">
|
||||
<span class="navbar-toggler-icon"></span>
|
||||
</button>
|
||||
|
||||
<!-- [Recherche] [Mes Playlists] [Historique] -->
|
||||
<div class="collapse navbar-collapse">
|
||||
<ul class="navbar-nav">
|
||||
<li class="nav-item active monLi">
|
||||
<a class="nav-link" routerLink="/admin/userList"> Liste des utillisateurs </a>
|
||||
</li>
|
||||
<li class="nav-item active monLi">
|
||||
<a class="nav-link" routerLink="/admin/addUser"> Ajouter un utilisateur </a>
|
||||
</li>
|
||||
<li class="nav-item active monLi">
|
||||
<a class="nav-link" routerLink="/admin/adList"> Liste des pubs </a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<!-- Slide -->
|
||||
<mat-slide-toggle (click)="onClick()" style="font-size: x-large; margin: 0px 10px 0px 10px;"></mat-slide-toggle>
|
||||
|
||||
<!-- Mon profil -->
|
||||
<img [src]=urlImage
|
||||
onerror="this.onerror=null; this.src='assets/profil.png'"
|
||||
routerLink="/admin/myProfil"
|
||||
alt="">
|
||||
|
||||
<!-- Deconnexion -->
|
||||
<button mat-button class="btnDeconnexion" (click)="onDeconnexion()" routerLink="/">
|
||||
Deconnexion
|
||||
</button>
|
||||
|
||||
</nav>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- --------------------------------------------------------------------------------------------------------- -->
|
||||
|
|
@ -1,49 +0,0 @@
|
|||
import {Component, Input, OnInit} from '@angular/core';
|
||||
import {ThemeService} from "../../services/theme/theme.service";
|
||||
|
||||
|
||||
|
||||
@Component({
|
||||
selector: 'app-nav-bar',
|
||||
templateUrl: './nav-bar.component.html',
|
||||
styleUrls: ['./nav-bar.component.scss']
|
||||
})
|
||||
export class NavBarComponent implements OnInit
|
||||
{
|
||||
@Input() pour = "login";
|
||||
urlImage: string = "" ;
|
||||
|
||||
|
||||
constructor( public themeService: ThemeService ) { }
|
||||
|
||||
|
||||
ngOnInit(): void
|
||||
{
|
||||
// --- FAUX CODE ---
|
||||
switch (this.pour)
|
||||
{
|
||||
case "user":
|
||||
this.urlImage = "https://www.figurines-goodies.com/1185-thickbox_default/huey-duck-tales-disney-funko-pop.jpg" ;
|
||||
break;
|
||||
case "advertiser":
|
||||
this.urlImage = "https://www.figurines-goodies.com/1188-large_default/dewey-duck-tales-disney-funko-pop.jpg" ;
|
||||
break;
|
||||
case "admin":
|
||||
this.urlImage = "https://www.reference-gaming.com/assets/media/product/41195/figurine-pop-duck-tales-n-309-loulou.jpg" ;
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
onClick(): void
|
||||
{
|
||||
this.themeService.isLightTheme = !this.themeService.isLightTheme;
|
||||
}
|
||||
|
||||
|
||||
onDeconnexion(): void
|
||||
{
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
|
@ -1,9 +1,18 @@
|
|||
export interface User
|
||||
{
|
||||
_id: string,
|
||||
login: string
|
||||
hashPass: string
|
||||
mail: string
|
||||
role: any,
|
||||
profilePictureUrl: string
|
||||
login: string,
|
||||
hashPass: string,
|
||||
mail: string,
|
||||
role: {
|
||||
name: string,
|
||||
permission: number,
|
||||
},
|
||||
profilePictureUrl: string,
|
||||
dateOfBirth: Date,
|
||||
gender: string,
|
||||
interests: string[],
|
||||
isActive: boolean,
|
||||
createdAt: Date,
|
||||
updatedAt: Date,
|
||||
}
|
||||
|
|
|
|||
|
|
@ -226,8 +226,17 @@ export class FictitiousDatasService
|
|||
login: "Riri",
|
||||
hashPass: "agourgroou",
|
||||
mail: "riri@gmail.com",
|
||||
role: "user",
|
||||
profilePictureUrl: "https://www.figurines-goodies.com/1185-thickbox_default/huey-duck-tales-disney-funko-pop.jpg"
|
||||
role: {
|
||||
name: "user",
|
||||
permission: 0,
|
||||
},
|
||||
profilePictureUrl: "https://www.figurines-goodies.com/1185-thickbox_default/huey-duck-tales-disney-funko-pop.jpg",
|
||||
dateOfBirth: new Date(),
|
||||
gender: "man",
|
||||
interests: ["foot", "jeux-vidéo"],
|
||||
isActive: true,
|
||||
createdAt: new Date(),
|
||||
updatedAt: new Date(),
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -238,8 +247,17 @@ export class FictitiousDatasService
|
|||
login: "Fifi",
|
||||
hashPass: "agourgroou",
|
||||
mail: "fifi@gmail.com",
|
||||
role: "advertiser",
|
||||
profilePictureUrl: "https://www.figurines-goodies.com/1188-large_default/dewey-duck-tales-disney-funko-pop.jpg"
|
||||
role: {
|
||||
name: "advertiser",
|
||||
permission: 5,
|
||||
},
|
||||
profilePictureUrl: "https://www.figurines-goodies.com/1188-large_default/dewey-duck-tales-disney-funko-pop.jpg",
|
||||
dateOfBirth: new Date(),
|
||||
gender: "man",
|
||||
interests: ["cuisine", "jeux-vidéo"],
|
||||
isActive: true,
|
||||
createdAt: new Date(),
|
||||
updatedAt: new Date(),
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -250,8 +268,17 @@ export class FictitiousDatasService
|
|||
login: "Loulou",
|
||||
hashPass: "agourgroou",
|
||||
mail: "loulou@gmail.com",
|
||||
role: "advertiser",
|
||||
profilePictureUrl: "https://www.reference-gaming.com/assets/media/product/41195/figurine-pop-duck-tales-n-309-loulou.jpg?format=product-cover-large&k=1519639530"
|
||||
role: {
|
||||
name: "admin",
|
||||
permission: 5,
|
||||
},
|
||||
profilePictureUrl: "https://www.reference-gaming.com/assets/media/product/41195/figurine-pop-duck-tales-n-309-loulou.jpg?format=product-cover-large&k=1519639530",
|
||||
dateOfBirth: new Date(),
|
||||
gender: "man",
|
||||
interests: ["musique", "jeux-vidéo"],
|
||||
isActive: true,
|
||||
createdAt: new Date(),
|
||||
updatedAt: new Date(),
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
Reference in a new issue