From 054e8acede1116c544413722cc767c922fffc92c Mon Sep 17 00:00:00 2001 From: 21797545 Date: Thu, 3 Oct 2024 09:43:54 +0200 Subject: [PATCH 1/2] :triangular_ruler: Removed Spotify init from artist profile page --- .../pages/artist-profile/artist-profile.component.ts | 11 ++++------- 1 file changed, 4 insertions(+), 7 deletions(-) diff --git a/Frontend/src/app/pages/artist-profile/artist-profile.component.ts b/Frontend/src/app/pages/artist-profile/artist-profile.component.ts index c53ae544..ccba06a1 100644 --- a/Frontend/src/app/pages/artist-profile/artist-profile.component.ts +++ b/Frontend/src/app/pages/artist-profile/artist-profile.component.ts @@ -68,8 +68,8 @@ export class ArtistProfileComponent implements AfterViewInit { private spotifyService: SpotifyService, public moodService: MoodService, ) { - this.currentMood = this.moodService.getCurrentMood(); - this.moodComponentClasses = this.moodService.getComponentMoodClasses(); + this.currentMood = this.moodService.getCurrentMood(); + this.moodComponentClasses = this.moodService.getComponentMoodClasses(); } ngAfterViewInit(): void { @@ -83,9 +83,6 @@ export class ArtistProfileComponent implements AfterViewInit { this.screenSizeService.screenSize$.subscribe(screenSize => { this.screenSize = screenSize; }); - if (typeof window !== 'undefined') { - await this.spotifyService.init(); - } } getAlbumArt(item: string): string { @@ -97,12 +94,12 @@ export class ArtistProfileComponent implements AfterViewInit { // Logic to play the selected song console.log(`Playing song: ${song}`); } - + viewAlbum(album: string): void { // Logic to view the selected album console.log(`Viewing album: ${album}`); } - + viewPlaylist(playlist: string): void { // Logic to view the selected playlist console.log(`Viewing playlist: ${playlist}`); From 8569fe209270cf273860f03095c7f5bd7b293710 Mon Sep 17 00:00:00 2001 From: 21797545 Date: Thu, 3 Oct 2024 09:52:26 +0200 Subject: [PATCH 2/2] :triangular_ruler: Reverted changes to artist profile --- .../artist-profile.component.html | 109 +++++++----------- .../artist-profile.component.ts | 108 +++++++++-------- 2 files changed, 102 insertions(+), 115 deletions(-) diff --git a/Frontend/src/app/pages/artist-profile/artist-profile.component.html b/Frontend/src/app/pages/artist-profile/artist-profile.component.html index 10f195e1..d0188e9c 100644 --- a/Frontend/src/app/pages/artist-profile/artist-profile.component.html +++ b/Frontend/src/app/pages/artist-profile/artist-profile.component.html @@ -1,73 +1,48 @@ -
-
- -
- -
{{ artist.name }}
-
- - -
- -
- {{ artist.name }} -
- - -
-

{{ artist.description }}

-
Genres: {{ artist.genres.join(', ') }}
-
-
+
+
+
+ + - -
-

Top Songs

-
- -
- - -
-
- -
-
+
+
+ + +
+ Kendrick Lamar +
+
+

Songs

+
+
+ Album Art +

{{ i + 1 }}. {{ song }}

+
+
+
- -
-

Albums

-
- -
- - -
-
- -
-
+
+

Albums

+
+
+ Album Art +

{{ i + 1 }}. {{ album }}

+
+
+
- -
-

Playlists

-
- -
- - -
-
- +
+

Playlists

+
+
+ Album Art +

{{ i + 1 }}. {{ playlist }}

+
+
+
+ + +
diff --git a/Frontend/src/app/pages/artist-profile/artist-profile.component.ts b/Frontend/src/app/pages/artist-profile/artist-profile.component.ts index ccba06a1..8e028dd4 100644 --- a/Frontend/src/app/pages/artist-profile/artist-profile.component.ts +++ b/Frontend/src/app/pages/artist-profile/artist-profile.component.ts @@ -16,31 +16,28 @@ import { SpotifyService } from "../../services/spotify.service"; import { InfoBarComponent } from '../../components/organisms/info-bar/info-bar.component'; import { MoodService } from '../../services/mood-service.service'; import { BackButtonComponent } from '../../components/atoms/back-button/back-button.component'; -import { TopCardComponent } from '../../components/molecules/top-card/top-card.component'; @Component({ - selector: 'app-artist-profile', - standalone: true, - imports: [ - NavbarComponent, - NgIf, - SideBarComponent, - MatCard, - MatCardContent, - MatButtonModule, - MatIconModule, - NgForOf, - EditProfileModalComponent, - CommonModule, - InfoBarComponent, - NgClass, - BackButtonComponent, - TopCardComponent - ], - templateUrl: './artist-profile.component.html', - styleUrl: './artist-profile.component.css', + selector: 'app-artist-profile', + standalone: true, + imports: [ + NavbarComponent, + NgIf, + SideBarComponent, + MatCard, + MatCardContent, + MatButtonModule, + MatIconModule, + NgForOf, + EditProfileModalComponent, + CommonModule, + InfoBarComponent, + NgClass, + BackButtonComponent, + ], + templateUrl: './artist-profile.component.html', + styleUrl: './artist-profile.component.css', }) - export class ArtistProfileComponent implements AfterViewInit { imgpath: string = 'back.jpg'; screenSize?: string; @@ -49,24 +46,25 @@ export class ArtistProfileComponent implements AfterViewInit { backgroundMoodClasses!:{ [key: string]: string }; artist = { - name: 'Kendrick Lamar', - description: 'Kendrick Lamar is a Grammy-winning rapper and songwriter from Compton, California, known for his thought-provoking lyrics and storytelling. His albums, like Good Kid, M.A.A.D City, To Pimp a Butterfly, and DAMN., explore themes of identity, societal struggles, and personal growth. Widely regarded as one of the most influential voices in hip-hop, Kendricks music blends sharp social commentary with powerful narratives, earning him accolades like the Pulitzer Prize for Music.', - genres: ['Hip-Hop', 'Rap', 'Conscious Hip-Hop'], - image: './assets/images/kendrick.jpg', - topSongs: ['HUMBLE.', 'Swimming Pools (Drank)', 'Money Trees', 'Alright', 'DNA.'], - albums: ['Good Kid, M.A.A.D City', 'To Pimp a Butterfly', 'DAMN.', 'Mr. Morale & The Big Steppers'], - playlists: ['Kendrick Essentials', 'RapCaviar', 'Hip-Hop Hits', 'Workout Mix'], + name: 'Kendrick Lamar', + description: 'Kendrick Lamar, an influential figure in contemporary music, epitomizes artistic depth and cultural resonance. His discography navigates themes of identity, societal struggle, and personal introspection with poetic precision.', + genres: ['Hip-Hop', 'Rap', 'Conscious Hip-Hop'], + similarArtists: ['J. Cole', 'Drake', 'Kanye West'], + topSongs: ['HUMBLE.', 'Swimming Pools (Drank)', 'Money Trees', 'Alright', 'DNA.'], + albums: ['Good Kid, M.A.A.D City', 'To Pimp a Butterfly', 'DAMN.', 'Mr. Morale & The Big Steppers'], + features: ['Goosebumps (with Travis Scott)', 'Control (with Big Sean)', 'Collard Greens (with ScHoolboy Q)', 'Pray for Me (with The Weeknd)'], + playlists: ['Kendrick Essentials', 'RapCaviar', 'Hip-Hop Hits', 'Workout Mix'], }; username: string = ''; constructor( - private authService: AuthService, - private router: Router, - protected dialog: MatDialog, - private screenSizeService: ScreenSizeService, - private spotifyService: SpotifyService, - public moodService: MoodService, + private authService: AuthService, + private router: Router, + protected dialog: MatDialog, + private screenSizeService: ScreenSizeService, + private spotifyService: SpotifyService, + public moodService: MoodService, ) { this.currentMood = this.moodService.getCurrentMood(); this.moodComponentClasses = this.moodService.getComponentMoodClasses(); @@ -78,30 +76,44 @@ export class ArtistProfileComponent implements AfterViewInit { this.imgpath = res.user.user_metadata.picture; }); } - async ngOnInit() { this.screenSizeService.screenSize$.subscribe(screenSize => { this.screenSize = screenSize; }); + if (typeof window !== 'undefined') { + await this.spotifyService.init(); + } } - getAlbumArt(item: string): string { - // Placeholder function to return a default album art - return '../assets/images/damn.jpeg'; + onNavChange($event: string) {} + + openDialog(): void { + const dialogRef = this.dialog.open(EditProfileModalComponent, { + width: '250px', + }); + + dialogRef.afterClosed().subscribe((result) => { + console.log('The dialog was closed'); + }); + + } - playSong(song: string): void { - // Logic to play the selected song - console.log(`Playing song: ${song}`); + save() { + if (localStorage.getItem('path') !== null) { + // @ts-ignore + this.imgpath = localStorage.getItem('path'); + } } - viewAlbum(album: string): void { - // Logic to view the selected album - console.log(`Viewing album: ${album}`); + refresh() { + this.authService.currentUser().subscribe((res) => { + this.username = res.user.user_metadata.username; + }); } - viewPlaylist(playlist: string): void { - // Logic to view the selected playlist - console.log(`Viewing playlist: ${playlist}`); + getAlbumArt(song: string): string { + // Placeholder function to return a default album art + return '../assets/images/damn.jpeg'; } }