@extends('web.layout.master')

@section('content')

<section>
    <div class="container">
        <nav aria-label="Breadcrumb" class="breadcrumb">
            <ul>
                <li><a href="{{ url('/') }}">Home</a></li>
                @php
                $titleFind = "";
                @endphp
                @if(!empty($breadcrumbsModel))
                @php
                $breadcrumbsModel = array_reverse($breadcrumbsModel);
		 $sssid = 0;
                @endphp
                @foreach ($breadcrumbsModel as $k => $b)
                    @if($loop->last)
                    <li><span aria-label="..." role="main"  aria-current="page" class="highlight-label">{{ $b['title'] }}</span></li>
                    @php
                    $titleFind = $b['title'];
                @endphp
                    @else
                        <li><a href="{{ $b['url'] }}">{{ $b['title'] }}</a></li>
			 @php
                            $sssid = $b['url'];
                        @endphp
                    @endif

                @endforeach
                @endif

            </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
    <div class="container" style="margin-bottom: 60px;">
        @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
        @if($subid == '|15881' || $subid == '|15882' || $subid == '|15878' || $subid == '|15879' || $subid == '|15880' || $subid == '9292')
            <shop-by-category-search></shop-by-category-search>
        @endif


        @if($subid != '|15881' && $subid != '|15882' && $subid != '|15878' && $subid != '|15879' && $subid != '|15880' && $subid != '9292')
        <section  style="min-height:135px;">
            <model-data-search ></model-data-search>
        </section>
        <div class="text-center" style="margin-top:0px">
            <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>
        @endif
        <div class="row">
            @foreach (['danger', 'warning', 'success', 'info'] as $msg)
            @if(Session::has('alert-' . $msg))

            <p class="alert alert-{{ $msg }}">{{ Session::get('alert-' . $msg) }}</p>
            @endif
            @endforeach
            {{-- <h1 class="fw-bold mb-3 h2">{{ $cat_name }}</h1> --}}
            {{-- <a href="javascript:void(0)" onclick="notlistedBtn()"  aria-label=""><img alt="..." src="{{ asset('assets/web') }}/images/modelnotlisted.png" height="40px"></a> --}}
            {{-- <div class="col-md-3">
                <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> --}}
        </div>

        <div class="row mb-4" id="modalDataList">
            @if(!empty($modeldata['list']))
            @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($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="..." style="max-width:100%; max-height:100%;"  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
        @else
        <div class="col-md-3 col-sm-6 p-2 col-xs-6 text-center">
            <p>No models have been added yet</p>
        </div>
        @endif
        </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" 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="PartsWarehouse" 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="PartsWarehouse" 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="PartsWarehouse" 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="PartsWarehouse" 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="PartsWarehouse" 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 role="button" tabindex="0" aria-labelledby="SUBMIT" 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>
    window.subId = "|194";
	  window.titleFind = '{!! html_entity_decode($titleFind) !!}';
        var vert = "{{ str_replace('|',"",$subid) }}";

        if(vert == '15881' || vert == '15882'){
            window.vertId = "app";
        }else if(vert == '15878'){
            window.vertId = "tool";
        }else if(vert == '15879'){
            window.vertId = "Yard";
        }else if(vert == '15880'){
            window.vertId = "Vaccum";
        }else if(vert == '9292'){
            window.vertId = "Pool";
        }



   function notlistedBtn(){
        $('#notlistedModel').modal('show');
    }
   var makesele = "";
   @if($subid != '|15881' && $subid != '|15882' && $subid != '|15878' && $subid != '|15879' && $subid != '|15880' && $subid != '9292')
       // var preSubId = "{{ url()->previous() }}";
	 var preSubId = "{{ $sssid }}";
        var presid = preSubId.split('/').pop();
        window.subId = '|'+presid.replace('.htm','');
        makesele = "{{ request()->segment(2) }}";
        makesele = '|'+makesele.replace('.htm','');
   @endif

   $( 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");
            }
        //  $("#manufacturerHeader").css("background-repeat", "no-repeat");
        //  $("#manufacturerHeader").css("background-size", "contain");
        //  $("#manufacturerHeader").css("background-position", "center");
        @endif

    });
</script>
<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>
@section('scripts')


    <script src="{{ asset('js/app.js?v='.date('YmdHis')) }}" type="text/javascript"></script>

@endsection

@endsection