<div class="container">
<form method="get" id="directory-search">
<input id="filter" type="hidden" name="previous_filters" value="{{ filters }}" />
<input id="page" type="hidden" name="page" value="{{ page }}" />
<input id="category" type="hidden" name="category" value="{{ category }}" />
<input id="location" type="hidden" name="previous_locations" value="{{ locations }}" />
<input id="state" type="hidden" name="previous_states" value="{{ states }}" />
{% set random = random(3) + 1 %}
{% set site_text_short = (site_code == constant("App\\Entity\\Content::SITE_MCS")) ? 'mcs' : 'rcs' %}
<div style="background:url({{ asset('assets/img/' ~ site_text_short ~ '-directory-background-image' ~ random ~ '.jpg') }}); background-position-x: 50%; background-position-y: 50%; background-size: cover;">
{% set site_text_short = (site_code == constant("App\\Entity\\Content::SITE_CCS")) ? 'ccs' : 'rcs' %}
<div class="p-5">
<!-- Directory Search -->
<div class="row">
<div class="col-md-12 text-center">
<h2 class="text-white mb-4"
style="font-size: 54px; font-weight: bold; text-shadow: 0 0 8px rgba(0, 0, 0, 1);">What Are You Looking For Today?</h2>
</div>
</div>
{#
<div class="row mb-5">
<div class="col-md-12 text-center">
{% if app.environment == 'dev' %}
<a
href="https://staging.rooferscoffeeshop.com/be-part-of-the-directory"
class="btn btn-orange px-5"
>Be Part of the Directory!</a>
{% else %}
<a
href="https://www.rooferscoffeeshop.com/be-part-of-the-directory"
class="btn btn-orange px-5"
>Be Part of the Directory!</a>
{% endif %}
</div>
</div>
#}
<!-- Directory Buttons -->
<div class="row filters my-2">
<div class="col-md-12">
<ul class="nav justify-content-center">
<li>
<button
class="btn btn-tertiary mx-1"
type="submit"
value="products_services"
>Products & Services</button>
</li>
<li>
<button
class="btn btn-tertiary mx-1"
type="submit"
value="distributors"
>Distributors</button>
</li>
<li>
<button
class="btn btn-tertiary mx-1"
type="submit"
value="consultants"
>Consultants</button>
</li>
<li>
<button
class="btn btn-tertiary mx-1"
type="submit"
value="contractors"
>Contractors</button>
</li>
<li>
<button
class="btn btn-tertiary mx-1"
type="submit"
value="associations"
>Trade Associations</button>
</li>
<li>
<button
class="btn btn-tertiary mx-1"
type="submit"
value="manufacturers_reps"
>Manufacturers Reps</button>
</li>
{#<li>
<button
class="btn btn-tertiary mx-1"
type="submit"
value="rcs_partners"
>{{site_text_short|upper}} Partners</button>
</li>#}
</ul>
</div>
</div>
</div>
</div>
<!-- Directory Sort -->
<div class="filtering-controls py-3 px-4" style="background: #E3E1DE;">
{% if show_filters %}
<div class="row">
<div class="col-md-12">
<ul class="nav directory-nav" id="check_filters">
<li class="mx-1"><strong>Filter By:</strong></li>
<li class="mx-1">
<label>
<input
type="checkbox"
name="filters[]"
value="products_services"
{% if "products_services" in filters %}
checked
{% endif %}
/>
Products & Services
</label>
</li>
<li class="mx-1">
<label>
<input
type="checkbox"
name="filters[]"
value="distributors"
{% if "distributors" in filters %}
checked
{% endif %}
/>
Distributors
</label>
</li>
<li class="mx-1">
<label>
<input
type="checkbox"
name="filters[]"
value="consultants"
{% if "consultants" in filters %}
checked
{% endif %}
/>
Consultants
</label>
</li>
<li class="mx-1">
<label>
<input
type="checkbox"
name="filters[]"
value="contractors"
{% if "contractors" in filters %}
checked
{% endif %}
/>
Contractors
</label>
</li>
<li class="mx-1">
<label>
<input
type="checkbox"
name="filters[]"
value="associations"
{% if "associations" in filters %}
checked
{% endif %}
/>
Trade Associations
</label>
</li>
<li class="mx-1">
<label>
<input
type="checkbox"
name="filters[]"
value="manufacturers_reps"
{% if "manufacturers_reps" in filters %}
checked
{% endif %}
/>
Manufacturers Reps
</label>
</li>
{#<li class="mx-1">
<label>
<input
type="checkbox"
name="filters[]"
value="rcs_partners"
{% if "rcs_partners" in filters %}
checked
{% endif %}
/>
{{site_text_short|upper}} Partners
</label>
</li>#}
</ul>
</div>
</div>
{% else %}
<div class="row">
<div class="col-md-12 text-center">
<h2>Filtering By:
{% if filters == 'products_services' %}
<u>Products & Services</u>
{% elseif filters == 'distributors' %}
<u>Distributors</u>
{% elseif filters == 'consultants' %}
<u>Consultants</u>
{% elseif filters == 'contractors' %}
<u>Contractors</u>
{% elseif filters == 'associations' %}
<u>Associations</u>
{% elseif filters == 'manufacturers_reps' %}
<u>Manufacturers Reps</u>
{#{% elseif filters == 'rcs_partners' %}
<u>{{site_text_short|upper}} Partners</u>#}
{% endif %}
<button
class="btn btn-secondary"
type="submit"
id="remove_filter"
><i class="fa fa-times"></i></button>
</h2>
</div>
</div>
{% endif %}
<!-- Search Row -->
<div class="row">
<div class="col-xl-2" style="padding: 0px 5px;">
<div class="locations-nav" id="check_locations" >
<strong style="font-size: 16px;">Available In:</strong><br>
<label>
<input
type="checkbox"
name="locations[]"
value="usa"
{% if "usa" in locations %}
checked
{% endif %}
/>
USA
</label>
<label>
<input
type="checkbox"
name="locations[]"
value="canada"
{% if "canada" in locations %}
checked
{% endif %}
/>
Canada
</label>
</div>
</div>
<div class="col-xl-3">
<select class="form-control" name="states" id="directory_states" style="height: 37.5px;">
<option value="">Search by state / province</option>
{% for s in stateOptions %}
<option
value="{{ s }}"
{% if s == states %}
selected
{% endif %}
>{{ s }}</option>
{% endfor %}
</select>
</div>
<div class="col-xl-3">
<select class="form-control" id="directory_category" style="height: 37.5px;">
<option value="">Find product by category listing</option>
{% for cat in categories %}
<option
value="{{ cat.getId() }}"
{% if cat.getId() == category %}
selected
{% endif %}
>{{ cat.getTitle() }}</option>
{% endfor %}
</select>
</div>
<div class="col-xl-4">
<div class="input-group">
<input
type="text"
class="form-control"
style="margin-right:10px"
name="search"
value="{{ search }}"
placeholder="Search by keyword, trade name, service, product, etc."
/>
<button
type="submit"
class="group-append btn btn-secondary"
>Search
</button>
</div>
</div>
</div>
</div>
<div class="row my-2">
<div class="col-md-12">
<!-- Pagination -->
{% if total %}
<div class="float-right">
<div class="input-group">
<div class="input-group-prepend px-3">
<span>
Showing:
{{ page * limit + 1 }} -
{% if (page * limit + limit <= total) %}
{{ page * limit + limit }}
{% else %}
{{ total }}
{% endif %}
of
{{ total }}
</span>
</div>
<div class="button-group input-group-append">
{% if (page) %}
<button
class="btn paging"
type="submit"
value="{{ page - 1 }}"
><i class="fa fa-angle-left"></i></button>
{% endif %}
{% if page * limit + limit < total %}
<button
class="btn paging"
type="submit"
value="{{ page + 1 }}"
><i class="fa fa-angle-right"></i></button>
{% endif %}
</div>
</div>
</div>
{% else %}
<div class="text-center my-2">
<div class="alert alert-warning p-3">
<i class="fa fa-exclamation-triangle"></i> No Records Found
</div>
</div>
{% endif %}
</div>
</div>
<!-- Results -->
{% for listing in listings %}
{% set customer = listing.getDirectory() %}
<div class="row mb-3 directory-listing">
<div class="col-md-12 col-xl-3 d-flex">
{% if customer.getMedia() %}
{% set media = customer.getMedia() %}
<a href="{{ listing.getURL() }}" style="position: relative">
{# {{ media.getImageTag("","")|raw }} #}
{% if (customer.getTypeWork()) %}
<div class="plaque">
<img class="directory-listing-image" src="{{ media.getURL()|raw }}" alt="">
</div>
<span class="inscription">{{customer.getTypeWork()}}</span>
{% else %}
<div class="unplaqued">
<img class="directory-listing-image" src="{{ media.getURL()|raw }}" alt="">
</div>
{% endif %}
</a>
{% elseif (listing.getFeaturedImageTag()) %}
<a href="{{ listing.getURL() }}">
{{ post.getFeaturedImageTag("","")|raw }}
</a>
{% endif %}
</div>
<div class="col-md-9 col-xl-7">
<h3 class="notranslate"><a href="{{ listing.getURL() }}">{{ listing.getTitle() }}</a></h3>
{{ listing.getIntroText()|raw }}
<div>
<a href="{{ listing.getURL() }}">Read More</a>
</div>
</div>
<div class="col-md-3 col-lg-2 d-none d-md-flex">
<div style="width: 80%; margin: 0 auto;">
{% set level = listing.getDirectory().getCustomerLevel(site_code) %}
{% if level <= 2000 %}
<img
src="{{ asset('assets/img/' ~ site_text_short ~ '-level-best.jpg') }}"
alt="Best Level"
loading='lazy'
/>
{% elseif level == 3000 %}
<img
src="{{ asset('assets/img/' ~ site_text_short ~ '-level-better.jpg') }}"
alt="Better Level"
loading='lazy'
/>
{% elseif level == 4000 or level == 4001 %}
<img
src="{{ asset('assets/img/' ~ site_text_short ~ '-level-good.jpg') }}"
alt="Good Level"
loading='lazy'
/>
{% else %}
<img
src="{{ asset('assets/img/' ~ site_text_short ~ '-level-other.jpg') }}"
alt="Good Level"
loading='lazy'
/>
{% endif %}
</div>
</div>
</div>
<div class="row my-2">
<div class="col-sm-12">
<hr />
</div>
</div>
{% endfor %}
<div class="row my-2">
<div class="col-md-12">
<!-- Pagination -->
{% if total %}
<div class="float-right">
<div class="input-group">
<div class="input-group-prepend px-3">
<span>
Showing:
{{ page * limit + 1 }} -
{% if (page * limit + limit <= total) %}
{{ page * limit + limit }}
{% else %}
{{ total }}
{% endif %}
of
{{ total }}
</span>
</div>
<div class="button-group input-group-append">
{% if (page) %}
<button
class="btn paging"
type="submit"
value="{{ page - 1 }}"
><i class="fa fa-angle-left"></i></button>
{% endif %}
{% if page * limit + limit < total %}
<button
class="btn paging"
type="submit"
value="{{ page + 1 }}"
><i class="fa fa-angle-right"></i></button>
{% endif %}
</div>
</div>
</div>
{% endif %}
</div>
</div>
<!--
<div class="row">
<div class="col-md-2">
[img]
</div>
<div class="col-md-7">
[content]
</div>
<div class="col-md-3">
[star]
</div>
</div>
-->
</form>
</div>