import { Component, Injectable } from '@angular/core';
import { Router } from '@angular/router';
import { ModalController } from '@ionic/angular';

@Injectable({
  providedIn: 'root'
  })

@Component({
  selector: 'app-home',
  templateUrl: 'modalsGame.page.html',
  styleUrls: ['modalsGame.page.scss'],
})
export class ModalsGamePage {

  constructor(private router: Router, public modalController: ModalController) {}

  async presentModal(game: string) {
    const modal = await this.modalController.create({
      component: ModalsGamePage,
      cssClass: 'my-custom-class',
      componentProps: {
        'gameTitle': game,
      }
    });
    return await modal.present();
  }

  dismiss() {
    // using the injected ModalController this page
    // can "dismiss" itself and optionally pass back data
    this.modalController.dismiss({
      'dismissed': true
    });
  }

  play(game: string) {
    // check if game cookie exists
    // create cookie with data if non existing
    // continue or restart with cookie
    
    // when all the steps are done and clicked on play, dismiss modal and open page
    this.dismiss();
    // routing is in lowercase, set text to lower
    this.router.navigateByUrl(`/${game.toLowerCase()}`);
  }
}
