@extends('layouts.master')

@section('title', \Lang::get('business_matching.business_matching'))

@section('css')
<link rel="stylesheet" href="{{ URL::asset('public/css/business_matching.css') }}">
<link rel="stylesheet" href="{{ URL::asset('public/css/bootstrap-tagsinput.css') }}">
<link rel="stylesheet" href="{{ URL::asset('public/css/exhibitor-listing.css') }}">
<link rel="stylesheet" href="{{ URL::asset('public/css/datatables.min.css') }}">

<script src="{{ URL::asset('public/js/modernizr.custom.js') }}"></script>
<script src="{{ URL::asset('public/js/jquery-3.1.1.min.js') }}"></script>
<script src="{{ URL::asset('public/js/jquery-ui.min.js') }}"></script>  
<script src="{{ URL::asset('public/js/formBuilder/form-render.js') }}"></script>
<script src="{{ URL::asset('public/js/stepwizard-form-validation.js') }}"></script>

{{-- menu --}}
<link rel="stylesheet" href="{{ URL::asset('public/css/dashboard.css') }}">
<link rel="stylesheet" href="{{ URL::asset('public/css/checkbox.css') }}">
<link rel="stylesheet" href="{{ URL::asset('public/css/jquery.fancybox.min.css') }}">
<link rel="stylesheet" href="{{ URL::asset('public/css/fullcalendar.css') }}">
<link rel="stylesheet" href="{{ URL::asset('public/css/wizard.css') }}">
<link rel="stylesheet" href="{{ URL::asset('public/css/select2.min.css') }}">
<link rel="stylesheet" href="{{ URL::asset('public/css/bootstrap-switch.css') }}">
<link rel="stylesheet" href="{{ URL::asset('public/css/daterange-picker.css') }}">
<link rel="stylesheet" href="{{ URL::asset('public/css/summernote.css') }}">
<link rel="stylesheet" href="{{ URL::asset('public/css/pygments.css') }}">
<link rel="stylesheet" href="{{ URL::asset('public/css/dashboard-style.css') }}">
<style type="text/css">
</style>
@stop

@section('content')



<div class="modal-shiftfix" id="my_dashboard" style="margin-top: 10%'">
	<!-- Navigation -->
	@include('layouts.partials.event_dashboard_menu')
	<!-- End Navigation -->
	<div class="container-fluid main-content">
		<!-- Statistics -->
		@include('layouts.partials.event_exhibitor_submenu')

		<div class="dashboard_content" style="margin-bottom: 5%; margin-top: 1%">
			<div class="row attendee_business_matching">
				<h3 class="text-center">@lang('business_matching.diary_request_appointment')</h3>

				<div class="row">
					<div class="col-md-6 col-sm-12">
						<h4>Online Diary: Request an Appointment</h4>
						<h4>
							@lang('business_matching.available_attendees')	
							January 01, 1970							 - 						</h4>
						<h4><strong>@lang('business_matching.to_request_appointment')</strong></h4>
					</div>
					<div class="col-md-6 col-sm-12">
						<a href="/business_matching/online_diary" class="btn btn btn-warning pull-right">@lang('business_matching.return_to_main_page')</a>
					</div>
				</div>

				<div class="col-md-3">
			        <div class="left_side_bar" style="height: 50px;">
			            <button class="btn btn-danger btn-block" id="reset_btn" style="display: none;"><b style="font-size: 16px !important;">@lang('article.reset_all_filter')</b></button>
			        </div>
			        
			        <div class="left_side_bar" style="height: 50px;">
			        	<button class="btn btn-default btn-block" id="last_filter_btn" style="display: block;"><b style="font-size: 16px !important;">@lang('article.last_filter')</b></button>
			        </div>

			        <div class="left_side_bar" style="height: 55px;">
			            <button class="btn btn-success btn-block" id="apply_btn" style="display: none;"><b>@lang('article.apply_filter')</b></button>
			        </div>
			        <div class="panel-group left_side_bar" id="accordion" role="tablist" aria-multiselectable="true">
			            <div class="panel panel-default">
			                <div class="panel-heading" role="tab" id="headingOne" style="padding: 0 !important;">
			                    <h4 class="panel-title">
			                        <a class="collapsed" role="button" data-toggle="collapse" data-parent="#accordion" href="#filterBy" aria-expanded="true">
			                            <b>@lang('article.filter_by') </b>
			                        </a>
			                    </h4>
			                </div>
			                <div id="filterBy" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingOne">
			                     <div class="panel-body">
			                        			                        @foreach($filter_data['result'] as $filter_data_key => $filter)
			                            			                                @if(!empty($filter))
			                                <a href="#{{ $no }}" class="list-group-item collapsed" data-toggle="collapse" aria-expanded="true" aria-controls="{{ $filter_data_key }}"><b>{{ $filter_data_key }}</b></a>

			                                <div id="{{ $no }}" class="panel-collapse collapse" role="tabpanel">
			                                    @foreach($filter as $filter_key => $filter_value)
			                                        <div class="checkbox" style="margin-bottom: 10px; width: 100%;">
			                                            @if($filter_value === end($filter))
			                                                <label class="group_checkbox">
			                                            @else
			                                                <label>
			                                            @endif
			                                                <input type="checkbox" data-col="{{ $i + 2 }}" class="data_filter"  data-id="{{ $filter_data['filter_id'][$no] }}" data-value="{{ $filter_value }}" name="filter[]" id="{{ $filter_data['filter_id'][$no] }}"><span class="cr"><i class="cr-icon glyphicon glyphicon-ok"></i></span>{{ $filter_value }}
			                                                </label>
			                                        </div>
			                                    @endforeach
			                                </div>
			                                @else
			                                    <div class="checkbox" style="border-top: 1px dotted #cccccc; padding-top: 10px;">
			                                        <label>
			                                        @if(isset($filter['field_type_id'][$i]))
			                                            @foreach($filter as $filter_key => $filter_value)
			                                                <input type="checkbox" data-col="{{ $i + 2 }}" class="data_filter"  data-id="{{ $filter['field_type_id'][$i] }}" data-value="{{ $filter_key }}" name="filter[]" id="{{ $filter['field_type_id'][$i] }}"><span class="cr"><i class="cr-icon glyphicon glyphicon-ok"></i></span>{{ $filter_key }}
			                                            @endforeach
			                                        @endif
			                                        </label>
			                                    </div>
			                                @endif
			                                			                        @endforeach
			                    </div>
			                </div>
			            </div>
			        </div>
			    </div>

	    		<div class="col-md-9">
			    	<div class="container" id="filter_result" style="width: 95%">
			            			   		</div>
			    </div>

			</div>
		</div>
	</div>
