@extends('student-panel.layouts.app')


@section('main')

    @php
        function checkResult($results, $testId)
        {
            foreach ($results as $result) {
                if ($result['test_id'] == $testId && $result['status'] != 1) {
                    return false;
                }
            }
            return true;
        }
    @endphp

    <div class="container">
        <div class="test-block">
            <div class="top-strip">
                <div class="details">
                    <p class="name">Hello {{ auth()->user()->name }}!</p>
                    @if (!empty($ieltsTests))
                        <span class="sub-head">Complete these {{ count($ieltsTests) }} Mock tests and assess your
                            progress!</span>
                    @endif

                    @if (!empty($ieltsTests))
                        <div class="profile-progress">
                            <span class="progress-value" id="progress-value"></span>
                            <span class="text">/{{ count($ieltsTests) }}</span>

                            <div id="data_progress_bar" class="progress-line" data-progress="1">
                                <span class="filled-line"></span>
                            </div>
                        </div>
                    @endif
                </div>
                <img src="{{ asset('frontend') }}/assets-desktop/images/mock-test/goal.svg" alt="goal">
            </div>
            @if (!empty($ieltsTests))
                <div class="test-list">

                    @php
                        $firstTestStatus = 'submitted';
                    @endphp
                    @foreach ($ieltsTests as $key => $test)
                        @if ($test->id >= 130)
                            @if (in_array($test->listening_test_id, array_column($results, 'test_id')) &&
                                    in_array($test->writing_test_id, array_column($results, 'test_id')) &&
                                    in_array($test->speaking_test_id, array_column($results, 'test_id')) &&
                                    in_array($test->reading_test_id, array_column($results, 'test_id')))
                                @if (in_array($test->speaking_test_id, array_column($results, 'test_id')) &&
                                        checkResult($results, $test->listening_test_id) &&
                                        checkResult($results, $test->writing_test_id) &&
                                        checkResult($results, $test->reading_test_id) &&
                                        checkResult($results, $test->speaking_test_id))
                                    <div class="single-test result-show">
                                        <div class="test-detail">
                                            <span class="circle"></span>
                                            <p class="test-name">Mock Test</p>
                                            @php

                                                $totalScore = 0;
                                                $totalTests = 4;
                                                @$score = 0;
                                                foreach ($results as $result) {
                                                    if ($result['test_id'] == @$test->listening_test_id) {
                                                        $score = $score + $result['band'];
                                                    } elseif ($result['test_id'] == @$test->writing_test_id) {
                                                        $score = $score + $result['band'];
                                                    } elseif ($result['test_id'] == @$test->reading_test_id) {
                                                        $score = $score + $result['band'];
                                                    } elseif ($result['test_id'] == @$test->speaking_test_id) {
                                                        $score = $score + $result['band'];
                                                    }
                                                }
                                                $averageBand = round(($score / $totalTests) * 2) / 2;
                                                // $averageBand = round($score / $totalTests, 2);
                                            @endphp
                                            <p class="test-result complete-test">{{ $averageBand }} Bands</p>
                                        </div>
                                        <a  title="Check Bands"
                                            href="{{ route('mock-test.ieltsTest', ['testId' => base64_encode($test->id)]) }}">
                                            <img src="{{ asset('frontend') }}/assets-desktop/images/mock-test/arrow-right.svg"
                                                alt="arrow-right">
                                        </a>
                                    </div>
                                @endif
                                @php
                                    $firstTestStatus = 'submitted';
                                @endphp
                            @else
                                @if ($firstTestStatus === 'submitted')
                                    <div class="single-test take-test">
                                        <div class="test-detail">
                                            <span class="circle">{{ $loop->iteration }}</span>
                                            <a class="test-name">Mock Test</a>
                                            {{-- <a href="{{ route('mock-test.ieltsTest', ['testId' => base64_encode($test->id)]) }}"
                                            class="test-name">Mock Test</a> --}}
                                            {{-- <p class="test-result">20 Questions</p> --}}
                                        </div>
                                        <a  title="Take Test"
                                            href="{{ route('mock-test.ieltsTest', ['testId' => base64_encode($test->id)]) }}">
                                            <img src="{{ asset('frontend') }}/assets-desktop/images/mock-test/play.svg"
                                                alt="play">
                                        </a>
                                    </div>
                                    @php
                                        $firstTestStatus = 'unlocked';
                                    @endphp
                                @else
                                    <div class="single-test test-lock">
                                        <div class="test-detail">
                                            <span class="circle">{{ $loop->iteration }}</span>
                                            <a href="javascript:;" class="test-name">Mock Test</a>
                                            {{-- <p class="test-result">20 Questions</p> --}}
                                        </div>
                                        <img src="{{ asset('frontend') }}/assets-desktop/images/mock-test/lock.svg"
                                            alt="lock">
                                    </div>
                                @endif
                            @endif
                        @else
                            @if (in_array($test->listening_test_id, array_column($results, 'test_id')) &&
                                    in_array($test->writing_test_id, array_column($results, 'test_id')) &&
                                    in_array($test->speaking_test_id, array_column($results, 'test_id')) &&
                                    in_array($test->reading_test_id, array_column($results, 'test_id')))
                                @if (in_array($test->speaking_test_id, array_column($results, 'test_id')) &&
                                        checkResult($results, $test->listening_test_id) &&
                                        checkResult($results, $test->writing_test_id) &&
                                        checkResult($results, $test->reading_test_id) &&
                                        checkResult($results, $test->speaking_test_id))
                                    <div class="single-test result-show">
                                        <div class="test-detail">
                                            <span class="circle"></span>
                                            <p class="test-name">Mock Test</p>
                                            @php

                                                $totalScore = 0;
                                                $totalTests = 4;
                                                @$score = 0;
                                                foreach ($results as $result) {
                                                    if ($result['test_id'] == @$test->listening_test_id) {
                                                        $score = $score + $result['band'];
                                                    } elseif ($result['test_id'] == @$test->writing_test_id) {
                                                        $score = $score + $result['band'];
                                                    } elseif ($result['test_id'] == @$test->reading_test_id) {
                                                        $score = $score + $result['band'];
                                                    } elseif ($result['test_id'] == @$test->speaking_test_id) {
                                                        $score = $score + $result['band'];
                                                    }
                                                }
                                                $averageBand = round(($score / $totalTests) * 2) / 2;
                                                // $averageBand = round($score / $totalTests, 2);
                                            @endphp
                                            <p class="test-result complete-test">{{ $averageBand }} Bands</p>
                                        </div>
                                        <a  title="Check Bands"
                                            href="{{ route('mock-test.ieltsTest', ['testId' => base64_encode($test->id)]) }}">
                                            <img src="{{ asset('frontend') }}/assets-desktop/images/mock-test/arrow-right.svg"
                                                alt="arrow-right">
                                        </a>
                                    </div>
                                @endif
                            @else
                            <div class="single-test take-test">
                                <div class="test-detail">
                                    <span class="circle">{{ $loop->iteration }}</span>
                                    <a class="test-name">Mock Test</a>
                                </div>
                                <a href="{{ route('mock-test.ieltsTest', ['testId' => base64_encode($test->id)]) }}"
                                    class="score bell" title="Test Not Available">
                                    <img src="{{ asset('frontend') }}/assets-desktop/images/mock-test/pending.svg"
                                        alt="play">
                                </a>
                            </div>
                            @endif
                        @endif
                    @endforeach
                </div>
            @endif
        </div>
    </div>
