@extends('layouts.admin')

@section('page-header', 'New Sponsor/Supporter')

@section('content')
<div class="white-component">
    <div class="row">
        <form method="post" class="col-lg-6" enctype="multipart/form-data">
            @csrf

            <div class="form-group">
                <label for="type">Type</label>
                <select name="type" class="custom-select{{ $errors->has('type') ? ' is-invalid' : '' }}" id="type">
                    <option value="">Select</option>
                    <option value="sponsor" @if (old('type') === 'sponsor') selected @endif>Sponsor</option>
                    <option value="supporter" @if (old('type') === 'supporter') selected @endif>Supporter</option>
                </select>

                @if ($errors->has('type'))
                <div class="invalid-feedback">
                    {{ $errors->first('type') }}
                </div>
                @endif
            </div>

            <div id="category" class="form-group" @if (old('type') === 'supporter') style="display:none" @endif>
                <label for="category">Category</label>
                <select name="category" class="custom-select{{ $errors->has('category') ? ' is-invalid' : '' }}"
                    @if (old('type') === 'supporter') disabled @endif>
                    <option value="">Select</option>
                    <option value="gold" @if (old('category')==='gold' ) selected @endif>Gold</option>
                    <option value="silver" @if (old('category')==='silver' ) selected @endif>Silver</option>
                    <option value="bronze" @if (old('category')==='bronze' ) selected @endif>Bronze</option>
                </select>

                @if ($errors->has('category'))
                <div class="invalid-feedback">
                    {{ $errors->first('category') }}
                </div>
                @endif
            </div>

            <div id="supporter_category" class="form-group" @if (old('type') !== 'supporter') style="display:none" @endif>
                <label for="category">Category</label>
                <select name="category" class="custom-select{{ $errors->has('supporter') ? ' is-invalid' : '' }}"
                    @if (old('type') !== 'supporter') disabled @endif>
                    <option value="">Select</option>
                    <option value="igo" @if (old('category') === 'igo') selected @endif>IGO’s</option>
                    <option value="ngo" @if (old('category') === 'ngo') selected @endif>NGO’s</option>
                    <option value="ga" @if (old('category') === 'ga') selected @endif>Government Agencies & Museums</option>
                    <option value="universities" @if (old('category') === 'universities') selected @endif>Universities</option>
                    <option value="consultancies" @if (old('category') === 'consultancies') selected @endif>Consultancies</option>
                </select>


                @if ($errors->has('category'))
                <div class="invalid-feedback">
                    {{ $errors->first('category') }}
                </div>
                @endif
            </div>

            <div class="form-group">
                <label for="name">Name</label>
                <input name="name" type="text" class="form-control{{ $errors->has('name') ? ' is-invalid' : '' }}" id="name"
                    value="{{ old('name') }}">

                @if ($errors->has('name'))
                <div class="invalid-feedback">
                    {{ $errors->first('name') }}
                </div>
                @endif
            </div>

            <div class="form-group">
                <label for="link">Link</label>
                <input name="link" type="text" class="form-control{{ $errors->has('link') ? ' is-invalid' : '' }}" id="link"
                    value="{{ old('link') }}">

                @if ($errors->has('link'))
                <div class="invalid-feedback">
                    {{ $errors->first('link') }}
                </div>
                @endif
            </div>


            <div class="row">
                <div class="col-sm-5">
                    <div class="form-group">
                        <label for="customFile">Logo</label>
                        <div class="image-upload">
                            <input type="file" class="custom-file-input fileup" name="logo" id="file">
                            <img id="img_prev" src="{{asset('/images/image-upload.jpg')}}" alt="">
                        </div>
                    <p style="width: 100%;text-align: center;color: #6D4949; font-size: 11px;">maximum image size:2MB</p>

                        @if ($errors->has('logo'))
                        <div class="invalid-feedback" style="display: block">
                            {{ $errors->first('logo') }}
                        </div>
                        @endif
                    </div>
                </div>
            </div>
            <button class="btn btn-primary">Save</button>
        </form>
    </div>
</div>
@endsection

@section('scripts')
<script>
    $(document).ready(function () {
        $('#type').trigger('change')
        $('#type').on('change', function () {
            $('#category select').prop('disabled', $(this).val() == 'supporter');
            if ($(this).val() == 'supporter') $('#category').hide();
            if ($(this).val() == 'supporter') $('#supporter_category').show();

            $('#supporter_category select').prop('disabled', $(this).val() == 'sponsor');
            if ($(this).val() == 'sponsor') $('#supporter_category').hide();
            if ($(this).val() == 'sponsor') $('#category').show();
        });
    });
</script>
@endsection