@extends('web.layout.master')

@section('content')

<style>
    .textheight {
    min-width: 90px;
}

</style>
  {{--  <div class="container" style="display: none; min-height:240px;" id="manufacturerHeader" >

        <div class="row">
            <div class="col-md-6"><img src="" alt="..." srcset="" id="manufacturerHeaderImage"></div>
            <div class="d-none d-md-block d-lg-block col-md-6 text-end"><img src="" alt="..." srcset="" id="manufacturerHeaderSecImg" width="300px"></div>
        </div>
    </div> --}}
<section >
    <div class="container">
        <nav aria-label="Breadcrumb" class="breadcrumb">
            <ul>
                <li><a href="{{ url('/') }}">Home</a></li>
                @if($subid == '|15881')
                    <li><span aria-label="..." role="main"  aria-current="page" class="highlight-label">Kitchen</span></li>

                @elseif($subid == '|15882')
                    <li><span aria-label="..." role="main"  aria-current="page" class="highlight-label">Laundry</span></li>
                @elseif($subid == '|15878')
                    <li><span aria-label="..." role="main"  aria-current="page" class="highlight-label">Tool</span></li>
                @elseif($subid == '|15879')
                    <li><span aria-label="..." role="main"  aria-current="page" class="highlight-label">Yard</span></li>
                @elseif($subid == '|15880')
                    <li><span aria-label="..." role="main"  aria-current="page" class="highlight-label">Vacuum</span></li>
                @elseif($subid == '|9292')
                    <li><span aria-label="..." role="main"  aria-current="page" class="highlight-label">Pool</span></li>
                @endif
                @php
                $titleFind = "";
                @endphp
                @if(!empty($breadcrumbsModel))
                @php
                $breadcrumbsModel = array_reverse($breadcrumbsModel);

                @endphp
                @foreach ($breadcrumbsModel as $k => $b)
                    @if($loop->last)
                        <li><span aria-label="..." role="main"  aria-current="page"  class="highlight-label">{{ $titleFind = $b['title'] }}</span></li>
                        @php
                            $titleFind = $b['title'];
                        @endphp
                    @else
                        <li><a href="{{ $b['url'] }}">{{ $b['title'] }}</a></li>

                    @endif

                @endforeach
                @endif
                {{--  <li><span aria-label="..." role="main"  aria-current="page">{{ !empty($title) ? str_replace('| PartsWarehouse','',$title) : '' }}</span></li>  --}}
            </ul>
        </nav>
    </div>
    @foreach (['danger', 'warning', 'success', 'info'] as $msg)
            @if(Session::has('alert-' . $msg))

            <div class="alert alert-{{ $msg }} mt-2"><p>{{ Session::get('alert-' . $msg) }}</p></div>
            @endif
        @endforeach
        @if ($errors->any())
        <div class="alert alert-danger">
            <ul>
                @foreach ($errors->all() as $error)
                    <li>{{ $error }}</li>
                @endforeach
            </ul>
        </div>
    @endif
    @if(!empty($modeldata["header"]["logo_banner"]))
    <section >

        <div class="container" style="display: block; " id="manufacturerHeader" >
            <H1><img alt="{{ !empty($title) ? str_replace('| PartsWarehouse','',$title) : '' }}" src="{{ asset('assets/web') }}/images/no-image-banner.png" data-src="{{ $modeldata["header"]["logo_banner"] }}" width="100%" style="max-height:240px;" class="lazy"/></H1>
        </div>

    </section>
    @endif
</section>
<section  style="min-height:135px;">
    <manufacture-model-search ></manufacture-model-search>
</section>
{{-- <div class="text-center" style="margin-top:-15px">
    <a href="javascript:void(0)" onclick="notlistedBtn()" class="btn btn-block btn-danger btn-sm setWebSiteBtnStyle" aria-label="">Don't See Your Model Listed?</a>
</div> --}}
<section>
 <div class="container" style="margin-top: 10px; margin-bottom: 60px;">
     {{--  <div class="row d-lg-none">
         <h1 class="fw-bold mb-3 h2">{{ request()->cat_name }}</h1>
     </div>  --}}

     <div class="row mt-2 mb-4" id="manufacturerList">

        @foreach ($modeldata['list'] as $m)
        @php
        $subcat = str_replace('|','',$m['subcat']);
        $pname = preg_replace("/[^A-Za-z0-9\s]/", "", $m['Name']);
        $pname1 = str_replace(" ","-",$pname).'-s';
