{namespace neos=Neos\Neos\ViewHelpers}
{namespace vh=Newland\NeosViewHelpers\ViewHelpers}
{namespace poi=Newland\Toubiz\Poi\Neos\ViewHelpers}

<f:layout name="Default"/>

<f:section name="Content">
    <f:if condition="{format} === 'ajax'">
        <f:then>
            <vh:render partial="FilteredLists/Result" arguments="{_all}"/>
        </f:then>
        <f:else>
            <poi:splitscreen.configuration mainType="{node.properties.articleType}" configurationAs="split">
                <f:if condition="{split.enabled}">
                    <f:then>
                        <vh:render section="SplitScreenWrapper" arguments="{_all}" contentAs="content">
                            <vh:render partial="FilteredLists/ResultsContainer" arguments="{_all}"/>
                        </vh:render>
                    </f:then>
                    <f:else>
                        <vh:render renderable="{filter}" />
                        <vh:render partial="FilteredLists/ResultsContainer" arguments="{_all}"/>
                    </f:else>
                </f:if>
            </poi:splitscreen.configuration>

        </f:else>
    </f:if>
</f:section>


<f:section name="SplitScreenWrapper">
    <div data-toubiz-results.splitscreen.active-classes="fixed overflow-hidden p-4 pin w-full bg-white flex flex-col">

        <vh:render renderable="{filter}" />

        <div data-toubiz-results.splitscreen.active-classes="flex flex-1 overflow-hidden">
            <div data-toubiz-results.splitscreen.active-classes="max-w-md px-4 pt-8 h-full overflow-y-scroll flex-1 hidden md:block">
                {content -> f:format.raw()}
            </div>
            <div {vh:render(section: 'SplitscreenDataAttributes')}></div>
        </div>
    </div>
</f:section>

<f:section name="SplitscreenDataAttributes">
    data-toubiz-results.splitscreen.map-container
    data-toubiz-results.splitscreen.map-type="{split.mapType}"
    data-toubiz-results.splitscreen.map.clustering.color="{split.clustering.color}"
    data-toubiz-results.splitscreen.map.clustering.background-color="{split.clustering.backgroundColor}"
    data-toubiz-results.splitscreen.map.google-maps-api-key="{split.apiKeys.googleMaps}"
    data-toubiz-results.splitscreen.map.toursprung-api-key="{split.apiKeys.toursprung}"
    data-toubiz-results.splitscreen.active-classes="flex-1"
    data-toubiz-results.splitscreen.inactive-classes="hidden"

    <f:for each="{split.toursprungMapStyle}" as="style" iteration="i">
        data-toubiz-results.splitscreen.map.toursprung-map-style.{i.index}.identifier="{style.identifier}"
    </f:for>

    <f:for each="{split.googleMapStyle}" as="style" iteration="i">
        data-toubiz-results.splitscreen.map.google-map-style.{i.index}.identifier="{style.identifier}"
    </f:for>
</f:section>