@endsection


@section('css')
    <link rel="stylesheet"
        href="{{ asset('frontend') }}/assets-desktop/css/ielts-mock-test.css?v={{ env('ASSETS_VERSION') }}">
@endsection

@section('script')
    <script src="{{ asset('student-panel') }}/js/common.js?v={{ env('ASSETS_VERSION') }}"></script>
    @if (!empty($ieltsTests))
        <script>
            function upgradeProgress() {
                $(".progress-line").each(function() {
                    let progressWidth = ($(this).attr("data-progress")) * (100 / {{ count($ieltsTests) }});

                    $(".filled-line").animate({
                        width: progressWidth + "%",
                    }, 2000);

                    $('.progress-value').each(function() {
                        $(this).text('Counter', 0).animate({
                            Counter: $(this).parent(".profile-progress").find(".progress-line").attr(
                                "data-progress")
                        }, {
                            duration: 2000,
                            easing: 'swing',
                            step: function(now) {
                                $(this).text(Math.ceil(now));
                            }
                        });
                    });
                });
            }



            $(document).ready(function() {
                let com = $(".complete-test").length;
                console.log("com:", com);
                console.log("Element:", $("#data_progress_bar"));
                $("#data_progress_bar").attr("data-progress", com);
                upgradeProgress();
            });
        </script>
    @endif
@endsection