@extends($layout)
@section('content')
    <div class="container">
        <div class="row justify-content-center">
            <div class="col-md-8">
                <div class="card">
                   
                    <div class="card-header">{{ __('Add New User') }}</div>
                    
                    

                    <div class="row">
                        <div class="col-12 text-end">


                           
                            <a href="/users" class="btn bg-gradient-dark mb-0 me-4"><i class="fas fa-user"></i>
                                &nbsp;&nbsp;All Users
                            </a>
                         
                            {{-- @hasrole('dio')
                            <a href="/users" class="btn bg-gradient-dark mb-0 me-4"><i class="fas fa-user"></i>
                                &nbsp;&nbsp;All Videographers
                            </a>
                            @endhasrole --}}

                        </div>
                        
                    </div>

                    <div class="card-body">
                        @if (session('success'))
                        <div class="alert alert-success">
                            {{ session('success') }}
                        </div>
                    @endif

                        <form method="POST" action="/users/register">
                            @csrf

                            <div class="form-group row">
                                <label for="name"
                                    class="col-md-4 col-form-label text-md-right">{{ __('Name') }}</label>

                                <div class="col-md-6">
                                    <input id="name" type="text"
                                        class="form-control @error('name') is-invalid @enderror" name="name"
                                        value="{{ old('name') }}" required autocomplete="name" autofocus>

                                    @error('name')
                                        <span class="invalid-feedback" role="alert">
                                            <strong>{{ $message }}</strong>
                                        </span>
                                    @enderror
                                </div>
                            </div>

                            <div class="form-group row">
                                <label for="email"
                                    class="col-md-4 col-form-label text-md-right">{{ __('E-Mail (Username)') }}</label>

                                <div class="col-md-6">
                                    <input id="email" type="email"
                                        class="form-control @error('email') is-invalid @enderror" name="email"
                                        value="{{ old('email') }}" required autocomplete="email">

                                    @error('email')
                                        <span class="invalid-feedback" role="alert">
                                            <strong>{{ $message }}</strong>
                                        </span>
                                    @enderror
                                </div>
                            </div>

                            <div class="form-group row">
                                <label for="password"
                                    class="col-md-4 col-form-label text-md-right">{{ __('Password') }}</label>

                                <div class="col-md-6">
                                    <input id="password" type="password"
                                        class="form-control @error('password') is-invalid @enderror" name="password"
                                        required autocomplete="new-password">

                                    @error('password')
                                        <span class="invalid-feedback" role="alert">
                                            <strong>{{ $message }}</strong>
                                        </span>
                                    @enderror
                                </div>
                            </div>



                            <div class="form-group row">
                                <label for="password-confirm"
                                    class="col-md-4 col-form-label text-md-right">{{ __('Confirm Password') }}</label>

                                <div class="col-md-6">
                                    <input id="password-confirm" type="password" class="form-control"
                                        name="password_confirmation" required autocomplete="new-password">
                                </div>
                            </div>

                            
                                <div class="form-group row">
                                    <label for="role"
                                        class="col-md-4 col-form-label text-md-right">{{ __('Role') }}</label>

                                    <div class="col-md-6">
                                        <select id="role" class="form-control @error('role') is-invalid @enderror"
                                            name="role" required>
                                            <option value="" disabled selected>Select a role</option>
                                            @foreach ($roles as $role)
                                                {{-- <option value="{{ $role->id }}">{{ $role->name }}</option> --}}
                                                <option value="{{ $role->id }}">{{ $role->name === 'dio' ? 'Standard User' : $role->name }}</option>
                                            @endforeach
                                        </select>

                                        @error('role')
                                            <span class="invalid-feedback" role="alert">
                                                <strong>{{ $message }}</strong>
                                            </span>
                                        @enderror
                                    </div>
                                </div>



                                @hasrole('admin')
                                <div class="form-group row">
                                    <label for="district" class="col-md-4 col-form-label text-md-right">Group</label>

                                    <div class="col-md-6">
                                        <select id="district" class="form-control @error('district') is-invalid @enderror"
                                            name="district" required>
                                            <option value="" disabled selected>Select a Group</option>
                                            @foreach ($districts as $district)
                                                <option value="{{ $district->id }}">{{ $district->name }}</option>
                                            @endforeach
                                        </select>

                                        @error('district')
                                            <span class="invalid-feedback" role="alert">
                                                <strong>{{ $message }}</strong>
                                            </span>
                                        @enderror
                                    </div>
                                </div>
                            @endhasrole


                            <div class="form-group row" id="fileTypes">
                                <label for="file_types"
                                    class="col-md-4 col-form-label text-md-right">{{ __('File types') }}</label>

                                    <div class="col-md-6">
                                        @php
                                        use Spatie\Permission\Models\Role;
                                        $currentUser = auth()->user();
                                
                                        $isAdmin = $currentUser->hasRole('admin');
                                        $isSuperAdmin = $currentUser->hasRole('Super Admin');

                                
                                        if ($isAdmin || $isSuperAdmin) {
                                            $canUploadVideos = true;
                                            $canUploadDocuments = true; 
                                            $canUploadImages = true;
                                        } else {
                                            $createdByUserId = $currentUser->created_by;
                                            $createdByUser = App\Models\User::find($createdByUserId);
                                
                                            if ($createdByUser) {
                                                $canUploadVideos = $createdByUser->hasPermissionTo('upload videos');
                                                $canUploadDocuments = $createdByUser->hasPermissionTo('upload documents');
                                                $canUploadImages = $createdByUser->hasPermissionTo('upload images');
                                            } else {
                                                $canUploadVideos = false;
                                                $canUploadDocuments = false;
                                                $canUploadImages = false;
                                            }
                                        }
                                    @endphp
                                    
                                        @if ($canUploadVideos || $canUploadDocuments || $canUploadImages)
                                            <div class="form-check">
                                                @if ($canUploadVideos)
                                                    <input id="videos" checked type="checkbox"
                                                        class="form-check-input @error('videos') is-invalid @enderror" name="videos">
                                                    <label for="videos" class="form-check-label">{{ __('Videos') }}</label>
                                                @endif
                                            </div>
                                    
                                            <div class="form-check">
                                                @if ($canUploadDocuments)
                                                    <input id="documents" checked type="checkbox"
                                                        class="form-check-input @error('documents') is-invalid @enderror"
                                                        name="documents">
                                                    <label for="documents" class="form-check-label">{{ __('Documents') }}</label>
                                                @endif
                                            </div>
                                            <div class="form-check">
                                                @if ($canUploadImages)
                                                    <input id="images" checked type="checkbox"
                                                        class="form-check-input @error('images') is-invalid @enderror"
                                                        name="images">
                                                    <label for="images" class="form-check-label">{{ __('Images') }}</label>
                                                @endif
                                            </div>
                                        @else
                                            <p>The user who created you does not have permissions to upload videos or documents.</p>
                                        @endif
                                    
                                        @error('videos')
                                            <span class="invalid-feedback" role="alert">
                                                <strong>{{ $message }}</strong>
                                            </span>
                                        @enderror
                                        @error('documents')
                                            <span class="invalid-feedback" role="alert">
                                                <strong>{{ $message }}</strong>
                                            </span>
                                        @enderror
                                    </div>
                                    
                            </div>

                            <div class="form-group row mb-0">
                                <div class="col-md-6 offset-md-4">
                                    <button type="submit" class="btn btn-primary">
                                        {{ __('Register') }}
                                    </button>
                                </div>
                            </div>
                        </form>
                        @if ($errors->any())
                            <div class="alert alert-danger">
                                <ul>
                                    @foreach ($errors->all() as $error)
                                        <li>{{ $error }}</li>
                                    @endforeach
                                </ul>
                            </div>
                        @endif
                        
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection

<script>
    document.addEventListener('DOMContentLoaded', function() {
        const roleSelect = document.getElementById('role');
        const fileTypesDiv = document.getElementById('fileTypes');

        function toggleFileTypes() {
            const selectedOption = roleSelect.options[roleSelect.selectedIndex].text;
            if (selectedOption === 'admin') {
                fileTypesDiv.style.display = 'none';
            } else {
                fileTypesDiv.style.display = '';
            }
        }

        roleSelect.addEventListener('change', toggleFileTypes);

        toggleFileTypes();
    });
    </script>