templates/Tour/teaser.html.twig line 1

Open in your IDE?
  1. {# @var \Pimcore\Model\DataObject\AlpsteinTour tour #}
  2. {% set additionalBadges = getClosureStatesForTour(tour) %}
  4. <section class="tour-teaser teaser-animation">
  5.     <div class="tour-teaser__info-wrapper d-flex">
  6.         {% if tour.publicTransportFriendly %}
  7.             <div class="tour-teaser__arrival">
  8.                 <span class="tour-teaser__arrival-icon icon icon-traffic" aria-label="mit Bus erreichbar"
  9.                       data-toggle="tooltip" data-original-title="{{ 'tour.mit Bus erreichbar'|trans }}"></span>
  10. {#                <span class="tour-teaser__arrival-text">#}
  11. {#                    {{ 'tour.mit Bus erreichbar'|trans }}#}
  12. {#                </span>#}
  13.             </div>
  14.         {% endif %}
  16.         {% if additionalBadges is defined %}
  17.         <div class="tour-teaser__status-wrapper {{ additionalBadges|length > 1 ? 'd-flex w-100 justify-content-end' }}" >
  18.             {% for additionalBadge in additionalBadges %}
  19.                 <div class="tour-teaser__status">
  20.                     <span class="tour-teaser__status-icon icon icon-path-{{ additionalBadge.icon }} text-{{ additionalBadge.color }}" aria-label="{{ additionalBadge.text }}"
  21.                           data-toggle="tooltip" data-custom-tooltip-class="tour-status__tooltip" data-original-title="{{ additionalBadge.title|default(additionalBadge.text) }}">
  22.                     </span>
  23. {#                    <span class="tour-teaser__status-text">#}
  24. {#                        {{ additionalBadge.text }}#}
  25. {#                    </span>#}
  26.                 </div>
  27.             {% endfor %}
  28.         </div>
  29.     </div>
  30.     {% endif %}
  31.     <div class="embed-responsive embed-responsive-7by9">
  32.         {% set teaserImage = null %}
  33.         {% if tour.primaryImage %}
  34.             {% set teaserImage = tour.primaryImage %}
  35.         {% elseif tour.images and tour.images[0] %}
  36.             {% set teaserImage = tour.images[0] %}
  37.         {% endif %}
  38.         {% if teaserImage %}
  39.             {% set description = getImageDescription(teaserImage, true) %}
  40.             {{ teaserImage.thumbnail('tour-teaser').html({
  41.                 imgAttributes: {
  42.                     class: 'js-lazy-img embed-responsive-item teaser-animation__img'
  43.                 },
  44.                 lowQualityPlaceholder: true,
  45.                 title: description|default(''),
  46.                 alt: description|default('')
  47.             })|raw }}
  48.         {% endif %}
  49.     </div>
  51.     <div class="tour-teaser__content d-flex flex-column justify-content-end">
  52.         <div class="vertical-gutter--2">
  53.             {% set location = getTourLocation(tour) %}
  54.             {% if location %}
  55.                 <span class="badge badge-white mr-md-2 mr-1 vertical-gutter__item">{{ location }}</span>
  56.             {% endif %}
  57.             {% if tour.ratingDifficulty %}
  58.                 {% if tour.ratingDifficulty == 3 %}
  59.                     {% set levelColor = 'dark' %}
  60.                 {% elseif tour.ratingDifficulty == 2 %}
  61.                     {% set levelColor = 'info' %}
  62.                 {% elseif tour.ratingDifficulty == 1 %}
  63.                     {% set levelColor = 'success' %}
  64.                 {% endif %}
  65.                 <span class="badge badge-{{ levelColor }} mr-2  vertical-gutter__item">{{ ('tour.difficulty' ~ tour.ratingDifficulty)|trans }}</span>
  66.             {% endif %}
  69.             {#
  70.             open: badge-success
  71.             partially-open: badge-info
  72.             closed: badge-danger
  73.             #}
  75.             {% set badge = [] %}
  76.             {% if tour.openedState %}
  77.                 {% if tour.openedState == 'open' %}
  78.                     {% set badge = {
  79.                         'color': 'success',
  80.                         'text': 'tour.Geöffnet'|trans
  81.                     } %}
  82.                 {% elseif tour.openedState == 'partially-open' %}
  83.                     {% set badge = {
  84.                         'color': 'info',
  85.                         'text': 'tour.Teilweise geöffnet'|trans
  86.                     } %}
  87.                 {% elseif tour.openedState == 'closed' %}
  88.                     {% set badge = {
  89.                         'color': 'danger',
  90.                         'text': 'tour.Geschlossen'|trans
  91.                     } %}
  92.                 {% endif %}
  94.             {% endif %}
  95.             {% if badge is not empty %}
  96.                 <span class="badge badge-{{ badge.color }} mr-2  vertical-gutter__item">
  97.                 {{ badge.text }}
  98.             </span>
  99.             {% endif %}
  101.         </div>
  103.         <div class="row row-gutter--3 pt-2">
  104.             <div class="col-auto">
  105.                 <span
  106.                     class="font-default-bold">{{ 'tour.Strecke'|trans }}</span> {{ (tour.length / 1000)|number_format(1, ',', '.') }}
  107.                 km
  108.             </div>
  109.             <div class="col-auto">
  110.                 {% set duration = tour.timeMin %}
  111.                 {% set hour = (duration/60)|round(0, 'floor') %}
  112.                 {% set minutes = duration % 60 %}
  113.                 {% if minutes < 10 %}
  114.                     {% set minutes = 0 ~ minutes %}
  115.                 {% endif %}
  116.                 <span class="font-default-bold">{{ 'tour.Dauer'|trans }}</span> {{ hour }}:{{ minutes }} h
  117.             </div>
  118.         </div>
  119.         {% set description = getImageDescription(tour.primaryImage) %}
  120.         <h3 class="tour-teaser__content__title font-default-bold mb-0"><a
  121.                 href="{{ linkGenerator().generate(tour, {relative: true, canoncial: false}) }}"
  122.                 class="stretch-link__link" title="{{ description|default('') }}">{{ tour.name }}</a></h3>
  123.     </div>
  124. </section>