IMMREX7

@extends('students.student_layout')
@section('content')
<div class="row clearfix">

<!--</div>
<div class="row clearfix">-->
    <div class="col-sm-12">
        <div class="card">
            <div class="header">
                <h2><strong>Exams</strong></h2>
            </div>
            <div class="body table-responsive">
                <table class="table table-bordered table-striped table-hover js-basic-example dataTable">
                    <thead>
                        <tr>
                            <th>S. No.</th>
                            <th>Date</th>
                            <th>Exam Name</th>
                            <th>Duration</th>
                            <th>Marks</th>
                            <th></th>
                        </tr>
                    </thead>
                    <tbody>
                        <?php $i = 1; ?>
                        @foreach($exams as $value)
                        <tr>
                            <th scope="row">{{$i}}</th>
                            <td>{{$value->examDate}}</td>
                            <td>{{$value->examName}}</td>
                            <td>{{$value->examTime}}</td>
                            <td>{{$value->totalMarks}}</td>
                            <td class="js-sweetalert"><button class="btn btn-raised btn-primary waves-effect" data-type="success" data-id="{{$value->idMcq}}" data-name="{{$value->examName}}" data-time="{{ \Carbon\Carbon::parse($value->examDate)->format('F d,Y H:m:s')}}">Start Exam</button>
                                <a href="{{url('/student/exam/result/' . $value->idMcq)}}" class="btn btn-danger" target="_blank">View Result</a>
                            </td>
                        </tr>
                        <?php $i++; ?>
                        @endforeach
                    </tbody>
                </table>
            </div>
             {{ $exams->links() }}
        </div>
    </div>
</div>
@stop
@section('script')
<script type="text/javascript"></script>
<script type="text/javascript">
$(function () {
    $('.js-sweetalert button').on('click', function () {
        showHtmlMessage($(this));
    });
});
var x ;
function showHtmlMessage(e) {
    var countDownDate = new Date(e.data('time')).getTime();
    var id = e.data('id');
    clearInterval(x);
    swal({
        title: e.data('name'),
        text: "<span id=\"timer-demo\" style=\"color: #CC0000\">"+e.data('time')+"<span>",
        type: "info",
        showCancelButton: true,
        closeOnConfirm: false,
        confirmButtonText : "Start Exam",
        showLoaderOnConfirm: true,
        html: true
        }, function () {
            $.ajax({
                type: "GET",
                url: "{{url('/student/exam/checker/')}}",
                data: {id:e.data('id')}
                       
            })
            .done(function(data) {
               if(data == "not started")
               showHtmlMessage(e);
               else {
                    swal.close();
                    window.location = "{{url('student/exam/questions/')}}"+"/"+id;
               }
            });
            return false;
    });
   
    x = setInterval(function() {
      var now = new Date().getTime();
      var distance = countDownDate - now;
      var days = Math.floor(distance / (1000 * 60 * 60 * 24));
      var hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
      var minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
      var seconds = Math.floor((distance % (1000 * 60)) / 1000);
      
      document.getElementById("timer-demo").innerHTML = "Time Left : "+days + "d " + hours + "h "
      + minutes + "m " + seconds + "s ";
        
      if (distance < 0) {
       clearInterval(x);
        document.getElementById("timer-demo").innerHTML = "Exam has been started click the start exam button";
      }
    }, 1000);
}
</script>

@stop