@extends('layouts.app')
@section('content')
    <div class="row" >
        <div class="col-xs-12 col-sm-12 column col-sm-offset-0 ">
            <div class="panel panel-default container_body" >
                <div class="panel-heading">
                   <h3>Software Training</h3>
                </div>
                <div class="panel-body">
                <div class="row">
                    @foreach($videos as $video)
                      <div class="col-md-3 col-xs-12">
                          <div class="panel panel-default">
                              <div class="panel-heading">
                                  <h5 class="panel-title">{{$video['section_name']}}</h5>
                              </div>
                              <div class="panel-body">
                                  <a href="{{$video['link']}}"  class="youtube_popup" id="youtube_popup_{{$video['id']}}" >
                                      <img style="position: relative;top:0px;" width="55" class="center-block" src="{{asset('images/watch_now.jpg')}}" alt=""/>
                                  </a>
                              </div>
                          </div>
                       </div>
                    @endforeach
                </div>
                </div>
            </div>
        </div>
    </div>

@endsection
@push('script')
    <script>

            $('.youtube_popup').click(function (e) {
                e.preventDefault();
                let id = $(this).attr("id");
                common_helper.youtubePopup($('#' + id));
            });

    </script>

@endpush