templates/content/directory-index.html.twig line 1

Open in your IDE?
  1. <div class="container">
  2.     <form method="get" id="directory-search">
  3.     <input id="filter" type="hidden" name="previous_filters" value="{{ filters }}" />
  4.     <input id="page" type="hidden" name="page" value="{{ page }}" />
  5.     <input id="category" type="hidden" name="category" value="{{ category }}" />
  6.     <input id="location" type="hidden" name="previous_locations" value="{{ locations }}" />
  7.     <input id="state" type="hidden" name="previous_states" value="{{ states }}" />
  8.     
  9.     {% set random = random(3) + 1 %}
  10.     {% set site_text_short = (site_code == constant("App\\Entity\\Content::SITE_MCS")) ? 'mcs' : 'rcs' %}
  11.     
  12.     <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;">
  13.         
  14.     {% set site_text_short = (site_code == constant("App\\Entity\\Content::SITE_CCS")) ? 'ccs' : 'rcs' %}
  15.         <div class="p-5">
  16.             <!-- Directory Search -->
  17.             <div class="row">
  18.                 <div class="col-md-12 text-center">
  19.                     <h2 class="text-white mb-4" 
  20.                         style="font-size: 54px; font-weight: bold; text-shadow: 0 0 8px rgba(0, 0, 0, 1);">What Are You Looking For Today?</h2>
  21.                 </div>
  22.             </div>
  23.             {#
  24.             <div class="row mb-5">
  25.                 <div class="col-md-12 text-center">
  26.                     {% if app.environment == 'dev' %}
  27.                         <a
  28.                             href="https://staging.rooferscoffeeshop.com/be-part-of-the-directory"
  29.                             class="btn btn-orange px-5"
  30.                         >Be Part of the Directory!</a>
  31.                     {% else %}
  32.                         <a
  33.                             href="https://www.rooferscoffeeshop.com/be-part-of-the-directory"
  34.                             class="btn btn-orange px-5"
  35.                         >Be Part of the Directory!</a>
  36.                     {% endif %}
  37.                 </div>
  38.             </div>
  39.             #}
  40.             
  41.             <!-- Directory Buttons -->
  42.             <div class="row filters my-2">
  43.                 <div class="col-md-12">
  44.                     <ul class="nav justify-content-center">
  45.                         <li>
  46.                             <button 
  47.                             class="btn btn-tertiary mx-1"
  48.                             type="submit"
  49.                             value="products_services"
  50.                             >Products &amp; Services</button>
  51.                         </li>
  52.                         <li>
  53.                             <button 
  54.                             class="btn btn-tertiary mx-1"
  55.                             type="submit"
  56.                             value="distributors"
  57.                             >Distributors</button>
  58.                         </li>
  59.                         <li>
  60.                             <button 
  61.                             class="btn btn-tertiary mx-1"
  62.                             type="submit"
  63.                             value="consultants"
  64.                             >Consultants</button>
  65.                         </li>
  66.                         <li>
  67.                             <button 
  68.                             class="btn btn-tertiary mx-1"
  69.                             type="submit"
  70.                             value="contractors"
  71.                             >Contractors</button>
  72.                         </li>
  73.                         <li>
  74.                             <button 
  75.                             class="btn btn-tertiary mx-1"
  76.                             type="submit"
  77.                             value="associations"
  78.                             >Trade Associations</button>
  79.                         </li>
  80.                         <li>
  81.                             <button 
  82.                             class="btn btn-tertiary mx-1"
  83.                             type="submit"
  84.                             value="manufacturers_reps"
  85.                             >Manufacturers Reps</button>
  86.                         </li>
  87.                         {#<li>
  88.                             <button 
  89.                             class="btn btn-tertiary mx-1"
  90.                             type="submit"
  91.                             value="rcs_partners"
  92.                             >{{site_text_short|upper}} Partners</button>
  93.                         </li>#}
  94.                     </ul>
  95.                 </div>
  96.             </div>
  97.         </div>
  98.     </div>
  99.         
  100.     <!-- Directory Sort -->
  101.     <div class="filtering-controls py-3 px-4" style="background: #E3E1DE;">
  102.         {% if show_filters %}
  103.         <div class="row">
  104.             <div class="col-md-12">
  105.                 <ul class="nav directory-nav" id="check_filters">
  106.                     <li class="mx-1"><strong>Filter By:</strong></li>
  107.                     <li class="mx-1">
  108.                         <label>
  109.                             <input 
  110.                                 type="checkbox" 
  111.                                 name="filters[]"
  112.                                 value="products_services"
  113.                                 {% if "products_services" in filters %}
  114.                                 checked
  115.                                 {% endif %}
  116.                             />
  117.                             Products &amp; Services
  118.                         </label>
  119.                     </li>
  120.                     <li class="mx-1">
  121.                         <label>
  122.                             <input 
  123.                                 type="checkbox" 
  124.                                 name="filters[]"
  125.                                 value="distributors"
  126.                                 {% if "distributors" in filters %}
  127.                                 checked
  128.                                 {% endif %}
  129.                             />
  130.                             Distributors
  131.                         </label>
  132.                     </li>
  133.                     <li class="mx-1">
  134.                         <label>
  135.                             <input 
  136.                                 type="checkbox" 
  137.                                 name="filters[]"
  138.                                 value="consultants"
  139.                                 {% if "consultants" in filters %}
  140.                                 checked
  141.                                 {% endif %}
  142.                             />
  143.                             Consultants
  144.                         </label>
  145.                     </li>
  146.                     <li class="mx-1">
  147.                         <label>
  148.                             <input 
  149.                                 type="checkbox" 
  150.                                 name="filters[]"
  151.                                 value="contractors"
  152.                                 {% if "contractors" in filters %}
  153.                                 checked
  154.                                 {% endif %}
  155.                             />
  156.                             Contractors
  157.                         </label>
  158.                     </li>
  159.                     <li class="mx-1">
  160.                         <label>
  161.                             <input 
  162.                                 type="checkbox" 
  163.                                 name="filters[]"
  164.                                 value="associations"
  165.                                 {% if "associations" in filters %}
  166.                                 checked
  167.                                 {% endif %}
  168.                             />
  169.                             Trade Associations
  170.                         </label>
  171.                     </li>
  172.                     <li class="mx-1">
  173.                         <label>
  174.                             <input 
  175.                                 type="checkbox" 
  176.                                 name="filters[]"
  177.                                 value="manufacturers_reps"
  178.                                 {% if "manufacturers_reps" in filters %}
  179.                                 checked
  180.                                 {% endif %}
  181.                             />
  182.                             Manufacturers Reps
  183.                         </label>
  184.                     </li>
  185.                     {#<li class="mx-1">
  186.                         <label>
  187.                             <input 
  188.                                 type="checkbox" 
  189.                                 name="filters[]"
  190.                                 value="rcs_partners"
  191.                                 {% if "rcs_partners" in filters %}
  192.                                 checked
  193.                                 {% endif %}
  194.                             />
  195.                             {{site_text_short|upper}} Partners
  196.                         </label>
  197.                     </li>#}
  198.                 </ul>
  199.             </div>
  200.         </div>
  201.         
  202.         {% else %}
  203.         <div class="row">
  204.             <div class="col-md-12 text-center">
  205.                 <h2>Filtering By: 
  206.                     {% if filters == 'products_services' %}
  207.                         <u>Products &amp; Services</u>
  208.                     {% elseif filters == 'distributors' %}
  209.                         <u>Distributors</u>
  210.                     {% elseif filters == 'consultants' %}
  211.                         <u>Consultants</u>
  212.                     {% elseif filters == 'contractors' %}
  213.                         <u>Contractors</u>
  214.                     {% elseif filters == 'associations' %}
  215.                         <u>Associations</u>
  216.                     {% elseif filters == 'manufacturers_reps' %}
  217.                         <u>Manufacturers Reps</u>
  218.                     {#{% elseif filters == 'rcs_partners' %}
  219.                         <u>{{site_text_short|upper}} Partners</u>#}
  220.                     {% endif %}
  221.                     <button 
  222.                         class="btn btn-secondary" 
  223.                         type="submit" 
  224.                         id="remove_filter"
  225.                     ><i class="fa fa-times"></i></button>
  226.                 </h2>
  227.             </div>
  228.         </div>
  229.         {% endif %}
  230.         
  231.         
  232.         <!-- Search Row -->
  233.         <div class="row">
  234.             <div class="col-xl-2" style="padding: 0px 5px;">
  235.                 
  236.                 <div class="locations-nav" id="check_locations" >
  237.                     <strong style="font-size: 16px;">Available In:</strong><br>
  238.                     
  239.                     <label>
  240.                         <input 
  241.                             type="checkbox" 
  242.                             name="locations[]"
  243.                             value="usa"
  244.                             {% if "usa" in locations %}
  245.                             checked
  246.                             {% endif %}
  247.                         />
  248.                         USA
  249.                     </label>
  250.                     
  251.                     <label>
  252.                         <input 
  253.                             type="checkbox" 
  254.                             name="locations[]"
  255.                             value="canada"
  256.                             {% if "canada" in locations %}
  257.                             checked
  258.                             {% endif %}
  259.                         />
  260.                         Canada
  261.                     </label>
  262.                 </div>
  263.                 
  264.             </div>
  265.             
  266.             <div class="col-xl-3">
  267.                 <select class="form-control" name="states" id="directory_states" style="height: 37.5px;">
  268.                     <option value="">Search by state / province</option>
  269.                     {% for s in stateOptions %}
  270.                         <option 
  271.                             value="{{ s }}"
  272.                             {% if s == states %}
  273.                             selected
  274.                             {% endif %}
  275.                         >{{ s }}</option>
  276.                     {% endfor %}
  277.                 </select>
  278.             </div>
  279.             
  280.             <div class="col-xl-3">
  281.                 <select class="form-control" id="directory_category" style="height: 37.5px;">
  282.                     <option value="">Find product by category listing</option>
  283.                     {% for cat in categories %}
  284.                         <option 
  285.                             value="{{ cat.getId() }}"
  286.                             {% if cat.getId() == category %}
  287.                             selected
  288.                             {% endif %}
  289.                         >{{ cat.getTitle() }}</option>
  290.                     {% endfor %}
  291.                 </select>
  292.             </div>
  293.             
  294.             
  295.             <div class="col-xl-4">
  296.                 <div class="input-group">
  297.                     <input 
  298.                         type="text"
  299.                         class="form-control"
  300.                         style="margin-right:10px"
  301.                         name="search"
  302.                         value="{{ search }}"
  303.                         placeholder="Search by keyword, trade name, service, product, etc."
  304.                     />
  305.                     <button 
  306.                         type="submit"
  307.                         class="group-append btn btn-secondary"
  308.                     >Search
  309.                     </button>
  310.                 </div>
  311.             </div>
  312.         </div>
  313.         
  314.     </div> 
  315.     
  316.     <div class="row my-2">
  317.         <div class="col-md-12">
  318.             <!-- Pagination -->
  319.             {% if total %}
  320.             <div class="float-right">
  321.                 <div class="input-group">
  322.                     <div class="input-group-prepend px-3">
  323.                         <span>
  324.                         Showing: 
  325.                         {{ page * limit + 1 }} - 
  326.                     
  327.                         {% if (page * limit + limit <= total) %}
  328.                             {{ page * limit + limit }}
  329.                         {% else %}
  330.                             {{ total }}
  331.                         {% endif %}
  332.                         
  333.                         of 
  334.                         
  335.                         {{ total }}
  336.                         </span>
  337.                     </div>
  338.                     <div class="button-group input-group-append">
  339.                         {% if (page) %}
  340.                         <button 
  341.                             class="btn paging"
  342.                             type="submit"
  343.                             value="{{ page - 1 }}"
  344.                         ><i class="fa fa-angle-left"></i></button>
  345.                         {% endif %}
  346.                         {% if page * limit + limit < total %}
  347.                         <button 
  348.                             class="btn paging"
  349.                             type="submit"
  350.                             value="{{ page + 1 }}"
  351.                         ><i class="fa fa-angle-right"></i></button>
  352.                         {% endif %}
  353.                     </div>
  354.                 </div>
  355.             </div>
  356.             {% else %}
  357.             <div class="text-center my-2">
  358.                 <div class="alert alert-warning p-3">
  359.                     <i class="fa fa-exclamation-triangle"></i> No Records Found
  360.                 </div>
  361.             </div>
  362.             {% endif %}
  363.         </div>
  364.     </div>
  365.     
  366.     
  367.     <!-- Results -->
  368.     {% for listing in listings %}
  369.     {% set customer = listing.getDirectory() %}
  370.     <div class="row mb-3 directory-listing">
  371.         <div class="col-md-12 col-xl-3 d-flex">
  372.             {% if customer.getMedia() %}
  373.             {% set media = customer.getMedia() %}
  374.                 <a href="{{ listing.getURL() }}" style="position: relative">
  375.                     {# {{ media.getImageTag("","")|raw }} #}
  376.                     {% if (customer.getTypeWork()) %}
  377.                     <div class="plaque">
  378.                         <img class="directory-listing-image" src="{{ media.getURL()|raw }}" alt="">
  379.                     </div>
  380.                     <span class="inscription">{{customer.getTypeWork()}}</span>
  381.                     {% else %}
  382.                     <div class="unplaqued">
  383.                         <img class="directory-listing-image" src="{{ media.getURL()|raw }}" alt="">
  384.                     </div>
  385.                     {% endif %}
  386.                 </a>
  387.             {% elseif (listing.getFeaturedImageTag()) %}
  388.                 <a href="{{ listing.getURL() }}">
  389.                 {{ post.getFeaturedImageTag("","")|raw }}
  390.                 </a>
  391.             {% endif %}
  392.         </div>
  393.         <div class="col-md-9 col-xl-7">
  394.             <h3 class="notranslate"><a href="{{ listing.getURL() }}">{{ listing.getTitle() }}</a></h3>
  395.             {{ listing.getIntroText()|raw }}
  396.             <div>
  397.                 <a href="{{ listing.getURL() }}">Read More</a>
  398.             </div>
  399.         </div>
  400.         <div class="col-md-3 col-lg-2 d-none d-md-flex">
  401.             <div style="width: 80%; margin: 0 auto;">
  402.         {% set level = listing.getDirectory().getCustomerLevel(site_code) %}
  403.         {% if level <= 2000 %}
  404.             <img 
  405.                 src="{{ asset('assets/img/' ~ site_text_short ~ '-level-best.jpg') }}"
  406.                 alt="Best Level" 
  407.                 loading='lazy'
  408.             />
  409.         {% elseif level == 3000 %}
  410.             <img 
  411.                 src="{{ asset('assets/img/' ~ site_text_short ~ '-level-better.jpg') }}"
  412.                 alt="Better Level" 
  413.                 loading='lazy'
  414.             />
  415.         {% elseif level == 4000 or level == 4001 %}
  416.             <img 
  417.                 src="{{ asset('assets/img/' ~ site_text_short ~ '-level-good.jpg') }}"
  418.                 alt="Good Level" 
  419.                 loading='lazy'
  420.             />
  421.         {% else %}
  422.             <img 
  423.                 src="{{ asset('assets/img/' ~ site_text_short ~ '-level-other.jpg') }}"
  424.                 alt="Good Level" 
  425.                 loading='lazy'
  426.             />
  427.         {% endif %}
  428.             </div>
  429.         </div>
  430.     </div>
  431.     <div class="row my-2">
  432.         <div class="col-sm-12">
  433.             <hr />
  434.         </div>
  435.     </div>
  436.     {% endfor %}
  437.     
  438.     <div class="row my-2">
  439.         <div class="col-md-12">
  440.             <!-- Pagination -->
  441.             {% if total %}
  442.             <div class="float-right">
  443.                 <div class="input-group">
  444.                     <div class="input-group-prepend px-3">
  445.                         <span>
  446.                         Showing: 
  447.                         {{ page * limit + 1 }} - 
  448.                     
  449.                         {% if (page * limit + limit <= total) %}
  450.                             {{ page * limit + limit }}
  451.                         {% else %}
  452.                             {{ total }}
  453.                         {% endif %}
  454.                         
  455.                         of 
  456.                         
  457.                         {{ total }}
  458.                         </span>
  459.                     </div>
  460.                     <div class="button-group input-group-append">
  461.                         {% if (page) %}
  462.                         <button 
  463.                             class="btn paging"
  464.                             type="submit"
  465.                             value="{{ page - 1 }}"
  466.                         ><i class="fa fa-angle-left"></i></button>
  467.                         {% endif %}
  468.                         {% if page * limit + limit < total %}
  469.                         <button 
  470.                             class="btn paging"
  471.                             type="submit"
  472.                             value="{{ page + 1 }}"
  473.                         ><i class="fa fa-angle-right"></i></button>
  474.                         {% endif %}
  475.                     </div>
  476.                 </div>
  477.             </div>
  478.             {% endif %}
  479.         </div>
  480.     </div>
  481.     
  482.     <!--
  483.     <div class="row">
  484.         <div class="col-md-2">
  485.             [img]
  486.         </div>
  487.         <div class="col-md-7">
  488.             [content]
  489.         </div>
  490.         <div class="col-md-3">
  491.             [star]
  492.         </div>
  493.     </div>
  494.     -->
  495.     
  496.     </form>
  497.     
  498.     
  499. </div>