{% extends "@ibexadesign/pagelayout.html.twig" %}

{% block page_head %}
    {% if content.fields.description is defined %}
        {% set description =  ibexa_field_value( content, 'description' ) %}
    {% else %}
        {% set description =  ibexa_content_name( content) %}
    {% endif %}
    {{ parent() }}
{% endblock %}

{% block content %}
<div class="magazin-landingpage pb-3">
<div class="row">
    <div id="headerCarousel" class="carousel slide d-block lazy" data-ride="carousel">
        {{ ibexa_render_field(
            content, 'slider',
            { 'template': '@ibexadesign/fields/mainslider_field_templates.html.twig',
                'parameters': {"carousel": 'headerCarousel'} }
        ) }}
    </div>
</div>
<h1 class="text-white mt-0 mb-0 small"><small>{% if not ibexa_field_is_empty( content, 'headline' ) %}{{ ibexa_render_field(content, 'headline')}}{% else %}&nbsp;{% endif %}</small></h1>
{% if not ibexa_field_is_empty( content, 'podcast' ) %}
    <hr class="d-md-none" />
    <div class="hr w-100 d-none d-md-flex"><div class="hr-left"></div><div class="hr-right"></div></div>
    <div class="row podcast">
        <div class="col">
            <a href="/Podcast" title="Der Eltern-Podcast mit Julia Dahmen">
                <picture>
                    <source media="(min-width:768px)" srcset="{{  asset('../build/images/magazin/Teaser-Eltern-Podcast.png') }}" alt="Teaser Eltern-Podcast" class="img-fluid" />
                    <source media="(min-width:0px)" srcset="{{ asset('../build/images/magazin/Teaser-Eltern-Podcast-mobil.jpg') }}" alt="Teaser Eltern-Podcast" class="img-fluid" />
                    <img src="{{  asset('../build/images/magazin/Teaser-Eltern-Podcast.png') }}" alt="Teaser Eltern-Podcast" class="img-fluid" />
                </picture>
            </a>
        </div>
    </div>
{% endif %}
<hr />

{% if not ibexa_field_is_empty( content, 'first_article' ) %}
<div class="row mg-box mb-3 img-shadow">
    {{ render( controller( "ibexa_content:viewAction",
        {'contentId': ibexa_field_value(content, 'first_article').destinationContentId,
            'viewType': 'teaser', 'noLayout': 1,"params": { "lineDesign": true }} ) ) }}
</div>
<hr />
{% endif %}
<div class="row mb-3">
    <div class="col-md-6 col-lg-4 copyright-left img-shadow">
        {% if not ibexa_field_is_empty( content, 'image' ) %}
            {{ render( controller( "ibexa_content:viewAction", {'contentId': ibexa_field_value(content,"image").destinationContentId, 'viewType': 'embed', 'noLayout': true, 'params': {'alias': 'image400width'}} ) ) }}
        {% endif %}
    </div>
    <div class="col-md-6 col-lg-4 mt-3 mt-md-0">
        {% if not ibexa_field_is_empty( content, 'second_article' ) %}
            {{ render( controller( "ibexa_content:viewAction",
                {'contentId': ibexa_field_value(content, 'second_article').destinationContentId,
                    'viewType': 'teaser', 'noLayout': 1,"params": { "fullDesign": true, "hideImage": true, "colWidth": 12, "equalHeight": false  }} ) ) }}
        {% endif %}
    </div>
    <div class="col-md-12 col-lg-4 mt-5 mt-lg-0">
        <div class="row h-100 standpunkt img-rounded mx-0 p-3">
          {% if not ibexa_field_is_empty( content, 'standpunkt_artikel' ) %}
            <div class="kolumne-marker w-100 pt-3"><a href="{{ path( "ibexa.url.alias", {"contentId": ibexa_field_value(content, 'standpunkt_artikel').destinationContentId} ) }}"><h5>{{ ibexa_render_field(content, 'standpunkt_title') }}</h5></a></div>
                {% if not ibexa_field_is_empty( content, 'kolumne_portrait' ) %}
                    {{ render( controller( "ibexa_content:viewAction",
                        {'contentId': ibexa_field_value(content, 'standpunkt_artikel').destinationContentId,
                            'viewType': 'teaser', 'noLayout': 1,"params": { "kolumneDesign": true  }} ) ) }}
                    <a href="{{ path( "ibexa.url.alias", {"contentId": ibexa_field_value(content, 'standpunkt_artikel').destinationContentId } ) }}">
                        {{ render( controller( "ibexa_content:viewAction", {'contentId': ibexa_field_value(content,"kolumne_portrait").destinationContentId, 'viewType': 'embed', 'noLayout': true, 'params': {'alias': 'magazin_portrait_image_col2','hideText': 'true'}} ) ) }}
                    </a>
                {% else %}
                    {{ render( controller( "ibexa_content:viewAction",
                        {'contentId': ibexa_field_value(content, 'standpunkt_artikel').destinationContentId,
                            'viewType': 'teaser', 'noLayout': 1,"params": { "standpunktDesign": true  }} ) ) }}
                {% endif %}
        </div>
      {% endif %}
    </div>
