import { Component, OnDestroy, OnInit } from '@angular/core';
import { Router } from '@angular/router';

@Component({
  selector: 'app-carrusel-home',
  templateUrl: './carrusel-home.component.html',
  styleUrl: './carrusel-home.component.css'
})
export class CarruselHomeComponent implements OnInit, OnDestroy {
  currentSlideIndex = 0; 
  intervalId: any;

  constructor(
    private _router: Router
  ) {

  }

  ngOnInit(): void {
    this.startAutoplay(); 
  }

  startAutoplay() {
    this.intervalId = setInterval(() => {
      this.nextSlide();
    }, 4000); 
  }

  nextSlide(): void {
    const totalSlides = 3;
    this.currentSlideIndex = (this.currentSlideIndex + 1) % totalSlides;

    
    const slideRadio = document.getElementById(`slide-${this.currentSlideIndex + 1}`) as HTMLInputElement;
    if (slideRadio) {
      slideRadio.checked = true;
    }
  }

  redirectPage(){
    this._router.navigate(['/404']);
  }

  ngOnDestroy(): void {
    if (this.intervalId) {
      clearInterval(this.intervalId);
    }
  }
}
