AltitudeWeb/frontend/src/app/home/home.component.ts
Teriuihi de989ad5a0 Add rules page and enhance home slider functionality
Introduced a new "Rules" component with its routing, templates, and styles, outlining server rules. Enhanced the home slider with navigation dots, updated click events, and improved styling for active/inactive indicators. Also modified the header component to support dynamic height styling.
2025-04-05 21:22:59 +02:00

71 lines
1.8 KiB
TypeScript

import {Component, OnInit} from '@angular/core';
import {Title} from '@angular/platform-browser';
import {ALTITUDE_VERSION} from '../constant';
@Component({
standalone: false,
selector: 'app-home',
templateUrl: './home.component.html',
styleUrl: './home.component.scss'
})
export class HomeComponent implements OnInit {
constructor(private titleService: Title) {
}
ngOnInit(): void {
this.titleService.setTitle('Survival Minecraft Server on ' + ALTITUDE_VERSION + ' | Altitude Community');
}
private slides: string[] = ["/public/img/backgrounds/caruselimage2.png",
"/public/img/backgrounds/caruselimage4.png",
"/public/img/backgrounds/caruselimage1.png",
"/public/img/backgrounds/caruselimage5.png",
"/public/img/backgrounds/caruselimage3.png"
];
private slideIndex = 0;
get slide(): string {
return this.slides[this.slideIndex];
}
public previousSlide(): void {
if (this.slideIndex > 0) {
this.slideIndex--;
} else {
this.slideIndex = this.slides.length - 1;
}
}
public nextSlide(): void {
this.slideIndex = (this.slideIndex + 1) % this.slides.length;
}
public copyToClipboard(text: string): void {
navigator.clipboard.writeText(text);
}
public getSlideIndices(): number[] {
return Array.from({length: this.slides.length}, (_, i) => i);
}
public setSlide(slide: number): void {
this.slideIndex = slide;
}
public getDotClass(slide: number): string {
return slide == this.slideIndex ? 'active-dot' : 'inactive-dot';
}
scrollToSection(): void {
const element = document.getElementById('scrollingpoint');
if (element) {
element.scrollIntoView({behavior: 'smooth', block: 'start'});
} else {
console.error('Element with id "scrollingpoint" not found.');
}
}
protected readonly ALTITUDE_VERSION = ALTITUDE_VERSION;
}