</div>


@stop
@section('javascript')
<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-143269914-1"></script>
<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());

  gtag('config', 'UA-143269914-1');
</script>

<script type="text/javascript">
	$('body').on('click', '.request-cancel' ,function(){
		var participant_id = $(this).attr('data');
		var attendee_id = $(this).attr('data-id');
		var slot_id = $(this).attr('data-slot');
		
		if(participant_id  != ''){
			$.ajax({
				type: 'GET',
				url: '/business_matching/selection/request_cancel/'+participant_id,
				beforeSend:function(){
				
					$('.loading').css('display', '');
				},
				success:function(data){
					if (data >= 1) {
						$("#selection-status-"+ attendee_id).html("@lang('business_matching.cancelled_bold')");
					} else {
						alert("@lang('business_matching.action_not_processed')");
					}
					
					$('.loading').css('display', 'none');
					
				},
				error: function(xhr, exception){

					if(xhr.status == 401){
						notification("@lang('global.401_error')", "Danger");
					}else{
						notification("[error_perform]", "Danger");
					}
				}
			});
		}
	});

	$('body').on('click', '.more-info' ,function(){
		var event_id = $(this).attr('data-id');
		var user_id = $(this).attr('data');
		
		if(event_id  != ''){
			if($("#more-info-flag-"+ user_id).html() == 1){
				$("#more-info-flag-"+ user_id).html(0);
				$("#preview-"+ user_id).html("");
			} else {
				$.ajax({
					type: 'GET',
					url: '/business_matching/' + event_id + '/' + user_id + '/preview',
					beforeSend:function(){
						// $(".preview-selection").html("");
						$('.loading').css('display', '');
					},
					success:function(data){
						$(".preview").html();
						$("#preview-"+ user_id).html(data);
						$('.loading').css('display', 'none');
					},
					error: function(xhr, exception){
						$('.loading').css('display', 'none');
						if(xhr.status == 401){
							notification("@lang('global.401_error')", "Danger");
						}else{
							notification("[error_perform]", "Danger");
						}
					}
				});
				$("#more-info-flag-"+ user_id).html(1);
			}
			
		}
	});
	
	$('body').on('click', '.request-appointment' ,function(){
	//$('.request-selection').on('click',function(){
		var selected_business_matching_id = $(this).attr('data');
		var selected_attendee_id = $(this).attr('data-id');
		
		if(selected_attendee_id  != ''){
			$.ajax({
				type: 'POST',

				url: '/business_matching/online_diary/add',
				data:{
					_token: "{{ csrf_token() }}",
					slot_id: {{ $slot_id }},
					sender_business_matching_participant_id: {{ $business_matching_particpant_id['result']['id'] }},
					reciever_business_matching_participant_id: selected_business_matching_id,
					participant_status_id: 3,
				},
				beforeSend:function(){
					$('.loading').css('display', '');
					
				
				},
				success:function(data){
					$('.loading').css('display', 'none');
					
					if (data.match_selection_id == 0) {
						alert("@lang('business_matching.may_have_appointment_alert')");
					} if (data.match_selection_id == 3) {
						alert("You already have a pending appointment from this participant on this time slot: "+data.slot_timing);
					} else if (data.match_selection_id != null) {
						var cancel_request = "<button type='submit' data-slot='{{ $slot_id }}' class='request-cancel btn btn-xs btn-danger' data-id='"+selected_attendee_id+"' data='"+data.match_selection_id+"'>@lang('business_matching.cancel_request')</button>";
						$("#selection-status-"+ selected_attendee_id).html("@lang('business_matching.requested_an_appointment_alert') "+ cancel_request);

						
					} else {
						alert("@lang('business_matching.reached_max_request_alert')");
					}

					if (data.no_of_request >= {{ $max_request }}) {
						var tbl_event_exhibitors = $('#tbl_event_exhibitors').DataTable().column(1).nodes();
						for (var i = 0; i < tbl_event_exhibitors.length; i++) {
						
							//console.log($(test[i]).find('.reach_max_selection'));
							$(tbl_event_exhibitors[i]).find('.reach_max_selection').html("@lang('business_matching.reached_max_request_alert')");
						}
						$(".reach_max_selection").html("@lang('business_matching.reached_max_request_alert')");
					}
				},
				error: function(xhr, exception){
					$('.loading').css('display', 'none');
					if(xhr.status == 401){
						notification("@lang('global.401_error')", "Danger");
					}else{
						notification("[error_perform]", "Danger");
					}
				}
			});
		}

	});
