import { stringify } from '@angular/compiler/src/util';
import { Component, OnInit } from '@angular/core';
import { ModalController } from '@ionic/angular';
import { DiscotecaI } from '../interfaces/discoteca-i';
import { Eventoi } from '../interfaces/eventoi';
import { Reservai } from '../interfaces/reservai';
import { ReservamodalPage } from '../reservamodal/reservamodal.page';
import { ApiService } from '../services/api.service';
import { CodigoreservaService } from '../services/codigoreserva.service';
import { FeedService } from '../services/feed.service';
import { LoginService } from '../services/login.service';

@Component({
  selector: 'app-view-evento-cliente',
  templateUrl: './view-evento-cliente.page.html',
  styleUrls: ['./view-evento-cliente.page.scss'],
})
export class ViewEventoClientePage implements OnInit {

  evento: Eventoi;
  discoteca: DiscotecaI;
  reserva: Reservai;
  codigoReserva: string;
  reservaRealizada: boolean;

  constructor(private feedService: FeedService, private modalController: ModalController, 
    private codigoReservaService: CodigoreservaService, private loginService: LoginService, private apiService: ApiService) { }

  ngOnInit() {
    this.reservaRealizada = false;
    this.evento = this.feedService.getEventoByIndex(this.feedService.eventoIndex);
    this.discoteca = this.feedService.discotecaEvento;
  }

  generarCodigo(){
    return stringify(this.codigoReservaService.generarAleatorio());
  }

  initReserva(){
    this.reserva = {
      UserID: this.loginService.user.userID,
      EventoID: this.evento.id,
      codigoDescuento: null,
      codigoUnico: '',
      codigoUnicoID: null,
      descuentoPorciento: null
    }
  }

  openReserva(){
    this.initReserva();
    this.reserva.codigoDescuento =  (<HTMLInputElement>document.getElementById("codigoDescuento")).value;
    this.reserva.codigoUnico = this.generarCodigo();
    this.creaReserva(this.reserva);
  }

  creaReserva(reserva){
    this.apiService.creaReserva(reserva)
    .subscribe(
      data => {
        console.log(data);
        this.reserva = data;
        this.reservaRealizada = true;
        this.modalController.create({
          component: ReservamodalPage,
          componentProps : {
            codigo: this.reserva.codigoUnico,
            descuento: this.reserva.descuentoPorciento
          }
  
        }).then(modal => modal.present());
      },
      error => {
        console.log(error);
      }
    )
  }

}