// Sliding labels plugin - slides out form label on focus to left/right/top/bottom
(function ($) {
    $.fn.slidinglabels = function (options) {
        var defaults = {
            className: 'formSlider',
            topPosition: '5px',
            leftPosition: '5px',
            axis: 'x',
            speed: 'fast'
        };

        var options = $.extend(defaults, options);
        var itemwrapper = this.find('.' + defaults.className + '');
        var labels = itemwrapper.find('label');

        return labels.each(function () {
            obj = $(this);

            var parent = obj.parents('.' + defaults.className + '');
            parent.css({ 'position': 'relative', 'overflow': 'hidden' })

            // style the label with JS for progressive enhancement
            obj.css({
                'position': 'absolute',
                'top': defaults.topPosition,
                'left': defaults.leftPosition,
                'display': 'inline',
                'z-index': 99,
                'ease': 'easeOutQuad'
            });

            var inputval = $(this).next().val();
            var labelwidth = $(this).width();
            var labelmove = labelwidth + 5 + 'px';
            var labelheight = $(this).height();

            if (inputval !== '') {
                if (defaults.axis == 'x') {
                    obj.stop().animate({ 'left': '-' + labelmove }, 1);
                } else if (defaults.axis == 'y') {
                    obj.stop().animate({ 'top': '-' + labelheight }, 1);
                }
            }

            // if the input is empty on focus move the label to the left
            // if it's empty on blur, move it back
            $('input, textarea').focus(function () {
                var label = $(this).prev('label');
                var width = label.width();
                var height = label.height();
                var adjust = width + 5 + 'px';
                var adjustUp = height + 'px';
                var value = $(this).val();

                if (value == '') {
                    if (defaults.axis == 'x') {
                        label.stop().animate({ 'left': '-' + adjust }, defaults.speed, defaults.ease);
                    } else if (defaults.axis == 'y') {
                        label.stop().animate({ 'top': '-' + adjustUp }, defaults.speed, defaults.ease);
                    }
                } else {
                    if (defaults.axis == 'x') {
                        label.css({ 'left': '-' + adjust });
                    } else if (defaults.axis == 'y') {
                        label.css({ 'top': '-' + adjustUp });
                    }
                }
            }).blur(function () {
                var label = $(this).prev('label');
                var value = $(this).val();

                if (value == '') {
                    if (defaults.axis == 'x') {
                        label.stop().animate({ 'left': defaults.leftPosition }, defaults.speed, defaults.ease);
                    } else if (defaults.axis == 'y') {
                        label.stop().animate({ 'top': defaults.topPosition }, defaults.speed, defaults.ease);
                    }
                }
            });
        });
    };
})(jQuery);
// End of Sliding labels plugin