import { Component, OnInit } from '@angular/core';
import * as faker from 'faker';
import { Location } from '@angular/common';

@Component({
    selector: 'app-quiz',
    templateUrl: './quiz.page.html',
    styleUrls: ['./quiz.page.scss'],
})
export class QuizPage implements OnInit {
    secondsPerQuestion: number;
    selectedQuestion: number = 0;

    questionType: 'MCQ' | 'CARD';

    questions: Array<{
        type: 'MCQ' | 'CARD',
        question: any,
        choices?: Array<{
            value: string,
            text: string,            
        }>,
        correctAnswer?: string,
        secondsAllotted: number
    }>;
    showReport: boolean = true;

    constructor(
        private location: Location
    ) { }

    back() {
        this.location.back();
    }

    ngOnInit() {
        this.startQuiz();
    }


    startQuiz() {
        this.selectedQuestion = 0;
        this.showReport = false;

        let timer = setInterval(() => {
            if (this.secondsPerQuestion === 0) {
                clearInterval(timer);
            } else {
                this.secondsPerQuestion -= 1;
            }
        }, 1000);        

        let cardQuestions = [{
            text: 'Is this Chris Gayle?',
            image: 'https://i.ebayimg.com/images/g/IP0AAOSwaZVec~9X/s-l300.jpg'
        }, {
            text: 'KL Rahul has scored 4 consecutive 50s, True or False?',
            image: 'https://www.insidesport.co/wp-content/uploads/2019/04/KL-Rahul-1-696x464.jpg'
        }, {
            text: 'Who is a better Capt?',
            image: 'https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcSUsEaO3_mUEhJ6OGUcu5LS-ZfPi228FSLxng&usqp=CAU'
        }, {
            text: 'Who will win the next game?',
            image: 'https://firstsportz.com/wp-content/uploads/2020/10/WhatsApp-Image-2020-10-25-at-6.12.13-PM-1024x576.jpeg'
        }];

        this.questions = [{
            type: 'MCQ',
            question: 'Who has highest S/R in KXIP history?',
            choices: [{
                value: 'A',
                text: 'Rahul K L'
            }, {
                value: 'B',
                text: 'Glen Maxwell'
            }, {
                value: 'C',
                text: 'V Sehwag'
            }, {
                value: 'D',
                text: 'R Ashwin'
            }],
            correctAnswer: 'A',
            secondsAllotted: 20
        }, {
            type: 'MCQ',
            question: 'Who Scored highest runs in KXIP History?',
            choices: [{
                value: 'A',
                text: 'Rahul K L'
            }, {
                value: 'B',
                text: 'Glen Maxwell'
            }, {
                value: 'C',
                text: 'V Sehwag'
            }, {
                value: 'D',
                text: 'N Pooran'
            }],
            correctAnswer: 'C',
            secondsAllotted: 20
        }, {
            type: 'CARD',
            question: cardQuestions,
            secondsAllotted: 20
        }];

        this.secondsPerQuestion = this.questions[this.selectedQuestion].secondsAllotted;
        this.questionType = this.questions[this.selectedQuestion].type;
    }


    nextQuestion() {
        if (this.selectedQuestion < this.questions.length - 1) {
            this.selectedQuestion += 1;
            this.secondsPerQuestion = this.questions[this.selectedQuestion].secondsAllotted;
            this.questionType = this.questions[this.selectedQuestion].type;
        } else {
            this.showReport = true;
        }
    }

    getCardEvent(data) {
        if (data) {
            if (data.end) {
                this.nextQuestion();
            }
        }
    }

}