/* if (!empty($newURLs[$subcat])) {
                $newURL = url($newURLs[$subcat]);
            }else{
                $newURL = url('/'.$pname1.'/'.$subcat.'.htm');
            }            */
if($newURLs[$subcat] == ($subcat.'-s/'.$subcat .'.htm')){
            $newURL = url('/'.$pname1.'/'.$subcat.'.htm');
        }else{
            if (!empty($newURLs[$subcat])) {
                $newURL = url($newURLs[$subcat]);
            }else{
                $newURL = url('/'.$pname1.'/'.$subcat.'.htm');
            }
        }
        @endphp
            <div class="col-md-3 col-sm-6 p-2 col-xs-6 text-center">
                <a href="{{ $newURL }}" class="text-decoration-none text-black">
                    <div class="card-wraptocenter" style="">
                        <div class="wraptocenter-margin">
                            <div class="wraptocenter"><img alt="..." width="" style="max-width:100%; max-height:100%;" height="" data-src="{{ $m['thumbnail'] }}" src="https://s3.us-central-1.wasabisys.com/partswarehouse/photos/NO_PRODUCT_IMAGE-2.jpg" onerror="this.onerror=null;this.src=&quot;https://s3.us-central-1.wasabisys.com/partswarehouse/photos/NO_PRODUCT_IMAGE-2.jpg&quot;" class="lazy"></div>
                        </div>
                        <p class="text-center mt-4 prod-title-3line">{{ $m['Name'] }} </p>
                    </div>
                </a>
            </div>
        @endforeach
     </div>
 </div>
 <div class="modal" id="notlistedModel" tabindex="-1">
    <div class="modal-dialog modal-lg">
        <div class="modal-content">
            <div class="modal-header">
                <div class="text-start">
                    <h3>How can we help you?</h3>

                </div>
                <button role="button" tabindex="0" aria-labelledby="Close" type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <div class="text-start p-2">
                <h5>If you don't see your model or part listed, let us set it up for you!</h5>
            </div>
            <div class="modal-body">
                <form id="RarelyOrderedForm" action="{{ route('rarely-ordered-add-process') }}" method="post">
                    @csrf

                    <input aria-labelledby="PartsWarehouse" type="hidden"
                        value="{{ !empty($ClientMap) ? $ClientMap->ProductCode: '' }}" name="productcode">

                    <div class="row mt-2">
                        <div class="col-md-4 mt-2">
                            <div class="form-group text-start">
                                <label for="label">Brand?</label>
                            </div>
                        </div>
                        <div class="col-md-8">
                            <div class="form-group">
                                <input aria-labelledby="brand" type="text" class="form-control"
                                    value="{{ old('brand') }}" name="brand" id="brand" placeholder="Enter brand"
                                    autocomplete="off" required>
                            </div>
                        </div>
                    </div>

                    <div class="row">
                        <div class="col-md-4 mt-2">
                            <div class="form-group text-start">
                                <label for="label">Model Description?</label>
                            </div>
                        </div>
                        <div class="col-md-8">
                            <div class="form-group mt-2">
                                <input aria-labelledby="model_description" type="text" class="form-control"
                                    value="{{ old('model_description') }}" name="model_description"
                                    id="model_description" placeholder="Enter model description" autocomplete="off" required>
                            </div>
                        </div>
                    </div>

                    <div class="row">
                        <div class="col-md-4 mt-2">
                            <div class="form-group text-start">
                                <label for="label">Model Number?</label>
                            </div>
                        </div>
                        <div class="col-md-8">
                            <div class="form-group mt-2">
                                <input aria-labelledby="model_number" type="text" class="form-control"
                                    value="{{ old('model_number') }}" name="model_number" id="model_number"
                                    placeholder="Enter model number" autocomplete="off" required>
                            </div>
                        </div>
                    </div>

                    <div class="row">
                        <div class="col-md-4 mt-2">
                            <div class="form-group text-start">
                                <label for="label">Part Number?</label>
                            </div>
                        </div>
                        <div class="col-md-8">
                            <div class="form-group mt-2">
                                <input aria-labelledby="part_number" type="text" class="form-control"
                                    name="part_number" id="part_number" value="" placeholder="Enter part number"
                                    autocomplete="off" required>
                            </div>
                        </div>
                    </div>

                    <div class="row">
                        <div class="col-md-4 mt-2">
                            <div class="form-group text-start">
                                <label for="label">More Info & Other Questions? </label>
                            </div>
                        </div>
                        <div class="col-md-8">
                            <div class="form-group mt-2">
                                <textarea class="form-control" rows="4" name="additional_information"
                                    placeholder="Enter More Info & Other Questions ..."
                                    spellcheck="false" required></textarea>
                            </div>
                        </div>
                    </div>


                    <div class="row">
                        <div class="col-md-4 mt-2">
                            <div class="form-group text-start">
                                <label for="label"><b>Email address:</b><span aria-label="..." role="main" class="highlight-label text-danger">(*Required)</span>
                                </label>
                            </div>
                        </div>
                        <div class="col-md-8">
                            <div class="form-group mt-2">
                                <input aria-labelledby="emailn" type="email" class="form-control"
                                    value="{{ old('email') }}" name="email" id="emailn" placeholder="Enter email"
                                    autocomplete="off" required>
                            </div>
                        </div>
                    </div>


                    <div class="row">
                        <div class="col-md-4 mt-2">
                            <div class="form-group text-start">
                                <label for="label">Phone Number: </label>
                            </div>
                        </div>
                        <div class="col-md-8">
                            <div class="form-group mt-2">
                                <input aria-labelledby="phone" type="text" class="form-control"
                                    value="{{ old('phone') }}" name="phone" id="phone" placeholder="Enter phone"
                                    autocomplete="off">
                            </div>
                        </div>
                    </div>
                    <div class="row">
                                    <div class="col-md-4 mt-2">

                                    </div>
                                    <div class="col-md-8 text-start">
                                        <div class="form-group mt-2">
                                            <div class="captcha">
                                                <span>{!! captcha_img() !!}</span>
                                                <button type="button" class="btn btn-danger" class="reload" id="reload">
                                                    &#x21bb;
                                                </button>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="row mt-2">
                                    <div class="col-md-4 mt-2">

                                    </div>
                                    <div class="col-md-8">
                                        <div class="form-group mb-4">
                                            <input id="captcha" type="text" class="form-control" placeholder="Enter Captcha" name="captcha" required>
                                        </div>
                                    </div>
                                </div>

                    <div class="row mt-4">
                        <div class="col-md-12 text-end">
                            <button aria-labelledby="SUBMIT" role="button" tabindex="0" aria-label="Toggle navigation" type="submit"
                                class="btn btn-danger w-25 mb-3">SUBMIT</button>
                        </div>


                    </div>

                </form>
            </div>

        </div>
    </div>
