<?php
    defined('BASEPATH') OR exit('No direct script access allowed');
?>
<section class="container">
    <h1 class="center" id="title"><?= lang('caesar_title') ?></h1>
    <p class="lead center" id="subtitle"><?= lang('caesar_description') ?></p>
    <div class="row col">
        <form class="form w-100" action="" id="caesar-encrypt">
            <div class="row">
                <div class="col-md-4 col-xs-12">
                    <label class="radio">
                        <input type="radio" name="encryptDecrypt" id="encrypt" value="<?= lang('encrypter_encrypt'); ?>"
                               checked> <?= lang('encrypter_encrypt') ?>
                    </label>
                    <label class="radio">
                        <input type="radio" name="encryptDecrypt" id="decrypt"
                               value="<?= lang('encrypter_decrypt'); ?>"> <?= lang('encrypter_decrypt'); ?>
                    </label>
                    <div class="form-group">
                        <label for="key"><?= lang('caesar_shiftkey') ?></label>
                        <input type="number" class="form-control input-encrypter" name="key" id="shift-key"
                               placeholder="<?= lang('caesar_shiftkey') ?>" value="5" maxlength="15"
                               aria-describedby="shift-help" required>
                        <span id="shift-help" class="help-block"><?= lang('caesar_shifthelp') ?></span>
                    </div>
                </div>
                <div class="col-md-8 col-xs-12">
                    <div class="form-group">
                        <label for="text" id="text-input-label"><?= lang('encrypter_unencrypted') ?></label>
                        <textarea class="form-control input-encrypter" name="text" id="text-input" rows="5"
                                  placeholder="<?= lang('encrypter_input_plc') ?>"></textarea>
                    </div>
                    <div class="form-group">
                        <label for="output" id="text-output-label"><?= lang('encrypter_encrypted') ?></label>
                        <textarea id="text-output" name="output" rows="5" class="form-control output-encrypter"
                                  placeholder="<?= "" ?>" readonly></textarea>
                    </div>
                </div>
            </div>
        </form>
    </div>
</section>