{namespace v=FluidTYPO3\Vhs\ViewHelpers}
{namespace ot=Opentalent\OtTemplating\ViewHelpers}

<f:comment><!-- Next events --></f:comment>

<f:comment><!-- Get the events page' uid if the page is found --></f:comment>
<v:variable.set value="{ot:eventsPage.getId()}" name="eventsPageUid"/>

<div class="ot-box ot-events">
    <div class="events-list">
        <header>
            <f:if condition="{fromParents}">
                <f:then>
                    <h3><f:translate key="next-events-of-our-network"/></h3>
                </f:then>
                <f:else>
                    <f:if condition="{fromChildren}">
                        <f:then>
                            <h3><f:translate key="next-events-of-our-structures"/></h3>
                        </f:then>
                        <f:else>
                            <h3><f:translate key="our-next-events"/></h3>
                        </f:else>
                    </f:if>
                </f:else>
            </f:if>
        </header>

        <ot:events.getNext as="eventsCollection"
                           organizationId="{settings.organizationId}"
                           limit="{settings.eventsLimit}"
                           period="{settings.eventsPeriod}"
                           fromParents="{fromParents}"
                           fromChildren="{fromChildren}">

            <f:for each="{eventsCollection.members}" as="event">

                <div class="event-card">

                    <div class="event-poster">
                        <f:if condition="{event.image}">
                            <f:then>
                                <img src='{event.image}' alt="poster" />
                            </f:then>
                            <f:else>
                                <f:image src="EXT:ot_templating/Resources/Public/media/event-default.jpg" alt="poster" />
                            </f:else>
                        </f:if>
                    </div>

                    <div class="event-summary">
                        <span class="event-name">
                            {event.name}
                        </span>
                        <span class="event-date">
                            {f:format.date(date: event.datetimeStart,
                                           format: "\l\e d-m-Y \à H\hi")}
                        </span>
                        <f:if condition="{eventsPageUid} > 0">
                            <f:then>
                                <span class="event-see">
                                    <f:if condition="{fromParents}||{fromChildren}">
                                        <f:then>
                                            <a href="https://{event.subDomain}.opentalent.fr"
                                               target="_blank">
                                                <f:translate key="more-informations"/>
                                            </a>
                                        </f:then>
                                        <f:else if="{eventsPageUid} > 0">
                                            <f:link.page pageUid="{eventsPageUid}"
                                                         additionalParams="{eventId: event.id}">
                                                <f:translate key="more-informations"/>
                                            </f:link.page>
                                        </f:else>
                                        <f:else>
                                        </f:else>
                                    </f:if>
                                </span>

                            </f:then>
                        </f:if>
                    </div>

                </div>
            </f:for>

            <f:if condition="{eventsCollection.totalItems} == 0">
                <f:then>
                    <span class="no-events">
                        <f:translate key="no-events-for-next-weeks"/>
                    </span>
                </f:then>
            </f:if>
        </ot:events.getNext>

        <footer>
            <f:if condition="{fromParents}||{fromChildren}">
                <f:then>
                </f:then>
                <f:else>
                    <f:if condition="{eventsPageUid} > 0"><f:then>
                        <div class="event-see-all">
                            <f:link.page pageUid="{eventsPageUid}">
                                <f:translate key="see-all-events"/>
                            </f:link.page>
                        </div>
                    </f:then></f:if>
                </f:else>
            </f:if>
        </footer>
    </div>
</div>