var ElementCheckboxTree = (function () {

    var checkboxTree = function() {
        this.initialize.apply(this, arguments);
    };

    checkboxTree.defaultOptions = {
        elementId: undefined,
        treeId: undefined,
        toggleChildren: true,
        toggleDialog: {
            message: '%action% all child items?',
            buttonNo: 'Just %action% this item',
            buttonYes: '%action% all child items',
            placement: 'right'
        }
    };

    checkboxTree.prototype = {
        message: new qs.Message({
            'en': {
                'check': 'check',
                'uncheck': 'uncheck'
            },
            'uk': {
                'check': 'додати',
                'uncheck': 'видалити'
            },
            'ru': {
                'check': 'добавить',
                'uncheck': 'удалить'
            }
        }),

        initialize: function (options)
        {
            var that = this;

            this.options = $.extend({}, checkboxTree.defaultOptions, options);
            if (this.options.treeId == undefined) {
                this.options.treeId = this.options.elementId + '-tree';
            }

            this.element = $('#' + this.options.elementId);
            if (this.element.size()) {
                this.links = $('[data-tree-action]', this.element);
                if (this.links.size()) {
                    $(this.links).bind('click.checkboxTree', function () {
                        that.onLinkClick.apply(that, arguments);
                    });
                }

                if (this.options.toggleChildren) {
                    this.checkbokses = $('input[type=checkbox]', this.element);
                    if (this.checkbokses.size()) {
                        $(this.checkbokses).bind('change.checkboxTree', function () {
                            that.onCheckboxChange.apply(that, arguments);
                        });
                    }
                }
            }

            return this;
        },

        onLinkClick: function (e)
        {
            e.preventDefault();

            var target = $(e.currentTarget);
            var action = $(target).data('tree-action');
            var tree = $('#' + this.options.treeId);

            switch (action) {
                case 'checkAll':
                    this.element.find(':checkbox').prop('checked', true);
                    break;
                case 'uncheckAll':
                    this.element.find(':checkbox').prop('checked', false);
                    break;
                case 'expandAll':
                    $(tree).data('toggler').apply($('div.hitarea', tree).filter(function() { return $(this).parent('.expandable').length; }));
                    break;
                case 'collapseAll':
                    $(tree).data('toggler').apply($('div.hitarea', tree).filter(function() { return $(this).parent('.collapsable').length; }));
                    break;
            }
            return this;
        },

        onCheckboxChange: function (e)
        {
            $('.toggle-children .btn-cancel').click();

            var that = this;
            var target = $(e.currentTarget);
            var value = target.prop('checked');
            var li = $(target).closest('li');

            if ($('ul', li).size()) {
                var label = $(target).closest('label');
                var title = this.getDialogMessage(value, 'message');
                var content = '<div class="toggle-children">'
                            + '<button class="btn btn-mini btn-cancel" disabled="disabled">' + this.getDialogMessage(value, 'buttonNo') + '</button> '
                            + '<button class="btn btn-mini btn-submit btn-primary" disabled="disabled">' + this.getDialogMessage(value, 'buttonYes') + '</button>'
                            + '</div>';


                label.popover({html: true, placement: this.options.toggleDialog.placement, trigger: 'manual', title: title, content: content});
                label.popover('show');

                $('.toggle-children .btn-cancel').bind('click.checkboxTree', function (e) {
                    e.preventDefault();
                    $(label).popover('destroy');
                }).removeAttr('disabled');

                $('.toggle-children .btn-submit').bind('click.checkboxTree', function (e) {
                    e.preventDefault();
                    that.toggleAll.apply(that, [li]);
                    $(label).popover('destroy');
                }).removeAttr('disabled');
            }
        },

        toggleAll: function (li)
        {

            var elements = $('input[type=checkbox]', li);
            var value = $(elements).first().prop('checked');
            $(elements).prop('checked', value);
        },

        getDialogMessage: function (value, key)
        {
            var action = 'check';
            if (!value) {
                action = 'uncheck';
            }

            action = this.message.get(action);

            var message = this.options.toggleDialog[key];
            message = message.replace(/%action%/gi, action);

            var first = message.charAt(0).toUpperCase();
            message = first + message.substr(1, message.length - 1);

            return message;
        }
    };

    return checkboxTree;
})();