From 1af748e6f14462ae2878a982420c7be136959720 Mon Sep 17 00:00:00 2001 From: ralacote Date: Fri, 18 Oct 2024 14:27:55 +0200 Subject: [PATCH 1/4] Ajout de la navbar --- src/app/app.component.html | 2 +- src/app/components/login/login.component.ts | 2 +- src/app/components/sudoku/sudoku.component.html | 6 +++--- .../user-accueil/user-accueil.component.html | 2 +- .../user-list/user-list.component.html | 2 +- .../user-menu/user-menu.component.html | 17 ++++++++++++----- .../components/user-menu/user-menu.component.ts | 6 ++++-- 7 files changed, 23 insertions(+), 14 deletions(-) diff --git a/src/app/app.component.html b/src/app/app.component.html index 6330d4c..a1a6042 100644 --- a/src/app/app.component.html +++ b/src/app/app.component.html @@ -1,3 +1,3 @@ - + \ No newline at end of file diff --git a/src/app/components/login/login.component.ts b/src/app/components/login/login.component.ts index d0e2fa3..a309888 100644 --- a/src/app/components/login/login.component.ts +++ b/src/app/components/login/login.component.ts @@ -1,4 +1,4 @@ -import { Component, EventEmitter, OnInit, Output, ViewChild } from '@angular/core'; +import { Component, EventEmitter, OnInit, Output } from '@angular/core'; import { FormControl, FormGroup, FormsModule, ReactiveFormsModule, Validators } from '@angular/forms'; diff --git a/src/app/components/sudoku/sudoku.component.html b/src/app/components/sudoku/sudoku.component.html index 83803cd..884f00b 100644 --- a/src/app/components/sudoku/sudoku.component.html +++ b/src/app/components/sudoku/sudoku.component.html @@ -1,4 +1,4 @@ - +

sudoku works!

@@ -16,7 +16,7 @@

nombre d'indice: {{nbIndice}}

@@ -27,7 +27,7 @@

Vous avez gagné !

- {{userconnecte}} - Accueil - Classement - Details Sudoku + Morpion + Echec + Star Wars Rebellion + + + diff --git a/src/app/components/user-menu/user-menu.component.ts b/src/app/components/user-menu/user-menu.component.ts index 8fecd66..e983eb4 100644 --- a/src/app/components/user-menu/user-menu.component.ts +++ b/src/app/components/user-menu/user-menu.component.ts @@ -3,11 +3,14 @@ import { RouterModule } from '@angular/router'; import { MatButtonModule } from '@angular/material/button'; import { MatMenuModule } from '@angular/material/menu'; import { UserService } from '../../services/user-service'; +import { MatTabsModule } from '@angular/material/tabs'; +import { RouterLink } from '@angular/router'; +import { MatTabNav } from '@angular/material/tabs'; @Component({ selector: 'app-book-menu', standalone: true, - imports: [RouterModule, MatButtonModule, MatMenuModule], + imports: [RouterModule, MatButtonModule, MatMenuModule,MatTabsModule,RouterLink,MatTabNav], templateUrl: './user-menu.component.html' }) @@ -34,5 +37,4 @@ export class UserMenuComponent { this.route = "/users/0"; } } - } From 1dc47e6b7ae21d488d6700a4154495180ad004ab Mon Sep 17 00:00:00 2001 From: ralacote Date: Fri, 18 Oct 2024 15:15:52 +0200 Subject: [PATCH 2/4] =?UTF-8?q?Ajouts=20de=20styles=20et=20am=C3=A9liorati?= =?UTF-8?q?ons=20de=20code?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../user-accueil/user-accueil.component.html | 20 ++++------- .../user-accueil/user-accueil.component.ts | 26 ++++++++++----- .../user-menu/user-menu.component.css | 33 +++++++++++++++++++ .../user-menu/user-menu.component.html | 8 ++--- .../user-menu/user-menu.component.ts | 25 ++++++++------ 5 files changed, 76 insertions(+), 36 deletions(-) create mode 100644 src/app/components/user-menu/user-menu.component.css diff --git a/src/app/components/user-accueil/user-accueil.component.html b/src/app/components/user-accueil/user-accueil.component.html index 1326f2a..7a5161c 100644 --- a/src/app/components/user-accueil/user-accueil.component.html +++ b/src/app/components/user-accueil/user-accueil.component.html @@ -1,22 +1,16 @@ - -

