{{-- Layout --}}
@extends('student.layout.layout')
{{-- Page Title --}}
@section('title', 'GAS LMS | Dashboard')
{{-- Breadcrumb section --}}
@section('breadcrumb')
    @include('components._breadcrumb', ['items' => ['Dashboard' => route('student.dashboard')]])
@endsection
{{-- Content --}}
@section('content')
    <div class="container">
        <div class="card mb-8">

            <div class="card-body pt-10 pb-0 rounded "
                style="background-position: 100% 70%; background-repeat:no-repeat ;background-image:url('{{ env('SECURE_ASSETS').'/assets/media/stock/900x600/42.png' }}')">
                <!--begin::Details-->
                <div class="d-flex flex-wrap flex-sm-nowrap mb-6">
                    <!--begin::Image-->
                    <div
                        class="d-flex flex-center flex-shrink-0 bg-light rounded w-100px h-100px w-lg-150px h-lg-150px me-7 mb-4">
                        <img class="mw-50px mw-lg-150px" src="{{ env('SECURE_ASSETS').'/assets/media/logos/logo.png' }}"
                            alt="image">
                    </div>
                    <!--end::Image-->
                    <!--begin::Wrapper-->
                    <div class="flex-grow-1">
                        <!--begin::Head-->
                        <div class="d-flex justify-content-between align-items-start flex-wrap mb-2">
                            <!--begin::Details-->
                            <div class="d-flex flex-column">
                                <!--begin::Status-->
                                <div class="d-flex align-items-center mb-1">
                                    <a href="#"
                                        class="text-gray-800 text-hover-primary fs-2 fw-bold me-3">{{ $course_offering->cname }}</a>
                                    <span
                                        class="badge badge-light-success me-auto">{{ $course_offering->lshort_name }}</span>
                                </div>
                                <!--end::Status-->
                                <!--begin::Description-->
                                <div class="d-flex flex-wrap fw-semibold mb-4 fs-5 text-gray-400">
                                    {{ $course_offering->cdescription }}</div>
                                <!--end::Description-->
                            </div>
                            <!--end::Details-->
                            <!--begin::Actions-->

                            <!--end::Actions-->
                        </div>
                        <!--end::Head-->
                        <!--begin::Info-->
                        <div class="d-flex flex-wrap justify-content-start">
                            <!--begin::Stats-->
                            <div class="d-flex flex-wrap">
                                <!--begin::Stat-->
                                <div class="border border-gray-300 border-dashed rounded min-w-125px py-3 px-4 me-6 mb-3">
                                    <!--begin::Number-->
                                    <div class="d-flex align-items-center">
                                        <div class="fs-4 fw-bold"> {{ $course_offering->acyname }}</div>
                                    </div>
                                    <!--end::Number-->
                                    <!--begin::Label-->
                                    <div class="fw-semibold fs-6 text-gray-400">Session</div>
                                    <!--end::Label-->
                                </div>
                                <!--end::Stat-->

                                <!--begin::Stat-->
                                <div class="border border-gray-300 border-dashed rounded min-w-125px py-3 px-4 me-6 mb-3">
                                    <!--begin::Number-->
                                    <div class="d-flex align-items-center">
                                        <!--begin::Svg Icon | path: icons/duotune/arrows/arr066.svg-->
                                        <span class="svg-icon svg-icon-3 svg-icon-success me-2">
                                            <svg width="24" height="24" viewBox="0 0 24 24" fill="none"
                                                xmlns="http://www.w3.org/2000/svg">
                                                <rect opacity="0.5" x="13" y="6" width="13"
                                                    height="2" rx="1" transform="rotate(90 13 6)"
                                                    fill="currentColor"></rect>
                                                <path
                                                    d="M12.5657 8.56569L16.75 12.75C17.1642 13.1642 17.8358 13.1642 18.25 12.75C18.6642 12.3358 18.6642 11.6642 18.25 11.25L12.7071 5.70711C12.3166 5.31658 11.6834 5.31658 11.2929 5.70711L5.75 11.25C5.33579 11.6642 5.33579 12.3358 5.75 12.75C6.16421 13.1642 6.83579 13.1642 7.25 12.75L11.4343 8.56569C11.7467 8.25327 12.2533 8.25327 12.5657 8.56569Z"
                                                    fill="currentColor"></path>
                                            </svg>
                                        </span>
                                        <!--end::Svg Icon-->
                                        <div class="fs-4 fw-bold counted" data-kt-countup="true"
                                            data-kt-countup-value="15000" data-kt-countup-prefix="$"
                                            data-kt-initialized="1">Category</div>
                                    </div>
                                    <!--end::Number-->
                                    <!--begin::Label-->
                                    <div class="fw-semibold fs-6 text-gray-400">{{ $topics->count() }}</div>
                                    <!--end::Label-->
                                </div>
                                <!--end::Stat-->



                            </div>
                            <!--end::Stats-->
                        </div>
                        <!--end::Info-->
                    </div>
                    <!--end::Wrapper-->
                </div>
                <!--end::Details-->
                <div class="separator"></div>
                <!--begin::Nav-->
                <div class="card-rounded d-flex flex-stack flex-wrap p-5">
                    <!--begin::Nav-->
                    <ul class="nav flex-wrap border-transparent fw-bold">
                         <!--begin::Nav item-->
                        {{-- <li class="nav-item my-1">
                            <a class="{{$course_wall ? 'active':''}} btn btn-color-gray-600 btn-active-secondary btn-active-color-primary fw-bolder fs-8 fs-lg-base nav-link px-3 px-lg-8 mx-1 text-uppercase"
                                href="{{ route('student.course.wall.index', [$coffid]) }}">Course wall</a>
                        </li>
                        <!--end::Nav item-->
                        <!--begin::Nav item-->
                        <li class="nav-item my-1">
                            <a class="{{$materials || $paid_materials ? 'active':''}} btn btn-color-gray-600 btn-active-secondary btn-active-color-primary fw-bolder fs-8 fs-lg-base nav-link px-3 px-lg-8 mx-1 text-uppercase" href="{{route('student.course.index',[$coffid])}}">Materials</a>
                        </li>
                        <!--end::Nav item-->
                        <!--begin::Nav item-->
                        <li class="nav-item my-1">
                            <a class="{{$quizzes || $quiz_files ? 'active':''}} btn btn-color-gray-600 btn-active-secondary btn-active-color-primary fw-bolder fs-8 fs-lg-base nav-link px-3 px-lg-8 mx-1 text-uppercase" href="{{route('student.course.quiz.index',[$coffid])}}">Quizzes</a>
                        </li>
                        <!--end::Nav item-->
                        <!--begin::Nav item-->
                        <li class="nav-item my-1">
                            <a class="{{$assignments ? 'active':''}} btn btn-color-gray-600 btn-active-secondary btn-active-color-primary fw-bolder fs-8 fs-lg-base nav-link px-3 px-lg-8 mx-1 text-uppercase" href="{{route('student.course.assignment.index',[$coffid])}}">HomeWork</a>
                        </li> --}}
                        <!--end::Nav item-->
                        <!--begin::Nav item-->
                        <li class="nav-item my-1">
                            <a class="{{$quizzes_grades || $assignments_grades ? 'active':''}} btn btn-color-gray-600 btn-active-secondary btn-active-color-primary fw-bolder fs-8 fs-lg-base nav-link px-3 px-lg-8 mx-1 text-uppercase"
                                href="{{ route('student.course.grade', [$coffid]) }}">Grades</a>
                        </li>

                        <!--begin::Nav item-->
                        <!--end::Nav item-->
                        <!--end::Nav item-->
                        <!--begin::Nav item-->
                        {{-- <li class="nav-item my-1">
                            <a class="{{$material_transactions ? 'active':''}} btn btn-color-gray-600 btn-active-secondary btn-active-color-primary fw-bolder fs-8 fs-lg-base nav-link px-3 px-lg-8 mx-1 text-uppercase"
                                href="{{ route('student.course.material-transactions.index', [$coffid]) }}">Material transactions</a>
                        </li> --}}
                        <!--end::Nav item-->

                    </ul>
                    <!--end::Nav-->
                </div>

                <!--end::Nav-->
            </div>
        </div>

        @if ($materials|| $paid_materials)
            @include('student.pages.course.material._material-list')
        @elseif ($quizzes || $quiz_files)
            @include('student.pages.course.quiz._quiz-list')
        @elseif ($assignments)
            @include('student.pages.course.assignment._assignment-list')
        @elseif ($quizzes_grades || $assignments_grades)
            @include('student.pages.course.grade._grade')
        @elseif ($material_transactions)
            @include('student.pages.course.material-transactions.index')
        @elseif ($course_wall)
            @include('student.pages.course.wall.index')
        @endif
    </div>

    {{-- How to connect php in _grade.plade.php and js section below??! --}}


@endsection
@section('js')

{{-- datatable --}}
<script>
    // DataTable
    $(document).ready(function() {
        $("#datatable").DataTable({
            "order":true,
            "paging":true,
            "language": {
            "lengthMenu": "Show _MENU_",
            },
            "dom":
            "<'row'" +
            "<'col-sm-6 d-flex align-items-center justify-conten-start'l>" +
            "<'col-sm-6 d-flex align-items-center justify-content-end'f>" +
            ">" +

            "<'table-responsive'tr>" +

            "<'row'" +
            "<'col-sm-12 col-md-5 d-flex align-items-center justify-content-center justify-content-md-start'i>" +
            "<'col-sm-12 col-md-7 d-flex align-items-center justify-content-center justify-content-md-end'p>" +
            ">"
        });
    });
</script>

@if ($message = Session::get('error-start-event'))
 <script type="text/javascript">
      Swal.fire({
        text: "{{ $message }}!",
        icon: "error",
        buttonsStyling: false,
        confirmButtonText: "Close!",
        customClass: {
            confirmButton: "btn btn-primary"
        }
    });
 </script>
@endif
@endsection