{% extends "admin/partial/layout_logged_in.html.twig" %}

{% block title %}{{ ta('edit_user', 'Edit User') }}{% endblock %}
{% block selected_page %}users{% endblock %}
{% block selected_sub_page %}user_manage{% endblock %}

{% block body %}
    <script>
        $(function () {
        $('#expiry_date').daterangepicker({
        singleDatePicker: true,
                calender_style: "picker_1",
                autoUpdateInput: false,
                locale: {
                format: 'DD/MM/YYYY'
                }
        }, function (chosen_date) {
        $('#expiry_date').val(chosen_date.format('DD/MM/YYYY'));
        });
        });
        function checkExpiryDate()
        {
        userType = $('#account_type option:selected').val();
        if (userType > 1)
        {
        // default to 1 year
        $('#expiry_date').val('{{ defaultExpiryDate }}');
        }
        }

        function createRandomKey(eleId)
        {
        var text = "";
        var possible = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";
        for (var i = 0; i < 64; i++)
                text += possible.charAt(Math.floor(Math.random() * possible.length));
        $('#' + eleId).val(text);
        }
    </script>

    <div class="right_col" role="main">
        <div class="">
            <div class="page-title">
                <div class="title_left">
                    <h3>{{ ta('user_details', 'User Details') }}</h3>
                </div>
            </div>
            <div class="clearfix"></div>

            {{ msg_page_notifications|raw }}

            <div class="row">
                <div class="col-md-12 col-sm-12 col-xs-12">
                    <form action="{{ ADMIN_WEB_ROOT }}/user_edit/{{ user.id }}" method="POST" class="form-horizontal form-label-left" enctype="multipart/form-data">
                        <div class="x_panel">
                            <div class="x_title">
                                <h2>Account Details</h2>
                                <div class="clearfix"></div>
                            </div>
                            <div class="x_content">
                                <p>{{ ta('information_about_the_account', 'Information about the account.') }}</p>
                                <br/>

                                <div class="form-group">
                                    <label class="control-label col-md-3 col-sm-3 col-xs-12" for="username">{{ ta('username', 'Username') }}:
                                    </label>
                                    <div class="col-md-6 col-sm-6 col-xs-12">
                                        <input id="username" name="username" class="form-control" required="required" type="text" value="{{ username }}" READONLY/>
                                    </div>
                                </div>

                                <div class="form-group">
                                    <label class="control-label col-md-3 col-sm-3 col-xs-12" for="account_status">{{ ta('account_status', 'Account Status') }}:
                                    </label>
                                    <div class="col-md-4 col-sm-4 col-xs-12">
                                        <select name="account_status" id="account_status" class="form-control" {{ current_user_id == user.id ? 'disabled' : ''}}>
                                            {% for accountStatusDetail in accountStatusDetails %}
                                                <option value="{{ accountStatusDetail }}"{{ account_status == accountStatusDetail?' SELECTED':'' }}>{{ accountStatusDetail|title }}</option>
                                            {% endfor %}
                                        </select>
                                    </div>
                                </div>

                                <div class="form-group">
                                    <label class="control-label col-md-3 col-sm-3 col-xs-12" for="account_type">{{ ta('account_type', 'Account Type') }}:
                                    </label>
                                    <div class="col-md-6 col-sm-6 col-xs-12">
                                        <select name="account_type" id="account_type" class="form-control" onChange="checkExpiryDate();">
                                            {% for accountTypeDetail in accountTypeDetails %}
                                                <option value="{{ accountTypeDetail['id'] }}"{{ account_type == accountTypeDetail['id']?' SELECTED':'' }}>{{ accountTypeDetail['label']|title }}</option>
                                            {% endfor %}
                                        </select>
                                    </div>
                                </div>

                                <div class="form-group paid_account_expiry">
                                    <label class="control-label col-md-3 col-sm-3 col-xs-12" for="expiry_date">{{ ta('paid_expiry_date', 'Paid Expiry Date') }}:
                                    </label>
                                    <div class="col-md-6 col-sm-6 col-xs-12">
                                        <input id="expiry_date" name="expiry_date" type="text" class="form-control" value="{{ expiry_date }}"/>
                                        <span class="text-muted">{{ ta('format_dd_mm_yyy_leave_empty_to_never_expire', 'Format: dd/mm/yyyy. Maximum 19th January 2038. Leave empty to never expire the account.') }}</span>
                                    </div>
                                </div>

                                <div class="form-group">
                                    <label class="control-label col-md-3 col-sm-3 col-xs-12" for="storage_limit">{{ ta('filesize_storage_limit', 'Filesize Storage Limit') }}:
                                    </label>
                                    <div class="col-md-5 col-sm-5 col-xs-12">
                                        <div class="input-group">
                                            <input id="storage_limit" name="storage_limit" placeholder="i.e. 1073741824" type="text" class="form-control" value="{{ storage_limit }}"/>
                                            <span class="input-group-addon">{{ ta('bytes_lower', 'bytes') }}</span>
                                        </div>
                                        <span class="text-muted">{{ ta('optional_in_bytes_overrides_account_type_limits', 'Optional in bytes. Overrides account type limits. 1073741824 = 1GB. Use zero for unlimited.') }}</span>
                                    </div>
                                </div>

                                <div class="form-group">
                                    <label class="control-label col-md-3 col-sm-3 col-xs-12" for="remainingBWDownload">{{ ta('download_allowance', 'Download Allowance') }}:
                                    </label>
                                    <div class="col-md-5 col-sm-5 col-xs-12">
                                        <div class="input-group">
                                            <input id="remainingBWDownload" name="remainingBWDownload" placeholder="i.e. 1073741824" type="text" class="form-control" value="{{ remainingBWDownload }}"/>
                                            <span class="input-group-addon">{{ ta('bytes_lower', 'bytes') }}</span>
                                        </div>
                                        <span class="text-muted">{{ ta('optional_in_bytes_generally_left_blank_use_zero_for_unlimited', 'Optional in bytes. Generally left blank. Use zero for unlimited.') }}</span>
                                    </div>
                                </div>
                            </div>
                        </div>

                        <div class="x_panel">
                            <div class="x_title">
                                <h2>{{ ta('user_details', 'User Details') }}</h2>
                                <div class="clearfix"></div>
                            </div>
                            <div class="x_content">
                                <p>{{ ta('details_about_the_user', 'Details about the user.') }}</p>
                                <br/>

                                <div class="form-group">
                                    <label class="control-label col-md-3 col-sm-3 col-xs-12" for="title">{{ ta('title', 'Title') }}:
                                    </label>
                                    <div class="col-md-4 col-sm-4 col-xs-12">
                                        <select name="title" id="title" class="form-control">
                                            <option value="">- {{ ta('not_set', 'not set') }} -</option>
                                            {% for titleItem in titleItems %}
                                                <option value="{{ titleItem }}"{{ title == titleItem?' SELECTED':'' }}>{{ titleItem|title }}</option>
                                            {% endfor %}
                                        </select>
                                    </div>
                                </div>

                                <div class="form-group">
                                    <label class="control-label col-md-3 col-sm-3 col-xs-12" for="first_name">{{ ta('first_name', 'First Name') }}:
                                    </label>
                                    <div class="col-md-6 col-sm-6 col-xs-12">
                                        <input id="first_name" name="first_name" type="text" class="form-control" value="{{ first_name }}"/>
                                    </div>
                                </div>

                                <div class="form-group">
                                    <label class="control-label col-md-3 col-sm-3 col-xs-12" for="last_name">{{ ta('last_name', 'Last Name') }}:
                                    </label>
                                    <div class="col-md-6 col-sm-6 col-xs-12">
                                        <input id="last_name" name="last_name" type="text" class="form-control" value="{{ last_name }}"/>
                                    </div>
                                </div>

                                <div class="form-group">
                                    <label class="control-label col-md-3 col-sm-3 col-xs-12" for="email_address">{{ ta('email_address', 'Email Address') }}:
                                    </label>
                                    <div class="col-md-6 col-sm-6 col-xs-12">
                                        <input id="email_address" name="email_address" type="text" class="form-control" value="{{ email_address }}"/>
                                    </div>
                                </div>                            
                            </div>
                        </div>

                        <div class="x_panel">
                            <div class="x_title">
                                <h2>{{ ta('reset_password', 'Reset Password') }}</h2>
                                <div class="clearfix"></div>
                            </div>
                            <div class="x_content">
                                <p>{{ ta('reset_the_user_password_leave_blank_to_keep_existing', 'Reset the user password. Leave blank to keep the existing.') }}</p>
                                <br/>

                                <div class="form-group">
                                    <label class="control-label col-md-3 col-sm-3 col-xs-12" for="password">{{ ta('password', 'Password') }}:
                                    </label>
                                    <div class="col-md-6 col-sm-6 col-xs-12">
                                        <input id="password" name="user_password" class="form-control" type="password" value="{{ user_password }}"/>
                                    </div>
                                </div>

                                <div class="form-group">
                                    <label class="control-label col-md-3 col-sm-3 col-xs-12" for="confirm_password">{{ ta('confirm_password', 'Confirm Password') }}:
                                    </label>
                                    <div class="col-md-6 col-sm-6 col-xs-12">
                                        <input id="confirm_password" name="confirm_password" class="form-control" type="password" value="{{ confirm_password }}"/>
                                    </div>
                                </div>
                            </div>
                        </div>

                        <div class="x_panel">
                            <div class="x_title">
                                <h2>{{ ta('account_avatar', 'Account Avatar') }}</h2>
                                <div class="clearfix"></div>
                            </div>
                            <div class="x_content">
                                <p>{{ ta('if_an_account_avatar_is_supported_on_the_site_set_it_here', 'If an account avatar is supported on the site theme, set it here.') }}</p>
                                <br/>

                                <div class="form-group">
                                    <label for="avatar" class="control-label col-md-3 col-sm-3 col-xs-12">{{ ta('select_file_jpg_png_or_gif', 'Select File (jpg, png or gif)') }}</label>
                                    <div class="col-md-6 col-sm-6 col-xs-12">
                                        <input type="file" class="form-control" id="avatar" name="avatar" {{ ta('select_file_jpg_png_or_gif', 'Select File (jpg, png or gif)')|json_encode()|raw }}>
                                        {% if hasAvatar == true %}
                                            <br/>
                                            <img class="img-square settings-avatar pull-right" src="{{ ADMIN_WEB_ROOT }}/ajax/account_view_avatar?userId={{ user.id }}&width=70&amp;height=70">
                                            <div class="checkbox pull-left">
                                                <label>
                                                    <input type="checkbox" id="removeAvatar" name="removeAvatar" value="1"/>{{ ta('remove_avatar', 'Remove avatar') }}
                                                </label>
                                            </div>
                                        {% endif %}
                                    </div>
                                </div>
                            </div>
                        </div>

                        <div class="x_panel">
                            <div class="x_title">
                                <h2>{{ ta('2fa', '2FA') }}</h2>
                                <div class="clearfix"></div>
                            </div>
                            <div class="x_content">
                                <p>{{ ta('whether_2fa_is_enabled_for_the_user', 'Whether 2FA is enabled for the user.') }}</p>
                                <br/>
                                
                                <div class="form-group">
                                    <label class="control-label col-md-3 col-sm-3 col-xs-12">{{ ta('2fa_status', '2FA Status') }}:</label>
                                    <div class="col-md-6 col-sm-6 col-xs-12" style="margin-top: 8px;">
                                        {{ login_2fa_enabled == 1 ? ta('enabled', 'Enabled') : ta('disabled', 'Disabled') }}
                                    </div>
                                </div>

                                {% if login_2fa_enabled == 1 %}
                                <div class="form-group">
                                    <label class="control-label col-md-3 col-sm-3 col-xs-12"></label>
                                    <div class="col-md-5 col-sm-5 col-xs-12">
                                        <div class="input-group">
                                            <button class="btn btn-secondary" type="button" onClick="if(confirm('{{ ta('are_you_sure_you_want_to_disable_2fa_for_this_user', 'Are you sure you want to disable 2FA for this user?') }}')) { window.location='{{ ADMIN_WEB_ROOT }}/user_edit/{{ user.id }}?disable_2fa=1'; }">{{ ta('disable', 'Disable') }}</button>
                                        </div>
                                    </div>
                                </div>
                                {% endif %}
                            </div>
                        </div>
                                            
                        <div class="x_panel">
                            <div class="x_title">
                                <h2>{{ ta('file_upload_api_keys', 'File Upload API Keys') }}</h2>
                                <div class="clearfix"></div>
                            </div>
                            <div class="x_content">
                                <p>{{ ta('set_or_generate_api_keys', 'Set or generate API keys.') }}</p>
                                <br/>

                                <div class="form-group">
                                    <label class="control-label col-md-3 col-sm-3 col-xs-12" for="key1">{{ ta('key_1', 'Key 1') }}:
                                    </label>
                                    <div class="col-md-5 col-sm-5 col-xs-12">
                                        <div class="input-group">
                                            <input id="key1" name="key1" class="form-control" type="text" value="{{ key1 }}"/>
                                            <span class="input-group-btn">
                                                <button class="btn btn-secondary" type="button" onClick="createRandomKey('key1'); return false;">{{ ta('generate', 'Generate') }}</button>
                                            </span>
                                        </div>
                                    </div>
                                </div>

                                <div class="form-group">
                                    <label class="control-label col-md-3 col-sm-3 col-xs-12" for="key2">{{ ta('key_2', 'Key 2') }}:
                                    </label>
                                    <div class="col-md-5 col-sm-5 col-xs-12">
                                        <div class="input-group">
                                            <input id="key2" name="key2" class="form-control" type="text" value="{{ key2 }}"/>
                                            <span class="input-group-btn">
                                                <button class="btn btn-secondary" type="button" onClick="createRandomKey('key2'); return false;">{{ ta('generate', 'Generate') }}</button>
                                            </span>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>

                        <div class="x_panel">
                            <div class="x_title">
                                <h2>{{ ta('other_options', 'Other Options') }}</h2>
                                <div class="clearfix"></div>
                            </div>
                            <div class="x_content">
                                <p>{{ ta('server_upload_override', 'Server upload override.') }}</p>
                                <br/>

                                <div class="form-group">
                                    <label class="control-label col-md-3 col-sm-3 col-xs-12" for="upload_server_override">{{ ta('upload_server_override', 'Upload Server Override') }}:
                                    </label>
                                    <div class="col-md-4 col-sm-4 col-xs-12">
                                        <select name="upload_server_override" id="upload_server_override" class="form-control">
                                            <option value="">- {{ ta('none_default', 'none (default)') }} -</option>
                                            {% for serverDetail in serverDetails %}
                                                <option value="{{ serverDetail['id'] }}"{{ upload_server_override == serverDetail['id']?' SELECTED':'' }}>{{ serverDetail['serverLabel'] }}</option>
                                            {% endfor %}
                                        </select>
                                        <span class="text-muted">{{ ta('useful_for_testing_new_servers_for_a_specific_user', 'Useful for testing new servers for a specific user. Leave as \'none\' to use the global settings.') }}</span>
                                    </div>
                                </div>

                                <div class="ln_solid"></div>
                                <div class="form-group">
                                    <div class="col-md-6 col-sm-6 col-xs-12 col-md-offset-3">
                                        <button type="button" class="btn btn-default" onClick="window.location = '{{ ADMIN_WEB_ROOT }}/user_manage';">{{ ta('cancel', 'Cancel') }}</button>
                                        <button type="submit" class="btn btn-primary">{{ ta('update_user', 'Update User') }}</button>
                                    </div>
                                </div>
                            </div>
                        </div>

                        <input name="submitted" type="hidden" value="1"/>
                        <input name="id" type="hidden" value="{{ user.id }}"/>
                    </form>
                </div>
            </div>
        </div>
    </div>
{% endblock %}