{namespace ms=Mediatesystems\UmjSitepackage\ViewHelpers}

<f:if condition="{data.downloads}">
    <f:render section="e04_inpage_download_section" arguments="{data: event}"/>
</f:if>

<f:section name="e04_inpage_download_section">
    <div class="e04_inpage_download_section black-white"  id="event-{data.uid}">
        <div class="e04_inpage_download_section_wrapper">
            <div class="e04_inpage_download_section_inner_wrapper">
                    <div class="e04_inpage_download_section_header">
                        <h2>Downloads</h2>
                    </div>
                    <div class="e04_inpage_download_section_first_block">
                        <f:for each="{data.downloads}" as="data_item" iteration="iterator">
                            <div class="e04_inpage_download_section_content_wrapper">
                                <div class="e04_inpage_download_section_content">
                                    <p class="e04_inpage_download_section_title">{data_item.properties.name}</p>
                                    <!--
                                    <f:if condition="{data_item.settings.title}">
                                        <p class="e04_inpage_download_section_title">{data_item.tx_mask_e04_inpagedownload_section_title}</p>
                                    </f:if>
                                    <f:if condition="{data_item.tx_mask_e04_inpagedownload_section_subtitle}">
                                        <p class="subtitle">{data_item.tx_mask_e04_inpagedownload_section_subtitle}</p>
                                    </f:if>
                                    -->
                                </div>
                                <f:if condition="{data_item}">
                                    <div class="e04_inpage_download_section_preview">
                                        <f:image treatIdAsReference="1" image="{data_item}" height="54"></f:image>
                                    </div>
                                    <div class="e04_inpage_download_section_buttons">
                                        <div class="e04_inpage_download_section_download">
                                            <f:link.file file="{data_item}" class="e04_inpage_download_section_download-item" download="true">
                                                <svg width="20" height="18" viewBox="0 0 20 18" fill="none" xmlns="http://www.w3.org/2000/svg">
                                                    <path d="M7.35156 7.73438L10.4758 10.6867L13.6 7.73438" stroke="black" stroke-width="1.125" stroke-linecap="square" stroke-linejoin="round"/>
                                                    <path d="M10.4766 2.8125V10.1229" stroke="black" stroke-width="1.125" stroke-linecap="square" stroke-linejoin="round"/>
                                                    <path d="M17.0216 10.6875V14.625C17.0216 14.7742 16.9589 14.9173 16.8473 15.0227C16.7357 15.1282 16.5844 15.1875 16.4265 15.1875H4.52478C4.36695 15.1875 4.21559 15.1282 4.10398 15.0227C3.99238 14.9173 3.92969 14.7742 3.92969 14.625V10.6875" stroke="black" stroke-width="1.125" stroke-linecap="square" stroke-linejoin="round"/>
                                                </svg>
                                            </f:link.file>
                                        </div>
                                    </div>
                                </f:if>
                                <!--
                                <f:if condition="{data_item.tx_mask_e04_inpagedownload_section_primarylink} && {f:link.typolink(parameter: '{data_item.tx_mask_e04_inpagedownload_section_primarylink}')}">
                                    <f:if condition="{data_item.tx_mask_e04_inpagedownload_section_primarytext}">
                                        <div class="heromodulesub-buttons">
                                            <f:link.typolink class="btn btn-primary" parameter="{data_item.tx_mask_e04_inpagedownload_section_primarylink}">
                                                {ms:button(type: 'text',text: data_item.tx_mask_e04_inpagedownload_section_primarytext,direction:"right",border:0)}
                                            </f:link.typolink>
                                        </div>
                                    </f:if>
                                </f:if>
                                -->
                            </div>
                            <f:if condition="{iterator.isLast} == TRUE && {iterator.total} > 5">
                                <f:then>
                                    <div class="e04_inpage_download_section_show_more" >
                                        <ms:icon type="plus" data-show="5" function="extandShowMore(this, 'flex')"/>
                                    </div>
                                </f:then>
                            </f:if>
                        </f:for>
                    </div>

            </div>
        </div>
    </div>
</f:section>