@extends('main')

@section('css')
<link href="{{ asset('/css/bootstrapValidator.min.css')}}" rel="stylesheet">
<link href="{{ asset('plugins/datatables/css/jquery.dataTables.css')}}" rel="stylesheet">
<link href="{{ asset('plugins/select2/css/select2.min.css')}}" rel="stylesheet">
@endsection



@section('content')
<section class="main_content">
    <div class="container">
    <ol class="breadcrumb cust-breadcrumb">
              <li><a href="{{url('/')}}">Home</a></li>
              <li class="active">Share</li>
            </ol>
              <div class="row">
              <div class="clearfix"></div>
              @if (Session::get('error_msg'))
                <div class="col-md-12">
                  <div class="alert alert-danger">
                     <button type="button" class="close" data-dismiss="alert" aria-label="Close">
                       <span aria-hidden="true">&times;</span>
                     </button>
                      {{Session::get('error_msg')}}
                  </div>
                </div>
              @endif
              @if (Session::get('succ_msg'))
                <div class="col-md-12">
                  <div class="alert alert-success">
                     <button type="button" class="close" data-dismiss="alert" aria-label="Close">
                       <span aria-hidden="true">&times;</span>
                     </button>
                      {{Session::get('succ_msg')}}
                  </div>
                </div>  
              @endif
            </div>
      <div class="row talent_home">
        @include("left_menu")
        <div class="col-md-9 col-sm-9">
         <!-- main Nav tabs -->
                <ul class="nav nav-tabs share-tab" role="tablist">
                <li role="presentation"  class="active"><a href="#shared" aria-controls="assets" role="tab" data-toggle="tab"><strong>Share</strong></a></li>
                  <li role="presentation"><a href="#SharedData" aria-controls="profile" role="tab" data-toggle="tab"><strong>Shared Data</strong></a></li>
                  
                </ul>
                <div style="margin-bottom: -15px"></div>
              <!-- tab panel -->
              <div class="tab-content">
                  <div role="tabpanel" class="tab-pane " id="SharedData">

           <div class="rt-panel-block"> 



           <div class="my-profiles-block">  
          <h2 class="heading">Shared Data</h2>
          <div class="row">
              <div class="col-md-12">
                <!-- Nav tabs -->
                <ul class="nav nav-tabs share-tab" role="tablist">
                  <li role="presentation" class="active"><a href="#profile" aria-controls="profile" role="tab" data-toggle="tab"><strong>Profiles</strong></a></li>
                  <li role="presentation"><a href="#assets" aria-controls="assets" role="tab" data-toggle="tab"><strong>Files</strong></a></li>
                </ul>

                <!-- Tab panes -->
                <div class="tab-content">
                  <div role="tabpanel" class="tab-pane active" id="profile">
				   <div class="table-responsive visible-360">
                    <table id="users-share-table" class="table-bordered zui-table zui-table-rounded table share-pg-table">
                      <thead>
                        <tr>
                        <th width="145px" style="text-align: left;">Date</th>
                          <th width="" style="text-align: left; padding-left: 24px;">Profile</th>
                          <th  width='100px' style="text-align: left; padding-left: 41px;">Action</th>
                          
                        </tr>
                      </thead>
                    </table></div>
                  </div>
                  <div role="tabpanel" class="tab-pane" id="assets">
				   <div class="table-responsive visible-360">
                    <table id="users-shared-assets" class=" zui-table zui-table-rounded table share-pg-table">
                      <thead>
                        <tr>
                          <th width="150px" style="text-align: left;">Date</th>
                          <th width="400px" style="text-align: left;  padding-left: 24px;">Sender</th>
                          <th width="150px" style="text-align: left;">File Name</th>
                          <th width="150px" style="text-align: left; padding-left: 32px;">Action</th>
                          
                        </tr>
                      </thead>
                    </table></div>
                  </div>
                  <br />
                </div>
              </div>

          </div>
          </div>
          </div> 
          </div>
<!-- shared panel -->
          <div role="tabpanel" class="tab-pane active" id="shared">

                <div class="big_icons-div" style="margin-top: 0px;">