</div>
<hr />
{% if not ibexa_field_is_empty( content, 'dossier_title' ) %}
    <div class="row ml-0 mr-0 mb-3 img-shadow dossier dossier-bg1">
        {% if not ibexa_field_is_empty( content, 'dossier_image_list' ) %}
            <div class="col-md-7 mt-3 mb-3">
                <div id="dossierCarousel" class="carousel slide d-block lazy" data-ride="carousel">
                    {{ ibexa_render_field(
                        content, 'dossier_image_list',
                        { 'template': _self,
                            'parameters': {"carousel": 'dossierCarousel'} }
                    ) }}
                </div>
            </div>
            <div class="col-md-5 mt-4 mb-3">
                <div class="theme text-white">{{ ibexa_field_value( content, 'dossier_subtitle' ) }}</div>
                <div class="title text-white"><h2 class="font-weight-bold text-white">{{ ibexa_field_value( content, 'dossier_title' ) }}</h2></div>
                <div class="text-white">{{ ibexa_render_field( content, 'dossier_text' ) }}</div>
            </div>
        {% else %}
            <div class="col mt-3 mb-3">
                <div class="theme text-white">{{ ibexa_render_field( content, 'dossier_subtitle' ) }}</div>
                <div class="title text-white"><h2 class="font-weight-bold text-white">{{ ibexa_field_value( content, 'dossier_title' ) }}</h2></div>
                <div class="text-white">{{ ibexa_render_field( content, 'dossier_text' ) }}</div>
            </div>
        {% endif %}
    </div>
    <hr />
{% endif %}

<div class="row eltern mt-3 mb-3 p-3">
    <div class="col-md-6">
        {% if not ibexa_field_is_empty( content, 'eltern_link' ) %}
            <a href="{{ getSiteaccessUrlByContentId(ibexa_field_value(content, 'eltern_link').destinationContentId)}}">{{ ibexa_render_field(content, 'eltern_text') }}</a>
        {% else %}
            {{ ibexa_render_field(content, 'eltern_text') }}
        {% endif %}
    </div>
    <div class="col-md-6 text-right">
        <img src="{{ asset('../build/images/elternbriefe.png') }}" alt="Elternbriefe" class="img-fluid" />
    </div>
</div>
<hr />
{% if not ibexa_field_is_empty( content, 'article_teaser' ) %}
<div class="row">
    <div class="col">
        {{ render( controller( "ibexa_content:viewAction",
            {'contentId': ibexa_field_value(content, 'article_teaser').destinationContentId,
                'viewType': 'teaser', 'noLayout': 1,"params": { "imageDesign": true}} ) ) }}
    </div>
</div>
<hr />
{% endif %}

<div class="row">
    <div class="col mg-box mb-3 mostviewed img-shadow">
        <h3 class="mt-3 mb-3">{{ ibexa_render_field(content, 'most_viewed_titel') }}</h3>
        <div class="row mb-3">
        {% for mostViewed in mostViewedList %}
            <div class="col-md-4 mb-sm-4">
                {{ render( controller( "ibexa_content:viewAction", {'locationId': mostViewed, 'viewType': 'teaser', 'noLayout': 1, "params": { "fullDesign": true, "hideImage": false, "colWidth": 12, "equalHeight": false }} ) ) }}
            </div>
        {% endfor %}
        </div>
    </div>
</div>
{% if not ibexa_field_is_empty( content, 'keyvisual' ) %}
    <hr />
    <div class="row mt-3">
        <div class="col">
            {{ render( controller( "ibexa_content:viewAction", {'contentId': ibexa_field_value(content,"keyvisual").destinationContentId, 'viewType': 'embed', 'noLayout': true, 'params': {'alias': 'full_width'}} ) ) }}
        </div>
    </div>
{% endif %}
    
