@extends('main')

@section('css')
<link href="{{ asset('/css/bootstrapValidator.min.css')}}" rel="stylesheet">
@endsection
<!-- hai hello -->
@section('content')


    <div class="container">
	<!--breadcurmb starts here-->
  <ol class="breadcrumb cust-breadcrumb">
  <li><a href="#">Home</a></li>
  <li class="active">My Likes</li>
  </ol><!--breadcurmb ends here-->
  <div class="row">
              @if (Session::get('error_msg')!="" && 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
  </div>
      <section class="body-content"> 
  <div class="row">

        @include("left_menu")
       <div class="col-sm-9 right-pannel">
<div class="imagebanner-block">
<img src="images/My-Likes_banner.jpg"  class="img-responsive" alt="banner">
<h1 class="banner-txt">My Likes</h1>
</div>

<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($res_likes as $lik)
          <div class="col-md-2">
                
                     @if($lik->asset_type=='R')
                                             {{$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>
                      <span style="margin-left: 35%;">   
                              <a href="javascript:void(0)" class="updt_pro like{{$lik->id}} unlike_col" data-id="{{$lik->id}}" ><span class="glyphicon glyphicon-thumbs-down"></span> (Unlike)</a> 
                      </span>
                    @endif
           </div>
    @endforeach    

      	</div>
         <div style="text-align: right;margin-right: 24px;    margin-bottom: 5px;">
            <a href="{{url('/mylikes/resumes')}}">View More</a>
        </div>
</div> <!--second row end-->




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

					<div class="big_icons-div" style="margin-top: 16px;     padding-bottom: 31px;">
<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 ">Profiles</h3>
			</div>
		</div>

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

      @foreach($pro_likes as $lik)
          <div class="col-md-2">
            <div class="searchpg-profile-pic">
                <a href="{{url('/profiles/'.$lik->profile_id)}}" style="color: #0da8e0;">
                      @if($lik->assets_path != "")
                        <img class="img-responsive img-circle" src="{{url('uploads/profile_images/'.$lik->assets_path)}}" alt=""/>
                      @else                    
                        <img class="img-responsive img-circle" src="{{url('uploads/profile_images/default-profile.png')}}" alt=""/>
                      @endif
                </a>
            </div>
          </div>

          <a href="{{url('/profiles/'.$lik->profile_id)}}">
          <div class="col-md-2" style=" margin-right:22px;margin-left: -3.5%;padding-right: 11px;">
            
              <strong style="font-size:20px; padding: 0px; color: #0da8e0;">
                {{$lik->assets_name}}
              </strong>
              <br>
              <strong style="color: #655e5e; font-size:14px;">
              @if($lik->skills != "")
                {{$lik->skills}}
              @else
                Not Provide
              @endif
              </strong>
              <br>
              <strong style="color: #928e8e; font-size:12px;">
              @if($lik->city != "")
                {{$lik->city}}
              @else
                Not Provide
              @endif
                
              </strong>
              </a>
              <br>
            <span>   
                <a href="javascript:void(0)" class="updt_profile like{{$lik->profile_id}} unlike_col" data-id="{{$lik->profile_id}}" ><span class="glyphicon glyphicon-thumbs-down"></span> (Unlike)</a> 
              </span>
          </div>
         
              
          
        
        
          
        
      @endforeach
				  
							</div>
                  <div style="text-align: right;margin-right: 24px;    margin-bottom: -20px;">
            <a href="{{url('/mylikes/profiles')}}">View More</a>
        </div>
      	</div>





</div> <!--second row end-->

<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($pic_likes 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 align="right">       
              <span>   
                <a href="javascript:void(0)" class="updt_pro like{{$lik->id}} unlike_col" data-id="{{$lik->id}}" ><span class="glyphicon glyphicon-thumbs-down"></span> (Unlike)</a> 
              </span>  
              </div>    
           </div>


      @endforeach

        </div>
           <div style="text-align: right;margin-right: 24px;    margin-bottom: 5px;">
            <a href="{{url('/mylikes/pictures')}}">View More</a>
        </div>
	</div>
</div>




<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($vid_likes)) 
       @foreach($vid_likes 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 align="right">       
              <span>   
                <a href="javascript:void(0)" class="updt_pro like{{$lik->id}} unlike_col" data-id="{{$lik->id}}" ><span class="glyphicon glyphicon-thumbs-down"></span> (Unlike)</a> 
              </span>  
              </div>    
           </div>
       @endforeach

		@else
      <div style="text-align: center; color: red">No Video Likes</div>
    @endif
        </div>
    @if(!empty($vid_likes))     
        <div style="text-align: right;margin-right: 24px;    margin-bottom: 5px;">
            <a href="{{url('/mylikes/videos')}}">View More</a>
        </div>
    @endif
	</div>
</div>


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






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















</div> <!--right panel-->

</div> <!--right row end-->
 
  
  </div>
  
    </div> <!--container-->
  </section>

@endsection

<div class="modal fade" id="popup" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">
         <iframe src="" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen width="600" height="400" id="modal-iframe"></iframe>
      <div class="modal-footer video-model-foot">
          
        <button type="button" class="btn-close btn delete-btn clear_form pull-right" id="modal-close" >Close</button>
      </div>
    </div>
  </div>
</div>

<div id="view_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 img-name"></h4>
                    </div>
                    <div class="modal-body">
                      <div class="form-horizontal">
                          <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" type="button">Close</button>
                              </div>
                          </div>
                      </div>          
                   </div><!-- End of Modal body -->
            </div><!-- End of Modal content -->
        </div><!-- End of Modal dialog -->
    </div><!-- End of Profile Image Modal --> 

@section('js')
<script src="{{ asset('js/bootstrapValidator.min.js')}}"></script>
<script src="{{ asset('js/maskedinput/jquery.maskedinput.min.js')}}"></script>

<script type="text/javascript">
  
  $(function(){  
    $(document).on('click','.updt_pro',function(){
      
       var data_id = $(this).attr("data-id");
        var dataString = 'like_id='+ data_id +  '&_token=' + $("input[name=_token]").val();
       // $("#LoadingImage").show();
      // alert(dataString);
          $.ajax({
                    type: "GET",
                    url : "assests/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");
    });
    
    });
</script>


<script type="text/javascript">
  $(function(){  
    $(document).on('click','.updt_profile',function(){
       var data_id = $(this).attr("data-id");  
        var dataString = 'like_id='+ data_id +  '&_token=' + $("input[name=_token]").val();
       // $("#LoadingImage").show();
          $.ajax({
                    type: "GET",
                    url : "profile/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");
    });
    
    });


$(function(){
    if($('.view_btn').length)
  {
    $(document).on('click','.view_btn',function(){
         var atr_val=$(this).attr('data-id');
         var atr_name=$(this).attr('data-title');
      $('#view_modal').modal('show');
       $('#view_modal .img-name').html(atr_name);
      $('#view_modal .img-elem').attr('src', $(this).attr('data-url'));
      $('#view_modal .assets_id_elem').val($(this).attr('data-id'));
        
         var dataString = 'atr_val='+ atr_val +  '&_token=' + $("input[name=_token]").val();
        
            $.ajax({
                              type: "POST",
                              url : "picture_view",
                              data : dataString,
                              success : function(data){//alert(data);
                              }
                          },"json");
                          
     
    });
  }
});
</script>


<script type="text/javascript">
$(document).ready(function()
{
      
       
   $('#picture_next').click(function(){
       
       var numlikes=parseInt($("#numrows").val());
       var maxlimit=parseInt($("#maxlimit").val());
       if(numlikes<=maxlimit){$('#picture_next').css("display", "none");}
        
       $("#LoadingImage").show();
       
       var findsiz= parseInt($(".findsiz").length);
       var divsiz=maxlimit;
       var like_type=$('.like_type').val();//alert(like_type);
       if(numlikes<=divsiz){$('#picture_next').css("display", "none");}
       var dataString = 'likes_type='+ like_type + '&take='+ divsiz +'&skip='+ findsiz +'&_token=' + $("input[name=_token]").val();
           $.ajax({
                    type: "GET",
                    url : "mylikes/testing",
                    data : dataString,
                    dataType: "JSON",
                    success : function(data){
                       var append_data = '';
                       var title='';
                       var image_path='';
                       var viewName='';
                       var addfile='';
                      $.each(data,function(key,val){
                        //alert(like_type);
                        if(like_type=='P')
                          { 
                             var title='My Profiles';
                             if(val.assets_path!="")
                             {
                             var image_path='<img class="img-responsive" src="../uploads/profile_images/'+val.assets_path+'" alt=""/>';
                              }
                              else 
                              {
                              var image_path='<img class="img-responsive" src="../uploads/profile_images/default-profile.png" alt=""/>';
                              }
                          }  
                     if(like_type=='R')
                     {
                      var viewName=val.assets_path.split('.').pop();
                      if(viewName=='txt')addfile='../images/text.png';
                      if(viewName=='doc')addfile='../images/doc.png';
                      if(viewName=='docx')addfile='../images/docxs.png';
                      if(viewName=='pdf')addfile='../images/pdfs.png';
                      if(viewName=='xls')addfile='../images/xlss.png';
                      if(viewName=='xlsx')addfile='../images/xlsxs.png';
                      if(viewName=='rtf')addfile='../images/rtfs.png';
                      var title='My Resumes';
                      var image_path='<a href="{{url("res_download/")}}/'+val.asst_id+'"><img class="img-responsive" src="'+addfile+'"  alt=""/></a>';
                     
                     }
                          
                          if(like_type=='I')
                          { 
                             var title='My Pictures';
                             var image_path='<a href="javascript:;"><img class="img-responsive view_btn" data-id="'+val.id+'" data-title="'+val.assets_name+'" data-url="../images/'+val.assets_path+'" src="../images/'+val.assets_path+'" alt=""/></a>';
                          }
                          
                        if(like_type=='V')
                        { 
                            
    
                         var title='My Videos';
                         var image_path='<img src="'+val.thumb_img+'" iframe-src ="https://player.vimeo.com/video/'+val.assets_path+'" class="img-responsive popup">';
                     
                     }
                       
                       var txt_name = val.assets_name;
                       var pic_title=val.assets_name;
                        if(txt_name.length > 15)
                        {
                          txt_name = txt_name.substr(0,15) + "....";
                        }
                           
                        
                          append_data=append_data+'<div class="col-md-4  findsiz mylike_nopad col-sm-4 mbot10"><div class=" mylikes-pic"><div class="col-sm-12">'+image_path+'</div><div class="clearfix"></div><div class="row mylikes-icons-block"><div class="col-sm-8 col-xs-6"><h4 title="'+pic_title+'">'+txt_name+'</h4></div><div class="col-sm-4 col-xs-6"><div class="mylikes-pic-icons"><span><a href="{{url("profiles/")}}/'+val.profile_id+'" title="View Profile"><i class="fa fa-eye"></i></a></span><span class="delete-icon"><a  href="javascript:void(0)" data-id="'+val.id+'"  class="chk_del" title="Delete Like"><i class="fa fa-trash-o"></i></a></span></div></div></div></div></div>';
                         
                       });
                       if(!$(".findsiz").length)$('#mylikes_div').html('');
                       $('#mylikes_div').append(append_data);
                       if(numlikes>$(".findsiz").length){$('#picture_next').show();}else{$('#picture_next').hide();}
                       $("#LoadingImage").hide();
                    
                   }
                });
    
    });
    
   $("#modal-close").click(function(){
        $('#modal-iframe').attr('src',"");
        $('#popup').modal('hide');
    })
    
 $(document).on('click','.popup',function(){
       $('#modal-iframe').attr('src',$(this).attr('iframe-src'));
       $('#popup').modal('show');
 });
    
}); 
 $(document).on('click','.chk_del',function(){
    var pic_id = $(this).attr("data-id");//alert(pic_id);
   
    bootbox.confirm("Are you sure, you want to delete this?", function(result) {
      if(result)
      location.href = '{{url("mylikes/")}}/'+pic_id+"/delete";
    });  
  });

 $(function(){
    if($('.view_btn').length)
  {
    $(document).on('click','.view_btn',function(){
         var atr_val=$(this).attr('data-id');
         var atr_name=$(this).attr('data-title');
      $('#view_modal').modal('show');
       $('#view_modal .img-name').html(atr_name);
      $('#view_modal .img-elem').attr('src', $(this).attr('data-url'));
      $('#view_modal .assets_id_elem').val($(this).attr('data-id'));
        
         var dataString = 'atr_val='+ atr_val +  '&_token=' + $("input[name=_token]").val();
        
            $.ajax({
                              type: "POST",
                              url : "picture_view",
                              data : dataString,
                              success : function(data){//alert(data);
                              }
                          },"json");
                          
     
    });
  }
});
</script>
@endsection