<html
    xmlns:f="http://typo3.org/ns/TYPO3/CMS/Fluid/ViewHelpers"
    data-namespace-typo3-fluid="true"
>

<f:layout name="Module" />

<f:section name="Content">

    <f:be.pageRenderer
        includeJavaScriptModules="{
            0: '@typo3/beuser/permissions.js',
            1: '@typo3/backend/tooltip.js'
        }"
    />

    <h1>
        <f:translate key="LLL:EXT:beuser/Resources/Private/Language/locallang_mod_permission.xlf:permissions" />:
        <f:translate key="LLL:EXT:beuser/Resources/Private/Language/locallang_mod_permission.xlf:Edit" />
    </h1>

    <f:comment><!-- {base} is defined as it's *required* for mathematical operations in Fluid --></f:comment>
    <f:variable name="base" value="2" />

    <form action="{formAction}" method="post" name="editform" id="PermissionControllerEdit">

        <div class="row row-cols-auto align-items-end g-3">
            <div class="col">
                <label for="selectOwner"><f:translate key="LLL:EXT:beuser/Resources/Private/Language/locallang_mod_permission.xlf:Owner" /></label>
                <select class="form-select" name="data[pages][{id}][perms_userid]" id="selectOwner">
                    <f:for each="{beUserData}" key="userId" as="user">
                        <option value="{userId}" {f:if(condition: '{userId} == {currentBeUser}', then: 'selected')}>{user}</option>
                    </f:for>
                </select>
            </div>
            <div class="col">
                <label for="selectGroup"><f:translate key="LLL:EXT:beuser/Resources/Private/Language/locallang_mod_permission.xlf:Group" /></label>
                <f:if condition="{f:count(subject:beGroupData)} > 1">
                    <f:then>
                        <select class="form-select" name="data[pages][{id}][perms_groupid]" id="selectGroup">
                            <f:for each="{beGroupData}" key="groupId" as="group">
                                <option value="{groupId}" {f:if(condition: '{groupId} == {currentBeGroup}', then: 'selected')}>{group}</option>
                            </f:for>
                        </select>
                    </f:then>
                    <f:else>
                        <div class="alert alert-notice"><f:translate key="LLL:EXT:beuser/Resources/Private/Language/locallang_mod_permission.xlf:noGroups" /></div>
                    </f:else>
                </f:if>
            </div>
            <div class="col">
                <label for="recursionLevel"><f:translate key="LLL:EXT:beuser/Resources/Private/Language/locallang_mod_permission.xlf:Depth" /></label>
                <select class="form-select" name="mirror[pages][{id}]" id="recursionLevel">
                    <f:for each="{recursiveSelectOptions}" key="depth" as="depthLabel">
                        <option value="{depth}" {f:if(condition: '{depth} == {currentBeUser}', then: 'selected')}>{depthLabel}</option>
                    </f:for>
                </select>
            </div>
        </div>

        <div class="panel panel-default mt-3">
            <div class="table-fit">
                <table class="table table-striped table-hover" id="typo3-permissionMatrix">
                    <thead>
                        <tr>
                            <th></th>
                            <th><f:translate key="LLL:EXT:beuser/Resources/Private/Language/locallang_mod_permission.xlf:1" /></th>
                            <th><f:translate key="LLL:EXT:beuser/Resources/Private/Language/locallang_mod_permission.xlf:16" /></th>
                            <th><f:translate key="LLL:EXT:beuser/Resources/Private/Language/locallang_mod_permission.xlf:2" /></th>
                            <th><f:translate key="LLL:EXT:beuser/Resources/Private/Language/locallang_mod_permission.xlf:4" /></th>
                            <th><f:translate key="LLL:EXT:beuser/Resources/Private/Language/locallang_mod_permission.xlf:8" /></th>
                        </tr>
                    </thead>
                    <tbody>
                        <tr>
                            <td><strong><f:translate key="LLL:EXT:beuser/Resources/Private/Language/locallang_mod_permission.xlf:Owner" /></strong></td>
                            <td><input type="checkbox" name="check[perms_user][]" value="{base ^ 0}" data-check-change-permissions="check[perms_user],data[pages][{id}][perms_user]" /></td>
                            <td><input type="checkbox" name="check[perms_user][]" value="{base ^ 4}" data-check-change-permissions="check[perms_user],data[pages][{id}][perms_user]" /></td>
                            <td><input type="checkbox" name="check[perms_user][]" value="{base ^ 1}" data-check-change-permissions="check[perms_user],data[pages][{id}][perms_user]" /></td>
                            <td><input type="checkbox" name="check[perms_user][]" value="{base ^ 2}" data-check-change-permissions="check[perms_user],data[pages][{id}][perms_user]" /></td>
                            <td><input type="checkbox" name="check[perms_user][]" value="{base ^ 3}" data-check-change-permissions="check[perms_user],data[pages][{id}][perms_user]" /></td>
                        </tr>
                        <tr>
                            <td><strong><f:translate key="LLL:EXT:beuser/Resources/Private/Language/locallang_mod_permission.xlf:Group" /></strong></td>
                            <td><input type="checkbox" name="check[perms_group][]" value="{base ^ 0}" data-check-change-permissions="check[perms_group],data[pages][{id}][perms_group]" /></td>
                            <td><input type="checkbox" name="check[perms_group][]" value="{base ^ 4}" data-check-change-permissions="check[perms_group],data[pages][{id}][perms_group]" /></td>
                            <td><input type="checkbox" name="check[perms_group][]" value="{base ^ 1}" data-check-change-permissions="check[perms_group],data[pages][{id}][perms_group]" /></td>
                            <td><input type="checkbox" name="check[perms_group][]" value="{base ^ 2}" data-check-change-permissions="check[perms_group],data[pages][{id}][perms_group]" /></td>
                            <td><input type="checkbox" name="check[perms_group][]" value="{base ^ 3}" data-check-change-permissions="check[perms_group],data[pages][{id}][perms_group]" /></td>
                        </tr>
                        <tr>
                            <td><strong><f:translate key="LLL:EXT:beuser/Resources/Private/Language/locallang_mod_permission.xlf:Everybody" /></strong></td>
                            <td><input type="checkbox" name="check[perms_everybody][]" value="{base ^ 0}" data-check-change-permissions="check[perms_everybody],data[pages][{id}][perms_everybody]" /></td>
                            <td><input type="checkbox" name="check[perms_everybody][]" value="{base ^ 4}" data-check-change-permissions="check[perms_everybody],data[pages][{id}][perms_everybody]" /></td>
                            <td><input type="checkbox" name="check[perms_everybody][]" value="{base ^ 1}" data-check-change-permissions="check[perms_everybody],data[pages][{id}][perms_everybody]" /></td>
                            <td><input type="checkbox" name="check[perms_everybody][]" value="{base ^ 2}" data-check-change-permissions="check[perms_everybody],data[pages][{id}][perms_everybody]" /></td>
                            <td><input type="checkbox" name="check[perms_everybody][]" value="{base ^ 3}" data-check-change-permissions="check[perms_everybody],data[pages][{id}][perms_everybody]" /></td>
                        </tr>
                    </tbody>
                </table>
            </div>
        </div>

        <input type="hidden" name="data[pages][{id}][perms_user]" value="{pageInfo.perms_user}" data-checkbox-group="check[perms_user]" />
        <input type="hidden" name="data[pages][{id}][perms_group]" value="{pageInfo.perms_group}" data-checkbox-group="check[perms_group]" />
        <input type="hidden" name="data[pages][{id}][perms_everybody]" value="{pageInfo.perms_everybody}" data-checkbox-group="check[perms_everybody]" />
        <input type="hidden" name="depth" value="{depth}" />
        <input type="hidden" name="returnUrl" value="{returnUrl}" />
    </form>

    <h3><f:translate key="LLL:EXT:beuser/Resources/Private/Language/locallang_mod_permission.xlf:Legend" /></h3>
    <p>
        <strong><f:translate key="LLL:EXT:beuser/Resources/Private/Language/locallang_mod_permission.xlf:1" /></strong>: <f:translate key="LLL:EXT:beuser/Resources/Private/Language/locallang_mod_permission.xlf:1_t" /> <br />
        <strong><f:translate key="LLL:EXT:beuser/Resources/Private/Language/locallang_mod_permission.xlf:16" /></strong>: <f:translate key="LLL:EXT:beuser/Resources/Private/Language/locallang_mod_permission.xlf:16_t" /> <br />
        <strong><f:translate key="LLL:EXT:beuser/Resources/Private/Language/locallang_mod_permission.xlf:2" /></strong>: <f:translate key="LLL:EXT:beuser/Resources/Private/Language/locallang_mod_permission.xlf:2_t" /> <br />
        <strong><f:translate key="LLL:EXT:beuser/Resources/Private/Language/locallang_mod_permission.xlf:4" /></strong>: <f:translate key="LLL:EXT:beuser/Resources/Private/Language/locallang_mod_permission.xlf:4_t" /> <br />
        <strong><f:translate key="LLL:EXT:beuser/Resources/Private/Language/locallang_mod_permission.xlf:8" /></strong>: <f:translate key="LLL:EXT:beuser/Resources/Private/Language/locallang_mod_permission.xlf:8_t" />
    </p>
    <p><f:translate key="LLL:EXT:beuser/Resources/Private/Language/locallang_mod_permission.xlf:def" /></p>

</f:section>

</html>
