/*
     * start on domready
     */
    window.addEvent('domready', main);



    function main()
    {
       /**
         * regitser resizer function
         */
        window.addEvent("resize", login_resize);

        /**
         * resize the page
         */
        login_resize();




        $("login_login").addEvent("click", function(){
            $("login_box").set("styles", {background:"url(img/login_box.png) no-repeat"});

            doLoginBox();
        });
        $("login_invite").addEvent("click", function(){
            $("login_box").set("styles", {background:"url(img/login_box1.png) no-repeat"});

            doInviteBox();
        });

        doLoginBox();
    }





    function doInviteBox()
    {
        $("login_box").empty();

        var invite = new Element("input", {
            type:       "text",
            "class":    "invite txt",
            id:         "invite",
            alt:        "please enter your email address here...",
            events:{
                 keydown: function(event){
                    if(event.key == "enter")
                    {
                        $("invite_request").fireEvent("click");
                    }
                }
            }
        }).inject($("login_box"));

        var inviteOver = new OverText("invite", {poll:true});


        var l_error = new Element("div", {
            id:         "l_error",
            styles:     {                
                opacity:            0
            },
            "class":     "errormsg"
        }).inject($("login_box"));


         var inv = new Element("input", {
            type:       "button",
            "class":    "signin",
            id:         "invite_request",
            value:      "request invite",
            events:     {
                click:  function()
                {
                    $("invite").setProperty("disabled", "disabled");
                    $("invite_request").setProperty("disabled", "disabled");
                   
                    $("l_error").set("styles", {
                        opacity:                        1
                    });
                    $("l_error").set("html", '<img src="img/loading.gif" width="20" height="20" />');

                    var inviter = new Request.JSON({
                        url:            "invite",
                        onSuccess:      function(data)
                        {
                            if(!data.hasError)
                            {
                                $("l_error").set("styles", {color:"green", opacity:1});
                                $("l_error").set("text", "Thanks. We will send you an invite as soon as possible...");

                            }
                            else{
                                $("invite").value = "";

                                 $("l_error").set("styles", {color:"red", opacity:1});
                                 $("l_error").set("text", "An error occured. Check your input or try again later...");

                                 hideError();

                                 $("invite").removeProperty("disabled");
                                 $("invite_request").removeProperty("disabled");
                            }
                        }
                    }).post({
                        mail:       $("invite").value
                    });
                }
            }
        }).inject($("login_box"));
    }









    function doLoginBox()
    {
        $("login_box").empty();

        var user = new Element("input", {
            type:       "text",
            "class":    "li txt",
            id:         "user",
            alt:        "username",
            events:{
                 keydown: function(event){
                    if(event.key == "enter")
                    {
                        $("signin").fireEvent("click");
                    }
                }
            }
        }).inject($("login_box"));

        var pass = new Element("input", {
            type:       "password",
            "class":    "li txt",
            id:         "pass",
            styles:{
                "margin-left":      "10px"
            },
            alt:        "password",
            events:{
                 keydown: function(event){
                    if(event.key == "enter")
                    {
                        $("signin").fireEvent("click");
                    }
                }
            }
        }).inject($("login_box"));

        var userOver = new OverText("user", {poll:true});
        var passOver = new OverText("pass", {poll:true});


        var l_error = new Element("div", {
            id:         "l_error",
             styles:     {
                opacity:            0
            },
            "class":     "errormsg"
        }).inject($("login_box"));


        var signin = new Element("input", {
            type:       "button",
            "class":    "signin",
            id:         "signin",
            value:      "sign in",
            events:     {
                click:  function()
                {
                    var signer = new Request.JSON({
                        url:            "validate",
                        onSuccess:      function(data)
                        {
                            if(!data.hasError)
                            {
                                if(data.loginState)
                                {
                                    // get the app
                                    var application = new Request.HMTL().get("ipirate");
                                }
                                else{
                                    $("pass").value = "";
                                    $("l_error").set("text", "Wrong username or password...");

                                    hideError();
                                }
                            }
                            else{
                                 $("l_error").set("text", "An error occured. Please try again later...");

                                 hideError();
                            }
                        }
                    }).post({
                        user:       $("user").value,
                        pass:       $("pass").value
                    });

                   
                }
            }
        }).inject($("login_box"));
    }





    function hideError(){

        if($defined($("l_error").ani)) $("l_error").ani.cancel();
        $("l_error").set("styles", {opacity:1});

        setTimeout(function(){
            if(!$defined($("l_error").ani)){
                $("l_error").ani = new Fx.Morph("l_error", {duration: 2500, transition: Fx.Transitions.Sine.easeOut});
            }
            $("l_error").ani.start({
                opacity:    0
            });
        }, 2000);
    }








    function login_resize()
    {
        var y       = document.getSize().y;
        var x       = document.getSize().x;



        var nt      = (y-561)/2;
        $("login_hldr").set("styles", {
           top:     nt
        });


        var nl      = (x-539)/2;
        $("login_logo").set("styles", {
           top:     nt+50,
           left:    nl
        });


        $("login_login").set("styles", {
           top:     nt+250,
           left:    nl+50
        });
        $("login_invite").set("styles", {
           top:     nt+250,
           left:    nl+100
        });

        $("login_box").set("styles", {
           top:     nt+280,
           left:    nl
        });


    }