{{formattedDate}}

- - - - - - - - - + + + - diff --git a/src/app/components/user-accueil/user-accueil.component.ts b/src/app/components/user-accueil/user-accueil.component.ts index 87670e5..3d10560 100644 --- a/src/app/components/user-accueil/user-accueil.component.ts +++ b/src/app/components/user-accueil/user-accueil.component.ts @@ -3,6 +3,7 @@ import { RouterModule } from '@angular/router'; import { UserMenuComponent } from '../user-menu/user-menu.component'; import { UserService } from '../../services/user-service'; import { NgFor } from '@angular/common'; +import { DatePipe } from '@angular/common'; interface Streak { day: string @@ -12,7 +13,7 @@ interface Streak { @Component({ selector: 'app-user-accueil', standalone: true, - imports: [UserMenuComponent,RouterModule,NgFor], + imports: [UserMenuComponent,RouterModule,NgFor,DatePipe], templateUrl: './user-accueil.component.html', styleUrl: './user-accueil.component.css' }) @@ -20,17 +21,13 @@ interface Streak { export class UserAccueilComponent { protected formattedDate : String protected streaks: Object[] + protected day: String[] public constructor(us : UserService) { - const currentDate: Date = new Date - const options: Intl.DateTimeFormatOptions = { - year: 'numeric', - month: 'long', - day: 'numeric' - } - this.formattedDate = currentDate.toLocaleDateString(undefined, options) + this.formattedDate = this.getDate() this.streaks = ["❌","❌","❌","❌","❌","❌","❌"] + this.day = ["L","M","M","J","V","S","D"] let userConnecte = localStorage.getItem('UserConnecte') if(userConnecte == undefined) {return} @@ -42,8 +39,10 @@ export class UserAccueilComponent { if(streaks == undefined) {return} this.streaks = [] + this.day = [] streaks.forEach(element => { let a : Streak = element as Streak + this.day.push(a["day"]) if(a["isPlayed"]){ this.streaks.push("✅") } else { @@ -51,6 +50,17 @@ export class UserAccueilComponent { } }); + } + + public getDate(): String{ + const currentDate: Date = new Date + const options: Intl.DateTimeFormatOptions = { + year: 'numeric', + month: 'long', + day: 'numeric' } + return currentDate.toLocaleDateString(undefined, options) + + } } diff --git a/src/app/components/user-menu/user-menu.component.css b/src/app/components/user-menu/user-menu.component.css new file mode 100644 index 0000000..38a0f47 --- /dev/null +++ b/src/app/components/user-menu/user-menu.component.css @@ -0,0 +1,33 @@ +nav[mat-tab-nav-bar] { + display: flex; + justify-content: space-between; + background-color: #333; + padding: 10px 0 + } + + mat-tab-link, button[mat-button] { + flex: 1; + text-align: center; + color: white; + background-color: #444; + border: none; + padding: 15px; + cursor: pointer; + transition: background-color 0.3s; + } + + mat-tab-link:hover, button[mat-button]:hover { + background-color: #555; + } + + a[mat-menu-item] { + text-align: center; /* Centrer le texte des éléments de menu */ + padding: 10px; /* Espacement interne pour le menu */ + display: block; /* Faire en sorte que le lien prenne toute la largeur */ + color: #111; /* Couleur du texte du menu */ + } + + a[mat-menu-item]:hover { + background-color: #555; /* Couleur au survol pour le menu */ + } + diff --git a/src/app/components/user-menu/user-menu.component.html b/src/app/components/user-menu/user-menu.component.html index 708dad9..08137b5 100644 --- a/src/app/components/user-menu/user-menu.component.html +++ b/src/app/components/user-menu/user-menu.component.html @@ -1,9 +1,8 @@ Sudoku - Morpion - Echec - Star Wars Rebellion - + Morpion + Jeu de l'oie + Star Wars Rebellion diff --git a/src/app/components/user-menu/user-menu.component.ts b/src/app/components/user-menu/user-menu.component.ts index e983eb4..9cc5079 100644 --- a/src/app/components/user-menu/user-menu.component.ts +++ b/src/app/components/user-menu/user-menu.component.ts @@ -6,35 +6,40 @@ import { UserService } from '../../services/user-service'; import { MatTabsModule } from '@angular/material/tabs'; import { RouterLink } from '@angular/router'; import { MatTabNav } from '@angular/material/tabs'; +import { SimpleChanges } from '@angular/core'; @Component({ selector: 'app-book-menu', standalone: true, imports: [RouterModule, MatButtonModule, MatMenuModule,MatTabsModule,RouterLink,MatTabNav], - templateUrl: './user-menu.component.html' + templateUrl: './user-menu.component.html', + styleUrl: './user-menu.component.css' }) export class UserMenuComponent { - private Service : UserService; + private service : UserService; public userconnecte : String | undefined; public route : String | undefined; public constructor(us: UserService) { - this.Service = us + this.service = us this.reloadPseudo() } public reloadPseudo(){ - let id = localStorage.getItem('UserConnecte'); + let name = localStorage.getItem('UserConnecte'); + + if (typeof name === "string" && name !="undefined"){ + this.userconnecte = name + + // let id : number | undefined = this.service.getIdByUser(name) + // if(id == undefined) return + // this.route = "/user/" + id + // console.log(this.route) - if (typeof id === "string" && id !="undefined"){ - let user = this.Service.getUserById(+id) - this.route = "/users/" + user?.id - this.userconnecte = user?.login - this.userconnecte = id } else { this.userconnecte = "Pseudo"; - this.route = "/users/0"; + this.route = "/user/0"; } } } From 76b98e23281500f86e1e4ed70b0d97f275c94cbe Mon Sep 17 00:00:00 2001 From: ralacote Date: Fri, 18 Oct 2024 15:19:46 +0200 Subject: [PATCH 3/4] =?UTF-8?q?Supression=20de=20toutes=20les=20r=C3=A9f?= =?UTF-8?q?=C3=A9rences=20=C3=A0=20des=20fichiers=20Book?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/app/app.component.ts | 22 ++------ src/app/app.routes.ts | 6 --- .../book-detail/book-detail.component.html | 12 ----- .../book-detail/book-detail.component.ts | 25 ---------- .../book-form/book-form.component.html | 32 ------------ .../book-form/book-form.component.ts | 49 ------------------ .../book-home/book-home.component.html | 1 - .../book-home/book-home.component.ts | 12 ----- .../book-list/book-list.component.html | 7 --- .../book-list/book-list.component.ts | 23 --------- src/app/datas/books.stub.ts | 11 ---- src/app/services/book-service.ts | 50 ------------------- 12 files changed, 3 insertions(+), 247 deletions(-) delete mode 100644 src/app/components/book-detail/book-detail.component.html delete mode 100644 src/app/components/book-detail/book-detail.component.ts delete mode 100644 src/app/components/book-form/book-form.component.html delete mode 100644 src/app/components/book-form/book-form.component.ts delete mode 100644 src/app/components/book-home/book-home.component.html delete mode 100644 src/app/components/book-home/book-home.component.ts delete mode 100644 src/app/components/book-list/book-list.component.html delete mode 100644 src/app/components/book-list/book-list.component.ts delete mode 100644 src/app/datas/books.stub.ts delete mode 100644 src/app/services/book-service.ts diff --git a/src/app/app.component.ts b/src/app/app.component.ts index 5ea1343..59bf11e 100644 --- a/src/app/app.component.ts +++ b/src/app/app.component.ts @@ -2,45 +2,29 @@ import { Component } from '@angular/core'; import { RouterOutlet } from '@angular/router'; import { HttpClientModule } from '@angular/common/http'; -import { BookFormComponent } from './components/book-form/book-form.component'; -import { BookListComponent } from './components/book-list/book-list.component'; - import { UserService } from './services/user-service'; import { User } from './models/user.model'; -import { BookService } from './services/book-service'; -import { Book } from './models/book.model'; import { UserMenuComponent } from './components/user-menu/user-menu.component'; import { SudokuService } from "./services/sudoku-service" @Component({ selector: 'app-root', standalone: true, - imports: [RouterOutlet, BookListComponent, BookFormComponent, UserMenuComponent, HttpClientModule], + imports: [RouterOutlet, UserMenuComponent, HttpClientModule], templateUrl: './app.component.html', providers: [ - BookService, UserService, - SudokuService, + SudokuService ] }) export class AppComponent { title = 'angular-tp2-correct'; - constructor(protected bookService: BookService, protected userService: UserService, protected sudokuService: SudokuService){ } + constructor( protected userService: UserService, protected sudokuService: SudokuService){ } - addBook($event: Book): void { - this.bookService.addBook($event); - } - onActivate(componentRef: Event): void { console.log('onActivate', componentRef); - - if(componentRef instanceof BookFormComponent) { - componentRef.addBookEvent.subscribe((newBook: Book) => { - this.addBook(newBook); - }); - } } } diff --git a/src/app/app.routes.ts b/src/app/app.routes.ts index d824146..b9eca4d 100644 --- a/src/app/app.routes.ts +++ b/src/app/app.routes.ts @@ -1,7 +1,4 @@ import { Routes } from '@angular/router'; -import { BookListComponent } from './components/book-list/book-list.component'; -import { BookFormComponent } from './components/book-form/book-form.component'; -import { BookDetailComponent } from './components/book-detail/book-detail.component'; import { LoginComponent } from './components/login/login.component'; import { UserListComponent } from './components/user-list/user-list.component'; import { UserDetailComponent } from './components/user-detail/user-detail.component'; @@ -12,9 +9,6 @@ import { UserAccueilComponent } from './components/user-accueil/user-accueil.com export const routes: Routes = [ { path: '', component: LoginComponent }, { path: 'accueil', component: UserAccueilComponent }, - { path: 'books', component: BookListComponent }, - { path: 'book/add', component: BookFormComponent }, - { path: 'book/:id', component: BookDetailComponent }, { path: 'users', component: UserListComponent }, { path: 'user/:id', component: UserDetailComponent }, { path: 'sudoku', component: DifficultySelectorComponent }, diff --git a/src/app/components/book-detail/book-detail.component.html b/src/app/components/book-detail/book-detail.component.html deleted file mode 100644 index 8071deb..0000000 --- a/src/app/components/book-detail/book-detail.component.html +++ /dev/null @@ -1,12 +0,0 @@ -
-

{{selectedBook.title | uppercase}}

-
id: {{selectedBook.id}}
-
- - {{ selectedBook.author }} -
-
- - {{ selectedBook.publicationDate | date: 'EEEE d MMMM y' }} -
-
\ No newline at end of file diff --git a/src/app/components/book-detail/book-detail.component.ts b/src/app/components/book-detail/book-detail.component.ts deleted file mode 100644 index 20cf205..0000000 --- a/src/app/components/book-detail/book-detail.component.ts +++ /dev/null @@ -1,25 +0,0 @@ -import { Component} from '@angular/core'; -import { UpperCasePipe, DatePipe, NgIf} from '@angular/common'; -import { ActivatedRoute } from '@angular/router'; - -import { Book } from '../../models/book.model'; -import { BookService } from '../../services/book-service'; - -@Component({ - standalone: true, - selector: 'app-book-detail', - imports: [DatePipe, UpperCasePipe, NgIf], - templateUrl: './book-detail.component.html', - styles: `` -}) -export class BookDetailComponent { - selectedBook!: Book | undefined; - - constructor(protected bookService: BookService, private activatedRoute: ActivatedRoute) {} - - ngOnInit(){ - const id = this.activatedRoute.snapshot.params['id']; - this.selectedBook = this.bookService.getBookById(id); - console.log(this.selectedBook); - } -} \ No newline at end of file diff --git a/src/app/components/book-form/book-form.component.html b/src/app/components/book-form/book-form.component.html deleted file mode 100644 index ddf45e4..0000000 --- a/src/app/components/book-form/book-form.component.html +++ /dev/null @@ -1,32 +0,0 @@ -
-

Add book form

- -
-
- - Title - - -
- -
- - Author - - -
- -
- - Publication date - - - - -
- -
- -
- -
\ No newline at end of file diff --git a/src/app/components/book-form/book-form.component.ts b/src/app/components/book-form/book-form.component.ts deleted file mode 100644 index 2cf99f6..0000000 --- a/src/app/components/book-form/book-form.component.ts +++ /dev/null @@ -1,49 +0,0 @@ -import { Component, EventEmitter, Output } from '@angular/core'; - -import { FormControl, FormGroup, FormsModule, ReactiveFormsModule, Validators } from '@angular/forms'; -import { Book } from '../../models/book.model'; - -import { MatButtonModule } from '@angular/material/button'; -import { MatNativeDateModule } from '@angular/material/core'; -import { MatDatepickerModule } from '@angular/material/datepicker'; -import { MatFormFieldModule } from '@angular/material/form-field'; -import { MatInputModule } from '@angular/material/input'; -import { MatMenuModule } from '@angular/material/menu'; - -@Component({ - selector: 'app-book-form', - standalone: true, - imports: [ - MatFormFieldModule, - MatInputModule, - MatButtonModule, - MatMenuModule, - MatDatepickerModule, - MatNativeDateModule, - FormsModule, - ReactiveFormsModule - ], - templateUrl: './book-form.component.html' -}) -export class BookFormComponent { - @Output() addBookEvent = new EventEmitter(); - - book: Book = { id: 0, title: '', author: '', publicationDate: new Date() } - bookForm: FormGroup = new FormGroup({ - title: new FormControl(this.book.title, Validators.required), - author: new FormControl(this.book.author, Validators.required), - publicationDate: new FormControl(this.book.publicationDate, Validators.required) - }); - - addBook() { - if (this.bookForm.invalid) { - console.log("ERREUR"); - return; - } - - this.book = this.bookForm.value; - - this.addBookEvent.emit(this.book); - this.bookForm.reset(); - } -} \ No newline at end of file diff --git a/src/app/components/book-home/book-home.component.html b/src/app/components/book-home/book-home.component.html deleted file mode 100644 index c3a01ee..0000000 --- a/src/app/components/book-home/book-home.component.html +++ /dev/null @@ -1 +0,0 @@ -

Bienvenue sur la page d'accueil du Book Shop

diff --git a/src/app/components/book-home/book-home.component.ts b/src/app/components/book-home/book-home.component.ts deleted file mode 100644 index 2308417..0000000 --- a/src/app/components/book-home/book-home.component.ts +++ /dev/null @@ -1,12 +0,0 @@ -import { Component } from '@angular/core'; - -@Component({ - selector: 'app-book-home', - standalone: true, - imports: [], - templateUrl: './book-home.component.html', - styles: `` -}) -export class BookHomeComponent { - -} diff --git a/src/app/components/book-list/book-list.component.html b/src/app/components/book-list/book-list.component.html deleted file mode 100644 index 9965435..0000000 --- a/src/app/components/book-list/book-list.component.html +++ /dev/null @@ -1,7 +0,0 @@ -

Book list

- - \ No newline at end of file diff --git a/src/app/components/book-list/book-list.component.ts b/src/app/components/book-list/book-list.component.ts deleted file mode 100644 index 5804bc2..0000000 --- a/src/app/components/book-list/book-list.component.ts +++ /dev/null @@ -1,23 +0,0 @@ -import { Component } from '@angular/core'; -import { RouterModule } from '@angular/router'; -import { NgFor, DatePipe } from '@angular/common'; - -import { Book } from '../../models/book.model'; -import { BookService } from '../../services/book-service' - -@Component({ - selector: 'app-book-list', - standalone: true, - imports: [NgFor, DatePipe, RouterModule], - templateUrl: './book-list.component.html' -}) -export class BookListComponent { - books: Book[] = []; - - constructor(protected bookService: BookService){ - } - - ngOnInit(){ - this.books = this.bookService.getAll(); - } -} diff --git a/src/app/datas/books.stub.ts b/src/app/datas/books.stub.ts deleted file mode 100644 index f56ed3f..0000000 --- a/src/app/datas/books.stub.ts +++ /dev/null @@ -1,11 +0,0 @@ -import { Book } from "../models/book.model"; - -export const BOOKS: Book[] = [ - { id: 1, title: 'The Lord of the Rings - The Fellowship of the Ring', author: 'J.R.R. Tolkien', publicationDate: new Date('07/29/1954') }, - { id: 2, title: 'The Lord of the Rings - The Two Towers', author: 'J.R.R. Tolkien', publicationDate: new Date('11/11/1954') }, - { id: 3, title: 'The Lord of the Rings - The Return of the King', author: 'J.R.R. Tolkien', publicationDate: new Date('10/20/1955') }, - { id: 4, title: 'Dune', author: 'Frank Herbert', publicationDate: new Date('1965') }, - { id: 5, title: 'Dune Messiah', author: 'Frank Herbert', publicationDate: new Date('1969') }, - { id: 6, title: 'It', author: 'Stephen King', publicationDate: new Date('09/15/1986') }, - { id: 7, title: 'Do Androids Dream of Electric Sheep?', author: 'Philip K. Dick', publicationDate: new Date('1968') } -]; \ No newline at end of file diff --git a/src/app/services/book-service.ts b/src/app/services/book-service.ts deleted file mode 100644 index b83f379..0000000 --- a/src/app/services/book-service.ts +++ /dev/null @@ -1,50 +0,0 @@ -import { HttpClient, HttpErrorResponse } from '@angular/common/http'; -import { Injectable } from "@angular/core"; -import { BOOKS } from "../datas/books.stub"; -import { Book } from "../models/book.model"; - -@Injectable() -export class BookService { - private books: Book[]; - private readonly bookApiUrl = 'https://66e8848bb17821a9d9dcf68c.mockapi.io/books'; - - public constructor(private http: HttpClient){ - this.books = BOOKS; - - this.http.get(this.bookApiUrl).subscribe(books => { - books.forEach(b => { - this.addBookToLocal(b); - }); - }); - } - - public getAll(): Book[]{ - return this.books; - } - - public getBookById(id: number): Book | undefined{ - return this.books.find(b => b.id === id); - } - - public addBook(book: Book): void{ - this.addBookToLocal(book); - this.addBookToApi(book); - } - - private addBookToLocal(book: Book): void{ - //console.log('addBookToLocal', book); - if(book.id === 0){ - book.id = Math.max(...this.books.map(b => b.id)) + 1; - } - - const existedBook = this.books.find(b => b.title === book.title || b.id === Number(book.id)); - if(existedBook) - return; - - this.books.push(book); - } - - private addBookToApi(book: Book): void{ - this.http.post(this.bookApiUrl, book).subscribe(); - } -} \ No newline at end of file From 12ac9ee20d38e41d18861d5f3216ac908259c884 Mon Sep 17 00:00:00 2001 From: ralacote Date: Fri, 18 Oct 2024 16:28:11 +0200 Subject: [PATCH 4/4] Mise en place du localStorage dans User Service --- src/app/app.component.ts | 16 ++++++++++++++-- src/app/components/login/login.component.ts | 12 +++--------- .../user-accueil/user-accueil.component.ts | 3 +-- .../components/user-list/user-list.component.ts | 1 - .../components/user-menu/user-menu.component.css | 10 +++++----- .../user-menu/user-menu.component.html | 6 +++--- .../components/user-menu/user-menu.component.ts | 14 ++++++++++---- src/app/services/user-service.ts | 9 +++++++++ 8 files changed, 45 insertions(+), 26 deletions(-) diff --git a/src/app/app.component.ts b/src/app/app.component.ts index 59bf11e..83adc50 100644 --- a/src/app/app.component.ts +++ b/src/app/app.component.ts @@ -2,12 +2,15 @@ import { Component } from '@angular/core'; import { RouterOutlet } from '@angular/router'; import { HttpClientModule } from '@angular/common/http'; +import { LoginComponent } from './components/login/login.component'; + import { UserService } from './services/user-service'; import { User } from './models/user.model'; import { UserMenuComponent } from './components/user-menu/user-menu.component'; import { SudokuService } from "./services/sudoku-service" +import { UserAccueilComponent } from './components/user-accueil/user-accueil.component'; @Component({ selector: 'app-root', @@ -22,9 +25,18 @@ import { SudokuService } from "./services/sudoku-service" export class AppComponent { title = 'angular-tp2-correct'; - constructor( protected userService: UserService, protected sudokuService: SudokuService){ } + constructor(protected userService: UserService, protected sudokuService: SudokuService){ } + + changeUserName($event: User): void { + this.userService.addToLocalStorage($event); + } onActivate(componentRef: Event): void { - console.log('onActivate', componentRef); + if(componentRef instanceof LoginComponent) { + componentRef.addConnectEvent.subscribe((connectedUser: User) => { + this.changeUserName(connectedUser); + }); + } + } } diff --git a/src/app/components/login/login.component.ts b/src/app/components/login/login.component.ts index a309888..a0e08da 100644 --- a/src/app/components/login/login.component.ts +++ b/src/app/components/login/login.component.ts @@ -10,7 +10,6 @@ import { MatInputModule } from '@angular/material/input'; import { MatMenuModule } from '@angular/material/menu'; import { User } from '../../models/user.model'; import { NgIf } from '@angular/common'; -import { UserService } from '../../services/user-service'; import { Router } from '@angular/router'; @Component({ @@ -35,7 +34,6 @@ export class LoginComponent implements OnInit { @Output() addConnectEvent = new EventEmitter(); public isButtonVisible = false; - private UserService : UserService; user: User = {id:1, login: '', password: '', streak: null, streaks: [], points: null} loginForm: FormGroup = new FormGroup({ @@ -43,8 +41,7 @@ export class LoginComponent implements OnInit { password: new FormControl(this.user.password, Validators.required), }); - public constructor(us: UserService,private router: Router) { - this.UserService = us + public constructor(private router: Router) { } ngOnInit() { @@ -61,13 +58,10 @@ export class LoginComponent implements OnInit { console.log("ERREUR DIFFERENT"); return; } - console.log(this.loginForm.value.login) this.user = this.loginForm.value; - localStorage.setItem('UserConnecte',String(this.user.login)); - - //this.UserService.addUserToLocal(this.user); - this.addConnectEvent.emit(this.user) + + this.addConnectEvent.emit(this.loginForm.value) this.loginForm.reset(); this.isButtonVisible = false; this.router.navigate(['/accueil']); diff --git a/src/app/components/user-accueil/user-accueil.component.ts b/src/app/components/user-accueil/user-accueil.component.ts index 3d10560..6c4b248 100644 --- a/src/app/components/user-accueil/user-accueil.component.ts +++ b/src/app/components/user-accueil/user-accueil.component.ts @@ -29,7 +29,7 @@ export class UserAccueilComponent { this.streaks = ["❌","❌","❌","❌","❌","❌","❌"] this.day = ["L","M","M","J","V","S","D"] - let userConnecte = localStorage.getItem('UserConnecte') + let userConnecte = us.getItemUserConnecte() if(userConnecte == undefined) {return} let id = us.getIdByUser(userConnecte) @@ -60,7 +60,6 @@ export class UserAccueilComponent { day: 'numeric' } return currentDate.toLocaleDateString(undefined, options) - } } diff --git a/src/app/components/user-list/user-list.component.ts b/src/app/components/user-list/user-list.component.ts index 9f9b30d..b1f908e 100644 --- a/src/app/components/user-list/user-list.component.ts +++ b/src/app/components/user-list/user-list.component.ts @@ -27,7 +27,6 @@ export class UserListComponent { this.nbPage = 1; this.users = this.userService.getAll(); this.loadPage(0); - console.log(this.users); } public changeWatchedvar(newVar:string) { diff --git a/src/app/components/user-menu/user-menu.component.css b/src/app/components/user-menu/user-menu.component.css index 38a0f47..894df17 100644 --- a/src/app/components/user-menu/user-menu.component.css +++ b/src/app/components/user-menu/user-menu.component.css @@ -21,13 +21,13 @@ nav[mat-tab-nav-bar] { } a[mat-menu-item] { - text-align: center; /* Centrer le texte des éléments de menu */ - padding: 10px; /* Espacement interne pour le menu */ - display: block; /* Faire en sorte que le lien prenne toute la largeur */ - color: #111; /* Couleur du texte du menu */ + text-align: center; + padding: 10px; + display: block; + color: #111; } a[mat-menu-item]:hover { - background-color: #555; /* Couleur au survol pour le menu */ + background-color: #555; } diff --git a/src/app/components/user-menu/user-menu.component.html b/src/app/components/user-menu/user-menu.component.html index 08137b5..4148679 100644 --- a/src/app/components/user-menu/user-menu.component.html +++ b/src/app/components/user-menu/user-menu.component.html @@ -6,8 +6,8 @@ diff --git a/src/app/components/user-menu/user-menu.component.ts b/src/app/components/user-menu/user-menu.component.ts index 9cc5079..5c9c536 100644 --- a/src/app/components/user-menu/user-menu.component.ts +++ b/src/app/components/user-menu/user-menu.component.ts @@ -6,7 +6,6 @@ import { UserService } from '../../services/user-service'; import { MatTabsModule } from '@angular/material/tabs'; import { RouterLink } from '@angular/router'; import { MatTabNav } from '@angular/material/tabs'; -import { SimpleChanges } from '@angular/core'; @Component({ selector: 'app-book-menu', @@ -17,17 +16,19 @@ import { SimpleChanges } from '@angular/core'; }) export class UserMenuComponent { + private service : UserService; public userconnecte : String | undefined; public route : String | undefined; + public constructor(us: UserService) { this.service = us this.reloadPseudo() } public reloadPseudo(){ - let name = localStorage.getItem('UserConnecte'); + let name = this.service.getItemUserConnecte(); if (typeof name === "string" && name !="undefined"){ this.userconnecte = name @@ -35,11 +36,16 @@ export class UserMenuComponent { // let id : number | undefined = this.service.getIdByUser(name) // if(id == undefined) return // this.route = "/user/" + id - // console.log(this.route) } else { - this.userconnecte = "Pseudo"; + this.userconnecte = "Connexion"; this.route = "/user/0"; } } + + public removePseudo(){ + localStorage.clear(); + this.userconnecte = "Connexion"; + } + } diff --git a/src/app/services/user-service.ts b/src/app/services/user-service.ts index 2807379..e0b78b6 100644 --- a/src/app/services/user-service.ts +++ b/src/app/services/user-service.ts @@ -89,4 +89,13 @@ export class UserService { } return a; } + + public addToLocalStorage(user : User){ + localStorage.setItem('UserConnecte',String(user.login)) + } + + public getItemUserConnecte() : String | null{ + return localStorage.getItem('UserConnecte') + } + } \ No newline at end of file
LUNMARMERJEUVENSAMDIM
+ {{ d }} +
- {{ azerty }} + + {{ streak }}