@extends('Dashboard.layouts.master')
@section('title', 'Post | Edit')
@section('css')
@endsection
@section('content')
    <div class="app-main flex-column flex-row-fluid" id="kt_app_main">
        <div class="d-flex flex-column flex-column-fluid">
            <div id="kt_app_content" class="app-content flex-column-fluid">
                <livewire:bread-crumb heading="{{__('translations.posts')}}"
                                      url_1="{{Helper::handle_route('dashboard')}}"
                                      name_1="{{__('translations.dashboard')}}"
                                      url_2="{{Helper::handle_route('posts.index')}}"
                                      name_2="{{__('translations.posts')}}"
                                      name_3="{{__('forms.edit')}}"/>
                <!--begin::Content container-->
                <div id="kt_app_content_container" class="app-container container-xxl">
                    <div class="card">
                        <form action="{{Helper::handle_route('posts.update' , $post)}}" method="POST"
                              class="form" enctype="multipart/form-data">
                            @csrf
                            @method('PUT')
                            <div class="card-body">
                                <div class="mb-5">
                                    <livewire:form.text label="{{__('forms.title')}}" name="title"
                                                        value="{{$post->title}}"
                                    />
                                </div>

                                <div class="mb-3">
                                    <label>Post Type <span class="text-danger">*</span></label>
                                    <select name="post_type"
                                            class="form-control @error('post_type') border-danger @enderror"
                                            id="post_type">
                                        <option value="image" {{$post->type == 'image' ? 'selected' : ''}}>Image
                                        </option>
                                        <option value="video" {{$post->type == 'video' ? 'selected' : ''}}>Video
                                        </option>
                                        <option value="text" {{$post->type == 'text'? 'selected' : ''}}>Text</option>
                                    </select>
                                    @error('post_type')
                                    <span class="text-danger"> {{ $errors->first('post_type') }} </span>
                                    @enderror
                                </div>

                                <div class="row mb-5">

                                    <div class="mb-5 col-4" id="image_"
                                         style=" {{$post->type == 'image' ? 'display:block;' : 'display:none;'}}">
                                        <livewire:form.image label="{{__('forms.image')}}" name="image"
                                                             value="{{$post->getFirstMediaUrl('image_post')}}"/>
                                    </div>

                                    <div class="mb-5 col-8 mt-5" id="video"
                                         style=" {{$post->type == 'video' ? 'display:block;' : 'display:none;'}}">
                                        <iframe src="{{'https://content.jwplatform.com/previews/'.$post->media_id}}"
                                                width="400" height="220"></iframe>
                                        <br>
                                        <label>Video </label>
                                        <input type="file" name="video" class="file_multi_video form-control  @error('video') border-danger @enderror"
                                               accept="video/*" >

                                        @error('video')
                                        <span class="text-danger"> {{ $errors->first('video') }} </span>
                                        @enderror

                                        <div class="mt-5">
                                            <livewire:form.text label="Video link" name="video_link"
                                                                value="{{$post->video_link}}"
                                            />
                                        </div>
                                    </div>

                                </div>

                                <div class="mb-5">
                                    <label>Tags</label>
                                    <select class="form-control" name="tags[]" multiple="multiple" id="tags">
                                        @php
                                            foreach ($post->tags as $key => $tag) {
                                               echo '<option value="'.$tag->tag_id.'" selected>'.$tag->tag->title.'</option>';
                                            }
                                        @endphp
                                    </select>
                                </div>

                                <div class="mb-5">
                                    <livewire:form.area label="{{__('forms.description')}}"
                                                        required="required"
                                                        name="description" value="{{$post->description}}"/>
                                </div>

                                @if(isset($phases))
                                    <div class="mb-5">
                                        <label>Phase</label>
                                        <select name="phase_id" class="form-control">
                                            <option
                                                value="" {{$post->phase_id == null ? 'selected' : ''}}>Select
                                                Phase
                                            </option>
                                            @foreach($phases as $phase)
                                                <option
                                                    value="{{$phase->id}}" {{$post->phase_id == $phase->id ? 'selected' : ''}}>{{$phase->title}}</option>
                                            @endforeach
                                        </select>
                                    </div>
                                @endif

                                <div class="mb-3">
                                    <label>{{__('forms.status')}}</label>
                                    <select name="status" class="form-control">
                                        <option
                                            value="1" {{ $post->status == 1 ? 'selected' : ''}}>{{__('forms.enabled')}}</option>
                                        <option
                                            value="0" {{  $post->status  == 0 ? 'selected' : ''}}>{{__('forms.disabled')}}</option>
                                    </select>
                                </div>

                                <div class="mb-5">
                                    <div class="form-check form-switch p-0">
                                        <div class="d-flex">
                                            <label class="form-check-label fw-bold"
                                                   style="font-size: 14px;">Private </label>

                                            <div class="form-switch form-check ms-3 me-3 mt-1">
                                                <input type="checkbox" class="form-check-input" name="is_public"
                                                       value="1" {{ $post->is_public == 1 ? 'checked="checked"' : '' }}>
                                            </div>
                                            <label class="form-check-label fs-1x  fw-bold"
                                                   style="font-size: 14px;">Public</label>
                                        </div>
                                    </div>
                                </div>

                            </div>
                            <div class="card-footer">
                                <input type="submit" value="{{__('forms.save')}}" class="btn btn-primary">
                            </div>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection
@section('scripts')
    <script>
        $(document).ready(function () {

            $('#tags').select2({
                ajax: {
                    url: '{{route('tags.data')}}',
                    dataType: 'json',
                    processResults: function (data) {
                        return {
                            results: data
                        }
                    }
                },
                placeholder: "Select tags",
            });

            $(document).ready(function () {
                $('.kt_docs_ckeditor_classic').each(function () {
                    CKEDITOR.replace($(this)[0]).config.width = '100%';
                });

                const $type = $('#post_type :selected').text();

                if ($type === 'Text') {
                    $('#mendatory').show();
                } else {
                    $('#mendatory').hide();
                }

            });

        });
    </script>
@endsection