<?php

    session_start();

    include "../db.php";

    date_default_timezone_set('Asia/Kolkata');

    $currentTime = date('M j, Y g:i a');

    $now = date('h:i:s',time());

    if ( !isset($_SESSION['uid']) && !isset($_SESSION['uref']) && !isset($_SESSION['utype']) && !isset($_SESSION['uname']) )

        header("Location: logout.php");



    $m_sql = "SELECT mocktest_name, id, mock_time FROM mocktest WHERE id = '$_SESSION[mocktest_id]'";

    $m_result = mysqli_query($con, $m_sql);

    $m_row = mysqli_fetch_assoc($m_result);

    $test = "SELECT * FROM examination WHERE exam_ref = '$_SESSION[Exam_ref]'";

    $testresult = mysqli_query($con, $test);

    $cout = mysqli_num_rows($testresult);

    // echo $_SESSION['expire'];

    $timestamp = strtotime($_SESSION['expire']);

    $localtime = strtotime($now);

    $time= $timestamp-$localtime;

    $mins = floor($time / 60);

    $secs = floor($time % 60);

    if(!isset($_SESSION['Exam_ref'])){

        header("Location: view-mocktest.php");

    }

?>



<!DOCTYPE html>

<html lang="en">



<head>

    <?php include "includes/meta.php"; ?>

    <?php include "includes/css.php"; ?>



    <style>

        .modal.fade .modal-dialog {

            width: 100%;

            margin: 0 auto;

        }



        .mock_container {

            background: #f5f5f5;

            padding-top: 10px;

            padding-left: 100px;

            padding-right: 100px;

            padding-bottom: 150px;

        }



        .question_btn {

            font-size: 20px;

            padding-left: 13px;

            padding-right: 13px;

            margin: 7px;

        }



        .tabs ul {

            margin: 0;

            padding: 0;

        }



        .tabs li {

            display: inline-block;

            color: #fefefe;

            border-width: 1px 1px 0 1px;

            /* margin-right: 5px; */

        }



        .tabs a {

            display: block;

            /* padding: 10px 15px; */

            font-weight: bold;

            color: #fff;

        }



        .tabs li.active {

            background: #FFF;

            color: #000;

        }



        .tabs-content div:not(:first-child) {

            display: none;

        }



        .btn {

            border-radius: 0px;

        }



        .quest_btn button {

            padding-left: 45px;

            padding-right: 45px;

        }



        .form-check {

            padding-left: 0px;

            margin-bottom: 15px;

        }



        .form-check-label {

            padding-right: 22px;

        }

        /* .card {

            min-height: 500px;

        } */

    </style>

</head>



