@extends('admin.layouts.master')

@section('content')
    <div class="page-wrapper page-settings">
        <div class="content">
            <div class="content-page-header content-page-headersplit">
                <h5>Post Ad</h5>
                <div style="text-align: end;margin-right:3%">
                    <a class="btn btn-primary" href="{{ route('admin.myads') }}">Back</a>
                </div>
            </div>
            <div class="row">
                <div class="col-12">
                    <div class="profile-content">
                        <div class="row dashboard-info">
                            <div class="col-lg-12">
                                <div class="profile-content">
                                    <div class="messages-form">
                                        <form method="POST" action="{{ route('admin.addpost') }}" enctype="multipart/form-data">
                                            @csrf
                                            <div class="card">
                                                <div class="card-header">
                                                    <h4>Ad information</h4>
                                                </div>
                                                <div class="card-body">
                                                    <div class="row">
                                                        <div class="col-lg-6 col-md-6">
                                                            <div class="form-set">
                                                                <label class="col-form-label">Ad Title <span class="mandatory">*</span></label>
                                                                <input class="form-control pass-input" id="title" name="title" type="text" value="{{ old('title') }}" placeholder="Title"
                                                                    maxlength="250">
                                                                @error('title')
                                                                    <p class='text-danger ms-1'>{{ $message }}</p>
                                                                @enderror
                                                            </div>
                                                        </div>
                                                        <div class="col-lg-6 col-md-6">
                                                            <div class="form-set">
                                                                <label class="col-form-label">Price <span class="mandatory">*</span></label>
                                                                <div class="input-group price">
                                                                    <span class="input-group-text bg-transparent">{{$currency}}</span>
                                                                    <input class="form-control" id="price" name="price" type="text" value="{{ old('price') }}" placeholder="Enter price" onfocusout="myFunction()">
                                                                </div>
                                                                @error('price')
                                                                    <p class='text-danger ms-1'>{{ $message }}</p>
                                                                @enderror
                                                            </div>
                                                        </div>
                                                    </div>
                                                    <div class="form-set">
                                                        <label class="col-form-label">Ad Description <span class="mandatory">*</span></label>
                                                        <textarea class="form-control listingdescription rte-zone" id="editor" name="description" rows="3" placeholder="Message">{{ old('description') }}</textarea>
                                                        @error('description')
                                                            <p class='text-danger ms-1'>{{ $message }}</p>
                                                        @enderror
                                                    </div>
                                                    <div class="row">
                                                        <div class="col-lg-6 col-md-6">
                                                            <div class="form-set">
                                                                <label class="col-form-label">Category <span class="mandatory">*</span></label>
                                                                <select class="form-control select" id="category" name="category">                                                                    
                                                                    <option value="">Choose Category</option>
                                                                    @foreach ($categories as $category)
                                                                        <option value="{{ $category->id }}" @if(old('category') == $category->id) selected @endif>{{ $category->category }}</option>
                                                                    @endforeach                                                                    
                                                                </select>
                                                                @error('category')
                                                                    <p class='text-danger ms-1'>{{ $message }}</p>
                                                                @enderror
                                                            </div>
                                                        </div>
                                                        <div class="col-lg-6 col-md-6">
                                                            <div class="form-set">
                                                                <label class="col-form-label">Sub Category <span class="mandatory">*</span></label>
                                                                <select class="form-control select" id="sub_category" name="sub_category">
                                                                    @if(old('sub_category'))
                                                                        <option value="{{old('sub_category')}}" selected>subcategory selected already</option>
                                                                    @else
                                                                        <option value="">Choose Sub Category</option>
                                                                    @endif
                                                                </select>
                                                                @error('sub_category')
                                                                    <p class='text-danger ms-1'>{{ $message }}</p>
                                                                @enderror
                                                            </div>
                                                        </div>
                                                    </div>
                                                    <div class="row">
                                                    <div class="col-lg-6 col-md-6">
                                                            <div class="form-set">
                                                                <label class="col-form-label">Caliber </label>
                                                                <select class="form-control select" id="subsub_category" name="subsub_category">
                                                                    @if(old('subsub_category'))
                                                                        <option value="{{old('subsub_category')}}" selected>Caliber selected already</option>
                                                                    @else
                                                                        <option value="">Choose Caliber</option>
                                                                    @endif
                                                                </select>
                                                            </div>
                                                        </div>
                                                        <div class="col-lg-6 col-md-6">
                                                            <div class="form-set">
                                                                <label class="col-form-label">Shipping </label>
                                                                <select class="form-control select" id="shipping" name="shipping[]" multiple>                                                                    
                                                                    <!--<option value="">Choose Shipping</option>-->
                                                                    @foreach ($shippings as $shipping)
                                                                        <option value="{{ $shipping->id }}" @if(in_array($shipping->id, old('shipping', []))) selected @endif>{{ $shipping->shipping_name }}</option>
                                                                    @endforeach                                                                    
                                                                </select>
                                                            </div>
                                                        </div>
                                                        
                                                        <div class="form-set col-lg-6 col-md-6">
                                                            <label class="col-form-label">Additional Information</label>
                                                            <textarea class="form-control" maxlength="250" name="additional_information" rows="3">{{old('additional_information')}}</textarea>
                                                            @error('additional_information')
                                                                <p class='text-danger ms-1'>{{ $message }}</p>
                                                            @enderror
                                                        </div>
                                                        <div class="form-set col-lg-6 col-md-6">
                                                            <label class="col-form-label">Is Featured?<span class="mandatory">*</span></label><br><br>
                                                            <ul class="custom-radiosbtn">
                                                                <li>
                                                                    <label class="radiossets">
                                                                        Yes
                                                                        <input name="is_featured" type="radio" value="Yes">
                                                                        <span class="checkmark-radio"></span>
                                                                    </label>
                                                                </li>
                                                                <li>
                                                                    <label class="radiossets">
                                                                        No
                                                                        <input name="is_featured" type="radio" value="No" checked="checked">
                                                                        <span class="checkmark-radio"></span>
                                                                    </label>
                                                                </li>
                                                            </ul>
                                                            @error('is_featured')
                                                                <p class='text-danger ms-1'>{{ $message }}</p>
                                                            @enderror
                                                        </div>
                                                        <div class="form-set col-lg-6 col-md-6">
                                                            <label class="col-form-label">Home URL</label>
                                                            <input class="form-control pass-input" id="home_url" name="home_url" type="text" value="{{ old('home_url') }}"
                                                                placeholder="https://wwwexample.com">
                                                            @error('home_url')
                                                                <p class='text-danger ms-1'>{{ $message }}</p>
                                                            @enderror
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="card dash-cards">
                                                <div class="card-header">
                                                    <h4>Location information</h4>
                                                </div>
                                                <div class="card-body">
                                                    <div class="form-set">
                                                        <label class="col-form-label">Location Address<span class="mandatory">*</span></label>
                                                        <input class="form-control" id="location_address" name="location_address" type="text" value="{{ old('location_address') }}"
                                                            placeholder="Queens, New York NY">
                                                        @error('location_address')
                                                            <p class='text-danger ms-1'>{{ $message }}</p>
                                                        @enderror
                                                        @if ($errors->has('ad_lat') || $errors->has('ad_lng'))
                                                            <p class='text-danger ms-1'>Please select a valid address from the autocomplete suggestions.</p>
                                                        @endif
                                                        <input type="hidden" name="ad_city" id="ad_city" value="{{ old('ad_city') }}">
                                                        <input type="hidden" name="ad_state" id="ad_state" value="{{ old('ad_state') }}">
                                                        <input type="hidden" name="ad_state_code" id="ad_state_code" value="{{ old('ad_state_code') }}">
                                                        <input type="hidden" name="ad_lat" id="ad_lat" value="{{ old('ad_lat') }}">
                                                        <input type="hidden" name="ad_lng" id="ad_lng" value="{{ old('ad_lng') }}">
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="card dash-cards media-section">
                                                <div class="card-header">
                                                    <h4>Media Information </h4>
                                                </div>
                                                <div class="card-body">
                                                    <div class="form-set p-3">
                                                        <label>Upload Image/Video <span class="mandatory">*</span></label>
                                                        <div class="form-uploads mb-4">
                                                            <div class="form-uploads-path">
                                                                <div class="row">
                                                                    <div class="col-md-12">
                                                                        <img id="upload-img-preview" src="assets/img/icons/upload.svg" alt="img" width="55px" height="55px">
                                                                        <div class="flex-browse">
                                                                            <div class="preview"></div>
                                                                            <div class="file-browse flex-column">
                                                                                <h6>Click or Drag and Drop </h6>
                                                                                <div class="file-browse-path">
                                                                                    <input id="upload_media_file" name="upload_media_file[]" type="file" multiple>
                                                                                    <a href="javascript:void(0);"> Browse</a>
                                                                                </div>
                                                                                <h5>Supported formats: JPEG, JPG, PNG, MP4</h5>
                                                                                <h5>Max size: 2MB</h5>
                                                                                <h5>Image Dimensions: Min 1400px X 500px</h5>
                                                                            </div>
                                                                        </div>
                                                                </div>
                                                            </div>
                                                        </div>            
                                                        <div class="d-flex mt-3">
                                                            <button class="btn btn-primary" type="submit">Submit</button>
                                                        </div>
                                                    </div>
                                                    @error('upload_media_file')
                                                        <p class='text-danger ms-1'>{{ $message }}</p>
                                                    @enderror
                                                    @error('upload_media_file.*')
                                                        <p class='text-danger ms-1'>{{ $message }}</p>
                                                    @enderror
                                                    @if (session()->has('mismatch'))
                                                        <p class='text-danger ms-1'>{{ session('mismatch') }}</p>
                                                    @endif
                                                </div>
                                            </div>
                                        </form>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>

<script>
$(document).ready(function() {
// Function to load subcategories

// Load subcategories on page load
var initialCategoryId = $('#category').val();
var initialSubcategoryId = "{{ old('sub_category') }}";
var initialSubsubcategoryId = "{{ old('subsub_category') }}";
if (initialCategoryId) {
loadSubcategories(initialCategoryId, initialSubcategoryId);
}
if (initialSubcategoryId) {
loadSubsubcategories(initialSubcategoryId, initialSubsubcategoryId);
}

// Load subcategories when category changes
$('#category').change(function() {
var categoryId = $(this).val();
loadSubcategories(categoryId);
});

$('#sub_category').change(function() {
var subcategoryId = $(this).val();
loadSubsubcategories(subcategoryId);
});
});
</script>

@endsection