@extends('root.layouts.master')
@section('content')

<script type="text/javascript">
	$(document).ready(function() {
	    $('#trainingcategorie').DataTable( {
	    	dom: 'Bfrtip',
	        buttons: [
	            'copy', 'csv', 'excel', 'pdf', 'print'
	        ]
	    } );
	} );
</script>

<div class="col-lg-12">
	<nav class="breadcrumb_widgets" aria-label="breadcrumb mb30">
		<h4 class="title float-left">Formation : <strong>{{$formation->LibelleFormation}}</strong></h4>
		
	</nav>
</div>
<div class="col-lg-8 col-xl-9"> 
	<h3>Cours: <strong>{{$premier_cours->LibelleCours}}</strong> </h3> <br>
	<div class="blog_post_home6 style2 video">
		<div class="bg_img_video_widget h500 thumb">
			<div class="bg-video" style="background-image: url({{url($formation->PhotoFormation)}});">
				<!-- <div class="bt-play text-center" onclick="aficherlavideo()"><span class="flaticon-play-button"></span>Regarder la video</div> -->
				<div class="bt-play text-center"><span class="flaticon-play-button"></span>Regarder la video</div>
			</div>
			<div class="video-container">
				<iframe class="w100" height="500px" src="{!!@$premier_cours->VideoCours!!}" frameborder="0" allowfullscreen="allowfullscreen"></iframe>
			</div>
		</div>
	</div>
	<script type="text/javascript">
		function aficherlavideo(){
			var csrfToken = $('meta[name="csrf-token"]').attr('content');
			var idcours = {{@$premier_cours->idcours}};
			$.ajax({
			type: 'POST',
			enctype: 'multipart/form-data',
			url: '{{url('video')}}',
			data: {
			idcours:idcours,
			"_token":csrfToken
			    },

			success:function(result) {
			if(result.number == '1'){
				console.log(result);

			$(".video-container").html(result.data);
			                                        
			                            
			                                        
			                                        
			}
		}
	});
		}
	</script>
	<div class="courses_single_container">
		<div class="cs_rwo_tabs csv2">
			<ul class="nav nav-tabs style4 mt30" id="myTab" role="tablist">
				<li class="nav-item">
				    <a class="nav-link style4 active" id="Overview-tab" data-toggle="tab" href="#Overview" role="tab" aria-controls="Overview" aria-selected="true">Description</a>
				</li>
				<li class="nav-item">
				    <a class="nav-link style4" id="course-tab" data-toggle="tab" href="#course" role="tab" aria-controls="course" aria-selected="false">Autres cours</a>
				</li>
				<li class="nav-item">
				    <a class="nav-link style4" id="instructor-tab" data-toggle="tab" href="#instructor" role="tab" aria-controls="instructor" aria-selected="false">Formateur</a>
				</li>
				
			</ul>
			<div class="tab-content" id="myTabContent">
				<div class="tab-pane fade show active" id="Overview" role="tabpanel" aria-labelledby="Overview-tab">
					<div class="cs_row_two csv2">
						<div class="cs_overview style2">
							<h4 class="title">Apercu général</h4>
							<h4 class="subtitle">Description</h4>
							<!-- <p class="mb30"> </p> -->
							{!! $premier_cours->DescriptionCours !!}
							
							
						</div>
					</div>
				</div>
				<div class="tab-pane fade" id="course" role="tabpanel" aria-labelledby="review-tab">
					<div class="cs_row_three csv2">
						<div class="course_content style2">
							<div class="cc_headers">
								<h4 class="title">Autres cours</h4>
							</div>
							<br>
							<div class="details">
							  	<div id="accordion" class="panel-group cc_tab">
								    <div class="panel">
								      	<div class="panel-heading">
									      	<h4 class="panel-title">
									        	<a href="#panelBodyCourseStart" class="accordion-toggle link" data-toggle="collapse" data-parent="#accordion">Vidéos</a>
									        </h4>
								      	</div>
									    <div id="panelBodyCourseStart" class="panel-collapse collapse show">
									        <div class="panel-body">
							<ul class="cs_list mb0">
								@foreach($cours as $cour)
								<li><a href="
									@if(Auth::check())
									{{url('suivre_formation/'.$formation->idformation.'/'.$cour->idcours)}}
									@else
									{{url('inscription/'.$formation->idformation)}}
									@endif
									"><span class="flaticon-play-button-1 icon"></span> {{$cour->LibelleCours}} <span class="cs_time">{{$cour->DureeCours}} </span> <span class="cs_preiew">Suivre</span></a></li>
								@endforeach
								
							</ul>
									        </div>
									    </div>
								    </div>
								</div>
							</div>
							
						</div>
					</div>
				</div>
				<div class="tab-pane fade" id="instructor" role="tabpanel" aria-labelledby="review-tab">
					<div class="cs_row_four csv2">
						<div class="about_ins_container style2">
							<h4 class="aii_title">A propos du formateur</h4>
							<div class="about_ins_info">
								<div class="thumb"><img src="{{url($formation->profil)}}" alt="6.png" style="width: 120px;"></div>
							</div>
							<div class="details">
								<h4>{{$formation->name }} {{$formation->prenom }}</h4>
								<p class="subtitle">{{$formation->titre }}</p>
								
								{!! $formation->description !!}
								
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
</div>
		

@endsection