{namespace belog=TYPO3\CMS\Belog\ViewHelpers}

<belog:be.addJsFile file="sysext/backend/Resources/Public/JavaScript/tceforms.js" />
<belog:be.addJsFile file="js/extjs/ux/Ext.ux.DateTimePicker.js" />

<belog:be.inlineSettingsArray
	settings="{
		datePickerUSmode: 0,
		dateFormat: {0:settings.dateFormat, 1:'{settings.dateFormat} {settings.timeFormat}'}
	}"
/>

<f:comment>
	This is an ugly workaround.
	The function module in Web->Info already renders a form tag, and there is
	no easy way to circumvent this. The page id is needed for the info module
	that is not extbase based to figure the permissions. Thus, we have to add
	the page Id manually to hint the info module about that.
</f:comment>
<f:if condition="{constraint.isInPageContext}">
	<input type="hidden" name="id" value="{constraint.pageId}" />
</f:if>

<f:form object="{constraint}" action="index" name="constraint">
	<table border="0" cellpadding="0" cellspacing="0">
		<tbody>
			<tr>
				<th>
					<label for="belog-users"><f:translate key="users" /></label>
				</th>
				<td>
					<f:form.select
						property="userOrGroup"
						options="{userGroups}"
						additionalAttributes="{onchange : 'submit()'}"
						id="belog-users"
					/>
				</td>

				<th>
					<label for="belog-max"><f:translate key="max" /></label>
				</th>
				<td>
					<belog:form.translateLabelSelect
						property="number"
						options="{settings.selectableNumberOfLogEntries}"
						optionLabelPrefix="LLL:EXT:belog/Resources/Private/Language/locallang.xlf:"
						additionalAttributes="{onchange : 'submit()'}"
						id="belog-max"
					/>
				</td>

				<f:if condition="{belog:isExtensionLoaded(extensionKey:'workspaces')}">
					<f:then>
						<f:if condition="{showWorkspaceSelector}">
							<f:then>
								<th>
									<label for="belog-workspaces"><f:translate key="workspace" /></label>
								</th>
								<td>
									<f:form.select
										property="workspaceUid"
										options="{workspaces}"
										additionalAttributes="{onchange : 'submit()'}"
										id="belog-workspaces"
									/>
								</td>
							</f:then>
							<f:else>
								<th></th><td></td>
							</f:else>
						</f:if>
					</f:then>
					<f:else>
						<th></th><td></td>
					</f:else>
				</f:if>

				<f:if condition="{constraint.isInPageContext}">
					<f:then>
						<th>
							<label for="belog-depth"><f:translate key="chLog_menuDepth" /></label>
						</th>
						<td>
							<f:form.select
								property="depth"
								options="{pageDepths}"
								additionalAttributes="{onchange : 'submit()'}"
								id="belog-depth"
							/>
						</td>
					</f:then>
					<f:else>
						<th></th><td></td>
					</f:else>
				</f:if>
			</tr>

			<tr>
				<th>
					<label for="belog-time"><f:translate key="time" /></label>
				</th>
				<td>
					<belog:form.translateLabelSelect
						property="timeFrame"
						options="{settings.selectableTimeFrames}"
						optionLabelPrefix="LLL:EXT:belog/Resources/Private/Language/locallang.xlf:"
						additionalAttributes="{onchange : 'submit()'}"
						id="belog-time"
					/>

					<f:comment>
						Date time fields for manual date selection
					</f:comment>
					<f:if condition="{constraint.timeFrame} == 30">
						<br />

						<label for="tceforms-datetimefield-manualDateStart"><f:translate key="LLL:EXT:lang/locallang_common.xlf:from" /></label>&nbsp;
						<f:form.textfield
							property="manualDateStart"
							value="{constraint.manualDateStart -> f:format.date(format:'{settings.dateFormat} {settings.timeFormat}')}"
							id="tceforms-datetimefield-manualDateStart"
							style="margin:4px 2px; padding:1px; vertical-align:middle; width: 115px;"
						/>
						<span
							style="cursor:pointer;"
							id="picker-tceforms-datetimefield-manualDateStart"
							class="t3-icon t3-icon-actions t3-icon-actions-edit t3-icon-edit-pick-date"
						>
							&nbsp;
						</span>

						<label for="tceforms-datetimefield-manualDateStop"><f:translate key="LLL:EXT:lang/locallang_common.xlf:to" /></label>&nbsp;
						<f:form.textfield
							property="manualDateStop"
							value="{constraint.manualDateStop -> f:format.date(format:'{settings.dateFormat} {settings.timeFormat}')}"
							id="tceforms-datetimefield-manualDateStop"
							style="margin:4px 2px; padding:1px; vertical-align:middle; width: 115px;"
						/>
						<span
							style="cursor:pointer;"
							id="picker-tceforms-datetimefield-manualDateStop"
							class="t3-icon t3-icon-actions t3-icon-actions-edit t3-icon-edit-pick-date"
						>
							&nbsp;
						</span>

						<f:form.submit value="{f:translate(key:'set')}" />
					</f:if>
				</td>

				<th>
					<label for="belog-action"><f:translate key="action" /></label>
				</th>
				<td>
					<belog:form.translateLabelSelect
						property="action"
						options="{settings.selectableActions}"
						optionLabelPrefix="LLL:EXT:belog/Resources/Private/Language/locallang.xlf:"
						additionalAttributes="{onchange : 'submit()'}"
						id="belog-action"
					/>
				</td>

				<th>
					<label for="belog-group"><f:translate key="groupByPage" /></label>
				</th>
				<td>
					<f:form.checkbox
						property="groupByPage"
						value="1"
						additionalAttributes="{onchange : 'submit()'}"
						id="belog-group"
					/>
				</td>

				<th></th><td></td>
			</tr>
		</tbody>
	</table>
</f:form>