<?php

declare(strict_types=1);

use Fisharebest\Webtrees\Http\RequestHandlers\ControlPanel;
use Fisharebest\Webtrees\Http\RequestHandlers\UserAddAction;
use Fisharebest\Webtrees\Http\RequestHandlers\UserListPage;
use Fisharebest\Webtrees\I18N;
use Fisharebest\Webtrees\View;

/**
 * @var string $email
 * @var string $real_name
 * @var string $title
 * @var string $username
 */

?>

<?= view('components/breadcrumbs', ['links' => [
    route(ControlPanel::class) => I18N::translate('Control panel'),
    route(UserListPage::class) => I18N::translate('User administration'),
    $title,
]]) ?>

<h1><?= $title ?></h1>

<form method="post" action="<?= e(route(UserAddAction::class)) ?>" class="form-horizontal" autocomplete="off">
    <!-- REAL NAME -->
    <div class="row mb-3">
        <label class="col-sm-3 col-form-label" for="real_name">
            <?= I18N::translate('Real name') ?>
        </label>
        <div class="col-sm-9">
            <input class="form-control" type="text" id="real_name" name="real_name" required="required" maxlength="64" value="<?= e($real_name) ?>" dir="auto">
            <div class="form-text">
                <?= I18N::translate('This is your real name, as you would like it displayed on screen.') ?>
            </div>
        </div>
    </div>

    <!-- USER NAME -->
    <div class="row mb-3">
        <label class="col-sm-3 col-form-label" for="username">
            <?= I18N::translate('Username') ?>
        </label>
        <div class="col-sm-9">
            <input class="form-control" type="text" id="username" name="username" required="required" maxlength="32" value="<?= e($username) ?>" dir="auto">
            <div class="form-text">
                <?= I18N::translate('Usernames are case-insensitive and ignore accented letters, so that “chloe”, “chloë”, and “Chloe” are considered to be the same.') ?>
            </div>
        </div>
    </div>

    <!-- PASSWORD -->
    <div class="row mb-3">
        <label class="col-sm-3 col-form-label" for="password">
            <?= I18N::translate('Password') ?>
        </label>
        <div class="col-sm-9">
            <input class="form-control" type="password" id="password" name="password" pattern = ".{8,}" placeholder="<?= I18N::plural('Use at least %s character.', 'Use at least %s characters.', 8, I18N::number(8)) ?>" required="required" autocomplete="new-password" data-wt-show-password-text="<?= e(I18N::translate('show')) ?>" data-wt-show-password-title="<?= e(I18N::translate('Show password')) ?>" data-wt-hide-password-text="<?= e(I18N::translate('hide')) ?>" data-wt-hide-password-title="<?= e(I18N::translate('Hide password')) ?>">
            <div class="form-text">
                <?= I18N::translate('Passwords must be at least 8 characters long and are case-sensitive, so that “secret” is different from “SECRET”.') ?>
            </div>
        </div>
    </div>

    <!-- EMAIL ADDRESS -->
    <div class="row mb-3">
        <label class="col-sm-3 col-form-label" for="email">
            <?= I18N::translate('Email address') ?>
        </label>
        <div class="col-sm-9">
            <input class="form-control" type="email" id="email" name="email" required="required" maxlength="64" value="<?= e($email) ?>">
            <div class="form-text">
                <?= I18N::translate('This email address will be used to send password reminders, website notifications, and messages from other family members who are registered on the website.') ?>
            </div>
        </div>
    </div>

    <div class="row mb-3">
        <div class="offset-sm-3 col-sm-9">
            <button type="submit" class="btn btn-primary">
                <?= I18N::translate('save') ?>
            </button>
        </div>
    </div>

    <?= csrf_field() ?>
</form>

<?php View::push('javascript') ?>
<script>
  function regex_quote(str) {
    return str.replace(/[\\.?+*()[\]{}|]/g, "\\$&");
  }
</script>
<?php View::endpush() ?>
