textarea_expansion.js

(function(){
    if (location.pathname.indexOf("/chat/room") == 0) {
        var message = $("#message").css({
            "-webkit-transition" : "height 0.3s ease-in-out",
            "-webkit-transition" : "width 0.3s ease-in-out",
            "transition" : "height 0.3s ease-in-out",
            "transition" : "width 0.3s ease-in-out",
        });

        var defaultStyle = {
            "width"       : message.css("width"),
            "height"      : message.css("height"),
            "margin-left" : message.css("margin-left"),
        };
        var expandStyle = {
            "width"       : "100%",
            "height"      : "10em",
            "margin-left" : "0px",
        };

        function needsExpansion(){
            var value      = message.val();
            var lineNumber = value.split("\n").length;
            var charNumber = value.length;

            return (lineNumber >= 3 || charNumber >= 30);
        }

        function resize(){
            if (needsExpansion()) {
                expand();
            } else {
                shrink();
            }
        }

        function expand(){
            if (needsExpansion()) {
                message.css(expandStyle);
            }
        }
        function shrink(){
            message.css(defaultStyle);
        }

        message.bind("keyup", expand);
        message.bind("focus blur", resize);

        $("form.inputarea").bind("submit", shrink);
    }
})();