<body id="page-top" class="mt-55">



    <div style="margin-top: 70px;"></div>



    <?php include "includes/header2.php"; ?>

    <div class="mock_container" style="background: #f5f5f5;">

        <div class="row">

            <div class="col-md-12 bg-dark text-light">Welcome: <span><?php echo $_SESSION['Exam_ref'];?></span></div>

        </div>

        <div class="row my-5">

            <div class="col-md-12 text-danger">

                <h3> Test Name: <?php echo $m_row['mocktest_name'];?></h3>

            </div>

        </div>

        <div class="row">

            <table class="table table-striped">

                <tr class="bg-white" style="border: 1px solid #ddd;">

                    <td width="45%">Total Questions − <?php echo $cout;?></td>

                    <td width="10%" class="text-center" style="border: 1px solid #ddd;">Time Left: <span

                            id="mockTime"><?php echo "$mins:$secs";?></span></td>

                    <td width="45%" class="text-right">Max Time − <?php echo $m_row['mock_time'];?> Min</td>

                </tr>

            </table></div>

        <div class="row">

            <div class="col-md-7 px-0">

                <div class="card px-4 py-2">

                    <section class="tabs-content">

                        <?php 

                    foreach($testresult as $Qkey => $questions){

                        $getQuestions = "SELECT * FROM question WHERE id='$questions[question_id]'";

                        $run = mysqli_query($con, $getQuestions);

                        $questionsResult = mysqli_fetch_assoc($run);

                    ?>

                        <div id="tab<?php echo $Qkey+1;?>">

                            <h4><strong>Question No: <?php echo $Qkey+1;?></strong></h4>

                            <!-- <img src="../user3/upload/question/<?php echo $questionsResult['question_image'];?>" alt="" width="100%"> -->

                            <?php 

                       if(isset($questionsResult['question_name'])){?>

                            <p><?php echo $questionsResult['question_name'];?></p>

                            <?

                       }else{?>

                            <img src="../user3/upload/question/<?php echo $questionsResult['question_image'];?>" alt="" width="100%">

                            <?php

                       }

                       ?>

                            <form action="" id="optionForm<?php echo $questionsResult['id'];?>">

                                <input type="hidden" id="EXAM<?php echo $questionsResult['id']; ?>"

                                    value="<?php echo $questions['id']; ?>">

                                <input type="hidden" id="REF<?php echo $questionsResult['id']; ?>" value="<?php echo $questions['exam_ref']; ?>">

                                <section class="form-check" id="sectionRadio<?php echo $questionsResult['id'];?>">

                                    <label class="form-check-label" for="<?php echo $questionsResult['id'];?>flex1">A.

                                    </label>

                                    <input class="form-check-input" type="radio"

                                        name="option<?php echo $questionsResult['id'];?>"

                                        id="<?php echo $questionsResult['id'];?>flex1" value="A">

                                </section>

                                <section class="form-check">

                                    <label class="form-check-label" for="<?php echo $questionsResult['id'];?>flex2">B.

                                    </label>

                                    <input class="form-check-input" type="radio"

                                        name="option<?php echo $questionsResult['id'];?>"

                                        id="<?php echo $questionsResult['id'];?>flex2" value="B">

                                </section>

                                <section class="form-check">

                                    <label class="form-check-label" for="<?php echo $questionsResult['id'];?>flex3">C.

                                    </label>

                                    <input class="form-check-input" type="radio"

                                        name="option<?php echo $questionsResult['id'];?>"

                                        id="<?php echo $questionsResult['id'];?>flex3" value="C">

                                </section>

                                <section class="form-check">

                                    <label class="form-check-label" for="<?php echo $questionsResult['id'];?>flex4">D.

                                    </label>

                                    <input class="form-check-input" type="radio"

                                        name="option<?php echo $questionsResult['id'];?>"

                                        id="<?php echo $questionsResult['id'];?>flex4" value="D">

                                </section>

                                <section>

                                    <span id="alert<?php echo $questionsResult['id'];?>"></span>

                                </section>

                                <section class="tabs quest_btn py-3">

                                    <ul class="row">

                                        <li class="col-6 col-md-3"><button id="<?php echo $questionsResult['id'];?>"

                                                class="btn btn-primary" onclick="return myFunction(this.id);">Clear

                                                Responce</button></li>

                                        <li class="col-6 col-md-3">

                                            <?php 

                            $sl = $Qkey+1;

                            if($sl!=$cout){

                                ?>

                                            <a href="#tab<?php echo $Qkey+2;?>" class="btn btn-primary"

                                                id="SKIP<?php echo $questionsResult['id'];?>"

                                                onclick="return mySkip(event, this.id);">Skip</a>

                                            <?php

                            }

                                ?>

                                        </li>

                                        <li class="col-6 col-md-3">

                                            <?php 

                            if($sl==$cout){

                                ?>

                                            <button type="submit" id="NSUBMIT<?php echo $questionsResult['id'];?>"

                                                class="btn btn-success" onclick="return myNext(event, this.id);">Save &

                                                Submit</button>

                                            <?php

                            }else{

                                ?>

                                            <a href="#tab<?php echo $Qkey+2;?>"

                                                id="NEXT<?php echo $questionsResult['id'];?>" class="btn btn-success"

                                                onclick="return myNext(event, this.id);">Save & Next</a>

                                            <?php }?>

                                        </li>

                                        <li class="col-6 col-md-3">

                                            <button type="submit" id="FINAL<?php echo $questionsResult['id'];?>"

                                                class="btn btn-danger" onclick="return myFinal(event, this.id);">Final

                                                Submit</button>

                                            <!-- <a href="javascript:void(0)" ></a> -->

                                        </li>

                                    </ul>

                                </section>

                            </form>

                        </div>

                        <?php

                    }

                    ?>

                    </section>

                </div>

            </div>

            <div class="col-md-5 px-0">

                <div class="card p-2">

                    <div class="tabs">

                        <ul>

                            <?php 

                            foreach($testresult as $Qkey => $questions){

                            ?>

                            <li class="active"><a href="#tab<?php echo $Qkey+1;?>" class="btn btn-primary question_btn"

                                    id="button<?php echo $questions['id'];?>"

                                    data-toggle="tab"><?php echo $Qkey+1;?></a></li>

                            <?php }?>

                        </ul>

                    </div>

                </div>

            </div>

            <!-- <form action="FinalTestForm"> -->

                <input type="hidden" id="Examination_ref" value="<?php echo $_SESSION['Exam_ref'];?>">

            <!-- </form> -->

            <?php include "includes/ft.php"; ?>

            <?php include "includes/js.php"; ?>

        </div>

    </div>

    </div>

