var popup;

var close = function() {
    popup.animate({opacity:0},300);
    setTimeout( "popup.hide();", 300);

    setTimeout( "$('#xs').animate({opacity: 0},200);", 400);
    setTimeout( "$('#xs').css({display: 'none'});", 600);
}

var showLogin = function()
{
    $("#xs").css({display: "block"});
    $("#xs").animate({opacity: "0.8", height: $(document.body).height()}, 200);
    popup = $('#login_form');
    $('.crs:visible').click(close);
    popup.css({display: "block", marginTop: ($(window).height()/2 < 155 ? 155 : $(window).height()/2  - 100)+'px'});
    setTimeout("popup.animate({opacity: 1},300);", 300);
    return false;
}

var login = function() {
    $.post(this.form.action, $(this.form).serialize(), function(data) {
        $('#login_form').replaceWith(data);
        $('#login_form').show();
        $('#login_button').click(login);
    });
}

var remind = function() {
    $.post(this.form.action, $(this.form).serialize(), function(data) {
        $('#remind_form').replaceWith(data);
        $('#remind_form').show();
        $('#remind_button').click(remind);
    });
}

$(document).ready(function() {
    $(document.body).prepend($("#xs").remove());
    $('#login').click(showLogin);
    $('#login_button').click(login);
    $('#remind').click(function() {
        popup.hide();
        popup = $('#remind_form');
        popup.show();
        popup.css({opacity: 1});
        return false;
    });
    $('#remind_button').click(remind);
});