<?php
defined('BASEPATH') OR exit('No direct script access allowed');
?>
    <section class="container">
        <div class="jumbotron">
            <div class="row">
                <h1 class="center" id="title"><?= lang('encrypter_title') ?></h1>
                <p class="lead center" id="subtitle"><?= lang('encrypter_description') ?></p>
                <form class="form" action="" id="caesar-encrypt">
                    <div class="col-md-2 col-xs-12">
                        <label class="radio">
                            <input type="radio" name="encryptDecrypt" id="encrypt" value="<?= lang('encrypt'); ?>" checked> <?= lang('encrypt') ?>
                        </label>
                        <label class="radio">
                            <input type="radio" name="encryptDecrypt" id="decrypt" value="<?= lang('decrypt'); ?>"> <?= lang('decrypt'); ?>
                        </label>
                        <div class="form-group">
                            <label for="key"><?= lang('encrypter_shiftkey') ?></label>
                            <input type="number" class="form-control input-encrypter" name="key" id="shift-key" rows="1" placeholder="<?= lang('encrypter_shiftkey') ?>" value="5" maxlength="15" aria-describedby="shift-help" required>
                            <span id="shift-help" class="help-block"><?= lang('encrypter_shifthelp') ?></span>
                        </div>
                    </div>
                    <div class="col-md-10 col-xs-12">
                        <div class="form-group">
                            <label for="text" id="text-input-label"><?= lang('encrypter_text') ?></label>
                            <textarea class="form-control input-encrypter" name="text" id="text-input" rows="5" placeholder="<?= lang('encrypter_text2') ?>"></textarea>
                        </div>
                        <div class="form-group">
                            <label for="output" id="text-output-label"><?= lang('encrypter_output') ?></label>
                            <textarea id="text-output" name="output" rows="5" class="form-control output-encrypter" placeholder="<?= lang('encrypter_output') ?>" readonly></textarea>
                        </div>
                    </div>
                </form>
            </div>
        </div>
</section>