</script>
<script src="{{ URL::asset('public/js/angular.min.js') }}"></script>
<script src="{{ URL::asset('public/js/bootstrap-tagsinput-angular.js') }}"></script>  
<script src="{{ URL::asset('public/js/bootstrap-tagsinput.js') }}"></script>  
<script src="{{ URL::asset('public/js/DataTables/datatables.min.js') }}"></script>  
<script src="{{ URL::asset('public/js/DataTables/AlphabetSearch/alphabet-search.js') }}"></script>  
<script src="{{ URL::asset('public/js/jquery.ContentSlider.min.js') }}"></script>  
<script src="{{ URL::asset('public/js/exhibitor_listing.js') }}"></script>  

<script src="{{ URL::asset('public/js/raphael.min.js') }}" type="text/javascript"></script>
<script src="{{ URL::asset('public/js/selectivizr-min.js') }}" type="text/javascript"></script>
<script src="{{ URL::asset('public/js/jquery.mousewheel.js') }}" type="text/javascript"></script>
<script src="{{ URL::asset('public/js/jquery.bootstrap.wizard.js') }}" type="text/javascript"></script>
<script src="{{ URL::asset('public/js/excanvas.min.js') }}" type="text/javascript"></script>
<script src="{{ URL::asset('public/js/jquery.isotope.min.js') }}" type="text/javascript"></script>
<script src="{{ URL::asset('public/js/isotope_extras.js') }}" type="text/javascript"></script>
<script src="{{ URL::asset('public/js/isotope_extras.js') }}" type="text/javascript"></script>
<script src="{{ URL::asset('public/js/modernizr.custom.js') }}" type="text/javascript"></script>
<script src="{{ URL::asset('public/js/jquery.fancybox.min.js') }}" type="text/javascript"></script>
<script src="{{ URL::asset('public/js/select2.full.min.js') }}" type="text/javascript"></script>
<script src="{{ URL::asset('public/js/skycons.js') }}" type="text/javascript"></script>
<script src="{{ URL::asset('public/js/jquery.fitvids.js') }}" type="text/javascript"></script>
<script src="{{ URL::asset('public/js/dashboard.js') }}" type="text/javascript"></script>

<script type="text/javascript">
var event_id = "{{ $event_id }}";
var slot_id = "{{ $slot_id }}";
var user_id = "";

 var url = "/business_matching/"+event_id+"/attendee_listing_online_diary/search/"+slot_id;
exhibitor_listing_init();
</script>
@stop