<html xmlns:core="http://typo3.org/ns/TYPO3/CMS/Core/ViewHelpers" data-namespace-typo3-fluid="true">
<h1><f:translate key="moduleTitle" /></h1>
<div>
    <p class="lead"><f:translate key="overview" /></p>
    <div class="table-fit">
        <table class="table table-striped table-hover" id="ts-overview">
        <thead>
            <tr>
                <th><f:translate key="pageName" /></th>
                <th><f:translate key="templates" /></th>
                <th><f:translate key="isRoot" /></th>
                <th><f:translate key="isExt" /></th>
            </tr>
        </thead>
        <tbody>
            <f:for each="{pageTree}" as="page">
                <f:render section="PageZeroTableRow" arguments="{page: page, level: 0, template: page._templates.0}" />
            </f:for>
        </tbody>
        </table>
    </div>
</div>

<f:section name="PageZeroTableRow">
    <f:variable name="maxCharacters" value="30" />
    <tr class="{f:if(condition: page.hidden, then: 'inactive')}">
        <td class="nowrap">
            <span style="width: 1px; height: 1px; display:inline-block; margin-left: {level * 20}px"></span>
            <f:if condition="{page}">
                <f:then>
                    <f:if condition="{page._templates}">
                        <f:then>
                            <a href="{page._linkModul}"
                               title="ID: {page.uid}">
                                <f:format.raw>{page._icon}</f:format.raw>
                                {page.title -> f:format.crop(maxCharacters: maxCharacters)}
                            </a>
                        </f:then>
                        <f:else>
                            <span title="ID: {page.uid}">
                                <f:format.raw>{page._icon}</f:format.raw>
                                {page.title -> f:format.crop(maxCharacters: maxCharacters)}
                            </span>
                        </f:else>
                    </f:if>
                </f:then>
                <f:else>
                    &nbsp;
                </f:else>
            </f:if>
        </td>
        <td>
            <f:if condition="{template}">
                <f:then>
                    <a href="{template._linkModul}"
                       title="ID: {template.uid} {template.sitetitle}">
                        <core:iconForRecord table="sys_template" row="{template}" />
                        {template.title -> f:format.crop(maxCharacters: maxCharacters)}
                    </a>
                </f:then>
                <f:else>
                    &nbsp;
                </f:else>
            </f:if>
        </td>
        <td>
            <f:if condition="{template}">
                {f:if(condition: "{template.root}", then: "{core:icon(identifier: 'status-status-checked')}" )}
            </f:if>
        </td>
        <td>
            <f:if condition="{template}">
                {f:if(condition: "!{template.root}", then: "{core:icon(identifier: 'status-status-checked')}" )}
            </f:if>
        </td>
    </tr>
    <f:if condition="{page}">
        <!-- Additional templates -->
        <f:if condition="{f:count({page._templates})}">
            <f:for each="{page._templates}" as="template" iteration="i">
                <f:if condition="{i.index} > 0">
                    <f:render section="PageZeroTableRow" arguments="{page: 0, level: level, template: template}" />
                </f:if>
            </f:for>
        </f:if>
        <!-- Subpages -->
        <f:if condition="{f:count({page._nodes})}">
            <f:for each="{page._nodes}" as="page">
                <f:render section="PageZeroTableRow" arguments="{page: page, level: '{level + 1}', template: page._templates.0}" />
            </f:for>
        </f:if>
    </f:if>
</f:section>
</html>