@extends('admin_template')
@section('content')
<main class="main-con">
	
	
	
	<section class="breadcrumb-con align-items-center">
		<div class="container-fluid">
			<div class="row row-cols-1 row-cols-md-2 justify-content-between">
				<div class="col-lg-6 col-12 align-self-center">
					<h5>{{$allhalls[$_GET['hallid']]}} - {{$allsessions[$_GET['hall_sessionid']]}}, Attendance List</h5>
				</div>	
				<div class="col-lg-6 col-12 align-self-center text-end">
					<div class="row justify-content-end">
						<div class="col"> 							
							<input type="text" id="input-field" value="" class="col-12 alwaysfocus">	
 							<input type="hidden" id="email_id" value="Email Id" class="col-12">							
						</div>
						<div class="col-auto align-self-center">
							<a href="{{ url('hall-session-scanner').(isset($_GET) ? '?'.http_build_query($_GET):''); }}" class="btn-warning">Fetch Data</a>
						</div>
						<div class="col-auto align-self-center">
							<a href="{{ url('audience-event-list').'?event_id='.$_GET['eid'].'&event_key='.$_GET['ekey'] }}" class="btn-info pt-1 pb-1" title="Add Checkpoint">Audience</a>
						</div>
						
					</div>
				</div>	
			</div>
		</div>	
	</section>
	<section>
		<div class="container-fluid">
			<div class="row">
				<div class="col-lg-9 col-12 order-2 order-sm-1">
					<div id="no-more-tables">
							<table class="col-md-12 table-bordered table-striped table-condensed cf bg-white">
								<thead class="cf">
									<tr>
										<th class="numeric bg-m">Sr. No.</th>
										<th class="numeric bg-m">Name</th>
										<th class="numeric bg-m">Email</th>
										<th class="numeric bg-m">Company</th>
										<th class="numeric bg-m">Company</th>
										<th class="numeric bg-m">Visit Count</th>
									</tr>
								</thead>
								<tbody>
									<tr>
																				<tr>
											<td colspan="5">No Visitor Found</td>
										</tr>
											
									</tr>
								</tbody>
							</table>
						</div>
				</div>
				<div class="col-lg-3 col-12 order-1 order-sm-2 mb-3">
					
					<div class="w-100 shadow p-3 mb-3 bg-body rounded border-start border-success border-5">
						<h3 id="enteredcount" class="text-primary">
							{{ $event_data['entered']; }}
						</h3>
						<h6>Entered</h6>
					</div>
					<div class="w-100 shadow p-3 mb-3 bg-body rounded border-start border-warning border-5">
						<h3 id="remainingcount" class="text-warning">
							{{ $event_data['capacity']-$event_data['entered']; }}
						</h3>
						<h6>Remaining</h6>
					</div>
					
					<div class="w-100 shadow p-3 mb-3 bg-body rounded border-start border-info border-5">
						<h3 id="capacitycount" class="text-sec">
							{{ $event_data['capacity']; }}
						</h3>
						<h6>Capacity</h6>
					</div>
				</div>
			</div>
		</div>
	</section>
</main>	
<!-- Modal -->
<div class="modal fade" id="scanPopup" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-body">
        <h3 class="bg-primary text-white pt-5 pb-5 text-center" id="scansuccess"></h3>
				<h3 class="bg-danger text-white  pt-5 pb-5 text-center" id="scanerror"></h3>
      </div>
    </div>
  </div>
</div>





<script>
	function _qsave(){
		var email_id = $('#email_id').val(); //add by prachee
		$.ajax({
    	url:"{{url('hallsession_scanner_detail_qrcode_submit')}}",
    	type:'POST',
    	data:{"_token": "{{ csrf_token() }}", email_id:email_id, eid:'', ekey:'', hallid:'', hall_sessionid:''},
    	error:err=>{
    		console.log(err)
    	},
    	success:function(resp){
    		$("#email_id").val('');
    		$("#input-field").val('');
				resp = JSON.parse(resp);
				console.log(resp);
				$('#scanPopup').modal("show");
          		if(resp.success == 0)
          		{
          			console.log(resp.msg);
          			$('#scanerror').text(resp.msg);
					$('#scanerror').show();
          		}
          		if(resp.success == 1)
          		{
          			console.log(resp.msg);
          			$('#scansuccess').text(resp.msg);
					$('#scansuccess').show();
					
          			$('#capacitycount').text(resp.capacity);
          			$('#enteredcount').text(resp.entered);
          			$('#remainingcount').text(parseInt(resp.capacity) - parseInt(resp.entered));	
          		}
          		setTimeout(function(){
					$('#scanerror, #scansuccess').hide();
					$('#scanPopup').modal("hide");
				}, 1000);
				$('#input-field').focus();
				$('#input-field').val('');
				$('#email_id').val('');
    	}
    })
	}
    
    $(document).ready(function(){
		$('#input-field').focus();
		$('#scanerror, #scansuccess').hide();
		setInterval(function () {
			var myInput = document.getElementById("input-field");
			
			if (myInput && myInput.value) {
				var qr_email_id = myInput.value.match(/([a-zA-Z0-9._-]+@[a-zA-Z0-9._-]+\.[a-zA-Z0-9_-]+)/gi);
				var txt = qr_email_id.toString();				
				var email_id = txt.slice(0, -3);				
				$('#email_id').val(email_id);	//add by prachee 
				_qsave();
			}
		},1000);
	});
</script>
@endsection