<!-- $o=User::class -->
@extends('layouts.app')

@section('htmlheader_title')
	@if($o->exists) Update @else Add @endif User
@endsection

@section('content')
	<form class="needs-validation" method="post" novalidate>
		@csrf

		<div class="row">
			<div class="col-12">
				@includeWhen(session()->has('success'),'widgets.success-row',['msg'=>session()->get('success')])

				<div class="greyframe titledbox shadow0xb0">
					<h2 class="cap">@if($o->exists) Update @else Add @endif User</h2>

					<div class="row">
						<div class="col-4">
							<label for="name" class="form-label">Name</label>
							<div class="input-group has-validation">
								<span class="input-group-text"><i class="bi bi-tag-fill"></i></span>
								<input type="text" class="form-control @error('name') is-invalid @enderror" id="name" placeholder="Name" name="name" value="{{ old('name',$o->name) }}" autocomplete="name" required @cannot('admin',$o)disabled @endcannot autofocus>
								<span class="invalid-feedback" role="alert">
									@error('name')
										{{ $message }}
									@else
										A name is required.
									@enderror
								</span>
							</div>
						</div>

						<div class="col-3">
							<label for="alias" class="form-label">BBS Alias</label>
							<div class="input-group has-validation">
								<span class="input-group-text"><i class="bi bi-tag-fill"></i></span>
								<input type="text" class="form-control @error('alias') is-invalid @enderror" id="alias" placeholder="alias" name="alias" value="{{ old('alias',$o->alias) }}" @cannot('update',$o)disabled @endcannot>
								<span class="invalid-feedback" role="alert">
									@error('alias')
										{{ $message }}
									@enderror
								</span>
							</div>
						</div>

						<!-- Forward Netmail -->
						@can('admin',$o)
							<div class="col-4">
								<label for="system_id" class="form-label">Forward Netmails</label>
								<div class="input-group has-validation">
									<span class="input-group-text"><i class="bi bi-envelope-at-fill"></i></span>
									<select style="width: 80%;" class="form-select @error('system_id') is-invalid @enderror" id="system_id" name="system_id">
										<option value="">&nbsp;</option>
										@foreach ($o->systems as $oo)
											<option value="{{ $oo->id }}" @if(old('system_id',$o->system_id)==$oo->id)selected @endif>{{ $oo->name }}</option>
										@endforeach
									</select>
									<span class="invalid-feedback" role="alert">
										@error('system_id')
											{{ $message }}
										@enderror
									</span>
								</div>
							</div>
						@endcan
					</div>

					<div class="row">
						<div class="col-4">
							<label for="email" class="form-label">Email</label>
							<div class="input-group has-validation">
								<span class="input-group-text"><i class="bi bi-person-badge"></i></span>
								<input type="text" class="form-control @error('email') is-invalid @enderror" id="email" placeholder="Email" name="email" value="{{ old('email',$o->email) }}" autocomplete="email" required @cannot('update',$o)disabled @endcannot>
								<span class="invalid-feedback" role="alert">
									@error('email')
										{{ $message }}
									@else
										Email required for login.
									@enderror
								</span>
							</div>
						</div>

						<div class="col-4">
							<label for="password" class="form-label">Password</label>
							<div class="input-group has-validation">
								<span class="input-group-text"><i class="bi bi-person-badge"></i></span>
								<input type="password" class="form-control @error('password') is-invalid @enderror" id="password" placeholder="{{ old('password',$o->password) ? 'Password Unchanged' : 'Password' }}" name="password" value="" @cannot('update',$o)disabled @endcannot>
								<span class="invalid-feedback" role="alert">
									@error('password')
										{{ $message }}
									@else
										Password required for login.
									@enderror
								</span>
							</div>
						</div>

						<div class="col-1">
							@can('ownes',$o)
								<label for="passkey" class="form-label">Passkey</label>
								<div class="input-group has-validation">
									<button class="btn {{ $o->passkey ? 'btn-primary' : 'btn-outline-primary' }}" id="passkey"><i class="bi bi-key"></i></button>
									<span class="invalid-feedback" role="alert">
										@error('passkey')
											{{ $message }}
										@enderror
									</span>
								</div>
							@endcan
						</div>

						@can('admin',$o)
							<div class="col-3">
								<div class="row p-0">
									<div class="col-xl-6 col-12">
										<span class="form-label" style="font-size: 75%; margin-bottom: 1px;">Active</span>
										<div class="input-group">
											<div class="btn-group" role="group">
												<input type="radio" class="btn-check" name="active" id="active_yes" value="1" required @if(old('active',$o->active))checked @endif>
												<label class="btn btn-outline-success" for="active_yes">Yes</label>

												<input type="radio" class="btn-check btn-danger" name="active" id="active_no" value="0" required @if(! old('active',$o->active))checked @endif>
												<label class="btn btn-outline-danger" for="active_no">No</label>
											</div>
										</div>
									</div>

									<div class="col-xl-6 col-12">
										<span class="form-label" style="font-size: 75%; margin-bottom: 1px;">Site Admin</span>
										<div class="input-group">
											<div class="btn-group" role="group" @if($user->id === $o->id)data-bs-toggle="tooltip" title="You cannot demote yourself" @endif>
												<input type="radio" class="btn-check" name="admin" id="admin_yes" value="1" required @if(old('admin',$o->admin))checked @endif>
												<label class="btn btn-outline-success" for="admin_yes">Yes</label>

												<input type="radio" class="btn-check btn-danger" name="admin" id="admin_no" value="0" required @if(($user->id === $o->id) || $user->cannot('admin',$o)) disabled  @endif @if(! old('admin',$o->admin))checked @endif>
												<label class="btn btn-outline-danger" for="admin_no">No</label>
											</div>
										</div>
									</div>
								</div>
							</div>
						@endcan
					</div>

					<div class="row">
						<div class="col-12">
							<label for="pgp_pubkey" class="form-label">PGP Public Key</label>
							<textarea class="form-control @error('pgp_pubkey')is-invalid @enderror" rows=3 id="pgp_pubkey" name="pgp_pubkey" placeholder="PGP Public Key..." @cannot('update',$o)disabled @endcannot>{{ old('pgp_pubkey',$o->pgp_pubkey) }}</textarea>
							<span class="invalid-feedback" role="alert">
								@error('pgp_pubkey')
									{{ $message }}
								@enderror
							</span>
						</div>
					</div>

					<div class="row">
						<div class="col-12">
							<a href="{{ back()->getTargetUrl() }}" class="btn btn-danger">Cancel</a>
							@canany(['admin','update'],$o)
								<button type="submit" name="submit" class="btn btn-success float-end">@if ($o->exists)Save @else Add @endif</button>
							@endcan
						</div>
					</div>
				</div>
			</div>
		</div>

		<div class="row">
			<div class="col-12">
				<h3>Systems</h3>

				<table class="table monotable">
					<thead>
					<tr>
						<th>System</th>
					</tr>
					</thead>

					<tbody>
					@foreach ($o->systems as $o)
						<tr>
							<th><a href="{{ url('system/addedit',[$o->id]) }}">{{ $o->name }}</a></th>
							<th class="text-end">{!! $o->akas->pluck('ftn')->join('<br>') !!}</th>
						</tr>
					@endforeach
					</tbody>
				</table>
			</div>
		</div>
	</form>
