@extends('layouts.app')

@section('styles')
@endsection

@section('content')
		   <!-- .page -->
          <div class="page">
            <!-- .page-inner -->
            <div class="page-inner">
              <!-- .page-title-bar -->
              <header class="page-title-bar">
                <!-- .breadcrumb -->
                <nav aria-label="breadcrumb">
                  <ol class="breadcrumb">
                    <li class="breadcrumb-item active">
                      <a href="\">
                        <i class="breadcrumb-icon fa fa-angle-left mr-2"></i>{{ __('Dashboard') }}</a>
					  <a href="\sessions">
                        <i class="breadcrumb-icon fa fa-angle-left mr-2"></i>{{ __('Teams') }}</a>
                    </li>
                  </ol>
                </nav>
                <!-- /.breadcrumb -->
                <!-- title and toolbar -->
                <div class="d-md-flex align-items-md-start">
                  <h1 class="page-title mr-sm-auto"> {{ $session->sessionname }}</h1>
                    <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#inviteModal">{{ __('Invite link') }}</button>&nbsp;&nbsp;
                    <button type="button" class="btn btn-light"  data-toggle="modal" data-target="#exportModal">
                      <i class="oi oi-data-transfer-download"></i>
                      <span class="ml-1">{{ __('Export') }}</span>
                    </button>
                </div>
                <!-- /title and toolbar -->
              </header>
              <!-- /.page-title-bar -->
			  <!-- Export modal -->
              <div class="modal fade" id="exportModal" tabindex="-1" role="dialog" aria-labelledby="ExportLabel" aria-hidden="true">
              	<!-- .modal-dialog -->
                	<div class="modal-dialog" role="document">
                 	<!-- .modal-content -->
                 	<div class="modal-content">
                			<!-- .modal-header -->
                   		<div class="modal-header">
                      		<h5 class="modal-title">{{ __('Export Users') }}</h5>
                    		</div>
                        <!-- /.modal-header -->
                       	<!-- .modal-body -->
                        	<div class="modal-body">
                              <p>{{ __('Please indicate in which format you would like the Users to be exported.') }}</p>
                              <p>{{ __('Exports are available in Excel and CSV.') }}</p>
                      	</div>
                      	<!-- /.modal-body -->
                  		<!-- .modal-footer -->
                   		<div class="modal-footer">
                      		<button type="button" class="btn btn-primary" data-dismiss="modal" onclick="javascript:window.location='/downloadSessionUsers/{{ $session->id }}/xlsx'">Excel</button>
							<button type="button" class="btn btn-primary" data-dismiss="modal" onclick="javascript:window.location='/downloadSessionUsers/{{ $session->id }}/csv'">CSV</button>
                      		<button type="button" class="btn btn-light" data-dismiss="modal">{{ __('Close') }}</button>
                	    		</div>
                    		<!-- /.modal-footer -->
           			</div>
                   	<!-- /.modal-content -->
              	</div>
              	<!-- /.modal-dialog -->
              </div>
              <!-- /.modal -->
              <!-- invite modal -->
              <div class="modal fade" id="inviteModal" tabindex="-1" role="dialog" aria-labelledby="InviteLabel" aria-hidden="true">
              	<!-- .modal-dialog -->
                	<div class="modal-dialog" role="document">
                 	<!-- .modal-content -->
                 	<div class="modal-content">
                			<!-- .modal-header -->
                   		<div class="modal-header">
                      		<h5 class="modal-title">{{ __('Invite users by external link') }}</h5>
                    	</div>
                        <!-- /.modal-header -->
                       	<!-- .modal-body -->
                        	<div class="modal-body">
                              <p>{{ __('You can invite users easily by sending them this link. They need to register themselves by their name and email address.') }}</p>
                              <p>{{ __('Be careful: anyone with this link can register and complete a profile! Completed profiles will be invoiced. You can close this link on the details page by indicating a deadline date.') }}</p>
                      	      @if ($invitelinks->first() != null) 
                          	      @foreach ($invitelinks as $invitelink)
                          	        <p class="text-center"><button type="button" class="btn btn-primary" id="button{{ $invitelink->profileID }}" data-dismiss="modal">{{ __('Link for') }} {{ $profiles->where('id', '=', $invitelink->profileID)->first()->profilename }}</button></p>
                          	      @endforeach
                          	      <p>{{ __('You can also reset the invite links, for instance if you think the link is used by other people than those intended.') }}</p>
                          	      <p class="text-center">
                          	        <button type="button" class="btn btn-light" data-toggle="modal" data-target="#resetLinkModal">
                                      <i class="oi oi-loop-circular"></i>
                                      <span class="ml-1">{{ __('Reset invitelinks') }}</span>
                                    </button>
                                  </p>
                          	  @else
                              	  <p class="text-center"><button type="button" class="btn btn-primary" id="button0" data-dismiss="modal">{{ __('Activate external links') }}</button></p>
                          	  @endif
                      	</div>
                      	<!-- /.modal-body -->
                  		<!-- .modal-footer -->
                   		<div class="modal-footer">
                      		<button type="button" class="btn btn-light" data-dismiss="modal">{{ __('Close') }}</button>
                	    </div>
                    	<!-- /.modal-footer -->
           			</div>
                   	<!-- /.modal-content -->
              	</div>
              	<!-- /.modal-dialog -->
              </div>
              <!-- /.modal -->
              <!-- profile modal -->
              <div class="modal fade" id="resetLinkModal" tabindex="-1" role="dialog" aria-labelledby="ResetLinkLabel" aria-hidden="true">
              	<!-- .modal-dialog -->
                	<div class="modal-dialog" role="document">
                 	<!-- .modal-content -->
                 	<div class="modal-content">
                		<!-- .modal-header -->
                   		<div class="modal-header">
                      		<h5 class="modal-title">{{ __('Reset invite links for') }} {{ $session->sessionname }}</h5>
                    	</div>
                        <!-- /.modal-header -->
                       	<!-- .modal-body -->
                        	<div class="modal-body">
                              <p>{{ __('You can reset the invite links here, for instance if you think people are misusing the link.') }}</p>
                              <p>{{ __('Be careful: anyone with the old link can no longer register!') }}</p>
                      	</div>
                      	<!-- /.modal-body -->
                  		<!-- .modal-footer -->
                   		<div class="modal-footer">
                   		    <button type="button" class="btn btn-primary" id="resetbutton" data-dismiss="modal">{{ __('Reset invite links') }}</button>
                      		<button type="button" class="btn btn-light" data-dismiss="modal">{{ __('Close') }}</button>
                	    		</div>
                    		<!-- /.modal-footer -->
           			</div>
                   	<!-- /.modal-content -->
              	</div>
              	<!-- /.modal-dialog -->
              </div>
              <!-- /.modal -->
              <!-- .page-section -->
              <div class="page-section">
                <!-- .card -->
                <section class="card card-fluid">
                  <!-- .card-header -->
                  <header class="card-header">
                    <!-- .nav-tabs -->
                    <ul class="nav nav-tabs card-header-tabs">
                      <li class="nav-item">
                        <a class="nav-link" href="/sessions/{{ $session->id }}">{{ __('Details') }}</a>
                      </li>
					  <li class="nav-item">
                        <a class="nav-link" href="/sessions/{{ $session->id }}/2">{{ __('Users') }}</a>
                      </li>
                      @if ($session->profileID == 0)
                          <li class="nav-item">
                            <a class="nav-link" href="/sessions/{{ $session->id }}/3">{{ __('Profiles') }}</a>
                          </li>
                      @endif
					  <li class="nav-item">
                        <a class="nav-link" href="/sessions/{{ $session->id }}/4">{{ __('Emails') }}</a>
                      </li>
					  <li class="nav-item">
                        <a class="nav-link" href="/sessions/{{ $session->id }}/5">{{ __('Reports') }}</a>
                      </li>
					  <li class="nav-item">
                        <a class="nav-link active show" role="tab" data-toggle="tab" href="#myprofiles">{{ __('Reset') }}</a>
                      </li>
                    </ul>
                    <!-- /.nav-tabs -->
                  </header>
                  <!-- /.card-header -->
                  <!-- .card-body -->
                  <div class="card-body">
				  	<div class="tab-content">
					
						<div role="tabpanel" class="tab-pane active show" id="myprofiles">
							<form method="POST" action="/sessions/manageprofiles/{{ $session->id }}">
							{{ csrf_field() }}
								<!-- .card-header -->
                      			<header class="card-header border-0">
                        				<div class="d-flex align-items-center">
                          				<span class="mr-auto">{{ __('Manage profiles for') }} {{ $session->sessionname }}</span>
                        				</div>
                      			</header>
                      			<!-- /.card-header -->
                        			<!-- .table -->
                        			<table class="table">
                       				<!-- thead -->
                      				<thead>
                       					<tr>
											<th style="width:50px; min-width:50px;">
									            <span class="custom-control custom-control-nolabel custom-checkbox">
		                    							<input type="checkbox" class="custom-control-input" id="check-handle">
		                    							<label class="custom-control-label" for="check-handle"></label>
		                  						</span>
											</th>
								 			<th>{{ __('User') }}</th>
											<th>{{ __('Profile completed') }}</th>
											<th>{{ __('Old Profile available') }}</th>
                        					</tr>
                      				</thead>
                      				<!-- /thead -->
									<!-- tbody -->
									<tbody>
										@foreach ($sessionusers as $sessionuser)

												<tr>
												<td>
													<div class="custom-control custom-control-inline custom-control-nolabel custom-checkbox">
                            								<input type="checkbox" class="custom-control-input"  id="{{ $sessionuser->id }}" name="selectedRow[]" value="{{ $sessionuser->id }}">
                              							<label class="custom-control-label" for="{{ $sessionuser->id }}">checkbox</label>
                            							</div>
												</td>
												<td>{{ $sessionuser->name }}</td>
												<td>@if (null!==$sessionuser->profileDate)<a data-toggle="modal" data-target="#resetModal-{{$sessionuser->id}}" href="#"> {{ date('d-m-Y', strtotime($sessionuser->profileDate)) }} </a>@endif</td>		
												<td>@if (array_key_exists($sessionuser->id, $existingprofile))<a data-toggle="modal" data-target="#useModal-{{$sessionuser->id}}" href="#"> {{ date('d-m-Y', strtotime($existingprofile[$sessionuser->id])) }} </a>@endif</td>		
												</tr>
											
											@if (null!==$sessionuser->profileDate)
											  <!-- Reset profile modal -->
								              <div class="modal fade" id="resetModal-{{$sessionuser->id}}" tabindex="-1" role="dialog" aria-labelledby="ResetLabel" aria-hidden="true">
								              	<!-- .modal-dialog -->
								                	<div class="modal-dialog" role="document">
								                 	<!-- .modal-content -->
								                 	<div class="modal-content">
								                			<!-- .modal-header -->
								                   		<div class="modal-header">
								                      		<h5 class="modal-title">{{ __('Reset Profile') }}</h5>
								                    		</div>
								                        <!-- /.modal-header -->
								                       	<!-- .modal-body -->
								                        	<div class="modal-body">
								                              <p>{{ __('This profile has been completed on: ') }}{{ date('d-m-Y', strtotime($sessionuser->profileDate)) }}</p>
								                              <p>{{ __('You can reset this profile if needed. By clicking on the button below, the questionnaire will be available again and the user can complete a new profile.') }}</p>
								                      	</div>
								                      	<!-- /.modal-body -->
								                  		<!-- .modal-footer -->
								                   		<div class="modal-footer">
															<button type="button" class="btn btn-primary" data-dismiss="modal" onclick="javascript:window.location='/sessions/reset/{{ $session->id }}/{{ $sessionuser->id }}'">{{ __('Reset Profile') }}</button>
								                      		<button type="button" class="btn btn-light" data-dismiss="modal">{{ __('Close') }}</button>
								                	    		</div>
								                    		<!-- /.modal-footer -->
								           			</div>
								                   	<!-- /.modal-content -->
								              	</div>
								              	<!-- /.modal-dialog -->
								              </div>
								            	  <!-- /.modal -->
											@endif		
											@if (array_key_exists($sessionuser->id, $existingprofile))
											  <!-- Use old profile modal -->
								              <div class="modal fade" id="useModal-{{$sessionuser->id}}" tabindex="-1" role="dialog" aria-labelledby="UseLabel" aria-hidden="true">
								              	<!-- .modal-dialog -->
								                	<div class="modal-dialog" role="document">
								                 	<!-- .modal-content -->
								                 	<div class="modal-content">
								                			<!-- .modal-header -->
								                   		<div class="modal-header">
								                      		<h5 class="modal-title">{{ __('Use Old Profile') }}</h5>
								                    		</div>
								                        <!-- /.modal-header -->
								                       	<!-- .modal-body -->
								                        	<div class="modal-body">
								                              <p>{{ __('An earlier profile has been completed on: ') }}{{ date('d-m-Y', strtotime($existingprofile[$sessionuser->id])) }}</p>
								                              <p>{{ __('You can link this existing profile to this team. By clicking on the button below, the existing results and permission setting will be copied to the current team.') }}</p>
								                      	</div>
								                      	<!-- /.modal-body -->
								                  		<!-- .modal-footer -->
								                   		<div class="modal-footer">
															<button type="button" class="btn btn-primary" data-dismiss="modal" onclick="javascript:window.location='/sessions/useoldprofile/{{ $session->id }}/{{ $sessionuser->id }}'">{{ __('Use Old Profile') }}</button>
								                      		<button type="button" class="btn btn-light" data-dismiss="modal">{{ __('Close') }}</button>
								                	    		</div>
								                    		<!-- /.modal-footer -->
								           			</div>
								                   	<!-- /.modal-content -->
								              	</div>
								              	<!-- /.modal-dialog -->
								              </div>
								            	  <!-- /.modal -->		
											@endif
					  					@endforeach
                          			</tbody>
                          			<!-- /tbody -->
                        			</table>
                        			<!-- /.table -->
                        			<!-- .form-group -->
                        			<div class="form-group">                        
									<button type="submit" name="reset" class="btn btn-primary">{{ __('Reset Profile') }}</button>
									<button type="submit" name="useold" class="btn btn-primary">{{ __('Use Old Profile') }}</button>

                       			 </div>
                       			<!-- .form-group -->
							</form>
						</div>

				    </div>
				    <!-- /.tab-content -->
				  </div>
                  <!-- /.card-body -->
                </section>
                <!-- /.card -->
              </div>
              <!-- /.page-section -->
            </div>
            <!-- /.page-inner -->
          </div>
          <!-- /.page -->
