@extends('admin.layout.index')
@section('title')
    {{ __('messages.project') }}
@endsection
@section('css')
    <style>
        .center-test {
            height: 100%;
            display: flex;
            align-items: center;
            justify-content: center;

        }

        .form-input-test {
            width: 350px;
            padding: 20px;
            background: #fff;
            box-shadow: -3px -3px 7px rgba(94, 104, 121, 0.377),
            3px 3px 7px rgba(94, 104, 121, 0.377);
            margin-bottom: 50px;
            margin-top: 50px;
        }

        .form-input-test img {
            width: 100%;
            margin-bottom: 30px;
            position: relative;
            max-height: 100%;
            border: 4px solid #fff;

        }

        .form-input-test input {
            display: none;
        }

        .form-input-test label {
            display: block;
            width: 45%;
            height: 45px;
            line-height: 50px;
            text-align: center;
            background: #1172c2;
            color: #fff;
            font-size: 15px;
            font-family: "Open Sans", sans-serif;
            text-transform: Uppercase;
            font-weight: 600;
            border-radius: 5px;
            cursor: pointer;
            margin: auto;
        }
    </style>
@endsection
@section('content')
    <div class="content-header">

    </div>
    <div class="content">
        <div class="col-12">
            <div class="box box-default">
                <div class="box-header with-border">
                    <h4 class="box-title">{{ __('messages.add-project') }}</h4>
                </div>
                <form method="post" action="{{ route('project.details.add-completed') }}" enctype="multipart/form-data">
                    <!-- /.box-header -->
                    <div class="box-body">
                        <!-- Nav tabs -->
                        <ul class="nav nav-tabs nav-fill" role="tablist">
                            <li class="nav-item">
                                <a class="nav-link {{ session('back') == null ? 'active' : '' }} {{ session('back') != null && session('back')['open'] == 1 ? 'active' : '' }} "
                                   data-toggle="tab" href="#arabic" role="tab">
                                    <span>
                                        <i class="flag-icon flag-icon-eg mr-1"></i></span>
                                    <span class="hidden-xs-down ml-15">{{ __('messages.lang-ar') }}
                                    </span>
                                    @if (session('back') != null && isset(session('back')['error_ar']))
                                        <span style="color: orangered"><i class="fa fa-times mr-1"></i></span>
                                    @endif

                                </a>
                            </li>
                            <li class="nav-item"><a
                                    class="nav-link {{ session('back') != null && session('back')['open'] == 2 ? 'active' : '' }}"
                                    data-toggle="tab" href="#english" role="tab"><span><i
                                            class="flag-icon flag-icon-gb mr-1"></i></span> <span
                                        class="hidden-xs-down ml-15">{{ __('messages.lang-en') }}</span>
                                    @if (session('back') != null && isset(session('back')['error_en']))
                                        <span style="color: orangered"><i class="fa fa-times mr-1"></i></span>
                                    @endif
                                </a></li>
                        </ul>
                        <!-- Tab panes -->

                        <div class="tab-content tabcontent-border">
                            <div
                                class="tab-pane {{ session('back') == null ? 'active' : '' }} {{ session('back') != null && session('back')['open'] == 1 ? 'active' : '' }} "
                                id="arabic" role="tabpanel">
                                <div class="p-15">
                                    <div class="row">
                                        <div class="col-md-6">
                                            <div class="center-test">
                                                <div class="form-input-test">
                                                    <div class="preview">
                                                        <img id="file-ip-1-preview" src="" style="display: none;">
                                                    </div>
                                                    <label for="file-ip-1"> {{ __('messages.photo') }} : <span
                                                            class="danger">*</span></label>
                                                    <input type="file" id="file-ip-1" name="photo"
                                                           onchange="showPreview(event);" accept="image/*" required>
                                                    @if ($errors->has('photo'))
                                                        <span class="help-block">
                                                            <strong
                                                                class="text-danger">{{ $errors->first('photo') }}</strong>
                                                        </span>
                                                    @endif

                                                </div>
                                            </div>
                                        </div>
                                        <div class="col-md-6">
                                            <div class="center-test">
                                                <div class="form-input-test">
                                                    <div class="preview">
                                                        <img id="owner_photo-preview" src="" style="display: none;">
                                                    </div>
                                                    <label for="owner_photo"> {{ __('messages.owner_photo') }} : <span
                                                            class="danger"></span></label>
                                                    <input type="file" id="owner_photo" name="owner_photo"
                                                           onchange="showPreviewOwner(event);" accept="image/*">
                                                    @if ($errors->has('owner_photo'))
                                                        <span class="help-block">
                                                            <strong
                                                                class="text-danger">{{ $errors->first('owner_photo') }}</strong>
                                                        </span>
                                                    @endif

                                                </div>
                                            </div>
                                        </div>

                                    </div>
                                    <div class="row">
                                        <div class="col-md-6">
                                            <div class="form-group">
                                                <label for="wemailAddress2"> {{ __('messages.title_ar') }} : <span
                                                        class="danger">*</span> </label>
                                                <input id="title_ar" type="text" class="form-control " name="title_ar"
                                                       value="{{ old('title_ar') }}">
                                                @if ($errors->has('title_ar'))
                                                    <span class="help-block">
                                                        <strong
                                                            class="text-danger">{{ $errors->first('title_ar') }}</strong>
                                                    </span>
                                                @endif
                                            </div>
                                        </div>
                                        <div class="col-md-6">
                                            <div class="form-group">
                                                <label for="slug_ar">{{ __('messages.slug_ar') }} : <span
                                                        class="danger"></span></label>
                                                <input type="text" name="slug_ar" value="{{ old('slug_ar') }}"
                                                       class="form-control" id="slug_ar">
                                                @if ($errors->has('slug_ar'))
                                                    <span class="help-block">
                                                        <strong
                                                            class="text-danger">{{ $errors->first('slug_ar') }}</strong>
                                                    </span>
                                                @endif
                                            </div>
                                        </div>
                                    </div>
                                    <div class="row">
                                        <div class="col-md-6">
                                            <div class="form-group">
                                                <label for="category_id"> {{ __('messages.type') }} : <span
                                                        class="danger">*</span> </label>
                                                <select name="type" data-placeholder="Type to search type"
                                                        class="form-control custom-select required select2">
                                                    @if (!empty($types))
                                                        @foreach ($types as $key => $name)
                                                            <option value="{{ $name }}"
                                                                {{ old('type') == $name ? 'selected' : '' }}>
                                                                {{ $key }}</option>
                                                        @endforeach
                                                    @endif

                                                </select>
                                                @if ($errors->has('type'))
                                                    <span class="help-block">
                                                        <strong
                                                            class="text-danger">{{ $errors->first('type') }}</strong>
                                                    </span>
                                                @endif

                                            </div>
                                        </div>
                                        <div class="col-md-6">
                                            <div class="form-group">
                                                <label for="category_id"> {{ __('messages.Type Of Participation') }} :
                                                    <span
                                                        class="danger">*</span> </label>
                                                <select name="category_id[]"
                                                        data-placeholder="Type to search core Business"
                                                        class="form-control custom-select required select2" multiple>
                                                    @if (!empty($cates))
                                                        @foreach ($cates as $cate)
                                                            <option value="{{ $cate->id }}"
                                                            @if (old('category_id') != null)
                                                                {{ in_array($cate->id, old('category_id')) ? 'selected' : '' }}
                                                                @endif>
                                                                {{ $cate->title }}</option>
                                                        @endforeach
                                                    @endif

                                                </select>
                                                @if ($errors->has('category_id'))
                                                    <span class="help-block">
                                                        <strong
                                                            class="text-danger">{{ $errors->first('category_id') }}</strong>
                                                    </span>
                                                @endif

                                            </div>
                                        </div>

                                        <div class="col-md-6">
                                            <div class="form-group">
                                                <label for="location"> {{ __('messages.location') }} : <span
                                                        class="danger">*</span> </label>
                                                <input id="location" type="text" class="form-control "
                                                       name="location" value="{{ old('location') }}">
                                                @if ($errors->has('location'))
                                                    <span class="help-block">
                                                        <strong
                                                            class="text-danger">{{ $errors->first('location') }}</strong>
                                                    </span>
                                                @endif
                                            </div>
                                        </div>

                                        <div class="col-md-6">
                                            <div class="form-group">
                                                <label for="date"> {{ __('messages.start_date') }} : <span
                                                        class="danger">*</span> </label>
                                                <input type="date" class="form-control" value="{{ old('date') }}"
                                                       name="date" id="date">
                                                @if ($errors->has('date'))
                                                    <span class="help-block">
                                                        <strong
                                                            class="text-danger">{{ $errors->first('date') }}</strong>
                                                    </span>
                                                @endif

                                            </div>
                                        </div>
                                        <div class="col-md-6">
                                            <div class="form-group">
                                                <label for="end_date"> {{ __('messages.end_date') }} : <span
                                                        class="danger">*</span> </label>
                                                <input type="date" class="form-control" value="{{ old('end_date') }}"
                                                       name="end_date" id="end_date">
                                                @if ($errors->has('end_date'))
                                                    <span class="help-block">
                                                        <strong
                                                            class="text-danger">{{ $errors->first('end_date') }}</strong>
                                                    </span>
                                                @endif

                                            </div>
                                        </div>

                                        <div class="col-md-6">
                                            <div class="form-group">
                                                <label for="client_ar"> {{ __('messages.client') }} : </label>
                                                <input id="client_ar" type="text" class="form-control "
                                                       name="client_ar" value="{{ old('client_ar') }}">
                                                @if ($errors->has('client_ar'))
                                                    <span class="help-block">
                                                        <strong
                                                            class="text-danger">{{ $errors->first('client_ar') }}</strong>
                                                    </span>
                                                @endif
                                            </div>
                                        </div>
                                        <div class="col-md-6">
                                            <div class="form-group">
                                                <label for="owner_name_ar"> {{ __('messages.owner_name') }} : </label>
                                                <input id="owner_name_ar" type="text" class="form-control "
                                                       name="owner_name_ar" value="{{ old('owner_name_ar') }}">
                                                @if ($errors->has('owner_name_ar'))
                                                    <span class="help-block">
                                                        <strong
                                                            class="text-danger">{{ $errors->first('owner_name_ar') }}</strong>
                                                    </span>
                                                @endif
                                            </div>
                                        </div>

                                        <div class="col-md-6">
                                            <div class="form-group">
                                                <label for="owner_name"> {{ __('messages.contract_value') }} : </label>
                                                <input id="contract_value" type="text" class="form-control "
                                                       name="contract_value" value="{{ old('contract_value') }}">
                                                @if ($errors->has('contract_value'))
                                                    <span class="help-block">
                                                        <strong
                                                            class="text-danger">{{ $errors->first('contract_value') }}</strong>
                                                    </span>
                                                @endif
                                            </div>
                                        </div>
                                        <div class="col-md-6">
                                            <div class="form-group">
                                                <label for="owner_name"> {{ __('messages.duration') }} : </label>
                                                <input id="duration" type="text" class="form-control "
                                                       name="duration" value="{{ old('duration') }}">
                                                @if ($errors->has('duration'))
                                                    <span class="help-block">
                                                        <strong
                                                            class="text-danger">{{ $errors->first('duration') }}</strong>
                                                    </span>
                                                @endif
                                            </div>
                                        </div>
                                        <div class="col-md-6">
                                            <div class="form-group">
                                                <label for="arrangment"> {{ __('messages.arrangment') }} : </label>
                                                <input id="arrangment" type="number" class="form-control "
                                                       name="arrangment"
                                                       value="{{ old('arrangment') != null ? old('arrangment') : 1 }}">
                                                @if ($errors->has('arrangment'))
                                                    <span class="help-block">
                                                        <strong
                                                            class="text-danger">{{ $errors->first('arrangment') }}</strong>
                                                    </span>
                                                @endif
                                            </div>
                                        </div>
                                        <div class="col-md-6">
                                            <div class="form-group">
                                                <label for="in_home"> {{ __('messages.in_home') }} </label>
                                                <input type="checkbox" class="dt-checkboxes" id="in_home" name="in_home"
                                                       {{ old('in_home') ? 'checked' : '' }}
                                                       style="position: relative; left: unset; opacity: 1;right: 0; ">
                                                @if ($errors->has('in_home'))
                                                    <span class="help-block">
                                                        <strong
                                                            class="text-danger">{{ $errors->first('in_home') }}</strong>
                                                    </span>
                                                @endif
                                            </div>
                                        </div>


                                    </div>
                                    <div class="row">
                                        <div class="col-md-12">
                                            <div class="form-group">
                                                <label for="wemailAddress2"> {{ __('messages.desc_ar') }} : <span
                                                        class="danger">*</span> </label>
                                                <textarea id="desc_ar" name="desc_ar" rows="10" cols="40" required>
                                                    {!! old('desc_ar') !!}
                                                </textarea>
                                                @if ($errors->has('desc_ar'))
                                                    <span class="help-block">
                                                        <strong
                                                            class="text-danger">{{ $errors->first('desc_ar') }}</strong>
                                                    </span>
                                                @endif
                                            </div>
                                        </div>

                                    </div>
                                    <div class="row">
                                        <div class="col-md-12">
                                            <div class="form-group">
                                                <label for="scope_ar"> {{ __('messages.scope_ar') }} : <span
                                                        class="danger">*</span> </label>
                                                <textarea id="scope_ar" name="scope_ar" rows="10" cols="40" required>
                                                    {!! old('scope_ar') !!}
                                                </textarea>
                                                @if ($errors->has('scope_ar'))
                                                    <span class="help-block">
                                                        <strong
                                                            class="text-danger">{{ $errors->first('scope_ar') }}</strong>
                                                    </span>
                                                @endif
                                            </div>
                                        </div>

                                    </div>
                                    <div class="row">
                                        <div class="col-md-12">
                                            <div class="form-group">
                                                <label for="work_volume_ar"> {{ __('messages.work_volume') }} : <span
                                                        class="danger"></span> </label>
                                                <textarea id="work_volume_ar" name="work_volume_ar" rows="10" cols="40"
                                                          required>
                                                    {!! old('work_volume_ar') !!}
                                                </textarea>
                                                @if ($errors->has('work_volume_ar'))
                                                    <span class="help-block">
                                                        <strong
                                                            class="text-danger">{{ $errors->first('work_volume_ar') }}</strong>
                                                    </span>
                                                @endif
                                            </div>
                                        </div>

                                    </div>
                                    <div class="row">
                                        <div class="col-md-12">
                                            <div class="form-group">
                                                <label
                                                    for="marine_ar"> {{ __('messages.Marine vessels used in the project ') }}
                                                    : <span
                                                        class="danger"></span> </label>
                                                <textarea id="marine_ar" name="marine_ar" rows="10" cols="30"
                                                          required>
                                                    {!! old('marine_ar') !!}
                                                </textarea>
                                                @if ($errors->has('marine_ar'))
                                                    <span class="help-block">
                                                        <strong
                                                            class="text-danger">{{ $errors->first('marine_ar') }}</strong>
                                                    </span>
                                                @endif
                                            </div>
                                        </div>

                                    </div>

                                </div>
                            </div>
                            <div
                                class="tab-pane {{ session('back') != null && session('back')['open'] == 2 ? 'active' : '' }}"
                                id="english" role="tabpanel">
                                <div class="p-15">
                                    <div class="row">
                                        <div class="col-md-6">
                                            <div class="form-group">
                                                <label for="text_en"> {{ __('messages.title_en') }} : <span
                                                        class="danger"></span> </label>
                                                <input id="title_en" type="text" class="form-control"
                                                       name="title_en" value="{{ old('title_en') }}" id="title_en">
                                                @if ($errors->has('title_en'))
                                                    <span class="help-block">
                                                        <strong
                                                            class="text-danger">{{ $errors->first('title_en') }}</strong>
                                                    </span>
                                                @endif
                                            </div>
                                        </div>
                                        <div class="col-md-6">
                                            <div class="form-group">
                                                <label for="slug_en">{{ __('messages.slug_en') }} : <span
                                                        class="danger"></span></label>
                                                <input type="text" name="slug_en" value="{{ old('slug_en') }}"
                                                       class="form-control" id="slug_en">
                                                @if ($errors->has('slug_en'))
                                                    <span class="help-block">
                                                        <strong
                                                            class="text-danger">{{ $errors->first('slug_en') }}</strong>
                                                    </span>
                                                @endif
                                            </div>
                                        </div>
                                        <div class="col-md-6">
                                            <div class="form-group">
                                                <label for="client_en"> {{ __('messages.client') }} : </label>
                                                <input id="client_en" type="text" class="form-control "
                                                       name="client_en" value="{{ old('client_en') }}">
                                                @if ($errors->has('client_en'))
                                                    <span class="help-block">
                                                        <strong
                                                            class="text-danger">{{ $errors->first('client_en') }}</strong>
                                                    </span>
                                                @endif
                                            </div>
                                        </div>
                                        <div class="col-md-6">
                                            <div class="form-group">
                                                <label for="owner_name_en"> {{ __('messages.owner_name') }} : </label>
                                                <input id="owner_name_en" type="text" class="form-control "
                                                       name="owner_name_en" value="{{ old('owner_name_en') }}">
                                                @if ($errors->has('owner_name_en'))
                                                    <span class="help-block">
                                                        <strong
                                                            class="text-danger">{{ $errors->first('owner_name_en') }}</strong>
                                                    </span>
                                                @endif
                                            </div>
                                        </div>
                                        <div class="col-md-12">
                                            <div class="form-group">
                                                <label for="location_en"> {{ __('messages.location') }} : <span
                                                        class="danger">*</span> </label>
                                                <input id="location_en" type="text" class="form-control "
                                                       name="location_en" value="{{ old('location_en') }}">
                                                @if ($errors->has('location_en'))
                                                    <span class="help-block">
                                                        <strong
                                                            class="text-danger">{{ $errors->first('location_en') }}</strong>
                                                    </span>
                                                @endif
                                            </div>
                                        </div>
                                        <div class="col-md-12">
                                            <div class="form-group">
                                                <label for="wemailAddress2"> {{ __('messages.desc_en') }} : <span
                                                        class="danger">*</span> </label>
                                                <textarea id="desc_en" name="desc_en" rows="10" cols="80">
                                                    {!! old('desc_en') !!}
                                                </textarea>
                                                @if ($errors->has('desc_en'))
                                                    <span class="help-block">
                                                        <strong
                                                            class="text-danger">{{ $errors->first('desc_en') }}</strong>
                                                    </span>
                                                @endif
                                            </div>
                                        </div>
                                        <div class="col-md-12">
                                            <div class="form-group">
                                                <label for="scope_en"> {{ __('messages.scope_en') }} : <span
                                                        class="danger">*</span> </label>
                                                <textarea id="scope_en" name="scope_en" rows="10" cols="80">
                                                    {!! old('scope_en') !!}
                                                </textarea>
                                                @if ($errors->has('scope_en'))
                                                    <span class="help-block">
                                                        <strong
                                                            class="text-danger">{{ $errors->first('scope_en') }}</strong>
                                                    </span>
                                                @endif
                                            </div>
                                        </div>
                                        <div class="col-md-12">
                                            <div class="form-group">
                                                <label for="work_volume_en"> {{ __('messages.work_volume') }} : <span
                                                        class="danger"></span> </label>
                                                <textarea id="work_volume_en" name="work_volume_en" rows="10" cols="30"
                                                          >
                                                    {!! old('work_volume_en') !!}
                                                </textarea>
                                                @if ($errors->has('work_volume_en'))
                                                    <span class="help-block">
                                                        <strong
                                                            class="text-danger">{{ $errors->first('work_volume_en') }}</strong>
                                                    </span>
                                                @endif
                                            </div>
                                        </div>
                                        <div class="col-md-12">
                                            <div class="form-group">
                                                <label
                                                    for="marine_en"> {{ __('messages.Marine vessels used in the project ') }}
                                                    : <span
                                                        class="danger"></span> </label>
                                                <textarea id="marine_en" name="marine_en" rows="10" cols="30"
                                                          >
                                                    {!! old('marine_en') !!}
                                                </textarea>
                                                @if ($errors->has('marine_en'))
                                                    <span class="help-block">
                                                        <strong
                                                            class="text-danger">{{ $errors->first('marine_en') }}</strong>
                                                    </span>
                                                @endif
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>

                        </div>

                    </div>
                    <input type="hidden" value="{{ csrf_token() }}" name="_token">
                    <!-- /.box-body -->
                    <div class="box-footer">
                        <button type="submit" class="btn btn-rounded btn-primary btn-outline">
                            <i class="ti-save-alt"></i> Save
                        </button>
                    </div>
                </form>
            </div>
            <!-- /.box -->
        </div>
    </div>

