From cc286b60071c80f5d19747f412b86b2048c21e25 Mon Sep 17 00:00:00 2001 From: Jan-Marlon Leibl Date: Thu, 13 Feb 2025 12:13:24 +0100 Subject: [PATCH] feat(landing-page): add welcome bonus and game carousel --- .../landing-page/landing-page.component.html | 127 +++++++++++++++++- .../landing-page/landing-page.component.ts | 51 ++++++- .../components/footer/footer.component.html | 6 +- .../components/navbar/navbar.component.ts | 3 +- frontend/src/styles.css | 24 +++- 5 files changed, 199 insertions(+), 12 deletions(-) diff --git a/frontend/src/app/landing-page/landing-page.component.html b/frontend/src/app/landing-page/landing-page.component.html index 4e7c12f..954abf9 100644 --- a/frontend/src/app/landing-page/landing-page.component.html +++ b/frontend/src/app/landing-page/landing-page.component.html @@ -1,2 +1,127 @@ - + +
+
+
+
+

+ Willkommensbonus +

+
+ 200% bis zu 500€ +
+

+ + 200 Freispiele +

+ + +
+ +
+

Beliebte Spiele

+
+
+
+
+
+
+

Slots

+

Klassische Spielautomaten

+ +
+
+
+
+

Plinko

+

Spannendes Geschicklichkeitsspiel

+ +
+
+ +
+ +
+
+
+

Poker

+

Texas Hold'em & mehr

+ +
+
+
+
+

Liars Dice

+

Würfelspiel mit Strategie

+ +
+
+ +
+
+
+ + + + +
+ +
+
+
+ +
+
+
50 Mio.€+
+
Ausgezahlt
+
+ +
+
10 Mio.+
+
Spiele
+
+ +
+
24/7
+
Support *
+
+
+
+
+
diff --git a/frontend/src/app/landing-page/landing-page.component.ts b/frontend/src/app/landing-page/landing-page.component.ts index 826d86f..1471a99 100644 --- a/frontend/src/app/landing-page/landing-page.component.ts +++ b/frontend/src/app/landing-page/landing-page.component.ts @@ -1,10 +1,55 @@ -import { Component } from '@angular/core'; +import { ChangeDetectionStrategy, Component, OnInit, OnDestroy } from '@angular/core'; import { NavbarComponent } from '../shared/components/navbar/navbar.component'; +import { NgFor } from '@angular/common'; @Component({ selector: 'app-landing-page', standalone: true, - imports: [NavbarComponent], + imports: [NavbarComponent, NgFor], templateUrl: './landing-page.component.html', + changeDetection: ChangeDetectionStrategy.OnPush, }) -export class LandingPageComponent {} +export class LandingPageComponent implements OnInit, OnDestroy { + currentSlide = 0; + private autoplayInterval: any; + + ngOnInit() { + this.startAutoplay(); + } + + ngOnDestroy() { + this.stopAutoplay(); + } + + prevSlide() { + this.currentSlide = this.currentSlide === 0 ? 1 : 0; + this.resetAutoplay(); + } + + nextSlide() { + this.currentSlide = this.currentSlide === 1 ? 0 : 1; + this.resetAutoplay(); + } + + goToSlide(index: number) { + this.currentSlide = index; + this.resetAutoplay(); + } + + private startAutoplay() { + this.autoplayInterval = setInterval(() => { + this.nextSlide(); + }, 5000); + } + + private stopAutoplay() { + if (this.autoplayInterval) { + clearInterval(this.autoplayInterval); + } + } + + private resetAutoplay() { + this.stopAutoplay(); + this.startAutoplay(); + } +} diff --git a/frontend/src/app/shared/components/footer/footer.component.html b/frontend/src/app/shared/components/footer/footer.component.html index c5709d3..d29c406 100644 --- a/frontend/src/app/shared/components/footer/footer.component.html +++ b/frontend/src/app/shared/components/footer/footer.component.html @@ -1,4 +1,4 @@ -