﻿/* Criado por Bruno Kenj (http://www.brunokenj.net) */
(function($) {

    $.fn.ChangeInLine = function(options) {

        var defaults = {
            urlRequest: '',
            nomeParam: '',
            urlImageSave: 'Content/Imagens/16-circle-green-check.png',
            urlImageCancel: 'Content/Imagens/16-circle-red-delete.png',
            urlImageLoading: 'Content/Imagens/loading.gif',
            savedChanges: function(args) { }
        };

        var options = $.extend(defaults, options);

        var root, valorTexto, html, loading;

        function setActive(obj) {
            obj.data('inEdit', true);
            obj.unbind('click');
        }

        function setInative(obj) {
            obj.data('inEdit', false);
            obj.bind('click', onChangeInLine);
        }

        function setFocus(obj) {
            obj.find('input').select();
        }

        function onFocus() {
            this.select();
        }

        function save() {
            saveChanges(root, false);
        }

        function cancel() {
            saveChanges(root, true);
        }

        function setEventInButtons(obj) {
            obj.find('.clSavar').click(save);
            obj.find('.clCancelar').click(cancel);
        }

        function setHTML(obj, valor) {
            obj.html(valor);
        }

        function toogleActive(obj) {
            obj.toggleClass("clActive");
        }

        function isLoading() {
            return loading;
        }

        function setLoading(isLoading) {
            loading = isLoading;

            if (isLoading) {
                var space = '&nbsp;';
                var inputText = '<input type="text" value="' + root.find('input').val() + '" disabled="disabled" />';
                var imageLoading = '<img src="' + options.urlImageLoading + '" class="clLoading" width="16" height="16" />';
                setHTML(root, inputText + space + space + imageLoading);
            }
        }

        function onChangeInLine() {
            if (root.data('inEdit') == false || root.data('inEdit') == null) {
                valorTexto = root.html();

                var space = '&nbsp;';
                var inputText = '<input type="text" value="' + valorTexto + '"/>';
                var buttonOK = '<img src="' + options.urlImageSave + '" class="clSavar" width="16" height="16" />';
                var buttonNO = '<img src="' + options.urlImageCancel + '" class="clCancelar" width="16" height="16" />';

                html = inputText + space + space + buttonOK + space + buttonNO;

                setActive(root);
                setHTML(root, html);
                setEventInButtons(root);
                setFocus(root);
            }
            else {
                setInative(root);
                setHTML(root, valorTexto);
            }

            toogleActive(root);
        }

        var savedChangesCallBack = function(args) {
            onChangeInLine();
            setLoading(false);
            root.removeClass('clEditHover');
            root.html(eval('args.' + options.nomeParam));
            options.savedChanges(args);
        }

        function saveChanges(obj, cancel) {
            if (cancel) {
                obj.click(onChangeInLine);
            } else {
                var objJson = eval('({ "' + options.nomeParam + '": "' + obj.find('input').val() + '" })');
                setLoading(true);
                jQuery.post(options.urlRequest, objJson, savedChangesCallBack, "json");
            }
        }

        function mouseOver() {
            $(this).addClass('clEditHover');
        }

        function mouseOut() {
            $(this).removeClass('clEditHover');
        }

        return this.each(function() {
            root = $(this);
            root.click(onChangeInLine)
                .mouseover(mouseOver)
                .mouseout(mouseOut);
        });
    };
})(jQuery);
