templates/bundles/ProviderBundle/areas/teaser/view.html.twig line 1

Open in your IDE?
  1. {% from '@Provider/macros/teaser.html.twig' import teaser %}
  2. {% from '@Provider/macros/teaser.html.twig' import teaserSlider %}
  4. {# Default block settings #}
  5. {% set class            = pimcore_input('class').getData() %}
  6. {% set marginTop        = pimcore_select('margin_top').getData() %}
  7. {% set marginBottom     = pimcore_select('margin_bottom').getData() %}
  8. {% set anchorId         = pimcore_input('anchor').getData() %}
  9. {% set containerWidth   = pimcore_select('teaser_height').getData() in [ 'large', 'xl' ] ? 'full-width' : pimcore_select('container_width').getData() %}
  10. {% set areaClass        = class ~ ' ' ~ marginTop ~ ' ' ~ marginBottom ~ ' ' ~ containerWidth %}
  12. {# Teaser block settings #}
  13. {% set layout       = pimcore_select('layout').getData() %}
  14. {% set headerTag    = pimcore_select('header_tag').getData() %}
  15. {% set linkAsBtn    = pimcore_checkbox('link_as_button').isChecked() %}
  17. <div class="area area--teaser {{ areaClass }}"{% if anchorId %} id="{{ anchorId }}"{% endif %}>
  19.     {% set teaserHeight = pimcore_select('teaser_height').getData() ? pimcore_select('teaser_height').getData() : 'default' %}
  21.     {% if editmode %}
  23.         {{ pimcore_relations('teaser_items', {
  24.             'types': ['object'],
  25.             'subtypes': {
  26.                 'object': ['object']
  27.             },
  28.             'classes': ['Teaser'],
  29.             'reload': true,
  30.             'class': 'container'
  31.         }) }}
  33.         <div class="cols cols--2 container">
  35.             {% set teaserTypeDisable = false %}
  36.             {% if layout == 'slider' %}
  37.                 {% set teaserTypeDisable = true %}
  38.                 <div style="display: none;">
  39.                     {{ pimcore_select('teaser_height').setDataFromEditmode('klein') }}
  40.                 </div>
  41.             {% endif %}
  43.             <div class="card--config-edit">
  44.                 <strong>Teaser Größe:</strong>
  45.                 {{ pimcore_select('teaser_height', {
  46.                     'store': [
  47.                         [ 'default', 'klein' ],
  48.                         [ 'medium', 'mittel' ],
  49.                         [ 'large', 'groß' ],
  50.                         [ 'xl', 'xl' ]
  51.                     ],
  52.                     'defaultValue': 'default',
  53.                     'reload': true,
  54.                     'disabled': teaserTypeDisable
  55.                 }) }}
  56.             </div>
  58.             {# to disable row cols select if teaser height is not small #}
  59.             {% set disabled = false %}
  60.             {% if teaserHeight != 'default' and layout != 'slider' %}
  61.                 {% set disabled = true %}
  62.                 <div style="display: none;">
  63.                     {{ pimcore_select('teaser_row_cols').setDataFromEditmode('1 Spalte') }}
  64.                 </div>
  65.             {% endif %}
  67.             <div class="card--config-edit">
  68.                 <strong>Spalten:</strong>
  69.                 {{ pimcore_select('teaser_row_cols', {
  70.                     'store': [
  71.                         [ 'auto', 'automatisch' ],
  72.                         [ 1, '1 Spalte' ],
  73.                         [ 2, '2 Spalten' ],
  74.                         [ 3, '3 Spalten' ],
  75.                         [ 4, '4 Spalten' ]
  76.                     ],
  77.                     'defaultValue': 'auto',
  78.                     'reload': true,
  79.                     'disabled': disabled
  80.                 }) }}
  81.             </div>
  83.             {% if teaserHeight not in [ 'large', 'xl' ] %}
  84.                 <div class="card--config-edit" style="margin-top: 0; margin-bottom: 30px">
  85.                     {{ pimcore_checkbox('teaser_border', {
  86.                         'label': 'Teaser mit Rahmen',
  87.                         'reload': true
  88.                     }) }}
  89.                 </div>
  90.             {% endif %}
  91.         </div>
  92.     {% endif %}
  94.     {% set hasBorder = pimcore_checkbox('teaser_border') ? pimcore_checkbox('teaser_border').isChecked() : 0 %}
  95.     {% set hasBorder = teaserHeight in [ 'large', 'xl' ] ? 0 : pimcore_checkbox('teaser_border').isChecked() %}
  97.     {% set cols = pimcore_select('teaser_row_cols').getData() == '1 Spalte' ? 1 : pimcore_select('teaser_row_cols').getData() %}
  98.     {% if cols == 'auto' %}
  99.         {% set cardElementLength = pimcore_relations('teaser_items').getElements() | length %}
  100.         {% set cols = cardElementLength < 4 ? cardElementLength : 4 %}
  101.     {% endif %}
  103.     {% if layout == 'row' %}
  104.         <div class="cols cols--{{ cols }}">
  105.             {% for item in pimcore_relations('teaser_items') %}
  106.                 {{ teaser(item, headerTag, linkAsBtn, hasBorder, teaserHeight) }}
  107.             {% endfor %}
  108.         </div>
  109.     {% else %}
  111.         {% if editmode %}
  112.             <div class="cols cols--3 container">
  113.                 <div class="card--config-edit">
  114.                     {{ pimcore_checkbox('teaser_no_pagination', {
  115.                         'label': 'Pagination deaktivieren',
  116.                         'reload': true
  117.                     }) }}
  118.                 </div>
  120.                 <div class="card--config-edit">
  121.                     {{ pimcore_checkbox('teaser_no_arrows', {
  122.                         'label': 'Controls deaktivieren',
  123.                         'reload': true
  124.                     }) }}
  125.                 </div>
  127.                 <div class="card--config-edit">
  128.                     {{ pimcore_checkbox('teaser_big', {
  129.                         'label': 'breite Teaser',
  130.                         'reload': true
  131.                     }) }}
  132.                 </div>
  133.             </div>
  134.         {% endif %}
  136.         {% set pagination = pimcore_checkbox('teaser_no_pagination').isChecked() ? 'false' : 'true' %}
  137.         {% set arrows = pimcore_checkbox('teaser_no_arrows').isChecked() ? 'false' : 'true' %}
  138.         {% set teaserBig = pimcore_checkbox('teaser_big').isChecked() %}
  140.         {{ teaserSlider(pimcore_relations('teaser_items').getElements(), headerTag, linkAsBtn, hasBorder, cols, pagination, arrows, teaserBig) }}
  141.     {% endif %}
  142. </div>