diff --git a/frontend/src/app/components/tournament/tournament-public-gallery/tournament-public-gallery.component.scss b/frontend/src/app/components/tournament/tournament-public-gallery/tournament-public-gallery.component.scss index 18b2ead..817d509 100644 --- a/frontend/src/app/components/tournament/tournament-public-gallery/tournament-public-gallery.component.scss +++ b/frontend/src/app/components/tournament/tournament-public-gallery/tournament-public-gallery.component.scss @@ -53,6 +53,8 @@ box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1); z-index: 1000; justify-content: center; + font-weight: bold; + font-size: xx-large; } .centered { @@ -61,5 +63,4 @@ justify-content: center; align-items: center; font-weight: bold; - font-size: xx-large; } diff --git a/frontend/src/app/components/tournament/tournament-public-gallery/tournament-public-gallery.component.ts b/frontend/src/app/components/tournament/tournament-public-gallery/tournament-public-gallery.component.ts index 8a4a833..de62842 100644 --- a/frontend/src/app/components/tournament/tournament-public-gallery/tournament-public-gallery.component.ts +++ b/frontend/src/app/components/tournament/tournament-public-gallery/tournament-public-gallery.component.ts @@ -22,7 +22,7 @@ import { SharedMediaEndpointService, SharedMediaMetadataDto } from '@api'; state( 'shrink', style({ - transform: 'scale(0.2)', + transform: 'scale(0.1)', }), ), transition('expand => shrink', [animate('0.8s')]), @@ -55,10 +55,6 @@ export class TournamentPublicGalleryComponent implements OnInit { animationState: 'expand', }; this.loadImage(data[Math.floor(Math.random() * data.length)], card); - if (i === 6) { - console.log('Placeholde rimg' + card.title); - card.image = 'https://via.placeholder.com/800x600'; - } this.cards.push(card); this.setRandomAnimationInterval(card); } @@ -92,15 +88,11 @@ export class TournamentPublicGalleryComponent implements OnInit { title: string; animationState: string; }) { - const expandedDuration = 4000 + Math.random() * 6000; + const expandedDuration = 4000 + Math.random() * 10000; const shrinkDuration = 1500; setTimeout(() => { this.toggleAnimation(card, 'shrink'); - - setTimeout(() => { - this.toggleAnimation(card, 'expand'); - this.setRandomAnimationInterval(card); - }, shrinkDuration); + this.setRandomAnimationInterval(card); }, expandedDuration); } @@ -117,6 +109,7 @@ export class TournamentPublicGalleryComponent implements OnInit { ) { if (card.animationState === 'shrink') { this.loadImage(this.pictures[Math.floor(Math.random() * this.pictures.length)], card); + card.animationState = 'expand'; } } @@ -144,7 +137,7 @@ export class TournamentPublicGalleryComponent implements OnInit { console.log(`Inside LoadImage ${card.image}`); this.sharedMediaService.getSharedMediaImage(imgEntry.id!).subscribe( response => { - card.image = 'https://via.placeholder.com/1600x1200'; //URL.createObjectURL(response as any); // eslint-disable-line + card.image = URL.createObjectURL(response as any); // eslint-disable-line card.alt = imgEntry.title ?? 'Tournament Picture'; card.author = imgEntry.author ?? 'Mysterious KnowOne'; card.title = imgEntry.title ?? 'Tournament Picture';