@extends('layouts.main')

@section('main-container')
    <div class="tab-content">
        <div class="tab-pane fade show active" id="kt_ecommerce_add_product_general" role="tab-panel">
            <div class="d-flex flex-column gap-7 gap-lg-10">

                <!--begin::General options-->
                <div class="card card-flush py-4">
                    <!--begin::Card header-->
                    <div class="card-header">
                        <div class="card-title">
                            <div class="d-flex align-items-center" style="margin-top: 4rem;margin-bottom: 1.5rem;">
                                <a href="{{ url('/resources') }}" class="">
                                    <svg style="margin-top: -3px;" width="24" height="25" viewBox="0 0 24 25"
                                        fill="none" xmlns="http://www.w3.org/2000/svg">
                                        <path d="M19 12.5H5" stroke="#200F31" stroke-width="2" stroke-linecap="round"
                                            stroke-linejoin="round" />
                                        <path d="M12 19.5L5 12.5L12 5.5" stroke="#200F31" stroke-width="2"
                                            stroke-linecap="round" stroke-linejoin="round" />
                                    </svg>

                                    <span class="ms-2 fs-1hx h2"
                                        style="color:#200F31;font-size:18px;margin-left:40px">Edit Resource</span>
                                </a>
                            </div>
                        </div>
                    </div>

                    <div class="card-body pt-0">
                        <form method="POST" action="{{ route('resource.update', $resource->id) }}" enctype="multipart/form-data">
                            @csrf
                            @method('PUT')


                            <div class="mb-10 fv-row fv-plugins-icon-container">
                                <label for="title" class="required form-label">Title</label>

                                <input type="text" name="title" id="title"
                                    class="form-control mb-2 @error('title') is-invalid @enderror"
                                    placeholder="Title" value="{{ old('title', $resource->title) }}">
                                @error('title')
                                    <div
                                        class="fv-plugins-message-container fv-plugins-message-container--enabled invalid-feedback">
                                        {{ $message }}
                                    </div>
                                @enderror
                                <label for="type" class="form-label required">Type</label>
                                <br>

                                <label for="type_url" style="margin-right: 20px">
                                    <input type="radio" name="type" id="type_url" value="URL" style="margin-right: 5px" {{ $resource->type == "URL" ? "checked" : "" }} {{ old('type') == "URL" ? "checked" : "" }}> URL
                                </label>

                                <label for="type_file">
                                    <input type="radio" name="type" id="type_file" value="File" style="margin-right: 5px" {{ $resource->type == "File" ? "checked" : "" }} {{ old('type') == "File" ? "checked" : "" }}> File
                                </label>
                                <br>
                                @error('type')
                                    <div
                                        class="fv-plugins-message-container fv-plugins-message-container--enabled invalid-feedback">
                                        {{ $message }}
                                    </div>
                                @enderror
                                <br>

                                <div class="url_div" style="display: none">
                                    <label for="url" class="form-label">URL</label>
                                
                                    <input type="text" name="url" id="url"
                                    class="form-control mb-2 @error('url') is-invalid @enderror"
                                    placeholder="URL" value="{{ old('url', $resource->link_1) }}">
                                    @error('url')
                                    <div
                                        class="fv-plugins-message-container fv-plugins-message-container--enabled invalid-feedback">
                                        {{ $message }}
                                    </div>
                                    @enderror
                                </div>
                            
                                <div class="file_div" style="display: none">
                                    <label for="file" class="form-label">File</label>
                                    <input type="file" class="form-control mb-2 @error('file') is-invalid @enderror"
                                        name="file">
                                    @error('file')
                                        <div
                                            class="fv-plugins-message-container fv-plugins-message-container--enabled invalid-feedback">
                                            {{ $message }}
                                        </div>
                                    @enderror
                                    @if ($resource->type == "File")
                                        <a href="{{ asset($resource->link_2)}}" target="_blank">{{ asset($resource->link_2)}}</a>
                                    @endif
                                </div>
                            </div>
                            <button type="submit" class="btn btn-primary">Submit</button>
                        </form>

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

    
    <script>
        $(document).ready(function () {
            $('input[name="type"]').change(function (e) { 
                e.preventDefault();
                
                type_change_func();
            });

            function type_change_func(){
                var type = $('input[name="type"]:checked').val();
                if (type == "URL") {
                    $('.url_div').show();
                    $('.file_div').hide();
                } else if(type == "File"){
                    $('.url_div').hide();
                    $('.file_div').show();
                }
            }
            
            type_change_func();
        });
    </script>
@endsection