<div xmlns="http://www.w3.org/1999/xhtml" lang="en"
     xmlns:f="http://typo3.org/ns/TYPO3/Fluid/ViewHelpers"
     xmlns:flux="http://typo3.org/ns/FluidTYPO3/Flux/ViewHelpers"
     xmlns:pt="http://typo3.org/ns/Digitalwerk/DwPageTypes/ViewHelpers"
     xmlns:v="http://typo3.org/ns/FluidTYPO3/Vhs/ViewHelpers"
     xmlns:bb="http://typo3.org/ns/BinaryBay/BbBoilerplate/ViewHelpers"
     data-namespace-typo3-fluid="true">

  <f:layout name="Page/Default" />

  <f:section name="Configuration">
    <flux:form id="pageComplexLayout" extensionName="BbBoilerplate">
      <flux:grid>
        <flux:grid.row>
          <flux:grid.column colPos="10" name="header" label="LLL:EXT:bb_boilerplate/Resources/Private/Language/locallang.xlf:flux.pageComplexLayout.columns.header" colspan="4">
            <flux:form.variable name="allowedContentTypes" value="html,bbboilerplate_headerpage" />
          </flux:grid.column>
        </flux:grid.row>
        <flux:grid.row>
          <flux:grid.column colPos="20" name="leftContent" label="LLL:EXT:bb_boilerplate/Resources/Private/Language/locallang.xlf:flux.pageComplexLayout.columns.leftContent" colspan="3">
            <flux:form.variable name="allowedContentTypes"
                                value="
                                  div,
                                  list,
                                  shortcut,
                                  form_formframework,
                                  html,
                                  bbboilerplate_notice,
                                  bbboilerplate_gridaccordion,
                                  bbboilerplate_gridaccordionsimple,
                                  bbboilerplate_imagegallery,
                                  bbboilerplate_embededmediaelement,
                                  bbboilerplate_imagefigure,
                                  bbboilerplate_video,
                                  bbboilerplate_regulartextelement,
                                  bbboilerplate_teasersidebargeneral"
            />
            <flux:form.variable name="Fluidcontent" value="{allowedContentTypes:allowedFluidContentTypes}"/>
          </flux:grid.column>
          <flux:grid.column colPos="30" name="sidebar" label="LLL:EXT:bb_boilerplate/Resources/Private/Language/locallang.xlf:flux.pageComplexLayout.columns.sidebar" colspan="1" rowspan="{f:if(condition:'{record.doktype} == {settings.constants.page.doktype.event}', then:'1', else:'2')}">
            <flux:form.variable name="allowedContentTypes"
                                value="
                                  div,
                                  html,
                                  bbboilerplate_teasersidebargeneral,
                                  bbboilerplate_imagefigure,
                                  bbboilerplate_linklisticons,
                                  bbboilerplate_embededmediaelement"
            />
            <flux:form.variable name="Fluidcontent" value="{allowedContentTypes:allowedFluidContentTypes}"/>
          </flux:grid.column>
        </flux:grid.row>
        <flux:grid.row>
          <flux:grid.column colPos="40" colspan="3" name="leftBottomContent" label="LLL:EXT:bb_boilerplate/Resources/Private/Language/locallang.xlf:flux.pageComplexLayout.columns.leftBottomContent">
            <flux:form.variable name="allowedContentTypes"
                                value="
                                  div,
                                  list,
                                  shortcut,
                                  form_formframework,
                                  html,
                                  bbboilerplate_notice,
                                  bbboilerplate_gridaccordion,
                                  bbboilerplate_gridaccordionsimple,
                                  bbboilerplate_imagegallery,
                                  bbboilerplate_embededmediaelement,
                                  bbboilerplate_imagefigure,
                                  bbboilerplate_video,
                                  bbboilerplate_regulartextelement,
                                  bbboilerplate_teaserautoarticlemagazin"
            />
            <flux:form.variable name="Fluidcontent" value="{allowedContentTypes:allowedFluidContentTypes}"/>
          </flux:grid.column>
          <f:if condition="{record.doktype} == {settings.constants.page.doktype.event}">
            <!--Column "pressSidebar" used for event press page. Not visible on regular event page-->
            <flux:grid.column colPos="35" name="pressSidebar" label="LLL:EXT:bb_boilerplate/Resources/Private/Language/locallang.xlf:flux.pageComplexLayout.columns.pressSidebar" colspan="1" rowspan="1">
              <flux:form.variable name="allowedContentTypes"
                                  value="
                                    div,
                                    html,
                                    bbboilerplate_teasersidebargeneral,
                                    bbboilerplate_imagefigure,
                                    bbboilerplate_linklisticons"
              />
            </flux:grid.column>
          </f:if>
        </flux:grid.row>
        <flux:grid.row>
          <flux:grid.column colPos="0" colspan="4" name="content" label="LLL:EXT:bb_boilerplate/Resources/Private/Language/locallang.xlf:flux.pageComplexLayout.columns.content">
            <flux:form.variable name="allowedContentTypes"
                                value="
                                  list,shortcut,
                                  div,
                                  form_formframework,
                                  html,
                                  bbboilerplate_teaserhomepageeventshero,
                                  bbboilerplate_grid50x50,
                                  bbboilerplate_grid60x40,
                                  bbboilerplate_gridthemehighlights,
                                  bbboilerplate_teaserrelatedpagetypes,
                                  bbboilerplate_notice,
                                  bbboilerplate_footerpartners,
                                  bbboilerplate_team,
                                  bbboilerplate_teamldap,
                                  bbboilerplate_gridcentercontent,
                                  bbboilerplate_regulartextelement,
                                  bbboilerplate_teaserautoarticlemagazin"
            />
            <flux:form.variable name="Fluidcontent" value="{allowedContentTypes:allowedFluidContentTypes}"/>
          </flux:grid.column>
        </flux:grid.row>
      </flux:grid>
      <flux:field.checkbox
        name="fields.soldOut"
        requestUpdate="true"
        label="LLL:EXT:bb_boilerplate/Resources/Private/Language/locallang.xlf:flux.pageComplexLayout.fields.fields.soldOut"
        displayCond="FIELD:parentRec.doktype:=:{settings.constants.page.doktype.event}"/>

      <flux:field.input
        name="fields.soldOutText"
        label="LLL:EXT:bb_boilerplate/Resources/Private/Language/locallang.xlf:flux.pageComplexLayout.fields.fields.soldOutText"
        displayCond="FIELD:fields.soldOut:REQ:true"/>

      <flux:field.text
        name="fields.titleNotes"
        rows="4"
        label="LLL:EXT:bb_boilerplate/Resources/Private/Language/locallang.xlf:flux.pageComplexLayout.fields.fields.titleNotes"
        displayCond="FIELD:parentRec.doktype:=:{settings.constants.page.doktype.event}"/>
    </flux:form>
  </f:section>


  <f:section name="Default">
    <f:comment><!--Event Press page magic--></f:comment>
    <f:if condition="{page.content_from_pid} > 0">
      <f:variable name="pageOriginal" value="{page}" />
      <f:variable name="page" value="{v:page.info(pageUid:page.content_from_pid)}" />
      <v:variable.set name="fields" value="{flux:form.data(table:'pages', field:'tx_fed_page_flexform', uid:page.uid) -> v:iterator.column(indexKey:'fields') -> v:iterator.first()}" />
    </f:if>

    <!--TYPO3SEARCH_begin-->
    <div class="page-complex-layout page-complex-layout--narrow-left">
      <v:content.render column="10" />
      <div class="container">
        <f:if condition="{v:content.render(column:'10')}">
          <f:else>
            <div class="row">
              <div class="col-xl-9 col-lg-8 col-12 px-lg-0">
                <div class="pl-xl-6 pl-lg-2">
                  <f:render section="Heading" arguments="{_all}" />
                </div>
              </div>
            </div>
          </f:else>
        </f:if>
        <div class="row">
          <div class="col-xl-9 col-lg-8 col-12 px-lg-0">
            <div class="pl-xl-6 pl-lg-2{f:if(condition: '{v:content.render(column:\'20\')}', then:' mb-lg-4 mb-2')}">
              <f:if condition="{v:content.render(column:'10')}">
                <f:render section="Heading" arguments="{_all}" />
              </f:if>
              <div class="page-complex-layout-content {f:if(condition:pageTheme, then:' {pageTheme.cssClass}')}">
                <f:if condition="{pageTheme}">
                  <f:render partial="Content/Theme/Marker" arguments="{themes:'{0:pageTheme}', position:'vertical'}" />
                </f:if>
                <v:content.render column="20" />
              </div>
            </div>
            <v:content.render column="40" />
          </div>
          <div class="col-xl-3 col-lg-4 col-12 mb-lg-6 mb-2 px-0">
            <div class="sidebar">
              <v:content.render column="30" />
              <f:if condition="{pageOriginal}">
                <f:if condition="{settings.constants.page.doktype.event} == {v:page.info(pageUid:pageOriginal.content_from_pid, field:'doktype')}">
                  <v:content.render column="35" />
                </f:if>
              </f:if>
            </div>
          </div>
        </div>
      </div>
      <v:content.render column="0" />
    </div>
    <!--TYPO3SEARCH_end-->
  </f:section>

  <f:section name="Heading">
    <div class="row">
      <div class="col-xl-10 col-12">
        <div class="page-complex-layout-heading{f:if(condition: '{v:content.render(column:\'10\')}', else: ' page-complex-layout-heading--without-header-image')}">
          <div class="container">
            <f:if condition="{page.themes}">
              <f:if condition="{page.doktype} == {settings.constants.page.doktype.event}">
                <pt:event.get eventUid="{page.uid}" language="{page.sys_language_uid}" as="event">
                  <f:render partial="Content/Theme/List" arguments="{themes:event.themes, eventTypes:event.eventTypes}" />
                </pt:event.get>
              </f:if>
            </f:if>
            <div class="mb-md-2 mb-sm-1 mb-half">
              <div class="page-complex-layout-heading-top">
                <f:if condition="{page.suptitle}"><div class="page-complex-layout-heading-suptitle">{page.suptitle}</div></f:if>
                <bb:theme.get as="theme">
                  <h1 class="text-uppercase text-hyphens mb-0{f:if(condition: '"{page.suptitle}" || "{v:content.render(column:\'10\')}"', else: ' pt-md-1 pb-half')}{f:if(condition:theme, then:' text-color-{theme.cssClass}')}">{page.title}</h1>
                </bb:theme.get>
              </div>
              <div class="page-complex-layout-heading-bottom">
                <f:if condition="{page.subtitle}"><div class="page-complex-layout-heading-subtitle">{page.subtitle}</div></f:if>
              </div>
            </div>
            <f:if condition="{page.doktype} == {settings.constants.page.doktype.event}">
              <f:if condition="{fields.soldOut}"><div class="btn disabled btn-lg mb-2">{fields.soldOutText}</div></f:if>
              <f:if condition="{fields.titleNotes}"><p class="page-complex-layout-heading-notes">{fields.titleNotes -> f:format.nl2br()}</p></f:if>
            </f:if>
          </div>
        </div>
      </div>
    </div>
  </f:section>

</div>