var userFilter = $('#users');
    var typeFilter = $('#types');

    var typesContainsUsers = {};
    
    function getElements(type) {
        return $('input[name="' + type + '[]"]');
    }


    function getSelectedTypes() {
        return $.map(getTypes(), function (type, index) {
            if (type.selected) {
                return type;
            }
        });
    }

    function getTypes() {
        var types = [], type;

        getElements('types').each(function (key, input) {
            element = $(input);

            type = element.data();
            type.selected = element.prop('checked');

            types.push(type);
        });

        return types;
    }

    function getUsers() {
        var users = [], user;

        getElements('users').each(function (key, input) {
            element = $(input);

            user = element.data();
            user.selected = element.prop('checked');

            users.push(user);
        });

        return users;
    }


    function getSelectedUsers() {
        return $.map(getUsers(), function (user, index) {
            if (user.selected) {
                return user;
            }
        });
    }

    function drawTypes(types) {

        var div, element;

        typeFilter.empty();

        checkAll = $('<input>', {
            type: 'checkbox'
        });

        checkAll.on('change', function () {
            getElements('types').prop('checked', $(this).prop('checked'));
            getElements('types').trigger('change');
            $('#calendar').fullCalendar('refetchEvents');
        });

        div = $('<div>');
        div.append(checkAll);
        div.append('checkAll');

        typeFilter.append(div);

        var type, i;
        for (i in types) {
            type = types[i];

            div = $('<div>');

            element = $('<input>', {
                type: 'checkbox',
                value: type,
                name: 'types[]'
            });

            element.data(type);
            element.prop('checked', type.selected);

            element.on('change', function () {
                var users = getUsers(), user, userIndex;

                var element = $(this);
                var currentType = element.data('type');
                var selected = element.prop('checked');
                
                for (userIndex in users) {
                    user = users[userIndex];
                    if (user.type === currentType) {
                        users[userIndex].selected = selected;
                    }
                }
                drawUsers(users);
                $('#calendar').fullCalendar('refetchEvents');
            });

            div.append(element);
            div.append(type.name);

            typeFilter.append(div);
        }
        
        console.log('drawing types complite');
    }
    
    function getSelectedUsersByType(type) {
        var users = [], user;
        
        return $.map(getSelectedUsers(), function (user) {
            if (user.type === type) {
                return user;
            }
        });
    }
    
    function drawUsers(users) {
        var div, element;

        userFilter.empty();

        checkAll = $('<input>', {
            type: 'checkbox'
        });

        checkAll.on('change', function () {
            getElements('users').prop('checked', $(this).prop('checked'));
            $(getTypes()).each(function (i, type) {
                drawTypes(updateType(type.type));
            });
            $('#calendar').fullCalendar('refetchEvents');
        });

        div = $('<div>');
        div.append(checkAll);
        div.append('checkAll');

        userFilter.append(div);

        $(users).each(function (key, user) {
            div = $('<div>');

            element = $('<input>', {
                type: 'checkbox',
                value: user.id,
                name: 'users[]'
            });

            element.data(user);
            element.prop('checked', user.selected);

            element.on('change', function () {
                var element = $(this);

                var type = element.data('type');
                
                if (type) {
                    drawTypes(updateType(type));
                }
                
                $('#calendar').fullCalendar('refetchEvents');
            });

            div.append(element);
            div.append(user.name);

            userFilter.append(div);
        });
        
        console.log('drawing users complite');
    }
    
    function updateType(type) {
        
        var typeUsers = typesContainsUsers[type];

        if (!typeUsers) {
            return;
        }

        var types = getTypes();

        var selected = (typeUsers.length == getSelectedUsersByType(type).length);
        var i;
        for (i in types) {
            if (types[i].type == type) {
                types[i].selected = selected;
            }
        }
        
        return types;
    }

    function getTypesContainsUsers(types, users) {
        var type, user, i, result = {};
        
        for (i in types) {
            result[types[i].type] = [];
        }
        
        for (i in users) {
            if (users[i].type) {
                result[users[i].type].push(users[i]);
            } 
        }

        return result;
    }

    LightAjax({
        module: 'CalendarCarrenet',
        call: 'getSettings'
    }, function (settings) {
        initCalendar(settings);
        
        typesContainsUsers = getTypesContainsUsers(settings.types, settings.users);
        drawUsers(settings.users);
        drawTypes(settings.types);
    });