@extends('layouts.admin.master')

@section('title')
    {{__('Add University')}}
@endsection

@push('css')
    <style>
        .add-university #cke_description {
            border: 1px solid #efefef;
        }
    </style>
@endpush

@section('content')
    @component('components.breadcrumb')
        @slot('breadcrumb_title')
        @endslot
        <li class="breadcrumb-item"><a href="{{ route('universities.index') }}">{{ __('University') }}</a></li>
        <li class="breadcrumb-item active"><a
                href="{{ route('universities.create') }}">{{ __('Create University') }}</a></li>
    @endcomponent

    <div class="container-fluid">
        <div class="row">
            <div class="col-sm-12">
                <div class="card">
                    <div class="card-header pb-0">
                        <h5>{{ __('master.data') }}</h5>
                    </div>
                    <div class="card-body">
                        <form class="needs-validation f1" novalidate="" method="POST"
                              action="{{ route('universities.store') }}"
                              enctype="multipart/form-data">
                            @csrf
                            <div class="f1-steps">
                                <div class="f1-progress">
                                    <div class="f1-progress-line" data-now-value="16.66" data-number-of-steps="4"></div>
                                </div>
                                <div class="f1-step active">
                                    <div class="f1-step-icon"><i class="fa fa-user"></i></div>
                                    <p>{{ __('General Information') }}</p>
                                </div>
                                <div class="f1-step">
                                    <div class="f1-step-icon"><i class="fa fa-key"></i></div>
                                    <p>{{ __('Continue To Next') }}</p>
                                </div>
                                <div class="f1-step">
                                    <div class="f1-step-icon"><i class="fa fa-key"></i></div>
                                    <p>{{ __('Continue To Next') }}</p>
                                </div>
                                <div class="f1-step">
                                    <div class="f1-step-icon"><i class="fa fa-star"></i></div>
                                    <p>{{ __('Continue To Submit') }}</p>
                                </div>
                            </div>

                            <fieldset>

                                <div class="form-group">
                                    <label for="f1-first-name">{{ __('Name') }}</label>
                                    <input class="form-control" id="f1-first-name" type="text" name="name"
                                           value="{{ old('name') }}" placeholder="{{ __('Name') }}" required="">
                                    <div class="valid-feedback">{{ __('validation.valid_feedback') }}</div>
                                    <div class="invalid-feedback">{{ __('validation.invalid_feedback') }}</div>
                                </div>

                                <div class="form-group">
                                    <label>{{ __('Description') }}</label>
                                    <textarea id="description" required="" name="description" cols="10"
                                              rows="2">{{ old('description') }}</textarea>
                                    <div class="valid-feedback">{{ __('validation.valid_feedback') }}</div>
                                    <div class="invalid-feedback">{{ __('validation.invalid_feedback') }}</div>
                                </div>

                                <div class="form-group">
                                    <label class="form-label" for="validationDefault04">{{ __('Status') }}</label>
                                    <select class="form-select" id="validationDefault04" required="" name="status">
                                        <option value="active"
                                            {{ old('status') ? (old('status') == 'active' ? 'selected' : '') : '' }}>
                                            {{ __('Active') }}</option>
                                        <option value="inactive"
                                            {{ old('status') ? (old('status') == 'inactive' ? 'selected' : '') : '' }}>
                                            {{ __('Inactive') }}</option>
                                    </select>
                                    <div class="valid-feedback">{{ __('validation.valid_feedback') }}</div>
                                    <div class="invalid-feedback">{{ __('validation.invalid_feedback') }}</div>
                                </div>

                                <div class="form-group">
                                    <label for="language_id">{{ __('Languages') }}</label>
                                    <select class="form-select" id="language_id" required=""
                                            name="language_id" onchange="getCountries()">
                                        <option selected="" disabled="" value=""> {{ __('Languages') }}</option>
                                        @foreach ($languages as $language)
                                            <option value="{{ $language->id }}"
                                                {{ old('languages_id') ? (old('languages_id') == $language->id ? 'selected' : '') : '' }}>
                                                {{ $language->name }}</option>
                                        @endforeach
                                    </select>
                                    <div class="valid-feedback">{{ __('validation.valid_feedback') }}</div>
                                    <div class="invalid-feedback">{{ __('validation.invalid_feedback') }}</div>
                                </div>

                                <div class="form-group">
                                    <label for="validationDefault04">{{ __('Country') }}</label>
                                    <select id="country_id" class="form-select" required=""
                                            onchange="getCities()" name="country_id">
                                        <option selected="" disabled="" value=""> {{ __('Country') }}
                                        </option>
                                        {{--                                        @foreach ($countries as $country)--}}
                                        {{--                                            <option value="{{ $country->id }}"--}}
                                        {{--                                                {{ old('country_id') ? (old('country_id') == $country->id ? 'selected' : '') : '' }}>--}}
                                        {{--                                                {{ $country->name }}</option>--}}
                                        {{--                                        @endforeach--}}
                                    </select>
                                    <div class="valid-feedback">{{ __('validation.valid_feedback') }}</div>
                                    <div class="invalid-feedback">{{ __('validation.invalid_feedback') }}</div>
                                </div>

                                <div class="form-group">
                                    <label for="f1-first-global-rank">{{ __('Global Rank') }}</label>
                                    <input class="f1-global-rank form-control" id="f1-first-global-rank" type="number"
                                           value="{{ old('global_rank') }}" name="global_rank"
                                           placeholder="{{ __('Global Rank') }}" required="">
                                    <div class="valid-feedback">{{ __('validation.valid_feedback') }}</div>
                                    <div class="invalid-feedback">{{ __('validation.invalid_feedback') }}</div>
                                </div>
                                <div class="form-group">
                                    <label for="f1-first-local-rank">{{ __('Local Rank') }}</label>
                                    <input class="f1-local-rank form-control" id="f1-first-local-rank" type="number"
                                           value="{{ old('local_rank') }}" name="local_rank"
                                           placeholder="{{ __('Local Rank') }}" required="">
                                    <div class="valid-feedback">{{ __('validation.valid_feedback') }}</div>
                                    <div class="invalid-feedback">{{ __('validation.invalid_feedback') }}</div>
                                </div>
                                <div class="form-group">
                                    <label for="f1-first-student-count">{{ __('Students Count') }}</label>
                                    <input class="f1-student-count form-control" id="f1-first-student-count"
                                           type="number"
                                           value="{{ old('students_count') }}" name="students_count"
                                           placeholder="{{ __('Students Count') }}" required="">
                                    <div class="valid-feedback">{{ __('validation.valid_feedback') }}</div>
                                    <div class="invalid-feedback">{{ __('validation.invalid_feedback') }}</div>
                                </div>

                                <div class="form-group">
                                    <label for="f1-discount_type">{{ __('Discount Type') }}</label>
                                    <select name="discount_type" class="form-select" id="f1-discount_type">
                                        <option selected="" value=""> {{ __('Discount Type') }} </option>
                                        <option value="percentage"
                                            {{ old('discount_type') ? (old('discount_type') == 'percentage' ? 'selected' : '') : '' }}>
                                            {{ __('percentage') }}</option>
                                        <option value="amount"
                                            {{ old('discount_type') ? (old('discount_type') == 'amount' ? 'selected' : '') : '' }}>
                                            {{ __('amount') }}</option>
                                    </select>
                                    <div class="valid-feedback">{{ __('validation.valid_feedback') }}</div>
                                    <div class="invalid-feedback">{{ __('validation.invalid_feedback') }}</div>
                                </div>
                                <div class="form-group">
                                    <label for="f1-discount">{{ __('Discount') }}</label>
                                    <input class="f1-discount form-control" id="f1-discount" type="number"
                                           value="{{ old('discount') ? old('discount') : 0}}" name="discount"
                                           placeholder="{{ __('Discount') }}">
                                    <div class="valid-feedback">{{ __('validation.valid_feedback') }}</div>
                                    <div class="invalid-feedback">{{ __('validation.invalid_feedback') }}</div>
                                </div>

                                <div class="form-group">
                                    <label for="f1-price">{{ __('Price') }}</label>
                                    <input class="f1-price form-control" required id="f1-price" type="number"
                                           value="{{ old('price') }}" name="price" placeholder="{{ __('Price') }}">
                                    <div class="valid-feedback">{{ __('validation.valid_feedback') }}</div>
                                    <div class="invalid-feedback">{{ __('validation.invalid_feedback') }}</div>
                                </div>

                                <div class="f1-buttons">
                                    <button class="btn btn-primary btn-next" type="button">Next</button>
                                </div>
                            </fieldset>

                            <fieldset>

                                <div class="form-group">
                                    <label for="f1-university_type">{{ __('University Type') }}</label>
                                    <select name="university_type" class="form-select" id="f1-university_type">
                                        <option selected="" disabled="" value="">
                                            {{ __('University Type') }}</option>
                                        <option value="private"
                                            {{ old('university_type') ? (old('university_type') == 'private' ? 'selected' : '') : '' }}>
                                            {{ __('private') }}</option>
                                        <option value="public"
                                            {{ old('university_type') ? (old('university_type') == 'public' ? 'selected' : '') : '' }}>
                                            {{ __('public') }}</option>
                                    </select>
                                    <div class="valid-feedback">{{ __('validation.valid_feedback') }}</div>
                                    <div class="invalid-feedback">{{ __('validation.invalid_feedback') }}</div>
                                </div>

                                <div class="form-group">
                                    <label class="form-label"
                                           for="validationDefault0show_in_home">{{ __('Show In Home') }}</label>
                                    <select class="form-select" id="validationDefault0show_in_home" name="show_in_home">
                                        <option value="1"
                                            {{ old('show_in_home') ? (old('show_in_home') == 'active' ? 'selected' : '') : '' }}>
                                            {{ __('Active') }}</option>
                                        <option value="0"
                                            {{ old('show_in_home') ? (old('show_in_home') == 'inactive' ? 'selected' : '') : '' }}>
                                            {{ __('Inactive') }}</option>
                                    </select>
                                    <div class="valid-feedback">{{ __('validation.valid_feedback') }}</div>
                                    <div class="invalid-feedback">{{ __('validation.invalid_feedback') }}</div>
                                </div>

                                <div class="form-group">
                                    <label for="f1-order_by">{{ __('Order By') }}</label>
                                    <input class="f1-order_by form-control" id="f1-order_by"
                                           value="{{ old('order_by') }}" type="number" name="order_by"
                                           placeholder="{{ __('Order By') }}">
                                    <div class="valid-feedback">{{ __('validation.valid_feedback') }}</div>
                                    <div class="invalid-feedback">{{ __('validation.invalid_feedback') }}</div>
                                </div>

                                {{--                                <div class="form-group">--}}
                                {{--                                    <label for="f1-address">{{ __('Address') }}</label>--}}
                                {{--                                    <input class="f1-address form-control" value="{{ old('address') }}"--}}
                                {{--                                        id="f1-address" type="text" name="address"--}}
                                {{--                                        placeholder="{{ __('Address') }}">--}}
                                {{--                                    <div class="valid-feedback">{{ __('validation.valid_feedback') }}</div>--}}
                                {{--                                    <div class="invalid-feedback">{{ __('validation.invalid_feedback') }}</div>--}}
                                {{--                                </div>--}}

                                <div class="form-group">
                                    <label for="f1-link">{{ __('Link') }}</label>
                                    <input class="f1-link form-control" id="f1-link" value="{{ old('link') }}"
                                           type="url" name="link" placeholder="{{ __('Link') }}">
                                    <div class="valid-feedback">{{ __('validation.valid_feedback') }}</div>
                                    <div class="invalid-feedback">{{ __('validation.invalid_feedback') }}</div>
                                </div>
                                <div class="form-group">
                                    <label for="f1-link">{{ __('Video Link') }}</label>
                                    <input class="f1-link form-control" id="f1-link" value="{{ old('video_link') }}"
                                           type="url" name="video_link" placeholder="{{ __('Video Link') }}">
                                </div>
                                <div class="row">
                                    <div class="col-2">
                                        <div class="col-md-12 mb-3">
                                            <label class="form-label" for="showImageLogo">{{ __('Logo') }}</label>
                                            <div class="avatar">
                                                <img class="img-100 b-r-8" id="showImageLogo"
                                                     src="{{ asset('assets/images/uniguideLogo1.png') }}" alt="#">
                                            </div>
                                            @include('dashbord.include.image', ['button_name' => 'Logo',  'model_id' => 'LogoModel',  'type' => 'radio', 'name' => 'logo_id'])
                                            <div class="valid-feedback">{{ __('validation.valid_feedback') }}</div>
                                            <div class="invalid-feedback">{{ __('validation.invalid_feedback') }}</div>
                                        </div>
                                    </div>

                                    <div class="col-2">
                                        <div class="col-md-12 mb-3">
                                            <label class="form-label" for="showImage">{{ __('Image') }}</label>
                                            <div class="avatar">
                                                <img class="img-100 b-r-8" id="showImage"
                                                     src="{{ asset('assets/images/uniguideLogo1.png') }}" alt="#">
                                            </div>
                                            @include('dashbord.include.image', ['button_name' => 'Image', 'model_id' => 'ImageModel', 'type' => 'radio', 'name' => 'image_id'])
                                            <div class="valid-feedback">{{ __('validation.valid_feedback') }}</div>
                                            <div class="invalid-feedback">{{ __('validation.invalid_feedback') }}</div>
                                        </div>
                                    </div>
                                </div>

                                <div class="f1-buttons">
                                    <button class="btn btn-primary btn-previous" type="button">Previous</button>
                                    <button class="btn btn-primary btn-next" type="button">Next</button>
                                </div>
                            </fieldset>

                            <fieldset>
                                <div class="form-group">
                                    <label>{{ __('Campus') }}</label>
                                    <textarea id="campus" name="campus" cols="10" required=""
                                              rows="2">{{ old('campus') }}</textarea>
                                    <div class="valid-feedback">{{ __('validation.valid_feedback') }}</div>
                                    <div class="invalid-feedback">{{ __('validation.invalid_feedback') }}</div>
                                </div>

                                <div class="f1-buttons">
                                    <button class="btn btn-primary btn-previous" type="button">Previous</button>
                                    <button class="btn btn-primary btn-next" type="button">Next</button>
                                </div>
                            </fieldset>
                            <fieldset>
                                <div class="form-group">
                                    <label>{{ __('Confessions') }}</label>
                                    <textarea id="confessions" name="confessions" required="" cols="10"
                                              rows="2">{{ old('confessions') }}</textarea>
                                    <div class="valid-feedback">{{ __('validation.valid_feedback') }}</div>
                                    <div class="invalid-feedback">{{ __('validation.invalid_feedback') }}</div>
                                </div>

                                <div class="f1-buttons">
                                    <button class="btn btn-primary btn-previous" type="button">Previous</button>
                                    <button class="btn btn-primary btn-submit" type="submit">Submit</button>
                                </div>
                            </fieldset>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </div>

    @push('scripts')

        <script src="{{ asset('assets/js/editor/ckeditor/ckeditor.js') }}"></script>
        <script src="{{ asset('assets/js/editor/ckeditor/adapters/jquery.js') }}"></script>
        <script src="{{ asset('assets/js/form-wizard/form-wizard-three.js') }}"></script>
        <script src="{{ asset('assets/js/form-wizard/jquery.backstretch.min.js') }}"></script>
        {{-- <script src="{{ asset('assets/js/email-app.js') }}"></script> --}}
        @include('dashbord.include.imageScriptEdit')
        <script>

            "use strict";
            CKEDITOR.replace('description', {
                on: {
                    contentDom: function (evt) {
                        // Allow custom context menu only with table elemnts.
                        evt.editor.editable().on('contextmenu', function (contextEvent) {
                            var path = evt.editor.elementPath();

                            if (!path.contains('table')) {
                                contextEvent.cancel();
                            }
                        }, null, null, 5);
                    }
                }
            });
        </script>

        <script>
            "use strict";
            CKEDITOR.replace('campus', {
                on: {
                    contentDom: function (evt) {
                        // Allow custom context menu only with table elemnts.
                        evt.editor.editable().on('contextmenu', function (contextEvent) {
                            var path = evt.editor.elementPath();

                            if (!path.contains('table')) {
                                contextEvent.cancel();
                            }
                        }, null, null, 5);
                    }
                }
            });
        </script>

        <script>
            "use strict";
            CKEDITOR.replace('confessions', {
                on: {
                    contentDom: function (evt) {
                        // Allow custom context menu only with table elemnts.
                        evt.editor.editable().on('contextmenu', function (contextEvent) {
                            var path = evt.editor.elementPath();

                            if (!path.contains('table')) {
                                contextEvent.cancel();
                            }
                        }, null, null, 5);
                    }
                }
            });
        </script>


        <script>
            document.addEventListener('DOMContentLoaded', function () {
                const discountTypeElement = document.getElementById('f1-discount_type');
                const discountElement = document.getElementById('f1-discount');

                function updateDiscountInput() {
                    if (discountTypeElement.value === 'percentage') {
                        discountElement.setAttribute('min', '0');
                        discountElement.setAttribute('max', '100');
                    } else {
                        discountElement.removeAttribute('min');
                        discountElement.removeAttribute('max');
                    }
                }

                function validateDiscountValue() {
                    if (discountTypeElement.value === 'percentage') {
                        let value = parseFloat(discountElement.value);
                        if (value < 0) discountElement.value = 0;
                        if (value > 100) discountElement.value = 100;
                    }
                }

                discountTypeElement.addEventListener('change', updateDiscountInput);
                discountElement.addEventListener('input', validateDiscountValue);

                // Run once on page load to set initial state
                updateDiscountInput();
            });
        </script>


        @include('dashbord.include.custom-ajax')

    @endpush
@endsection