<div class="row">

    <div class=" panel panel-bg" style="margin-left: 21px;width: 115px;margin-top: -1px;">
      <div class="panel-heading">
      <h3 class="panel-title ">Resumes</h3>
      </div>
    </div>

    <div class="col-xs-12">

    @foreach($data_resumes as $lik)
          <div class="col-md-2">
                
                                             {{$lik->name}}
                       <a href="{{URL::to('res_download', array($lik->id))}}" style="color: #313131;font-size: 15px;font-weight: 500;">
                         <img class="img-responsive" src="{{$addfile}}"  alt=""/>
                      </a>
           <div class="col-sm-8 col-xs-6 my-pics-action-icons"> <div class="user-upload-action-icons">
                             @if($lik->access=='PUB')
                      {{--*/ $viewName = @end( @explode( '.', $lik->path ) ) /*--}}
            
                    <span class="lock-icon">
                      <a href="javascript:;" class="share_btn" data-id="{{$lik->id}}" data-url="{{$addfile}}" title="Share"><i class="fa fa-share-alt"></i></a>
                    </span>
                    <span class="lock-icon">  <a href="{{url('pictures/'.$lik->id.'?access=lock')}}" title="Unlock"><i class="fa fa-unlock"></i></a></span>
                    @else
                    <span class="lock-icon">
                      <a href="javascript:;" class="share_btn" data-id="{{$lik->id}}" data-url="{{$addfile}}" title="Share"><i class="fa fa-share-alt"></i></a>
                    </span>
                    <span class="lock-icon">     <a href="{{url('pictures/'.$lik->id.'?access=unlock')}}" title="Lock"><i class="fa fa-lock"></i></a></span>
                    @endif
              </div></div>
           </div>
    @endforeach    

        </div>
        @if(count($data_resumes)>5)
         <div class="col-md-12 text-right" style="margin-top: -12px;margin-left: -1%;">
            <a href="{{url('/myresume')}}">View More</a>
        </div>
        @endif
</div> <!--second row end-->




</div> <!--big icones div-->

      <!-- second row -->




<div class="big_icons-div" style="margin-top: 16px;">
<div class="row">

    <div class=" panel panel-bg" style="margin-left: 21px;width: 115px;margin-top: -1px;">
      <div class="panel-heading">
      <h3 class="panel-title ">Images</h3>
      </div>
    </div>
    <div class="col-xs-12">
      @foreach($data_picture as $lik)
          <div class="col-md-3">
                
                    <a href="javascript:;">
                    {{$lik->name}}
                    <img class="img-responsive view_btn" data-id="{{$lik->id}}"  data-title="{{$lik->name}}" data-url="images/{{$lik->path}}" src="images/{{$lik->path}}"  alt="" style="min-height: 135px;" /></a>
              <div class="col-sm-8 col-xs-6 my-pics-action-icons"> <div class="user-upload-action-icons">   
              @if($lik->access=='PUB')
                
          <span class="lock-icon">
                      <a href="javascript:;" class="share_btn" data-id="{{$lik->id}}" data-url="images/{{$lik->path}}" title="Share"><i class="fa fa-share-alt"></i></a>
                    </span>                  
                    <span class="lock-icon">  <a href="{{url('pictures/'.$lik->id.'?access=lock')}}" title="Unlock"><i class="fa fa-unlock"></i></a></span>
                    @else
                    <span class="lock-icon">
                      <a href="javascript:;" class="share_btn" data-id="{{$lik->id}}" data-url="images/{{$lik->path}}" title="Share"><i class="fa fa-share-alt"></i></a>
                    </span> 
                    <span class="lock-icon">     <a href="{{url('pictures/'.$lik->id.'?access=unlock')}}" title="Lock"><i class="fa fa-lock"></i></a></span>
                    @endif
          </div>
          </div>



           </div>


      @endforeach

        </div>
        @if(count($data_picture)>3)
           <div class="col-md-12 text-right" style="margin-top: -12px;margin-left: -1%;">
            <a href="{{url('/pictures')}}">View More</a>
        </div>
        @endif
  </div>
</div>

<!-- third row end -->

<div class="big_icons-div" style="margin-top: 16px; margin-bottom: 20px;">
<div class="row">

    <div class=" panel panel-bg" style="margin-left: 21px;width: 115px;margin-top: -1px;">
      <div class="panel-heading">
      <h3 class="panel-title ">Videos</h3>
      </div>
    </div>
    <div class="col-xs-12">
    @if(!empty($data_video) && count($data_video)>0) 
       @foreach($data_video as $lik)
            <div class="col-md-3">
                
                    <a href="javascript:;">
                      {{$lik->name}}
                  <!--   <img class="img-responsive view_btn" data-id="{{$lik->id}}"  data-title="{{$lik->name}}" data-url="images/{{$lik->path}}" src="images/{{$lik->path}}"  alt=""/> -->
                    <img src="{{$lik->thumb_img}}" iframe-src ="https://player.vimeo.com/video/{{$lik->path}}" class="img-responsive popup">
                       <input type="hidden" value="{{$lik->asset_type}}" class="like_type">
                    </a>
            <div class="col-md-8 col-xs-6 mtop10 my-pics-action-icons">
                         <div class="user-upload-action-icons">
                     @if($lik->access=='PUB')
            
                        <span class="lock-icon">
                          <a href="javascript:;" class="share_btn" data-id="{{$lik->id}}" data-url="{{$lik->thumb_img}}" title="Share"><i class="fa fa-share-alt"></i></a>
                        </span>                        
                        <span class="lock-icon">
                          <a href="{{url('videos/'.$lik->id.'?access=lock')}}" title="Unlock"><i class="fa fa-unlock"></i></a>
                        </span>
                        @else
                        <span class="lock-icon">
                          <a href="javascript:;" class="share_btn" data-id="{{$lik->id}}" data-url="{{$lik->thumb_img}}" title="Share"><i class="fa fa-share-alt"></i></a>
                        </span> 
                        <span class="lock-icon">
                          <a href="{{url('videos/'.$lik->id.'?access=unlock')}}" title="Lock"><i class="fa fa-lock"></i></a>
                        </span>  
                        @endif

                  </div>
                  </div>

           </div>
       @endforeach

    @else
      <div style="text-align: center; color: red">No Videos Found</div>
    @endif
        </div> 
     @if(count($data_video)>3)     
        <div class="col-md-12 text-right" style="margin-top: -12px;margin-left: -1%;">
            <a href="{{url('/videos')}}">View More</a>
        </div>
    @endif
  </div>
</div>


</div> <!--big icones div-->

            <!-- aaaaa -->
          </div>
          <!-- end of shared div -->
          </div> 
          


        </div>
        <!-- end of div col-md-9 col-sm-9 -->

        <!-- Video Modal -->
        <div class="modal fade" id="popup" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" data-backdrop="static">
          <div class="modal-dialog">
            <div class="modal-content">
              <div class="modal-header">
                  <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                  <h4 class="modal-title">Video</h4>
              </div>
              <iframe src="" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen width="600" height="400" id="modal-iframe"></iframe>
              <div class="modal-footer">
                <button data-dismiss="modal" class="btn-close btn-primary btn-default clear_form" type="button">Close</button>
              </div>


            </div>
          </div>
        </div>
        <!-- Picture Modal -->
        <div class="modal fade" id="pic-popup" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" data-backdrop="static">
          <div class="modal-dialog">
            <div class="modal-content">
              <div class="modal-header">
                  <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                  <h4 class="modal-title">Picture</h4>
              </div>
              <img src="" id="modal-pic" class="img-responsive" alt="">
              <div class="col-sm-12 message-elem"></div>
              <div class="modal-footer">
                <button data-dismiss="modal" class="btn-close btn delete-btn clear_form pull-right share-close" type="button" >Close</button>
              </div>
            </div>
          </div>
        </div>         
              
<!-- Profile  Resume Modal -->
    <div id="share_modal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" data-backdrop="static">
        <div class="modal-dialog">
        <div class="modal-content">
        <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
            <h4 class="modal-title">Share Resume</h4>
        </div>
        <div class="modal-body">
          <form class="form-horizontal" method="post" id="shareForm" name="shareForm" action="{{url('share/share_asset')}}">
              <input type="hidden" name="_token" value="{{ csrf_token() }}">
              <input type="hidden" name="sel_to_prof_id" id="sel_to_prof_id">
              <input type="hidden" name="assets_id" value="" class="assets_id_elem">
              <input type="hidden" name="asset_type" value="resume">
              <div class="form-group">
                <label class="col-sm-1 share_label">To<span class="reqired-val">*</span></label>
                <div class="col-sm-11">
                    <!--<input type="text" name="to" id="to" class="form-control .typeahead" data-bv-field="to">-->
                    <select name="to[]" id="to" class="form-control" multiple="multiple" placeholder="Ex: Username">
                      
                    </select>
                </div>
              </div>
              <div class="form-group">
                <div class="col-sm-12 text-center"><img src="" class="img-elem img-responsive"></div>
              </div>
              <div class="form-group">
                  <div class="col-md-12">
                      <button data-dismiss="modal" class="btn-close btn delete-btn clear_form pull-right share-close" type="button">Close</button>
                      <button type="submit" value="Submit" class="btn-close btn delete-btn clear_form pull-left">Share</button>
                  </div>
              </div>
          </form>          
        </div><!-- End of Modal body -->
        </div><!-- End of Modal content -->
        </div><!-- End of Modal dialog -->
    </div><!-- End of Profile Image Modal -->     
   
  </section>
@endsection
@section('js')
<script src="{{ asset('js/bootstrapValidator.min.js')}}"></script>
<script src="{{ asset('js/bootbox.js')}}"></script>
<script src="{{ asset('plugins/datatables/js/jquery.dataTables.js')}}"></script>
<script src="{{ asset('js/typeahead_0.11.js')}}"></script>
<script src="{{ asset('js/handlebars.js')}}"></script>
<script src="{{ asset('js/validation.js')}}"></script>
<script src="{{ asset('js/share_js.js')}}"></script>
<script src="{{ asset('js/maskedinput/jquery.maskedinput.min.js')}}"></script>
<script src="{{ asset('plugins/select2/js/select2.min.js')}}"></script>

<script type="text/javascript">
    
  $(document).on('click','.chk_del',function(){
    var pic_id = $(this).attr("data-id");
    bootbox.confirm("Are you sure, you want to delete Resume?", function(result) {
      if(result)
      location.href = '{{url("myresume/")}}/'+pic_id+"/delete";
    });  
  });
  
   

//for mylikes script
     $(document).on('click','.updt_pro',function(){
    var data_id = $(this).attr("data-id");//alert(data_id);
     // location.href = '{{url("pictures/likes")}}/'+data_id;
      $("#LoadingImage").show();
      //for mylikes ajax
 var dataString = 'like_id='+ data_id +  '&_token=' + $("input[name=_token]").val();
  $.ajax({
                    type: "POST",
                    url : "/myresume/likes",
                    data : dataString,
                    success : function(data){
                       $("#LoadingImage").hide();
                      var Unlike='<a href="javascript:void(0)" class="updt_pro like'+data_id+' unlike_col" data-id="'+data_id+'" ><span class="glyphicon glyphicon-thumbs-down"></span> (Unlike)</a>';
                      var Like='<a href="javascript:void(0)" class="updt_pro unlike'+data_id+'" data-id="'+data_id+'" ><span class="glyphicon glyphicon-thumbs-up"></span> (Like)</a>';
                       if(data=='Like'){ $('.like'+data_id).replaceWith(Like);}
                       if(data=='Unlike'){ $('.unlike'+data_id).replaceWith(Unlike);}}
                },"json");
   
  });

  // Share js code
  $(document).ready(function(){

    if($('.share_btn').length)
    {
      $(document).on('click','.share_btn',function(){
        $('#share_modal').modal('show');
        $('#share_modal .img-elem').attr('src', $(this).attr('data-url'));
        $('#share_modal .assets_id_elem').val($(this).attr('data-id'));
      });
    }

      $("#to").select2({
        ajax: {
          url: "invitation_typeahead",
          dataType: 'json',
          delay: 250,
          data: function (params) {
            return {
              user_name: params.term, // search term
            };
          },
          processResults: function (data) {
            //alert('hi');
            // parse the results into the format expected by Select2.
            // since we are using custom formatting functions we do not need to
            // alter the remote JSON data
            var results = [];
           // console.log(data);
            $.each(data, function(index, item){
              results.push({
                id: item.id,
                text: item.value
              });
            });
            return {
                results: results
            };
          },
          cache: true
        },
        escapeMarkup: function (markup) { return markup; }, // let our custom formatter work
        //minimumInputLength: 1,
        maximumSelectionLength: 5
        //templateResult: formatRepo, // omitted for brevity, see the source of this page
        //templateSelection: formatRepoSelection // omitted for brevity, see the source of this page
      });  
  })
$(document).on('click','.share-close',function(){
  $('#modal-pic').attr('src',"");
  $('.message-elem').html("");
});
  
 </script>
@endsection