@endsection

@push('scripts')
	<script>
		$(document).ready(function(){
		
			$(document).on('change', '#check-handle', function () {
      			var isChecked = $(this).prop('checked');
      			$('input[name="selectedRow[]"]').prop('checked', isChecked);
			})
			
			@if ($invitelinks->first() != null)
          		@foreach ($invitelinks as $invitelink)
              		// onclick event is assigned to the #button element.
                    document.getElementById("button{{ $invitelink->profileID }}").onclick = function() {
    
              		  var copyText = "https://my2.mymotivation.net/activateTeamUser/{{ $invitelink->activation_code }}";
    
                      // Copy the text inside the text field
                      navigator.clipboard.writeText(copyText);
                    
                      // Alert the copied text
                      alert("{{ __('Copied the link to the clipboard') }}: " + copyText);
                    };
                    
          		@endforeach
          		
          		// onclick event is assigned to the #button element.
                document.getElementById("resetbutton").onclick = function() {
                  window.location.href = "/sessions/resetlinks/{{ $session->id }}";
                };
          		
      		@else
      		    // onclick event is assigned to the #button element.
                document.getElementById("button0").onclick = function() {
                  window.location.href = "/sessions/generatelinks/{{ $session->id }}";
                };
      		@endif

		});
	</script>
@endpush