var errorBox;
var messageBox;

$(document).ready(function() {
    errorBox = $("div#errors");
    messageBox = $("div#messages");
    if(errorBox.is(":visible")) {
        fadeAndRemove(errorBox,3000);
    }
    if(messageBox.is(":visible")) {
        fadeAndRemove(messageBox,3000);
    }
});

function addMessageTo(box,message) {
    box.children("ul").append("<li>" + message + "</li>");
    box.animate({
        opacity: 1,
        height: 'toggle'
    }, 700, function() {
        fadeAndRemove(box,3000);
    });
}

function fadeAndRemove(box,msecsAfter) {
    box.fadeTo(msecsAfter,1.0).animate({
        opacity: 0,
        height: 'toggle'
    }, 700, function() {
        box.children("ul").children("li").remove();
    });
/*.fadeOut(500,function() {
        box.children("ul > li").remove(0);
    });
    */
}

function fadeAll(msecsAfter) {
    fadeAndRemove(errorBox,msecsAfter);
    fadeAndRemove(messageBox,msecsAfter);
}