<?php
    $page = "md5-encoder";
    include_once('includes/header.php');
    $normal_string = "";
    if(isset($_POST['input_text'])){
        $normal_string = $_POST['input_text'];
        $converted_string = md5($normal_string);
    }
?>
<div class="row">
<div class="mt-2 mb-2 col-md-2">

</div>
<div class="col-md-7 mt-2 mb-2">
    <form action="" method="POST">
        <h1><?php echo $title; ?></h1>
        <div class="card">
            <div class="card-body">
                <div class="mb-3">
                    <label for="exampleFormControlTextarea1" class="form-label">Enter String Below</label>
                    <textarea class="form-control" id="exampleFormControlTextarea1" rows="6" name="input_text"><?php echo $normal_string; ?></textarea>
                </div>
                <div class="text-end">
                    <button type="submit" class="btn btn-outline-success">Convert</button>
                </div>
            </div>
        </div>
    </form>
    
    <?php if(isset($converted_string)){ ?>
    <div class="card">
        <div class="card-body">
            <div class="mb-3">
                <table class="table table-bordered">
                <tr>
                    <td class="bg-light">MD5 Hash String</td>
                    <td><?php echo $converted_string; ?></td>
                    <textarea name="md5" id="md5" style="opacity: 0.1; height: 0; position:absolute; z-index: -1;" ><?php echo $converted_string; ?></textarea>
                    <td><button type="button" class="btn btn-dark" onclick="copyText()">Copy</button></td>
                </tr>

                </table>
            </div>
        </div>
    </div>
        <script>
            function copyText() {
                var copyText = document.getElementById("md5");
                copyText.select();
                document.execCommand("Copy");
            }
        </script>
    <?php } ?>
    
    <div class="card mt-3">
        <div class="card-header">
            What is MD5?
        </div>
            <div class="card-body">
                <p class="card-text">MD5 is a one way cryptographic function that converts string or message of any length as an input and returns a fixed length hashed string (128 bits or 16 bytes). </p>
            </div>
    </div>
    <p class="mt-2"> Also Try: <a href="https://geekyhumans.com/tools/url-decode"><span class="badge text-bg-warning">URL Decoder</span></a> <a href="https://geekyhumans.com/tools/url-encode"><span class="badge text-bg-primary">URL Encoder</span></a> <a href="https://geekyhumans.com/tools/image-metadata-viewer"><span class="badge text-bg-primary">Image Metadata Viewer</span></a></p>
    
<div class="mt-2 mb-2 col-md-3">

</div>
</div>
</div>

<?php
    include_once('includes/footer.php');
?>
