Zalgo

by disfated

HTML

<div id="zalgo">He comes...</div>
<input type="number" value="50"><button>Zalgo!</button>
<textarea>
Permission is hereby granted,  free of charge, to any person obtaining a copy of
this software  and associated  documentation  files (the "Software"), to deal in
the Software  without restriction,  including  without limitation  the rights to
use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of
the Software,  and to permit persons to whom the Software is furnished to do so,
subject to the following conditions:

The above copyright  notice and this permission  notice shall be included in all
copies or substantial portions of the Software.

THE SOFTWARE  IS PROVIDED  "AS IS", WITHOUT  WARRANTY  OF ANY KIND,  EXPRESS  OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS
FOR A PARTICULAR  PURPOSE AND NONINFRINGEMENT.  IN NO EVENT SHALL THE AUTHORS OR
COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM,  DAMAGES OR OTHER LIABILITY,  WHETHER
IN  AN  ACTION  OF CONTRACT,  TORT  OR OTHERWISE,  ARISING  FROM,  OUT  OF OR IN
CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
</textarea>

CSS

#zalgo {
    padding: 35px 20px;
    border: 1px solid #CCC;
    white-space: pre;
    font-family: monospace;
    background: #000;
    color: green;
}
.zalgo {
    color: hsl(120, 100%, 40%);
}
textarea {
    display: block;
    width: 100%;
    box-sizing: border-box;
    padding: 5px;
    min-height: 200px;
    border: 1px solid #999;
    sizing: vertical;
}

JavaScript

function zalgo(string, noisy) {
    var soul = [
       '\u030d\u030e\u0304\u0305\u033f\u0311\u0306\u0310\u0352\u0357\u0351\u0307\u0308\u030a\u0342\u0343\u0344\u034a\u034b\u034c\u0303\u0302\u030c\u0350\u0300\u0301\u030b\u030f\u0312\u0313\u0314\u033d\u0309\u0363\u0364\u0365\u0366\u0367\u0368\u0369\u036a\u036b\u036c\u036d\u036e\u036f\u033e\u035b\u0346\u031a',
        '\u0315\u031b\u0340\u0341\u0358\u0321\u0322\u0327\u0328\u0334\u0335\u0336\u034f\u035c\u035d\u035e\u035f\u0360\u0362\u0338\u0337\u0361\u0489',
        '\u0316\u0317\u0318\u0319\u031c\u031d\u031e\u031f\u0320\u0324\u0325\u0326\u0329\u032a\u032b\u032c\u032d\u032e\u032f\u0330\u0331\u0332\u0333\u0339\u033a\u033b\u033c\u0345\u0347\u0348\u0349\u034d\u034e\u0353\u0354\u0355\u0356\u0359\u035a\u0323',
    ],
    all = soul.join(''),
    dens = [
        [0.110, 1.000, 1],
        [0.030, 1.000, 1],
        [0.110, 1.000, 1]
    ],
    hecomes = [];
    isFinite(noisy = Number(noisy)) || (noisy = 50);
    
    [].forEach.call(string, function(char) {
        hecomes.push('<span class="zalgo">' + char + '</span>');
        if (!~all.indexOf(char)) {
            soul.forEach(function(soul, s) {
                var n = (dens[s][0] * noisy + dens[s][1]) * dens[s][2] * Math.random();
                while (--n > 0) {
                    hecomes.push(soul.charAt(~~(Math.random() * soul.length)));
                };
            });
        };
    });
    return hecomes.join('');
};

$(document).ready(function() {
    $('button').click(function() {
        $('#zalgo').html(zalgo(
            $('textarea')[0].value,
            parseInt($('input[type=number]').val())
        ));
    });
});