templates/index/business.html.twig line 1

Open in your IDE?
  1. {% extends 'center.html.twig' %}
  3. {% block title %}
  4.     {{ 'title.business_list'|trans }} | {{ parent() }}
  5. {% endblock %}
  7. {% block page %}
  8.     {% if selected is null %}
  9.         <section class="overflow-hidden py-lg-5 py-xl-5 py-sm-1 py-md-2">
  10.             <div class="container mt-2 mb-5">
  11.                 <div class="row">
  12.                     <div class="col-md-6 col-lg-6 text-left text-md-start">
  13.                         <h1>{{ 'title.business_list'|trans }}</h1>
  14.                     </div>
  15.                     <div class="col-md-6 col-lg-6 text-right text-md-start">
  16.                         {{ form(form) }}
  17.                     </div>
  18.                 </div>
  19.             </div>
  20.             <div class="container">
  21.                 <div class="row g-0">
  22.                     {% for business in list %}
  23.                         {% if business.logo is not null %}
  24.                             {% set filePath = '/uploads/'~business.logo.file %}
  25.                         {% else %}
  26.                             {% set filePath = '/assets/images/nc-max-logo.png' %}
  27.                         {% endif %}
  28.                         <div class="col-sm-6 col-lg-3 col-xl-3">
  29.                             <a href="{{ path('app_city_business', {'city':city, 'url':business.url}) }}"
  30.                                class="card card-hover-gradient inverted equal-1-1 m-1">
  31.                                 <div class="card-wrap">
  32.                                     <div class="card-footer text-shadow mt-auto">
  33.                                         <h5 class="mb-0">{{ business.title }}</h5>
  34.                                         <span class="text-muted">{% if business.category is not null %}{{ business.category.name }}{% endif %}</span>
  35.                                         <br>
  36.                                         <br class="text-muted">
  37.                                             {% for openingHour in business.openingHours %}
  38.                                                 <i class="bi bi-watch"></i> {{ openingHour.timeFrom|date('H:i') }} - {{ openingHour.timeTill|date('H:i') }}</br>
  39.                                         {% endfor %}
  40.                                         <br class="text-muted">
  41.                                         {% for tag in business.tags %}
  42.                                             <i class="bi bi-pin"></i> {{ tag.name }}
  43.                                         {% endfor %}
  44.                                         </span>
  45.                                     </div>
  46.                                 </div>
  47.                                 <figure class="background"
  48.                                         style="background-image: url('{{ filePath }}'); background-size: auto !important; background-repeat: no-repeat; background-color: white;">
  49.                                 </figure>
  50.                             </a>
  51.                         </div>
  52.                     {% endfor %}
  53.                 </div>
  54.             </div>
  55.         </section>
  56.         {% block javascripts_footer %}
  57.             {{ parent() }}
  58.             <script>
  59.                 $(document).ready(function () {
  60.                     var $categorySelect = $('#category_filter_category');
  61.                     $categorySelect.on('change', function () {
  62.                         $('form[name="category_filter"]').submit();
  63.                     });
  64.                 });
  65.             </script>
  66.         {% endblock %}
  67.     {% else %}
  68.         <section class="overflow-hidden py-lg-5 py-xl-5 py-sm-1 py-md-2">
  69.             <div class="container">
  70.                 <div class="row align-items-start mb-5 mt-5">
  71.                     <div class="col-lg-8 col-md-8">
  72.                         <h1>{{ selected.title }}</h1>
  73.                         <nav aria-label="breadcrumb">
  74.                             <ol class="breadcrumb">
  75.                                 <li class="breadcrumb-item"><a
  76.                                             href="{{ path('app_city_businesses', {'city':center.url}) }}">{{ 'title.business_list'|trans }}</a>
  77.                                 </li>
  78.                                 <li class="breadcrumb-item active"><a href="#">{{ selected.category.name }}</a></li>
  79.                             </ol>
  80.                         </nav>
  81.                     </div>
  82.                     <div class="col-lg-4 col-md-4">
  84.                     </div>
  85.                 </div>
  86.                 <div class="row align-items-start mb-5 mt-5">
  87.                     {% if selected.logo is not null %}
  88.                         {% set filePath = '/uploads/'~selected.logo.file %}
  89.                     {% else %}
  90.                         {% set filePath = '/assets/images/nc-max-logo.png' %}
  91.                     {% endif %}
  93.                     <div class="col-lg-4 col-md-4">
  94.                         <img src="{{ filePath }}" class="img-fluid rounded" alt="{{ selected.title }}"/>
  96.                     </div>
  97.                     <div class="col-lg-8 col-md-8 text-justify ">
  98.                         {{ selected.description|raw }}
  100.                         <ul class="list-group list-group-minimal mb-2 mt-2">
  101.                             <li class="list-group-item d-flex align-items-center">
  102.                                 <span class="w-25 text-muted"><i class="bi bi-envelope"></i></span>
  103.                                 {{ selected.address.email }}
  104.                             </li>
  105.                             <li class="list-group-item d-flex align-items-center">
  106.                                 <span class="w-25 text-muted"><i class="bi bi-globe"></i></span>
  107.                                 <a href="{{ selected.address.website }}"
  108.                                    target="_blank">{{ selected.address.website }}</a>
  109.                             </li>
  110.                             <li class="list-group-item d-flex align-items-center">
  111.                                 <span class="w-25 text-muted"><i class="bi bi-phone"></i></span>
  112.                                 {{ selected.address.phone }}
  113.                             </li>
  114.                             <li class="list-group-item d-flex align-items-center">
  115.                                 <span class="w-25 text-muted"><i class="bi bi-instagram"></i></span>
  116.                                 {% if selected.address.instagram %}
  117.                                     <a href="{{ selected.address.instagram }}"
  118.                                        target="_blank">{{ selected.address.instagram }}</a>
  119.                                 {% endif %}
  120.                             </li>
  121.                             <li class="list-group-item d-flex align-items-center">
  122.                                 <span class="w-25 text-muted"><i class="bi bi-facebook"></i></span>
  123.                                 {% if selected.address.facebook %}
  124.                                     <a href="{{ selected.address.facebook }}"
  125.                                        target="_blank">{{ selected.address.facebook }}</a>
  126.                                 {% endif %}
  127.                             </li>
  128.                             <li class="list-group-item d-flex align-items-center">
  129.                                 <span class="w-25 text-muted" title="{{ 'label.opening_hours'|trans }}"><i
  130.                                             class="bi bi-watch"></i></span>
  131.                                 <span title="{{ 'label.opening_hours'|trans }}">
  132.                                 {% for openingHour in selected.openingHours %}
  133.                                     {{ openingHour.timeFrom|date('H:i') }} - {{ openingHour.timeTill|date('H:i') }}<br>
  134.                                 {% endfor %}
  135.                                     </span>
  136.                             </li>
  137.                         </ul>
  138.                     </div>
  139.                 </div>
  140.                 <div class="row align-items-start mb-5 mt-5">
  141.                     <h5>{{ 'title.discounts'|trans }}</h5>
  142.                     {% if discounts is empty %}
  143.                         <p>{{ 'label.no_discounts'|trans }}</p>
  144.                     {% else %}
  145.                         <div class="row align-items-start">
  146.                             {% for discount in discounts %}
  147.                                 <div class="col-md-6 col-lg-4">
  148.                                     <article class="card hover-arrow">
  149.                                         {% if discount.image is not null %}
  150.                                             {% set filePath = '/uploads/'~city~'/discounts/'~discount.image.file %}
  152.                                             <a href="{{ path('app_city_discount', {'city':city, 'url':discount.url, 'businessUrl':discount.parent.url}) }}">
  153.                                                 <img src="{{ filePath }}" class="card-img-top"
  154.                                                      alt="{{ discount.title }}"/>
  155.                                             </a>
  156.                                         {% endif %}
  157.                                         <div class="card-body p-0 pe-lg-10 mt-2">
  158.                                             <a href="{{ path('app_city_discount', {'city':city, 'url':discount.url, 'businessUrl':discount.parent.url}) }}"
  159.                                                class="card-title">
  160.                                                 <h5>{{ discount.title }}</h5>
  161.                                             </a>
  162.                                             {{ 'label.discount_until'|trans }}:
  163.                                             <time datetime="{{ discount.dateFrom|date('Y-m-d H:i') }}"
  164.                                                   class="eyebrow text-muted">{{ discount.dateFrom|date('d.m. H:i') }}</time>
  165.                                         </div>
  166.                                     </article>
  167.                                 </div>
  168.                             {% endfor %}
  169.                         </div>
  170.                     {% endif %}
  171.                 </div>
  172.                 <div class="row align-items-start mb-5 mt-5">
  173.                     <div class="col-lg-12 col-md-8">
  174.                         {% set label_floor = 'label.floor-'~selected.floor %}
  175.                         <h5>{{ 'label.map_position'|trans }} - {{ label_floor|trans }}</h5>
  176.                     </div>
  177.                     <div class="col-lg-12 text-center mt-3">
  178.                         {% if selected.map is not null %}
  179.                             <img src="/assets/images/maps/{{ center.url }}-{{ selected.floor }}.png" id="image-map"
  180.                                  usemap="#image-map" class="map img-fluid"/>
  181.                             <map name="image-map" id="image-map">
  182.                                 <area shape="poly" coords="{{ selected.map }}" id="{{ selected.url }}"
  183.                                       ondmouseover="setTitle('{{ selected.title }}')" onmouseout=""
  184.                                       title="{{ selected.title }}"/>
  185.                                 {% for business in list %}
  186.                                     {% if business.id is not same as(selected.id) %}
  187.                                     <area shape="poly" coords="{{ business.map }}" id="{{ business.url }}"
  188.                                           ondmouseover="setTitle('{{ business.title }}')" onmouseout=""
  189.                                           title="{{ business.title }}" onclick="window.location.href='{{ path('app_city_business', {city:city, url: business.url}) }}'"/>
  190.                                     {% endif %}
  191.                                 {% endfor %}
  192.                             </map>
  193.                             <script src="{{ asset('assets/js/image-map.jquery.js') }}"></script>
  194.                             <script>
  195.                                 $(document).ready(function () {
  196.                                     $('area').qtip({
  197.                                         content: '',
  198.                                         position: {
  199.                                             target: 'mouse', // Track the mouse as the positioning target
  200.                                             adjust: {x: 5, y: 5} // Offset it slightly from under the mouse
  201.                                         },
  202.                                         style: {
  203.                                             classes: 'qtip-bootstrap qtip-shadow'
  204.                                         }
  205.                                     });
  206.                                     $('#{{ selected.url }}').qtip({
  207.                                         content: '{{ selected.title }}',
  208.                                         position: {
  209.                                             adjust: {x: 0, y: 0} // Offset it slightly from under the mouse
  210.                                         },
  211.                                         show: true,
  212.                                         style: {
  213.                                             classes: 'qtip-bootstrap qtip-shadow'
  214.                                         }
  215.                                     });
  218.                                     $('.map').maphilight({
  219.                                         fill: true,
  220.                                         fillColor: 'f08d34',
  221.                                         fillOpacity: 0.5,
  222.                                         strokeColor: 'f08d34'
  223.                                     });
  224.                                     /*
  225.                                     var data = $('#{{ selected.url }}').mouseout().data('maphilight') || {};
  226.                                     data.alwaysOn = !data.alwaysOn;
  227.                                     $('#{{ selected.url }}').data('maphilight', data).trigger('alwaysOn.maphilight');
  228.                                     */
  229.                                     $('img[usemap]').imageMap();
  230.                                 });
  231.                             </script>
  232.                         {% endif %}
  233.                     </div>
  234.                 </div>
  235.             </div>
  236.         </section>
  237.     {% endif %}
  238. {% endblock %}