@extends('layouts.teacher')

<title>{{ config('app.name', 'Laravel') }} | Teacher | Students</title>

<style>
    .bg-custom1 {
        background-color: #f1f1f1 !important;
    }
    .bg-custom_success {
        background-color: #009700 !important;
    }
    .question_table{
        border-spacing: 0 10px;
        border-collapse: separate;
    }
    .td_innerr {
        display: flex;
        gap: 6px;
    }
    .td_innerr strong {
        flex: 0 0 25px;
        max-width: 25px;
    }
</style>

@section('main-content')
<div class="container"></br>

    @if(count($questionsData) > 0)
        <div class="mb-2">
            <h2 class="col-10">{{$questionsData[0]->exam->heading}}</h2>
            <div style="text-align: end;">
                <a class="col-1 btn btn-primary text-white" href="/questionbank/{{$questionsData[0]->exam_id}}">Edit</a>
            </div>
        </div>
    @else
        <div class="mb-2">
            <h2 class="col-10">{{$unAttemptedQuestions[0]->exam->heading}}</h2>
            <div style="text-align: end;">
                <a class="col-1 btn btn-primary text-white" href="/questionbank/{{$unAttemptedQuestions[0]->exam_id}}">Edit</a>
            </div>
        </div>
    @endif
    <div class="card">
        <div class="card-body">
            <p><strong>Score:</strong> {{ $examMarks }}/{{$totalMarks}}</p>
            <p><strong>Correct Answers:</strong> {{ $totalCorrectAnswers }}</p>
            <p><strong>Number Of Questions:</strong> {{ $totalQuestions }}</p>
            <p><strong>Attempted Questions:</strong> {{ count($questionsData) }}</p>
            <p id="resultDisplay"></p>
        </div>
    </div>
    <br>
    @if(count($questionsData) > 0)
        <h4>Attempted Question List</h4>
        <form id="examResultForm">
            @php
                $totalObtainedMarks = 0;
            @endphp
            @foreach($questionsData as $question)
                <div class="card mb-3">
                    <div class="card-body">
                        <h5 class="card-title">{{ $question->question_text }}</h5>
                                                    </p>
                        @php
                            $options = [
                                'question_option1' => $question->question_option1,
                                'question_option2' => $question->question_option2,
                                'question_option3' => $question->question_option3,
                                'question_option4' => $question->question_option4,
                            ];
                        @endphp

                        @if(array_key_exists($question->correct_answer, $options))
                            <table class="table question_table">
                                <tbody>
                                    <tr>
                                        <td class="p-2 col-10 {{$question->correct_answer=='question_option1'?'bg-custom_success text-white':(($question->question_option1==$resultArr[$question->id])?'bg-danger text-white':'bg-custom1')}}"><div class="td_innerr"><strong>A ) </strong> {{ $question->question_option1 }} </div></td>
                                        <td class="col-4 {{$question->correct_answer=='question_option1'?'bg-custom_success text-white':(($question->question_option1==$resultArr[$question->id])?'bg-danger text-white':'bg-custom1')}}">
                                            {{($question->correct_answer=='question_option1' && $question[$question->correct_answer]==$resultArr[$question->id])?"Correct Answer": (($question->question_option1==$resultArr[$question->id])?"Wrong Answer":"")}}
                                        </td>                              
                                    </tr>
                                    <tr>
                                        <td class="p-2 {{$question->correct_answer=='question_option2'?'bg-custom_success text-white':(($question->question_option2==$resultArr[$question->id])?'bg-danger text-white':'bg-custom1')}}"><div class="td_innerr"><strong>B ) </strong> {{ $question->question_option2 }}</div></td>
                                        <td class="col-4 {{$question->correct_answer=='question_option2'?'bg-custom_success text-white':(($question->question_option2==$resultArr[$question->id])?'bg-danger text-white':'bg-custom1')}}">
                                            {{($question->correct_answer=='question_option2' && $question[$question->correct_answer]==$resultArr[$question->id])?"Correct Answer": (($question->question_option2==$resultArr[$question->id])?"Wrong Answer":"")}}
                                        </td>       
                                    </tr>
                                    <tr>
                                        <td class="p-2 {{$question->correct_answer=='question_option3'?'bg-custom_success text-white':(($question->question_option3==$resultArr[$question->id])?'bg-danger text-white':'bg-custom1')}}"><div class="td_innerr"><strong>C ) </strong> {{ $question->question_option3 }}</div></td>
                                        <td class="col-4 {{$question->correct_answer=='question_option3'?'bg-custom_success text-white':(($question->question_option3==$resultArr[$question->id])?'bg-danger text-white':'bg-custom1')}}">
                                            {{($question->correct_answer=='question_option3' && $question[$question->correct_answer]==$resultArr[$question->id])?"Correct Answer": (($question->question_option3==$resultArr[$question->id])?"Wrong Answer":"")}}
                                        </td>  
                                    </tr>
                                    <tr>
                                        <td class="p-2 {{$question->correct_answer=='question_option4'?'bg-custom_success text-white':(($question->question_option4==$resultArr[$question->id])?'bg-danger text-white':'bg-custom1')}}"><div class="td_innerr"><strong>D ) </strong> {{ $question->question_option4 }}</div></td>
                                        <td class="col-4 {{$question->correct_answer=='question_option4'?'bg-custom_success text-white':(($question->question_option4==$resultArr[$question->id])?'bg-danger text-white':'bg-custom1')}}">
                                            {{($question->correct_answer=='question_option4' && $question[$question->correct_answer]==$resultArr[$question->id])?"Correct Answer": (($question->question_option4==$resultArr[$question->id])?"Wrong Answer":"")}}
                                        </td>       
                                    </tr>
                                </tbody>
                            </table>
                        @else
                            <p>Invalid correct answer key</p>
                        @endif
                        <table class="table question_table">
                            <tr>
                                <td class="col-5">
                                    <div>
                                        Marks Obtained : {{$question[$question->correct_answer]==$resultArr[$question->id]?$question->question_marks:0}}
                                    </div>
                                </td>
                                {{-- <td class="col-11">
                                    <input class="form-control marksInput" placeholder="Enter marks from 0 to {{$question->question_marks}}"/> 
                                </td>
                                <td>
                                    <button class="btn btn-success">Add</button>
                                </td> --}}
                            </tr>
                        </table>
                    </div>
                </div>
            @endforeach
        </form>
    @else
        {{-- <p>No questions found for this exam.</p> --}}
    @endif

    @if (count($unAttemptedQuestions)>0)
        <br/>
        <h4>Unattempted Question List</h4>
    @endif
    @foreach ($unAttemptedQuestions as $question)
        <div class="card mb-3">
            <div class="card-body">
                <h5 class="card-title">{{ $question->question_text }}</h5>
                @php
                    $options = [
                        'question_option1' => $question->question_option1,
                        'question_option2' => $question->question_option2,
                        'question_option3' => $question->question_option3,
                        'question_option4' => $question->question_option4,
                    ];
                @endphp

                @if(array_key_exists($question->correct_answer, $options))
                    <table class="table question_table">
                        <tbody>
                            <tr>
                                <td class="p-2 col-10 {{$question->correct_answer=='question_option1'?'bg-custom_success text-white':'bg-custom1'}}"><div class="td_innerr"><strong>A ) </strong> {{ $question->question_option1 }}</div> </td>
                                <td class="col-4 {{$question->correct_answer=='question_option1'?'bg-custom_success text-white':'bg-custom1'}}">
                                    {{($question->correct_answer=='question_option1')?"Correct Answer":""}}
                                </td>                              
                            </tr>
                            <tr>
                                <td class="p-2 {{$question->correct_answer=='question_option2'?'bg-custom_success text-white':'bg-custom1'}}"><div class="td_innerr"><strong>B ) </strong> {{ $question->question_option2 }}</div></td>
                                <td class="col-4 {{$question->correct_answer=='question_option2'?'bg-custom_success text-white':'bg-custom1'}}">
                                    {{($question->correct_answer=='question_option2')?"Correct Answer":""}}
                                </td>       
                            </tr>
                            <tr>
                                <td class="p-2 {{$question->correct_answer=='question_option3'?'bg-custom_success text-white':'bg-custom1'}}"><div class="td_innerr"><strong>C ) </strong> {{ $question->question_option3 }}</div></td>
                                <td class="col-4 {{$question->correct_answer=='question_option3'?'bg-custom_success text-white':'bg-custom1'}}">
                                    {{($question->correct_answer=='question_option3')?"Correct Answer":""}}
                                </td>  
                            </tr>
                            <tr>
                                <td class="p-2 {{$question->correct_answer=='question_option4'?'bg-custom_success text-white':'bg-custom1'}}"><div class="td_innerr"><strong>D ) </strong> {{ $question->question_option4 }}</div></td>
                                <td class="col-4 {{$question->correct_answer=='question_option4'?'bg-custom_success text-white':'bg-custom1'}}">
                                    {{($question->correct_answer=='question_option4')?"Correct Answer":""}}
                                </td>       
                            </tr>
                        </tbody>
                    </table>
                    {{-- <p class="bg-success text-white p-2 rounded"><strong>Correct Answer:</strong> {{ $options[$question->correct_answer] }}</p> --}}
                @else
                    <p>Invalid correct answer key</p>
                @endif
                <table class="table">
                    <tr>
                        <td class="col-5">
                            <div>
                                Marks Obtained : 0
                            </div>
                        </td>
                    </tr>
                </table>
            </div>
        </div>
    @endforeach
    </div>

<script>
    function calculateResult() {
        var marksInputs = document.getElementsByClassName('marksInput');
        var totalCorrectAnswers = 0;
        var totalQuestionsAttempted = 0;

        for (var i = 0; i < marksInputs.length; i++) {
            var marks = parseInt(marksInputs[i].value) || 0;

            if (marks > 0) {
                totalCorrectAnswers++;
            }

            if (marks >= 0) { // Assuming a non-negative value indicates an attempted question
                totalQuestionsAttempted++;
            }
        }

        if (totalQuestionsAttempted > 0) {
            var percentage = (totalCorrectAnswers / totalQuestionsAttempted) * 100;
            document.getElementById('resultDisplay').innerHTML = 'Result: ' + percentage.toFixed(2) + '% (Correct Answers: ' + totalCorrectAnswers + ')';
        } else {
            document.getElementById('resultDisplay').innerHTML = 'Result cannot be calculated as no questions were attempted.';
        }
    }
</script>
@endsection