{% if not ibexa_field_is_empty( content, 'werbebanner' ) %}
    <hr />
    <div class="row mt-3">
        <div class="col">
            <p class="mb-0 ad">Anzeige</p>
            {{ render( controller( "ibexa_content:viewAction", {'contentId': ibexa_field_value(content,"werbebanner").destinationContentId, 'viewType': 'embed', 'noLayout': true, 'params': {'alias': 'full_width'}} ) ) }}
        </div>
    </div>
{% endif %}

<hr />
<div class="row mb">
    <div class="col-12 col-md-6">
        <div class="autor h-100 p-3 mr-md-2">
            <div class="row">
                <div class="theme mb-3 col-12">{{ ibexa_render_field(content, 'author_titel') }}</div>
                <div class="col-12">
                {% for contentId in ibexa_field_value( content, 'autor_list' ).destinationContentIds %}
                        {{ render( controller( "ibexa_content:viewAction", {'contentId': contentId, 'viewType': 'teaser', 'noLayout': 1, "params": {  }} ) ) }}
                {% endfor %}
                </div>
            </div>
        </div>
    </div>
    <div class="col pb-3 pt-3 pt-md-0 h-100 mb-0 ml-md-2 mediatips">
        <div class="row mt-3 mt-md-0">
{% if not ibexa_field_is_empty( content, 'mediatips_link' ) %}
    {% set url = getSiteaccessUrlByContentId(ibexa_field_value(content, 'mediatips_link').destinationContentId) %}
            <div class="col-12 col-lg-4">
                <a href="{{ url }}">{{ render( controller( "App\\Controller\\MagazinController::Latest",{'contentId':  ibexa_field_value(content, 'mediatips_link').destinationContentId} ) ) }}</a>
            </div>
            <div class="col-12 col-lg-8 mt-3 mt-lg-0">
                <a href="{{ url }}"><h3>{{ ibexa_render_field(content, 'mediatips_title') }}</h3></a>
                <a href="{{ url }}"><h5 class="font-weight-bold">{{ ibexa_field_value(content, 'mediatips_headline') }}</h5></a>
                <p>{{ ibexa_field_value(content, 'mediatips_text') }}</p>
            </div>
{% else %}
            <div class="col">
                <h3>{{ ibexa_render_field(content, 'mediatips_title') }}</h3>
                <h5 class="font-weight-bold">{{ ibexa_field_value(content, 'mediatips_headline') }}</h5>
                <p>{{ ibexa_field_value(content, 'mediatips_text') }}</p>
            </div>
{% endif %}
        </div>
    </div>
</div>
    
{% if not ibexa_field_is_empty( content, 'survey_relation' ) %}
    {{ include('@ibexadesign/survey/landingpages.html.twig') }}
{% endif %}
</div>
{% endblock %}
{% block ezobjectrelationlist_field %}
    {% if not ibexa_field_is_empty( content, field ) %}
        {% if field.value.destinationContentIds|length > 1 %}
            <ol class="carousel-indicators">
            {% for contentId in field.value.destinationContentIds|slice(0, 6) %}
                <li data-target="#{{ parameters.carousel }}" data-slide-to="{{ loop.index - 1 }}"{% if loop.first %} class="active"{% endif %}>
            {% endfor %}
            </ol>
        {% endif %}
        <div class="carousel-inner">
            {% for contentId in field.value.destinationContentIds|slice(0, 6) %}
                {{ render( controller( "ibexa_content:viewAction", {'contentId': contentId, 'viewType': 'slider', 'noLayout': 0, "params": { "image_alias": "magazin_dossier_slider", "is_first": loop.first }} ) ) }}
            {% endfor %}
        </div>
        {% if field.value.destinationContentIds|length > 1 %}
            <a class="carousel-control-prev" href="#{{ parameters.carousel }}" role="button" data-slide="prev">
                <i class="fas fa-angle-left" aria-hidden="true"></i>
                <span class="sr-only">Zurück</span>
            </a>
            <a class="carousel-control-next" href="#{{ parameters.carousel }}" role="button" data-slide="next">
                <i class="fas fa-angle-right" aria-hidden="true"></i>
                <span class="sr-only">Vor</span>
            </a>
        {% endif %}
    {% endif %}
{% endblock %}