<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title>Emoji</title>
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta content="width=device-width, initial-scale=1" name="viewport" />
    <script src="{THEME_PATH}assets/global/plugins/jquery.min.js" type="text/javascript"></script>
    <script type="text/javascript">

        function dr_insert_emoji_value(e) {
            var html = $('#html_'+e).html();
            var value =  parent.$('#dr_{$name}').val();
            parent.layer.closeAll();
            parent.$('#dr_{$name}').insertContent(html);
        }
    </script>
    <style>
         a {
            display: block;
            float: left;
            overflow: hidden;
            margin: 3px;
            padding: 5px;
            border: 1px #EEE solid;
             color:#000;
             text-decoration: none;
        }
        a span {
             display: block;
             width: 20px;
             height: 20px;
             overflow: hidden;
             word-break: break-all;
         }
    </style>
</head>
<body>
{php $i=0;}
{loop $emoji $name $t}
<a href="javascript:dr_insert_emoji_value({$i});"><span id="html_{$i}">{dr_html2emoji($name)}</span></a>
{php $i++;}
{/loop}
</body>
</html>