Util.inPageLoginObj = function(elId,callBackFunction) {
  
  this.loginEl = document.getElementById(elId);
  if (!this.loginEl) return;
  var me  = this;
  this.onClickEl = (this.loginEl.click) ? this.loginEl.click : null;
  $(this.loginEl).unbind('click');
  this.id = elId;
  if (callBackFunction){
    this.callBkFunc = function() {
      callBackFunction();
    };
  }else {
    this.callBkFunc = function () {
      if (me.onClickEl) me.onClickEl();
    };
  }

  if (this.isLoggedIn()){
		//logged in, proceed with the callBkFunc;
		this.execallbk();
	}else{
		//not logged in, show the log in window first;
    $(this.loginEl).click(function(){me.onFocus();});
	}
};

Util.inPageLoginObj.prototype.execallbk = function() {
  if (!this.loginEl) return;
  if (navigator.appVersion.indexOf("MSIE")!=-1){
    this.callBkFunc();
  }else{
    window.setTimeout(this.callBkFunc,0);
  }
};

Util.inPageLoginObj.prototype.cancelLogin = function() {
  if (!this.loginEl) return;
  this.showLogInWidget(false);
  this.loginEl.disabled = false;
};

Util.inPageLoginObj.prototype.isLoggedIn = function() {
  return is_logged_in;
};

Util.inPageLoginObj.prototype.setLoginStatus = function() {
  is_logged_in = true;
};


Util.inPageLoginObj.prototype.onFocus = function() {
  if (!this.loginEl) return;
  if (this.isLoggedIn()){
		//logged in, proceed with the callBkFunc;
		this.execallbk();
		return;
	}
  this.showLogInWidget(true);
  if (this.loginEl.type === 'textarea'){
    this.loginEl.disabled = true;

  }
};

Util.inPageLoginObj.prototype.showLogInWidget = function(shown) {
  if (!this.loginEl) return;
  ////////////////////////////////
  var offset = $(this.loginEl).offset(); 
  var w= offset.left -500;
  var h= offset.top - 270 + this.loginEl.clientHeight;
  if (w <0) w = 50;
  if (h <0) h = 20;
  
  if (shown) {
    $('#myinpagelogin').show();
    var me = this;
    
    $('#InPageLoginBtn').click(function(){me.onInPageLogin();return false;});
    $('#myInPageLoginCancelBtn').click(function(){me.cancelLogin();return false;});

    this.showLoginInput(true);
    $('#myinpagelogin').css({position:'absolute',left:w+'px',top:h+'px'});
    $('#user_name').focus();

  }else{
    $('#myinpagelogin').hide();
    $('#InPageLoginBtn').unbind('click');
  }  
};

Util.inPageLoginObj.prototype.showLoginInput = function(shown) {
  shown ? $('#loginWidget').show() : $('#loginWidget').hide() ;
};

Util.inPageLoginObj.prototype.showMsg = function (msg){
  var el = document.getElementById('messages');
  if (!msg) {
    el.innerHTML  = '';
    el.style.display="none";
    return;  
  }
  el.style.display="block";
  el.innerHTML = '<b>'+msg+"</b>";
};
Util.inPageLoginObj.prototype.myLoginSuc = function (o){
  var obj = o;
  if (!obj || obj.length < 2 ){
    this.showMsg('respond obj is not valid! Please Try Again');
    this.showLoginInput(true);
  }else {
    if (!obj[0]){
      //check returning value,
      //if false set, something wrong with the login
      this.showMsg(obj[1]);
      this.showLoginInput(true);
    }else{
    	this.setLoginStatus();
    	this.showLogInWidget(false);
    	this.showLoginInput(true);
      if (this.callBkFunc) {
        //call the continue function if suc;
        this.execallbk();
      	this.loginEl.disabled = false;
      }
    }
  }
};

Util.inPageLoginObj.prototype.myLoginFail = function (o){
  this.showMsg('error occurs while trying to send the request, please check!');
  this.showLoginInput(true);
};

Util.inPageLoginObj.prototype.onInPageLogin = function () {
  if ($('#user_name').val()=="" || $('#user_password').val()=="") {
    this.showMsg('Please Input Valid User Name and Password');
    return;
  }
  this.showLoginInput(false);
  this.showMsg('Please Wait while we are trying to Log you in!');
  var me = this;
  $.ajax({
   type: "POST",
   url: '/account/ajax_login',
   data: 'name='+$('#user_name').val()+'&password='+$('#user_password').val()+'&remember_me='+$('#user_remember_me').val(),
   success: function(o){me.myLoginSuc(o);},
   error : function(o){me.myLoginFail(o);},
   dataType : 'json'
  });
};