</div>
</section>
<script type="text/javascript">
    $('#reload').click(function () {
        $.ajax({
            type: 'GET',
            url: '{{ route("reload-captcha") }}',
            dataType:"json",
            success: function (data) {
                $(".captcha span").html(data.captcha);
            }
        });
    });
</script>
<script>
    window.subId = "{{ $subid }}";
    window.titleFind = '{!! html_entity_decode($titleFind) !!}';

    $( document ).ready(function() {
        // loadMakeDropdown();
     //   allSubBrand("{{ $subid }}");
    });
    function notlistedBtn(){
    $('#notlistedModel').modal('show');
   }
    $('.makeSelect').change(function (e) {
        e.preventDefault();
        if ($(this).val()) {
            subcat = $(this).val();
            loadTypeDropdown(subcat);
            $('.typeSelectDiv').removeClass('d-none');
            $('.typeSelectDiv').addClass('d-block');
            $('.modelSelect').empty();
        }
    });
    $('.typeSelect').change(function (e) {
        e.preventDefault();
        if ($(this).val()) {
            subcat = $(this).val();
            loadModelDropdown(subcat);
            $('.modelSelectDiv').removeClass('d-none');
            $('.modelSelectDiv').addClass('d-block');
        }
    });

    $('.modelSelect').change(function (e) {
        e.preventDefault();
        if ($(this).val()) {
            subcat = $(this).val();

            var brandtext = brand.Name;
            brandtext = brandtext.replace(/[^A-Za-z0-9\s]/gi, '').replace(/[_\s]/g, '-');

            var model_url = base_url + '/' + brandtext + '-s/' + subcat + '.html';
            window.location.href = model_url;

        }
    });

    $( document ).ready(function() {
        @if(!empty($modeldata["header"]["logo_banner"]) || !empty($modeldata["header"]["logo_mfg"]))


            windowsize = $(window).width();

            if (windowsize > 440) {
               // $("#manufacturerHeader").css("height", "240px");
            } else {
               // $("#manufacturerHeader").css("height", "70px");
            }

        @endif

    });


      var makesele = "";
</script>
@section('scripts')
    <script src="{{ asset('js/app.js?v='.date('YmdHis')) }}" type="text/javascript"></script>
@endsection
@endsection