Textarea characters remaining

Textarea characters remaining

by slawe

HTML

<textarea class="text"></textarea>
<div class="message_char_left">215 characters is max</div>

JavaScript

var __textarea = document.querySelector('.text'),
            __char = document.querySelector('.message_char_left'),
            __remaining = 0;

    __handler = function(e) {
        e.preventDefault();
        __remaining = 215 - parseInt(__textarea.value.length);
        __char.style.color = '#666';

        if (__remaining < 0) {
            __textarea.value = __textarea.value.substring(0, 215);
            __char.style.color = 'red';
            return false;
        }

        if (__remaining > 0 && __remaining < 50) {
            __char.style.color = '#e3d713';
        }

        if (__remaining === 0) {
            __char.style.color = 'red';
        }

        __char.innerHTML = __remaining + ' characters remaining';

    };

    __textarea.addEventListener('keyup', __handler);