function fadeEffect() { }

fadeEffect.prototype.startOnCss = function(self) { alert('abstract'); }
fadeEffect.prototype.startOffCss = function(self) { alert('abstract'); }
fadeEffect.prototype.effectOn = function() { alert('abstract'); }
fadeEffect.prototype.effectOff = function() { alert('abstract'); }

fadeEffect.prototype.showEffect = function() {
    if (this.state == 'fadein' || this.state == 'timein' || this.state == 'visible') return;
    
    var self = this;
    var startEffect = function() {        
      self.state = 'fadein';
      self.startOnCss(self);
      self.effectOn();
    }

    if (this.state == 'fadeout') {
      window.clearTimeout(this.timer);
      startEffect();
      return;
    }
    

    if (arguments.length == 0 && this.showTimeout > 0) {    
      if (this.timer != null) {
          window.clearTimeout(this.timer);                    
      }
      this.state = 'timein';
      this.timer = window.setTimeout(startEffect, this.showTimeout);
    }
    else {
      startEffect();
    }
}

fadeEffect.prototype.hideEffect = function() {
    if (this.state == 'fadeout' || this.state == 'timeout' || this.state == 'hidden') return;
    
    var self = this;
    var startEffect = function() {        
      self.state = 'fadeout';
      self.startOffCss(self);
      self.effectOff();
    }

    if (this.state == 'fadein') {
      window.clearTimeout(this.timer);
      startEffect();
      return;
    }
    
    if (arguments.length == 0 && this.hideTimeout > 0) {
      if (this.timer != null) {
          window.clearTimeout(this.timer);                    
      }
      this.state = 'timeout';
      this.timer = window.setTimeout(startEffect, this.hideTimeout);
    }
    else {
      startEffect();
    }
}








function hoverMenu(id, hideTimeout, showTimeout, fadeInTime, fadeOutTime, fadeInStep, fadeOutStep) {
    this.timer = null;
    this.id = id;
    this.element = document.getElementById(id);
    this.hideTimeout = hideTimeout;
    this.showTimeout = showTimeout;
    this.state = 'hidden';
    this.opacity = 0;
    this.fadeInStep = fadeInStep;
    this.fadeOutStep = fadeOutStep;
    this.fadeInStepTime = parseInt(fadeInTime * this.fadeInStep);
    this.fadeOutStepTime = parseInt(fadeOutTime * this.fadeOutStep);  
}
hoverMenu.prototype = new fadeEffect;

hoverMenu.prototype.startOnCss = function(self) {
  self.element.style.zIndex = "10";
  self.element.style.cssFloat = 'left';
  self.element.style.marginRight = '100px';
}
hoverMenu.prototype.stopOnCss = function() { }
hoverMenu.prototype.stopOffCss = function(self) {
  self.element.style.opacity = self.opacity;
	self.element.style.filter = "alpha(opacity=" + self.opacity*100 + ")";
	self.element.style.cssFloat = "right";
	self.element.style.marginRight = "0px";
}
hoverMenu.prototype.startOffCss = function(self) {
  self.element.style.zIndex = "0";
}
hoverMenu.prototype.effectOn = function() {
  var self = this;

	this.opacity += this.fadeInStep;
  this.element.style.opacity = this.opacity;
	this.element.style.filter = "alpha(opacity=" + this.opacity*100 + ")";

	if (this.opacity < 1) this.timer = window.setTimeout(function() { self.effectOn(); }, this.fadeInStepTime);
  else { 
    this.state = 'visible';
    this.opacity = 1;
  }
}
hoverMenu.prototype.effectOff = function() {
  var self = this;

	this.opacity -= this.fadeOutStep;
  this.element.style.opacity = this.opacity;
	this.element.style.filter = "alpha(opacity=" + this.opacity*100 + ")";

  if (this.opacity > 0.00) this.timer = window.setTimeout(function() { self.effectOff(); }, this.fadeOutStepTime); 
  else {
    this.state = 'hidden';
    this.opacity = 0;
    self.stopOffCss(self);
  }
}