</body>

<script>

    function myFunction(id) {

        $('#optionForm' + id + ' input[type="radio"]').prop('checked', false);

        return false;

    }



    function mySkip(event, id) {

        event.preventDefault();

        var str = id;

        str = str.split('P')[1];

        var exam = $('#EXAM' + str + '').val();

        $('#optionForm' + str + ' input[type="radio"]').prop('checked', false);

        $.ajax({

            type: "POST",

            url: "examination-ajax.php",

            data: {

                id: str,

                skip_id: exam

            },

            success: function (data) {

                if (data == "TRUE") {

                    $('#button' + exam + '').css({

                        "background": "red",

                        "border": "red"

                    });

                } else {

                    alert('something Happened!');

                }

            },

            error: function () {

                console.log("error");

            }

        });

        return false;

    }



    function myNext(event, id) {

        event.preventDefault();

        var str = id;

        str = str.split('T')[1];

        var next_id = $('#EXAM' + str + '').val();

        if (!$("input[type=radio][name=option" + str + "]").is(":checked")) {

            alert("Please check your option!");

            // window.setTimeout(function(){

            // $('#alert'+str+'').fadeOut();

            // }, 8000);

            return false;

        } else {

            var option = $("input[type=radio][name=option" + str + "]:checked").val();

        }

        $.ajax({

            type: "POST",

            url: "examination-ajax.php",

            data: {

                id: str,

                next_id: next_id,

                next_option: option

            },

            success: function (data) {

                if (data == "TRUE") {

                    $('#button' + next_id + '').css({

                        "background": "green",

                        "border": "green"

                    });

                } else {

                    alert('something Happened!');

                }



            },

            error: function () {

                console.log("error");

            }

        });

        return false;

    }



    function myFinal(event, id) {

        event.preventDefault();

        var str = id;

        str = str.split('L')[1];

        var submit_id = $('#REF' + str + '').val();

        if (!confirm("Are you want to submit this test ?")) {

            return false;

        }

        $.ajax({

            type: "POST",

            url: "examination-ajax.php",

            data: {

                id: str,

                submit_id: submit_id,

            },

            success: function (data) {

                if (data == "FALSE") {

                    alert('something Happened!');

                } else {

                    window.location = 'examination-result.php?exam_id='+submit_id+'';

                }



            },

            error: function () {

                console.log("error");

            }

        });

        // return false;

    }

    $(function () {

        $('.tabs a').click(function () {

            // Check for active

            $('.tabs li').removeClass('active');

            $(this).parent().addClass('active');

            // Display active tab

            let currentTab = $(this).attr('href');

            $('.tabs-content div').hide();

            $(currentTab).show();

            return false;

        });

    });



    startTimer();



    function startTimer() {

        var presentTime = document.getElementById('mockTime').innerHTML;

        var timeArray = presentTime.split(/[:]+/);

        var m = timeArray[0];

        var s = checkSecond((timeArray[1] - 1));

        if (s == 59) {

            m = m - 1

        }

        if ((m + '').length == 1) {

            m = '0' + m;

        }

        if (m < 0) {

            var submit_id = $("#Examination_ref").val();

            $.ajax({

                type: "POST",

                url: "examination-ajax.php",

                data: {

                    submit_id: submit_id,

                },

                success: function (data) {

                    if (data == "FALSE") {

                        alert('something Happened!');

                    } else {

                        window.location = 'examination-result.php?exam_id='+submit_id+'';

                    }



                },

                error: function () {

                    console.log("error");

                }

            });

            m = '59';

        }

        document.getElementById('mockTime').innerHTML = m + ":" + s;

        setTimeout(startTimer, 1000);

    }

    function checkSecond(sec) {

        if (sec < 10 && sec >= 0) {

            sec = "0" + sec

        }; 

        if (sec < 0) {

            sec = "59"

        };

        return sec;

    }

</script>



</html>