{{#*inline "photoCDN"~}}
    https://orion.soarr.com/photos/{{unit.id}}/{{width}}x/{{unit.year}}-{{lowercase unit.make}}-{{lowercase unit.model}}.{{index}}.jpg
{{~/inline}}
{{!--<link rel="preload" as="image" href="https://orion.soarr.com/photos/{{unit.id}}/{{width}}x/{{unit.year}}-{{lowercase unit.make}}-{{lowercase unit.model}}.{{index}}.jpg"> --}}

{{#*inline "photoImageKit"~}}
    {{replace unit.primaryPhoto.large  find='https://soarr.blob.core.windows.net/unit-photos/' replace='https://ik.imagekit.io/6x418njnp/'}}?tr=w-{{width}}
{{~/inline}}

{{#*inline "photo"~}}
    {{thumbnail unit width=width}}
{{~/inline}}

  {{#*inline "paging"}}
    {{#if (gt statistics.pageCount 1)}}
    <div class="">
        <a href="{{previousPageUrl .}}" class="listings__paging__page prev {{#if (eq query.page 1)}}disabled{{/if}}">Prev</a>

        {{#for 1 (increment statistics.pageCount 6) 1}}
        {{#if (eq this ../query.page)}}
        <span class="listings__paging__page listings__paging__page--current num">{{../query.page}}</span>
        {{else}}
        <a class="listings__paging__page num" href="{{pageUrl .. this}}">{{this}}</a>
        {{/if}}

        {{/for}}

        <a href="{{nextPageUrl .}}" class="listings__paging__page next {{#if (eq query.page statistics.pageCount)}}disabled{{/if}}">Next</a>
    </div>
    {{/if}}
{{/inline}}

{{#*inline "noresults"}}
    
{{/inline}}


{{#*inline "search"}}

    {{#searchForm id="minisearch" includeCount="false" class="invsearch"}}
        <div class="invsearch__field">
            <label class="invsearch__field__name">Truck Type</label>
            <select name="vehtype" data-field="vehtype" data-placeholder="Type"></select>
        </div>
        <div class="invsearch__field">
            <label class="invsearch__field__name">Year</label>
            <select name="year" data-field="year" data-placeholder="Year" data-sel-placeholder="Any Year"></select>
        </div>
        <div class="invsearch__field">
            <label class="invsearch__field__name">Make</label>
            <select name="make" data-field="make" data-placeholder="Make" data-sel-placeholder="All Makes"></select>
        </div>

        <div class="invsearch__field">
            <label class="invsearch__field__name">Model</label>
            <select name="model" data-field="model" data-placeholder="Model" data-sel-placeholder="All Models"></select>
        </div>

        <div class="invsearch__field">
            <label class="invsearch__field__name">Stock#</label>
            <input type="text" placeholder="Stock#" name="internalnum">
        </div>

        <div class="invsearch__field">
            <label>&nbsp;</label>
            {{#resetSearchLink class="clearfilter"}}Show All{{/resetSearchLink}}
        </div>
    {{/searchForm}}
{{/inline}}

{{#*inline "facetList"}}
    <div class="facets">
        {{#searchForm autoSubmit="false" class="facets__group stocknum-search"}}
            <label>Stock# Search</label>
            <div class="text-with-button">
                <input type="text" placeholder="Stock#" name="internalnum">
                {{#if (param 'internalnum' '')}}
                    {{#resetSearchLink class="attached"}}Show All{{/resetSearchLink}}
                {{else}}
                    <button type="submit" aria-label="Search" title="Search" class="attached"><i class="fa fa-search"></i></button>
                {{/if}}
            </div>
        {{/searchForm}}

        {{#facets "segment,vehtype,yearrange,make,model,enginemake,hp,transmodel,locationid"}}
            {{#with selected}}
                <div class="facets__group facets__group--selected facets__group--open">
                    <div class="facets__group__title"><i class="arrow"></i> Selected</div>
                    <ul class="facets__group__items">
                        {{#each .}}
                        <li class="facets__group__items__item facets__group__items__item--remove">{{#removeParamsLink name}}<span class="name">{{title}}</span><span class="value">{{value}}</span>{{/removeParamsLink}}</li>
                        {{/each}}
                    </ul>
                </div>
            {{/with}}

            {{#each facets}}
                <div class="facets__group {{#if (eq name 'segment')}}facets__group--open{{/if}}">
                    <div class="facets__group__title"><i class="arrow"></i> <span>{{title}}</span></div>
                    <ul class="facets__group__items">
                        {{#each items}}
                        <li class="facets__group__items__item"><a href="{{href}}">{{#if text}}{{text}}{{else}}[Not Specified]{{/if}} <em class="facets__group__items__item__count">({{count}})</em></a></li>
                        {{/each}}
                    </ul>
                </div>
                
            {{/each}}

        {{/facets}}
    </div>
{{/inline}}


{{#*inline "listings"}}

    {{#each units}}
        <div class="listing">
            {{#if primaryPhoto.large}}
            <a class="listing__photo__cont" href="{{specsheet .}}">
                <img class="listing__photo" src="{{> photoCDN unit=. width=300 index=1}}" {{#if (gt @index 0)}}loading="lazy"{{/if}} alt="{{year}} {{make}} {{model}}" onerror="this.onerror=null; this.src='/images/nophoto.small.jpg'" >
            </a>
            {{else}}
            <a class="listing__photo__cont" href="{{specsheet .}}">
                <span>Photos Coming<br>Soon</span>
            </a>
            {{/if}}

            <div class="listing__details">

                <div class="listing__header">
                    <a class="listing__title" href="{{specsheet .}}">{{year}} {{make}} {{model}}</a>
                    <ul class="listing__subtitle">
                        <li class="listing__subtitle__item listing__price">{{formatCurrency pricing.asking 'Call for Price' }}</li>
                        {{#if odometer.reading}}
                            <li class="listing__subtitle__item">{{formatNumber odometer.reading}} {{odometer.unit}}</li>
                        {{/if}}
                        <li class="listing__subtitle__item">Stock# {{stockNumber}}</li>
                    </ul>
                </div>

                {{!--
                <div class="listing__price__cont">
                    <span class="listing__price">{{formatCurrency pricing.asking 'Call for Price' }}</span>
                    <span class="listing__price__label">Asking Price</span>
                </div>--}}

                <div class="listing__content">

                    <ul class="listing__specs">
                        {{#if (eq type.segment.id 2)}}
                            
                            {{#withSpec . 'Length'}}
                                {{#if (gt value 0)}}
                                <li class="listing__specs__item">
                                    <span class="listing__specs__item__name">{{name}}</span>
                                    <span class="listing__specs__item__value">{{value}}</span>
                                </li>
                                {{/if}}
                            {{/withSpec}}
                            {{#withSpec . 'Width'}}
                                {{#if (gt value 0)}}
                                <li class="listing__specs__item">
                                    <span class="listing__specs__item__name">{{name}}</span>
                                    <span class="listing__specs__item__value">{{value}}</span>
                                </li>
                                {{/if}}
                            {{/withSpec}}
                            {{#withSpec . 'Height'}}
                                {{#if (gt value 0)}}
                                <li class="listing__specs__item">
                                    <span class="listing__specs__item__name">{{name}}</span>
                                    <span class="listing__specs__item__value">{{value}}</span>
                                </li>
                                {{/if}}
                            {{/withSpec}}
                            {{#withSpec . 'Axle Capacity'}}
                                {{#if (gt value 0)}}
                                <li class="listing__specs__item">
                                    <span class="listing__specs__item__name">{{name}}</span>
                                    <span class="listing__specs__item__value">{{value}}</span>
                                </li>
                                {{/if}}
                            {{/withSpec}}
                            {{#withSpec . 'Suspension Type'}}
                                <li class="listing__specs__item">
                                    <span class="listing__specs__item__name">{{name}}</span>
                                    <span class="listing__specs__item__value">{{value}}</span>
                                </li>
                            {{/withSpec}}
                        {{else}}
                            {{#withSpec . 'Sleeper Type'}}
                            <li class="listing__specs__item">
                                <span class="listing__specs__item__name">{{name}}</span>
                                <span class="listing__specs__item__value">{{value}}</span>
                            </li>

                            {{/withSpec}}
                            <li class="listing__specs__item">
                                <span class="listing__specs__item__name">Engine</span>
                                <span class="listing__specs__item__value">{{spec . 'Engine Make'}}{{#if (ne '0' (spec . 'Engine HP'))}} {{spec . 'Engine HP'}}{{/if}}</span>
                            </li>
                            {{#withSpec . 'RA Capacity'}}
                                {{#if (gt value 0)}}
                                <li class="listing__specs__item">
                                    <span class="listing__specs__item__name">{{name}}</span>
                                    <span class="listing__specs__item__value">{{formatNumber value}}</span>
                                </li>
                                {{/if}}
                            {{/withSpec}}

                            {{#withSpec . 'FA Capacity'}}
                                {{#if (gt value 0)}}
                                <li class="listing__specs__item">
                                    <span class="listing__specs__item__name">{{name}}</span>
                                    <span class="listing__specs__item__value">{{formatNumber value}}</span>
                                </li>
                                {{/if}}
                            {{/withSpec}}

                            {{#withSpec . 'GVWR'}}
                                {{#if (gt value 0)}}
                                <li class="listing__specs__item">
                                    <span class="listing__specs__item__name">{{name}}</span>
                                    <span class="listing__specs__item__value">{{formatNumber value}} lbs</span>
                                </li>
                                {{/if}}
                            {{/withSpec}}

                            {{#withSpec . 'Trans Type'}}
                            <li class="listing__specs__item">
                                <span class="listing__specs__item__name">{{name}}</span>
                                <span class="listing__specs__item__value">{{value}}</span>
                            </li>
                            {{/withSpec}}
                            
                            {{#withSpec . 'Trans Model'}}
                            <li class="listing__specs__item">
                                <span class="listing__specs__item__name">{{name}}</span>
                                <span class="listing__specs__item__value">{{value}}</span>
                            </li>
                            {{/withSpec}}

                            {{#withSpec . 'Trans Speed'}}
                            <li class="listing__specs__item">
                                <span class="listing__specs__item__name">{{name}}</span>
                                <span class="listing__specs__item__value">{{value}}</span>
                            </li>
                            {{/withSpec}}
                            
                            {{#withSpec . 'Rear End Ratio'}}
                            <li class="listing__specs__item">
                                <span class="listing__specs__item__name">Ratio</span>
                                <span class="listing__specs__item__value">{{value}}</span>
                            </li>
                            {{/withSpec}}

                            {{#withSpec . 'Suspension Type'}}
                                <li class="listing__specs__item">
                                    <span class="listing__specs__item__name">{{name}}</span>
                                    <span class="listing__specs__item__value">{{value}}</span>
                                </li>
                            {{/withSpec}}

                            {{#withSpec . 'Wheelbase'}}
                            {{#if (gt value 0)}}
                                <li class="listing__specs__item">
                                    <span class="listing__specs__item__name">{{name}}</span>
                                    <span class="listing__specs__item__value">{{value}}"</span>
                                </li>
                            {{/if}}
                            {{/withSpec}}

                            
                        {{/if}}
                    </ul>
                        
                    
                </div>

            </div>
            <div class="listing__footer">
                <a href="{{specsheet .}}" class="button button--secondary"><i class="fa fa-external-link-square"></i> View Details</a>
                <a class="button button--secondary" rel="nofollow" {{modalOpenOnClick}} href="{{routeUrl 'form' formName='unit-inquiry' unitid=id}}"><i class="fa fa-envelope"></i> Email Us</a>
            </div>
        </div>
    {{/each}}

{{/inline}}

{{#*inline "listingsHeader"}}
    <div class="results-header">
        <ul class="results-header__stats">
            <li class="results-header__stats__count">{{statistics.total}} Matches</li>
            <li class="inv-page show-for-medium">Page {{query.page}} of {{statistics.pageCount}}</li>
        </ul>
        
        <div class="">
            {{sortDropdown placeholderText="Sort Order" class="sort"}}
        </div>
    </div>
{{/inline}}

{{#headSEO}}
    {{#if units.length}}
        <link rel="preload" as="image" fetchpriority="high" href="{{> photoCDN unit=units.[0] width=300 index=1}}" type="image/jpeg">
    {{/if}}
{{/headSEO}}

<section class="strip strip--pageheader">
    <div class="strip__container">
        <h1>{{seoTitle}}</h1>
        {{breadcrumbs .}}
    </div>
</section>

<section class="strip strip--alt">
    <div class="strip__container inventory__cont">
        {{#if statistics.total }}
            {{> facetList }}

            <div class="inventory__content">
                {{> listingsHeader}}

                <div class="listings__cont">
                    {{> listings}}
                </div>

                <div class="listings__paging">
                    {{> paging}}
                </div>
            </div>
        {{else}}
            <div class="">
                <h2>There is currently no inventory matching the specified search</h2>
                <p>Click one of the options below to see our other inventory.</p>
                <ul class="inline-list">
                    <li><a class="button button--primary" href="{{routeUrl "trucks"}}">All Trucks</a></li>
                    <li><a class="button button--primary" href="{{routeUrl "trailers"}}">All Trailers</a></li>
                    <li><a class="button button--primary" href="contact-us">Contact Us</a></li>
                </ul>
            </div>
        {{/if}}
    </div>
</section>




<script>
    $('a[data-show="facets"]').click(function() {
        $('.listings__search').toggleClass('listings__search--modal');

        return false;
    });

    $('a[data-dismiss="facets"]').click(function() {
        $(this).parents('.listings__search').removeClass('listings__search--modal');
    });
</script>