{% extends "base.html" %}
{% load wagtailimages_tags %}

{# Handling meta tags for social media preview image #}
{% if self.content_blocks %}
  {# We take the image from the first component on the page, #}
  {# If this component is a carousel or a centered image. #}
  {% if self.content_blocks.0.block_type == 'centered_image' or self.content_blocks.0.block_type == 'carousel'%}
    {# carousel is a list of images, centered_image is a single image #}
    {% if self.content_blocks.0.value.image or self.content_blocks.0.value.0.image %}
      {% block og_image %}
        {% if self.content_blocks.0.block_type == 'centered_image' %}
          {% image self.content_blocks.0.value.image fill-1200x630 as first_image %}
        {% else %}
          {% image self.content_blocks.0.value.0.image fill-1200x630 as first_image %}
        {% endif %}
          <meta property="og:image" content="{{ request.scheme }}://{{ request.get_host }}{{ first_image.url }}" />
      {% endblock %}
    {% endif %}
  {% endif %}

{% endif %}


{% block content %}
  {% if self.content_blocks %}
    {% for block in self.content_blocks %}

      {% if block.block_type == 'carousel' %}
        {% include 'components/carousel.html' with carousel=block.value carousel_id=forloop.counter %}
      {% endif %}

      {% if block.block_type == 'big_card' %} 
        {% include 'components/big_cards.html' with cards=block.value big_card_group_id=forloop.counter%}
      {% endif %}
  
      {% if block.block_type == 'small_card' %}
        {% include 'components/small_cards.html' with cards=block.value small_card_group_id=forloop.counter%}
      {% endif %}

      {% if block.block_type == 'centered_image' %}
        {% include 'components/centered_image.html' with img_block=block.value centered_image_id=forloop.counter%}
      {% endif %}

      {% if block.block_type == 'centered_text_block' %}
        {% include 'components/centered_text_block.html' with txt_block=block.value centered_text_id=forloop.counter%}
      {% endif %}

    {% endfor %}
  {% endif %}
{% endblock content %}