@endsection
@section('js')
    <script>
        $(function () {
            "use strict";

            // Replace the <textarea id="editor1"> with a CKEditor
            // instance, using default configuration.
            CKEDITOR.replace('desc_ar', {
                extraPlugins: 'image',
                filebrowserUploadUrl: "{{ route('upload_image') }}?_token={{ csrf_token() }}",
                filebrowserUploadMethod: 'from'
            });
            CKEDITOR.replace('desc_en', {
                extraPlugins: 'image',
                filebrowserUploadUrl: "{{ route('upload_image') }}?_token={{ csrf_token() }}",
                filebrowserUploadMethod: 'from'
            });
            CKEDITOR.replace('scope_ar', {
                extraPlugins: 'image',
                filebrowserUploadUrl: "{{ route('upload_image') }}?_token={{ csrf_token() }}",
                filebrowserUploadMethod: 'from'
            });
            CKEDITOR.replace('scope_en', {
                extraPlugins: 'image',
                filebrowserUploadUrl: "{{ route('upload_image') }}?_token={{ csrf_token() }}",
                filebrowserUploadMethod: 'from'
            });
            CKEDITOR.replace('work_volume_ar', {
                extraPlugins: 'image',
                filebrowserUploadUrl: "{{ route('upload_image') }}?_token={{ csrf_token() }}",
                filebrowserUploadMethod: 'from'
            });
            CKEDITOR.replace('work_volume_en', {
                extraPlugins: 'image',
                filebrowserUploadUrl: "{{ route('upload_image') }}?_token={{ csrf_token() }}",
                filebrowserUploadMethod: 'from'
            });
            CKEDITOR.replace('marine_ar', {
                extraPlugins: 'image',
                filebrowserUploadUrl: "{{ route('upload_image') }}?_token={{ csrf_token() }}",
                filebrowserUploadMethod: 'from'
            });
            CKEDITOR.replace('marine_en', {
                extraPlugins: 'image',
                filebrowserUploadUrl: "{{ route('upload_image') }}?_token={{ csrf_token() }}",
                filebrowserUploadMethod: 'from'
            });
            //bootstrap WYSIHTML5 - text editor
            $('.textarea').wysihtml5();
        });

        $("#title_ar").on('input', function () {
            var titleValue = $(this).val();
            var slugValue = titleValue.toLowerCase().replace(/\s+/g, '-');
            $("#slug_ar").val(slugValue);
        });

        $("#title_en").on('input', function () {
            var titleValue = $(this).val();
            var slugValue = titleValue.toLowerCase().replace(/\s+/g, '-');
            $("#slug_en").val(slugValue);
        });


        $(document).ready(function () {
            $('.select_2').select2();
        });

        function showPreview(event) {

            if (event.target.files.length > 0) {
                let file = event.target.files[0];
                let img = new Image();
                let src = URL.createObjectURL(file);
                img.onload = function () {
                    let ratio = img.width / img.height;
                    if (Math.abs(ratio - 3 / 2) > 0.01) {
                        let preview = document.getElementById("file-ip-1-preview");
                        preview.src = src;
                        preview.style.display = "block";
                    } else {

                        alert("يجب أن تكون أبعاد الصورة 3 / 2");
                        event.target.value = "";
                        document.getElementById("file-ip-1-preview").style.display = "none";
                    }
                };

                img.src = src;
            }
        }

        function showPreviewOwner(event) {

            if (event.target.files.length > 0) {
                let file = event.target.files[0];
                let img = new Image();
                let src = URL.createObjectURL(file);
                img.onload = function () {
                    let preview = document.getElementById("owner_photo-preview");
                    preview.src = src;
                    preview.style.display = "block";

                };

                img.src = src;
            }
        }
    </script>
@endsection