@endsection

@section('page-css')
	@css('select2')

	<style>
		#content h3 {
			margin-bottom: 5px;
		}
		#content ul li:last-child {
			margin-bottom: inherit;
		}
	</style>
@append

@section('page-scripts')
	@js('select2')

	<!-- Passkeys -->
	<script type='text/javascript' src='{{ asset('/passkey/passkey.js') }}'></script>

	@if($user->id === $o->id)
		<script type="text/javascript">
			var tooltipTriggerList = [].slice.call(document.querySelectorAll('[data-bs-toggle="tooltip"]'))
			var tooltipList = tooltipTriggerList.map(function (tooltipTriggerEl) {
				return new bootstrap.Tooltip(tooltipTriggerEl)
			})
		</script>
	@endif

	<script type="text/javascript">
		$(document).ready(function() {
			$('#system_id').select2();
			$('#passkey').on('click',function(item) {
				if (passkey_debug)
					console.log('Passkey: Create Click');

				// Availability of `window.PublicKeyCredential` means WebAuthn is usable.
				// `isUserVerifyingPlatformAuthenticatorAvailable` means the feature detection is usable.
				// `sConditionalMediationAvailable` means the feature detection is usable.
				if (window.PublicKeyCredential &&
					PublicKeyCredential.isUserVerifyingPlatformAuthenticatorAvailable &&
					PublicKeyCredential.isConditionalMediationAvailable) {
						// Check if user verifying platform authenticator is available.
						Promise.all([
							PublicKeyCredential.isUserVerifyingPlatformAuthenticatorAvailable(),
							PublicKeyCredential.isConditionalMediationAvailable(),
						]).then(results => {
							if (passkey_debug)
								console.log('Passkey: Browser Supported');

							if (results.every(r => r === true)) {
								passkey_register('{{ csrf_token() }}',$(this),'bi-key','btn-primary','{{ $o->passkey ? 'btn-primary' : 'btn-outline-primary' }}');
							} else {
								alert('It seems that passkey is NOT supported by your browse (B)');
							}
						});

				} else {
					alert('It seems that passkey is NOT supported by your browser (A)');
				}

				return false;
			});
		});
	</script>
@append