@extends("layouts.app_new")
@section("title")
    Course view
@endsection
@section("content")

            <!-- Start Courses Details Area -->
        <section class="courses-details-area ptb-70">
            <div class="container">
                  <div class="myAccount-navigation">
                    <ul>
                        <li><a href="{{url('course-view/'.$course->id)}}" class="active"><i class='bx bx-edit' ></i> Course details</a></li>
                        @if($courseEnrolled == 1 )
                            @if($isCourseEnded)
                            <li><a href="{{url('course-certificate/'.$course->id)}}"><i class='bx bx-certification'></i> Course Certificate</a></li>
                            @endif
                        @endif
                    </ul>
                </div>
                <div class="courses-details-header">
                    <div class="row align-items-center">
                        <div class="col-lg-8">
                            <div class="courses-title">
                                <h2>{{$course->name}}</h2>
                                
                            </div>

                            
                        </div>
                        <div class="col-lg-4">
                            <div class="courses-price">

                        @if($courseEnrolled == 0 )

                                <a href="javascript:;" id="CourseEnroll" class="default-btn"><i class='bx bx-paper-plane icon-arrow before'></i><span class="label">Enroll me for this course</span><i class="bx bx-paper-plane icon-arrow after"></i></a>
                        @else
                              
                                
                                
                        <p class="default-btn"><i class='bx bx-timer icon-arrow before'></i><span class="label">{{$studentCreditHoursFinished}}/{{$course->credit_hours}}</span><i class="bx bx-timer icon-arrow after"></i></p>

                              <p class="default-btn" style="background-color: #4caf50;border-color: #4caf50;"><i class='bx bx-check-circle icon-arrow before'></i><span class="label">Already Enrolled.</span><i class="bx bx-check-circle icon-arrow after"></i></p>
  
                        @endif


                            </div>
                        </div>


                    </div>
                </div>

                <div class="row">
                    <div class="col-lg-8">
                        <div class="courses-details-header">
                            <p>{{$course->brief}}</p>
                            <div class="courses-meta">
                                <ul>
                                    <li>
                                        <i class='bx bx-folder-open'></i>
                                        <span>Language</span>
                                        <a href="#">{{$course->courseLanguage->name}}</a>
                                    </li>
                                    <li>
                                        <i class='bx bx-group'></i>
                                        <span>Learners Enrolled</span>
                                        <a href="#">{{$course->course_enroll_count}}</a>
                                    </li>
                                </ul>
                            </div>
                        </div>
                        <div class="courses-details-image text-center">
                            <img src="{{url($course->image)}}" style="width:200px" alt="image">
                        </div>

                        <div class="courses-details-desc">
                            <h3>What you'll learn</h3>

                            <div class="why-you-learn">
                                <ul>

                                    @foreach($course->what_you_will_learn as $what_you_will_learn)
                                    <li>
                                        <span>
                                            <i class='bx bx-check'></i>
                                            {{$what_you_will_learn}}
                                        </span>
                                    </li>
                                    @endforeach
                                 
                                </ul>
                            </div>
                            <br>
                            {!!$course->description!!}

                        </div>

                    </div>

                    <div class="col-lg-4">
                        <div class="courses-sidebar-information">
                            <ul>
                                <li>
                                    <span><i class='bx bx-time'></i> Credit hours:</span>
                                    {{$course->credit_hours}}
                                </li>
                                <li>
                                    <span><i class='bx bx-time'></i> Length:</span>
                                    {{$course->length}}
                                </li>
                                <li>
                                    <span><i class='bx bx-tachometer'></i> Effort:</span>
                                    {{$course->effort}}
                                </li>
                                <li>
                                    <span><i class='bx bxs-institution'></i> Category:</span>
                                    <a href="#" class="d-inline-block">{{$course->courseCategory->name}}</a>
                                </li>
                                <li>
                                    <span><i class='bx bxs-badge-check'></i> Language:</span>
                                    <a href="#" class="d-inline-block">{{$course->courseLanguage->name}}</a>
                                </li>
                                <li>
                                        <span><i class='bx bx-atom'></i> Quiz:</span>

                                    @if($courseQuiz > 0)

                                        Yes
                                    @else

                                        No
                                    @endif
                                </li>
                            </ul>
                        </div>
                        @include("user.courses.partials.courseSyllabus",["course"=>$course,"courseEnrolled"=>$courseEnrolled,"courseQuiz"=>$courseQuiz,"openQuizIfexists"=>$openQuizIfexists  ])
                    </div>
                </div>
            </div>
        </section>
        <!-- End Courses Details Area -->

@endsection
@section("script")
<script type="text/javascript">
    
    $("#CourseEnroll").on("click",function(){
        id = "{{$course->id}}";
        @if(Auth::check())
        $.ajax({
          type: "POST",
          url: "{{url('EnrollToCourse')}}"+"/"+id,
          success: function(){
            parent.window.location.reload();

          },
          data: {"_token":"{{csrf_token()}}"},
        });
        @else

        @endif
    })
</script>
@endsection