{namespace v=Tx_Vhs_ViewHelpers}
{namespace flux=Tx_Flux_ViewHelpers}
{namespace mot=TYPO3\CMS\Speciality\ViewHelpers}
<f:layout name="FCE" />
<div xmlns="http://www.w3.org/1999/xhtml"
     xmlns:flux="http://fedext.net/ns/flux/ViewHelpers"
     xmlns:v="http://fedext.net/ns/vhs/ViewHelpers"
     xmlns:f="http://typo3.org/ns/fluid/ViewHelpers">

	<f:section name="Configuration">
		<flux:flexform wizardTab="MOT-PARA" id="mot-chapterindex" label="Index de rubrique" description="Liste d'entrées de sous rubriques (2 par ligne)" icon="../typo3conf/ext/speciality/Resources/Public/Backend/FCE/PARA-Simple.png">

			<flux:flexform.sheet name="display" label="Display">
				<flux:flexform.section name="items" label="Elements">
					<flux:flexform.object name="item" label="Element">
						<flux:flexform.field.input name="left_entry" label="Lien vers l'entrée de gauche" eval="trim">
							<flux:flexform.field.wizard.link />
						</flux:flexform.field.input>
						<flux:flexform.field.input name="left_title" label="Titre de l'entrée de gauche" />
						<flux:flexform.field.input name="left_image" label="Image de l'entrée de gauche" eval="trim">
							<flux:flexform.field.wizard.link />
						</flux:flexform.field.input>
						<flux:flexform.field.input name="right_entry" label="Lien vers l'entrée de droite" eval="trim">
							<flux:flexform.field.wizard.link />
						</flux:flexform.field.input>
						<flux:flexform.field.input name="right_title" label="Titre de l'entrée de droite" />
						<flux:flexform.field.input name="right_image" label="Image de l'entrée de droite" eval="trim">
							<flux:flexform.field.wizard.link />
						</flux:flexform.field.input>
					</flux:flexform.object>
				</flux:flexform.section>
			</flux:flexform.sheet>

		</flux:flexform>
	</f:section>

	<f:section name="Preview">
		<ul>
			<f:for each="{items}" as="item" iteration="iteration">
				<li>{item.item.left_title} | {item.item.right_title}</li>
			</f:for>
		</ul>
	</f:section>

	<f:section name="Main">
		<ul class="chapter-index">
			<f:for each="{items}" as="item">
				<li class="item-left">
					<f:if condition="{item.item.left_entry}">
						<mot:link.page pageUid="{item.item.left_entry}" title="{item.item.left_title}">
							<f:image src="{item.item.left_image}" title="{item.item.left_title}" alt="{item.item.left_title}" width="340" height="135" />
							<span>{item.item.left_title}</span>
						</mot:link.page>
					</f:if>
				</li>
				<li class="item-right">
					<f:if condition="{item.item.right_entry}">
						<mot:link.page pageUid="{item.item.right_entry}" title="{item.item.right_title}">
							<f:image src="{item.item.right_image}" title="{item.item.right_title}" alt="{item.item.right_title}" width="340" height="135" />
							<span>{item.item.right_title}</span>
						</mot:link.page>
					</f:if>
				</li>
			</f:for>
		</ul>
	</f:section>
</div>