var loginHtml = '<h6>MEMBER LOGIN</h6>\
	<div id="div_login_wait" style="position: absolute; margin-left: 60px; margin-top: 4px; display: none;"><img src="../images/process.gif" alt="Loading..." width="35" height="35" /></div>\
	<ul>\
		<li><input id="login_txt_userName" type="text" class="input" maxlength="30" value="LoginEmail" ltype="email" defaultVal="LoginEmail" /><img src="../images/no.gif" alt="no" /></li>\
		<li><input id="login_txt_userPwd" type="password" class="input" maxlength="30" value="Password" ltype="notNull" defaultVal="Password" /><img src="../images/no.gif" alt="no" /></li>\
		<li><input type="button" class="but" value="Login" onclick="userLogin();" /></li>\
		<li><img src="../images/arrow_a.gif"/><a href="../Register.aspx">Register</a></li>\
		<li><img src="../images/arrow_a.gif"/><a href="../FindPassword.aspx">Lost Password</a></li>\
	</ul>';
    
    var $j = jQuery.noConflict();
    $j(document).ready(function(){
        checkLoginForm();
        isLogin();
    });
    
    function checkLoginForm(){
        $j('div[id=login]').find('input[ltype]').each(function(){
            $j(this).next().hide();
            $j(this).focus(function(){
                $j(this).next().attr('src', '../images/focus.gif').show();
                if($j(this).val() == $j(this).attr('defaultVal')){
                    $j(this).val('');
                }
            });
            
            $j(this).blur(function(){
                $j(this).next().hide();
                if($j(this).val() == ''){
                    $j(this).val($j(this).attr('defaultVal'));
                    $j(this).next().attr('src', '../images/no.gif').show();
                    $j(this).next().attr('alt', 'no');
                }else if($j(this).val != '' && $j(this).val() != $j(this).attr('defaultVal')){
                    $j(this).next().attr('src', '../images/yes.gif').show();
                    $j(this).next().attr('alt', 'yes');
                }else{
                    $j(this).next().attr('src', '../images/no.gif').show();
                    $j(this).next().attr('alt', 'no');
                }
            });
        });
    }
    
    function validateLoginForm(){
        var canSub = true;
        $j('div[id=login]').find('img[alt]').each(function(){
            if($j(this).attr('alt') == 'no'){
                canSub = false;
                $j(this).show();
            }
        });
        return canSub;
    }
    
    function userLogin(){
        if(!validateLoginForm()){
            return;
        }
        var userName = $j('#login_txt_userName').val();
        var userPwd = $j('#login_txt_userPwd').val();
        $j('#div_login_wait').show();
        $j.ajax({
            url : '../Ajax.aspx?rd=' + Math.random(),
            type : 'post',
            data : 'operate=Login&userName=' + userName + '&userPwd=' + userPwd,
            dataType : 'json',
            success : function(json){
                $j('#div_login_wait').hide();
                if(json == null){
                    alert('Failure,Please check your loginId and password.');
                    return;
                }else{
                    var strHtml = '<h6>MEMBER LOGIN</h6>\
	                    <h3>Welcome back: </h3>\
	                    <h4>'+ json.Fullname +'</h4><br />\
	                    <input type="button" class="but" value="Edit Detail" onclick="window.location = \'../Register.aspx?op=update\';" />\
	                    <input type="button" class="but" value="Signout" onclick="loginOut();" />\
	                    <input type="button" class="but_loog" value="CheckOrder" onclick=window.location.href="OrderTracking.aspx" />';
	                $j('#login').html(strHtml);
                }
            }
        });
    }
    
    function loginOut(){
        $j('#div_login_wait').show();
        try{
            $j('#g_email').val('');
            $j('#g_fullName').val('');
        }catch(err){}
        $j.ajax({
            url : '../Ajax.aspx?rd=' + Math.random(),
            type : 'post',
            data : 'operate=LoginOut',
            dataType : 'html',
            success : function(html){
                $j('#div_login_wait').hide();
                $j('#login').html(loginHtml);
                checkLoginForm();
            }
        });
    }
    
    function isLogin(){
        $j('#div_login_wait').show();
        $j.ajax({
            url : '../Ajax.aspx?rd=' + Math.random(),
            type : 'post',
            data : 'operate=IsLogin',
            dataType : 'json',
            success : function(json){
                $j('#div_login_wait').hide();
                if(json == null){
                    $j('#login').html(loginHtml);
                    checkLoginForm();
                }else{
                    var strHtml = '<h6>MEMBER LOGIN</h6>\
	                    <h3>Welcome back: </h3>\
	                    <h4>'+ json.Fullname +'</h4><br />\
	                    <input type="button" class="but" value="Edit Detail" onclick="window.location = \'../Register.aspx?op=update\';" />\
	                    <input type="button" class="but" value="Signout" onclick="loginOut();" />\
	                    <input type="button" class="but_loog" value="CheckOrder" onclick=window.location.href="OrderTracking.aspx" />';
	                $j('#login').html(strHtml);
	                
	                try{
	                    $j('#g_email').val(json.Username);
	                    $j('#g_fullName').val(json.Fullname);
	                }catch(err){}
                }
            }
        });
    }