$(document).ready(function() {

    $("input[type='checkbox']")
        .wrap($("<div />")
            .addClass('check_wrapper'))
    $(".check_wrapper")
            .append($("<em />"))

    $(".check_wrapper em").each(function() {
        if( $(this).parent().find("input:checked").val() == 'on' ) {
            $(this).addClass('checked')
        }
    })

    $(".check_wrapper em").click(function() {
        $(this).toggleClass('checked')
        $(this).parent().find("input").click();
    });

    $("#p_type select, #p_termin select, #p_deadline select").hide();
    
    $("#p_type")
        .append($("<span />")
            .text($("#id_type > option:first-child").text())
            .addClass('select'))
        .append($("<ul />").hide())

    type_value = $("#id_type").val()
    type_selected = $("#id_type option[value=" + type_value + "]")
    
    $("#p_deadline")
        .append($("<span />")
            .text($("#id_deadline > option:first-child").text())
            .addClass('select'))
        .append($("<ul />").hide())
    
    deadline_value = $("#id_deadline").val()
    deadline_selected = $("#id_deadline option[value=" + deadline_value + "]")
    
    $("#p_type .select").text(type_selected.text());
    $("#p_deadline .select").text(deadline_selected.text());

    $("#p_type optgroup").each(function() {
        var label = $(this).attr('label')
        $("#p_type > ul")
            .append(
                $("<li />")
                    .append(
                        $("<span />")
                            .addClass('optgroup')
                            .text(label)
                    )
                    .append(
                        $("<ul />")
                    )
            )
        
        $(this).find("option").each(function() {
            var text = $(this).text();
            var id = $(this).val();
            if(id != '') {
                $("#p_type > ul > li:last-child ul")
                    .append(
                        $("<li />")
                            .append(
                                $("<a />")
                                    .attr({
                                        'href': '',
                                        'rel': id
                                    })
                                    .text(text)
                            )
                    )
            }
        })
    })
                        
    $("#p_deadline option").each(function() {
        var text = $(this).text();
        var id = $(this).val();
        if(id != '') {
            $("#p_deadline > ul")
                .append(
                    $("<li />")
                        .append(
                            $("<a />")
                                .attr({
                                    'href': '',
                                    'rel': id
                                })
                                .text(text)
                        )
                )
        }
    })

    $("#p_type a").click(function() {
        $("#p_type select").val($("#p_type option[value='" + $(this).attr('rel') + "']").val())
        $("#p_type .select").text($(this).text());
        $("#p_type > ul").hide('fast');
        $("#p_type .select").removeClass('open');
        return false;
    });
                        
    $("#p_deadline a").click(function() {
        $("#p_deadline select").val($("#p_deadline option[value='" + $(this).attr('rel') + "']").val())
        $("#p_deadline .select").text($(this).text());
        $("#p_deadline > ul").hide('fast');
        $("#p_deadline .select").removeClass('open');
        return false;
    });

    $(".select").click(function() {
        if($(this).parent().find("ul").css('display') == 'none') {
            $(this).parent().find("ul").show('fast');
            $(this).addClass('open');
        } else {
            $(this).parent().find("ul").hide('fast');
            $(this).removeClass('open');
        }
    });

    $(".error").css({'opacity': 0});
    $(".error").animate({
        'opacity': 1
    }, 1000, function(callback) {
        $(this).animate({
            'opacity': 1
        }, 2000, function(callback) {
            $(this).animate({
                'opacity': 0,
                'marginLeft': '-700px'
            }, 1000);
        });
    });

});