BBCode Image Bank

<div class="grid-tab">
<?php foreach ($imgBankArray as $grabCategory) : ?>
<input type="button" class="grid-tab-link" onclick="showCode(event, '<?= $grabCategory['directory'] ?>')" value="<?= $grabCategory['title'] ?>" />
<?php endforeach; ?>
</div>
<?php foreach ($imgBankArray as $grabCategory) : ?>
<div id="<?= $grabCategory['directory'] ?>" class="grid-tab-content">
<?php $bbImgGrab = glob('graphics/'.$grabCategory['directory'].'/*.{png,gif}', GLOB_BRACE); ?>
<?php if ($grabCategory['parse'] == '<br>') {$implodeImg = implode("[/img][/td][td][img]", $bbImgGrab);} else {$implodeImg = implode("[/img][img]", $bbImgGrab);} ?>
    <textarea style="width: 100.7%; min-height: 200px" onclick="this.select()">
<?php if ($grabCategory['parse'] == '<br>') : ?>[table][tr][td]<?= $implodeImg ?>[/td][/tr][/table]<?php else : ?>[img]<?= $implodeImg ?>[/img]<?php endif; ?>
    </textarea>
</div>
<?php endforeach; ?>

<script>
    function showCode(evt, res) {
        var i, gridTabContent, gridTabLinks;
        gridTabContent = document.getElementsByClassName("grid-tab-content");
        for (i = 0; i < gridTabContent.length; i++) {
            gridTabContent[i].style.display = "none";
        }
        gridTabLinks = document.getElementsByClassName("grid-tab-link");
        for (i = 0; i < gridTabLinks.length; i++) {
            gridTabLinks[i].className = gridTabLinks[i].className.replace(" active", "");
        }
        document.getElementById(res).style.display = "block";
        evt.currentTarget.className += " active";
    }
</script>