function bgColorFade(id, hideTimeout, showTimeout, fadeInTime, fadeOutTime, fadeInSteps, fadeOutSteps, cLimits) {
    this.timer = null;
    this.id = id;
    this.element = document.getElementById(id);
    this.hideTimeout = hideTimeout;
    this.showTimeout = showTimeout;
    this.state = 'hidden';
    
    this.red = cLimits.red0;
    this.green = cLimits.green0;
    this.blue = cLimits.blue0;
    this.cLimits = cLimits;
    this.element.style.backgroundColor = "rgb("+this.red+", "+this.green+", "+this.blue+")";
    
    this.redStepIn    = parseInt((cLimits.red1   - cLimits.red0)   / fadeInSteps);
    this.redStepOut   = parseInt((cLimits.red1   - cLimits.red0)   / fadeOutSteps);
    this.greenStepIn  = parseInt((cLimits.green1 - cLimits.green0) / fadeInSteps);
    this.greenStepOut = parseInt((cLimits.green1 - cLimits.green0) / fadeOutSteps);
    this.blueStepIn   = parseInt((cLimits.blue1  - cLimits.blue0)  / fadeInSteps);
    this.blueStepOut  = parseInt((cLimits.blue1  - cLimits.blue0)  / fadeOutSteps);
    
    this.fadeInSteps = fadeInSteps;
    this.fadeOutSteps = fadeOutSteps;
    this.fadeInStepTime = parseInt(fadeInTime / this.fadeInSteps);
    this.fadeOutStepTime = parseInt(fadeOutTime / this.fadeOutSteps);  
}
bgColorFade.prototype = new fadeEffect;

bgColorFade.prototype.startOnCss = function(self) { }
bgColorFade.prototype.stopOnCss = function(self) { }
bgColorFade.prototype.startOffCss = function(self) { } 
bgColorFade.prototype.stopOffCss = function(self) { }
bgColorFade.prototype.betweenLimits = function() {
  return ( 
    (this.red > Math.min(this.cLimits.red0, this.cLimits.red1) && this.red < Math.max(this.cLimits.red0, this.cLimits.red1)) ||
    (this.green > Math.min(this.cLimits.green0, this.cLimits.green1) && this.green < Math.max(this.cLimits.green0, this.cLimits.green1)) ||
    (this.blue > Math.min(this.cLimits.blue0, this.cLimits.blue1) && this.blue < Math.max(this.cLimits.blue0, this.cLimits.blue1))
  ); 
}
bgColorFade.prototype.effectOn = function() {
  var self = this;

	this.red += this.redStepIn;
  this.green += this.greenStepIn;
  this.blue += this.blueStepIn;
	this.element.style.backgroundColor = "rgb("+this.red+", "+this.green+", "+this.blue+")";

	if ( this.betweenLimits() ) 
    this.timer = window.setTimeout(function() { self.effectOn(); }, this.fadeInStepTime);
  else { 
    this.state = 'visible';
    this.red = this.cLimits.red1;
    this.green = this.cLimits.green1;
    this.blue = this.cLimits.blue1;
    this.element.style.backgroundColor = "rgb("+this.red+", "+this.green+", "+this.blue+")";
  }
}

bgColorFade.prototype.effectOff = function() {
  var self = this;

	this.red -= this.redStepOut;
  this.green -= this.greenStepOut;
  this.blue -= this.blueStepOut;
	this.element.style.backgroundColor = "rgb("+this.red+", "+this.green+", "+this.blue+")";

  if ( this.betweenLimits() ) this.timer = window.setTimeout(function() { self.effectOff(); }, this.fadeOutStepTime); 
  else {
    this.state = 'hidden';
    this.red = this.cLimits.red0;
    this.green = this.cLimits.green0;
    this.blue = this.cLimits.blue0;
    this.element.style.backgroundColor = "rgb("+this.red+", "+this.green+", "+this.blue+")";
  }
}




//IE
function hoverMenuIE(id) {    
  this.id = id;
  this.element = document.getElementById(id);
  //this.state = 'hidden';
}
hoverMenuIE.prototype.hideEffect = function() {
  this.element.style.styleFloat = "right";
}
hoverMenuIE.prototype.showEffect = function() {
  this.element.style.styleFloat = 'left';
}



/*
var args = { red0: 76, red1: 255, green0: 255, green1: 121, blue0: 255, blue1: 84 };
var test = new bgColorFade('leftmenu_1', 0, 0, 400, 1000, 20, 20, args);
*/

