var jsiAni_Direction;
var jsiAni_Element;
var jsiAni_Position;
var jsiAni_Object;
var jsiAni_ScrollInfo;

function jsiAnimation_FadeIn (pElementId, pOpacity, pStep, pMilliSeconds) {

   if ($(pElementId) == null) return;

   if (pOpacity <= 100) {
      jsiAnimation_OpacitySet ($(pElementId), pOpacity);
      pOpacity += pStep;
      //window.clearTimeout();
      jsiTimeoutId = window.setTimeout("jsiAnimation_FadeIn('" + pElementId + "'," + pOpacity + ", " + pStep + ", " + pMilliSeconds + ")", pMilliSeconds);
      if ($(pElementId).style.visibility == "hidden")
          $(pElementId).style.visibility =  "visible";
   }

}

function jsiAnimation_OpacitySet (pElement, pOpacity) {

   if (pElement == null) return;

   pOpacity = (pOpacity == 100) ? 99.999 : pOpacity;
  
   // IE/Win
   pElement.style.filter = "alpha(opacity=" + pOpacity + ")";

   // Safari<1.2, Konqueror
   pElement.style.KHTMLOpacity = pOpacity/100;

   // Older Mozilla and Firefox
   pElement.style.MozOpacity = pOpacity/100;

   // Safari 1.2, newer Firefox and Mozilla, CSS3
   pElement.style.opacity = pOpacity/100;

}

function jsiAnimation_ScrollContent (pDirection,  // Up, Down, Left, Right
                                     pElementId,
                                     pPosition,   // top to be scrolled if up or down, left to be scrolled if left or right
                                     pObject)
{
var pos1, pos2, pos3, posParameter;

   jsiAni_Direction = pDirection.toUpperCase ();
   jsiAni_Element   = $(pElementId);
   jsiAni_Object    = pObject;

   if (jsiAni_Direction == "UP") {
      jsiAni_ScrollInfo = new Array(2);
      jsiAni_ScrollInfo[0] = new Array(3);
      jsiAni_ScrollInfo[0][0] = jsiAni_Element.scrollTop - ((jsiAni_Element.scrollTop - pPosition) * .93);
      jsiAni_ScrollInfo[0][1] = 1;
      jsiAni_ScrollInfo[0][2] = 25;
      jsiAni_ScrollInfo[1] = new Array(3);
      jsiAni_ScrollInfo[1][0] = pPosition;
      jsiAni_ScrollInfo[1][1] = 7;
      jsiAni_ScrollInfo[1][2] = 10;
      jsiAnimation_ScrollContentUp();

   }

   if (jsiAni_Direction == "DOWN") {
      jsiAni_ScrollInfo = new Array(2);
      jsiAni_ScrollInfo[0] = new Array(3);
      jsiAni_ScrollInfo[0][0] = jsiAni_Element.scrollTop + ((pPosition - jsiAni_Element.scrollTop) * .93);
      jsiAni_ScrollInfo[0][1] = 7;
      jsiAni_ScrollInfo[0][2] = 10;
      jsiAni_ScrollInfo[1] = new Array(3);
      jsiAni_ScrollInfo[1][0] = pPosition;
      jsiAni_ScrollInfo[1][1] = 1;
      jsiAni_ScrollInfo[1][2] = 25;
      jsiAnimation_ScrollContentDown();
   }

   if (jsiAni_Direction == "LEFT") {
      jsiAni_Position  = jsiAni_Element.scrollLeft - ((jsiAni_Element.scrollLeft - pPosition) * .90);
      jsiAnimation_ScrollContentLeft(10);
      jsiAni_Position  = pPosition;
      jsiAnimation_ScrollContentLeft(250);
   }

   if (jsiAni_Direction == "RIGHT") {
      jsiAni_Position  = jsiAni_Element.scrollLeft + ((pPosition - jsiAni_Element.scrollLeft) * .90);
      jsiAnimation_ScrollContentRight(10);
      jsiAni_Position  = pPosition;
      jsiAnimation_ScrollContentRight(250);
   }

}

function jsiAnimation_ScrollContentUp (pMiliSeconds) {
// parameters 75,3,250;275,5,100;300,1,500;
//  1 ---> scroll by 3 pixels until top is  75 each 250 milliseconds 
//  2 ---> scroll by 5 pixels until top is 275 each 100 milliseconds 
//  3 ---> scroll by 1 pixels until top is 300 each 500 milliseconds 
var i,
    step=0,
    mseconds=0;

   for (i=0; i<jsiAni_ScrollInfo.length; i++) {
   	 if (jsiAni_Element.scrollTop >= jsiAni_ScrollInfo [i][0]) {
   	 	 step     = jsiAni_ScrollInfo [i][1];
   	 	 mseconds = jsiAni_ScrollInfo [i][2];
   	 }
   }

   if (step > 0) {
      jsiAni_Element.scrollTop -= step;
      jsiAni_Object.ButtonPosition();
      jsiTimeoutId = window.setTimeout("jsiAnimation_ScrollContentUp()", mseconds);
   }

}

function jsiAnimation_ScrollContentDown () {
// parameters 75,3,250;275,5,100;300,1,500;
//  1 ---> scroll by 3 pixels until top is  75 each 250 milliseconds 
//  2 ---> scroll by 5 pixels until top is 275 each 100 milliseconds 
//  3 ---> scroll by 1 pixels until top is 300 each 500 milliseconds 
var i,
    step=0,
    mseconds=0;

   for (i=jsiAni_ScrollInfo.length-1; i>=0; i--) {
   	 if (jsiAni_Element.scrollTop <= jsiAni_ScrollInfo [i][0]) {
   	 	 step     = jsiAni_ScrollInfo [i][1];
   	 	 mseconds = jsiAni_ScrollInfo [i][2];
   	 }
   }

   if (step > 0) {
      jsiAni_Element.scrollTop += step;
      jsiAni_Object.ButtonPosition();
      jsiTimeoutId = window.setTimeout("jsiAnimation_ScrollContentDown()", mseconds);
   }

}

function jsiAnimation_ScrollContentLeft (pMiliSeconds) {

   if (jsiAni_Element.scrollLeft > jsiAni_Position) {
      jsiAni_Element.scrollLeft -= 1;
      jsiAni_Object.ButtonPosition();
      jsiWait(pMiliSeconds);
      jsiAnimation_ScrollContentLeft(pMiliSeconds);
   }

}

function jsiAnimation_ScrollContentRight (pMiliSeconds) {

   if (jsiAni_Element.scrollLeft < jsiAni_Position) {
      jsiAni_Element.scrollLeft += 1;
      jsiAni_Object.ButtonPosition();
      jsiWait(pMiliSeconds);
      jsiAnimation_ScrollContentRight(pMiliSeconds);
   }

}

////////////////////////////////////////////////////


////////////////////////////////////////////////////
var Animator = new jsiAnimation();

function jsiAnimation ()
{
   //
   // attributes
   //
   this.objects = new Array();
   this.index=0;
   //
   // functions
   //
   this.stop          = jsiAnimation_Stop;
   this.animate       = jsiAnimation_Animate;
   this.animateColor  = jsiAnimation_AnimateColor;
   this.shake         = jsiAnimation_Shake;
   this.grow          = jsiAnimation_Grow;
   this.backAndForth  = jsiAnimation_BackAndForth;

}

// clear the animation by timer id
function jsiAnimation_Stop (pIndex) {

   // IE7 & IE8 does not cause animations so check if animation exists.
   if (this.objects[pIndex]) {
   	this.objects[pIndex].stop = true;
      window.clearTimeout (this.objects[pIndex].timerId);
   }

}

/////////////
// ANIMATE //
/////////////

function jsiAnimation_Animate (pElementId, pPoperty, pFrom, pTo, pUnit, pInterval, pDuration, pShowOnTop, pFunction, pWait) {

   // pPropert can be ... (any numerical property)   
   //   'left', 'top', 'right', 'bottom', 'width', 'height', 'margin-top', 'padding-top', 'font-size', 'opacity', etc...
   // pUnit can be ... any of the follwings
   //   'px', 'em', '%', '' 

   this.objects[this.index] = new jsiAnimation_Item (this.index, pElementId, pPoperty, pFrom, pTo, pUnit, pInterval, pDuration, pShowOnTop, pFunction, pWait);
   this.index += 1;
   return this.index - 1; 

}

function jsiAnimation_Item (pIndex, pElementId, pPoperty, pFrom, pTo, pUnit, pInterval, pDuration, pShowOnTop, pFunction, pWait)
{
   //
   // attributes
   //
   this.index = pIndex;
   this.id = pElementId;
   this.element = $(this.id);
   this.timerId;
   this.property = pPoperty;
   this.from;
   this.to = pTo;
   this.unit = pUnit;
   this.interval = pInterval;
   this.duration = pDuration;
   this.showOnTop = pShowOnTop;
   this.functionCB = pFunction;
   this.increment;
   this.wait = pWait;

   //
   // functions
   //
   this.doAnimate = jsiAnimation_DoAnimate;
   //
   // Constructor
   //
   
   // if pfrom is given, it is not null, set the proporty to the given value
   if (pFrom != null) {
      this.from = pFrom;
      if (this.property == "opacity") {
         if (jsiIEVersion () > 0) this.element.style.filter = "alpha(opacity=" + (this.from * 100.0) + ")";
            else                  this.element.style.opacity = this.from;
      }
      else this.element.style[this.property] = this.from + this.unit;
   }
   else this.from = jsiGetStyleInt (this.element.id, this.property);

   this.increment = (this.to - this.from) / (this.duration / this.interval);

   // if IE7 or IE8 do not animate, they are so slow... just do one-step.
   if (jsiIEVersion () > 0 && jsiIEVersion () < 9)
      this.from = this.to - this.increment;

   if (this.showOnTop) this.element.style.zIndex = "10000";
   if (this.wait) this.timerId = window.setTimeout ("Animator.objects["+this.index+"].doAnimate()", this.wait);
      else this.doAnimate ();

}

function jsiAnimation_DoAnimate () {
var doItAgain=false;

   this.from += this.increment;

   // if we are increasing the value
   if (this.increment > 0)

      // if value is still less than the value
      if (this.from < this.to) {
         if (this.property == "opacity") {
            if (jsiIEVersion () > 0) this.element.style.filter ="alpha(opacity=" + (this.from * 100.0) + ")";
               else                  this.element.style.opacity = this.from;
         }
         else this.element.style[this.property] = this.from + this.unit;
         doItAgain=true;
      	}

      // if value is reached to the value given
      else {
           if (this.property == "opacity") {
              if (jsiIEVersion ()) {
                 if (this.to == 1) jsiRemoveProperty (this.element, "opacity");
                    else           this.element.style.filter ="alpha(opacity=" + (this.to * 100.0) + ")";
              }
              else this.element.style.opacity = this.to;
           }
      	  else this.element.style[this.property] = this.to + this.unit;
      	  }

   // if we are decreasing the value
   if (this.increment < 0)

      // if value is still greater than the value
      if (this.from > this.to) {
         if (this.property == "opacity") {
            if (jsiIEVersion ()) this.element.style.filter ="alpha(opacity=" + (this.from * 100.0) + ")";
               else              this.element.style.opacity = this.from;
         }
         else this.element.style[this.property] = this.from + this.unit;
         doItAgain=true;
      	}
      // if value is reached to the value given
      else {
           if (this.property == "opacity") {
              if (jsiIEVersion ()) this.element.style.filter ="alpha(opacity=" + (this.to * 100.0) + ")";
                 else              this.element.style.opacity = this.to;
           }
      	  else this.element.style[this.property] = this.to + this.unit;
      	  }
   if (doItAgain) 
      this.timerId = window.setTimeout ("Animator.objects["+this.index+"].doAnimate()", this.interval);
   else {
        jsiRemoveProperty (this.element, "z-index");
        if (this.functionCB) this.functionCB();
   }

}

///////////////////
// ANIMATE COLOR //
///////////////////

function jsiAnimation_AnimateColor (pElementId, pPoperty, pFrom, pTo, pInterval, pDuration, pFunction) {

   // pPropert can be ... 
   //   color, background-color, border-color

   this.objects[this.index] = new jsiAnimation_ColorItem (this.index, pElementId, pPoperty, pFrom, pTo, pInterval, pDuration, pFunction);
   this.index += 1;
   return this.index - 1; 

}

function jsiAnimation_ColorItem (pIndex, pElementId, pPoperty, pFrom, pTo, pInterval, pDuration, pFunction)
{
   //
   // attributes
   //
   this.index = pIndex;
   this.id = pElementId;
   this.element = $(this.id);
   this.timerId;
   this.property = pPoperty;
   this.from;
   this.to;
   this.rInc;
   this.gInc;
   this.bInc;
   this.interval = pInterval;
   this.duration = pDuration;
   this.functionCB = pFunction;
   //
   // functions
   //
   this.doColorAnimate = jsiAnimation_DoColorAnimate;
   //
   // Constructor
   //
   
   // if pfrom is given, it is not null, set the proporty to the given value
   if (pFrom) {
      this.from = new jsiRGBColor(pFrom);
      this.element.style[this.property] = this.from.toHex();
   }
   else {
   	  // bu kontrol IE8 ve aşağısı background-color'da problem çıkardığı için eklenmiştir...
   	  if (jsiGetStyle(this.id, this.property) == undefined) this.from = new jsiRGBColor("#FFFFFF");
   	     else                                               this.from = new jsiRGBColor(jsiGetStyle(this.id, this.property));
   }
   this.to = new jsiRGBColor(pTo);

   this.rInc = Math.floor((this.to.r - this.from.r) / (this.duration / this.interval));
   this.gInc = Math.floor((this.to.g - this.from.g) / (this.duration / this.interval));
   this.bInc = Math.floor((this.to.b - this.from.b) / (this.duration / this.interval));

   // if IE7 or IE8 do not animate, they are so slow... just do one-step.
   if (jsiIEVersion () > 0 && jsiIEVersion () < 9) {
      this.from.r = this.to.r - this.rInc;
      this.from.g = this.to.g - this.gInc;
      this.from.b = this.to.b - this.bInc;
   }

   this.doColorAnimate ();

}

function jsiAnimation_DoColorAnimate () {

   this.from.r += this.rInc;
   this.from.g += this.gInc;
   this.from.b += this.bInc;

   if (this.rInc > 0 && this.from.r > this.to.r) this.from.r = this.to.r;
   if (this.gInc > 0 && this.from.g > this.to.g) this.from.g = this.to.g;
   if (this.bInc > 0 && this.from.b > this.to.b) this.from.b = this.to.b;
   if (this.rInc < 0 && this.from.r < this.to.r) this.from.r = this.to.r;
   if (this.gInc < 0 && this.from.g < this.to.g) this.from.g = this.to.g;
   if (this.bInc < 0 && this.from.b < this.to.b) this.from.b = this.to.b;

   this.element.style[jsiCamelize(this.property)] = this.from.toHex();
   if (this.from.r != this.to.r || this.from.g != this.to.g || this.from.b != this.to.b) {
      this.timerId = window.setTimeout ("Animator.objects["+this.index+"].doColorAnimate()", this.interval);
   }
   else if (this.functionCB) this.functionCB();

}

///////////
// SHAKE //
///////////

function jsiAnimation_Shake (pElementId, pSize, pLoopCount, pInterval, pFunction) {

   // pSize      --> is the pixels used to move in shaking action 
   // pLoopCount --> how long the object will be shaked

   // if IE7 or IE8 do not animate, they are so slow... just exit.
   if (jsiIEVersion () > 0 && jsiIEVersion () < 9)
      return;

   this.objects[this.index] = new jsiAnimation_ShakeItem (this.index, pElementId, pSize, pLoopCount, pInterval, pFunction);
   this.index += 1;
   return this.index - 1; 

}

function jsiAnimation_ShakeItem (pIndex, pElementId, pSize, pLoopCount, pInterval, pFunction)
{
   //
   // attributes
   //
   this.index = pIndex;
   this.id = pElementId;
   this.element = $(this.id);
   this.timerId;
   this.top  = jsiGetStyleInt (this.id, "top");
   this.left = jsiGetStyleInt (this.id, "left");
   this.size = pSize;
   this.loopCount = pLoopCount;
   this.interval = pInterval;
   this.functionCB = pFunction;
   this.frame = 1;
   //
   // functions
   //
   this.doShake = jsiAnimation_DoShake;
   //
   // Constructor
   //
   this.doShake ();

}

function jsiAnimation_DoShake () {

   // move the object according to the frame count
   if (this.frame == 1)
      this.element.style.top = this.top + this.size + "px";
   else if (this.frame == 2)
           this.element.style.left = this.left + this.size + "px";
        else if (this.frame == 3)
                  this.element.style.top  = this.top  - this.size + "px";
             else this.element.style.left = this.left - this.size + "px";

   this.frame++;
   // all frames are shown, reset the frame count and decrease the loop count
   if (this.frame > 4) {
   	this.frame = 1;
      this.loopCount--;
   }
   if (this.loopCount < 1) {
      this.element.style.top  = this.top + "px";
      this.element.style.left = this.left + "px";
   	if (this.functionCB) this.functionCB();
   	return;
   }

   this.timerId = window.setTimeout ("Animator.objects["+this.index+"].doShake()", this.interval);

}

//////////
// GROW //
//////////

function jsiAnimation_Grow (pElementId, pFrom, pTo, pInterval, pDuration, pShowOnTop, pBackToOrigin, pFontResize, pFunction) {

   // pFrom & pTo ---> percent to grow, both width & height 
   // pTo > pFrom --> element grows    from 100 to 120
   // pFrom > pTo --> element shrinks  from 120 to 100

   this.objects[this.index] = new jsiAnimation_GrowItem (this.index, pElementId, pFrom, pTo, pInterval, pDuration, pShowOnTop, pBackToOrigin, pFontResize, pFunction);
   this.index += 1;
   return this.index - 1; 

}

function jsiAnimation_GrowItem (pIndex, pElementId, pFrom, pTo, pInterval, pDuration, pShowOnTop, pBackToOrigin, pFontResize, pFunction)
{
   //
   // attributes
   //
   this.index = pIndex;
   this.id = pElementId;
   this.element = $(this.id);
   this.timerId;
   this.fromSaved = pFrom;
   this.from = pFrom;
   this.to = pTo;
   this.increment;                        // percent to gwow or shrink each time
   this.incWidth;                         // pixel for width  to use each frame 
   this.incHeight;                        // pixel for height to use each frame
   this.interval = pInterval;
   this.duration = pDuration;
   this.showOnTop = pShowOnTop;
   this.back = pBackToOrigin;
   this.fontResize = pFontResize;
   this.functionCB = pFunction;
   this.width;
   this.height;
   this.left;
   this.top;
   //
   // functions
   //
   this.doGrow = jsiAnimation_DoGrow;
   //
   // Constructor
   //
   this.width     = jsiToNumber (jsiGetStyle(this.id, "width"));
   this.height    = jsiToNumber (jsiGetStyle(this.id, "height"));
   this.left      = jsiToNumber (jsiGetStyle(this.id, "left"));
   this.top       = jsiToNumber (jsiGetStyle(this.id, "top"));
   this.increment = (this.to - this.from) / (this.duration / this.interval);
   this.incWidth  = this.width  * this.increment / 100;
   this.incHeight = this.height * this.increment / 100;

   if (this.showOnTop) this.element.style.zIndex = "10000";

   // if pFrom is not 100 first resize the object according to pFrom
   if (pFrom != 100) {
   	this.left  += (this.width  - (this.width  + this.incWidth)  )  / 2;
   	this.top   += (this.height - (this.height + this.incHeight) ) / 2;
   	this.width  = this.width  + this.incWidth;
   	this.height = this.height + this.incHeight;
   	this.element.style.width  = this.width  + "px";
   	this.element.style.height = this.height + "px";
   	this.element.style.left   = this.left   + "px";
   	this.element.style.top    = this.top    + "px";
   }

   // if IE7 or IE8 do not animate, they are so slow... just do one step;
   if (jsiIEVersion () > 0 && jsiIEVersion () < 9) {
      if (this.back) return;
      this.from = this.to;
   }

   this.doGrow ();

}

function jsiAnimation_DoGrow () {
var doItAgain=false;

   // if we are increasing the value & value is still less than the value
   if (this.increment > 0 && this.from < this.to) doItAgain=true;
   // if we are decreasing the value & value is still greater than the value
   if (this.increment < 0 && this.from > this.to) doItAgain=true;

   if (doItAgain) {

      this.from += this.increment;

   	var newWidth  = this.width  + this.incWidth;
   	var newHeight = this.height + this.incHeight;
   	this.left  += (this.width  - newWidth)  / 2;
   	this.top   += (this.height - newHeight) / 2;
   	this.width  = newWidth;
   	this.height = newHeight;
   	this.element.style.width    = this.width  + "px";
   	this.element.style.height   = this.height + "px";
   	this.element.style.left     = this.left   + "px";
   	this.element.style.top      = this.top    + "px";
   	if (this.fontResize) {
         var size = jsiToNumber (jsiGetStyle(this.id, "font-size"));
         this.element.style.fontSize =  size + (size * this.increment / 100) + "px";
      }
   	this.timerId = window.setTimeout ("Animator.objects["+this.index+"].doGrow()", this.interval);
   }
   else {
   	  // if back is true --> shrink the grow element or vice versa
   	  if (this.back) {
   	  	  this.from = this.to;
   	  	  this.to   = this.fromSaved;
   	  	  this.increment *= -1;
   	  	  this.incWidth *= -1;
   	  	  this.incHeight *= -1;
   	  	  this.back = false;
   	  	  this.doGrow ();
   	  }
   	  else {
             jsiRemoveProperty (this.element, "z-index");
   	  	    if (this.functionCB) this.functionCB();
   	  }
   }

}

//////////////////
// BACK & FORTH //
//////////////////

function jsiAnimation_BackAndForth (pElementId, pProperty, pMax, pStep, pInterval) {

   // pProperty --> can be anything like "top", "left", ...
   // pMax      --> is the max value, until max value is reached value is incremented by step,
   //                                 after max value is reached value is decremented by step
   // pStep     --> if value is 1, value is incremented 1 by 1, if value is 2 value is incrmented 2 by 2

   // if IE7 or IE8 do not animate, they are so slow... just exit.
   if (jsiIEVersion () > 0 && jsiIEVersion () < 9)
      return;

   this.objects[this.index] = new jsiAnimation_BackAndForthItem (this.index, pElementId, pProperty, pMax, pStep, pInterval);
   this.index += 1;
   return this.index - 1; 

}

function jsiAnimation_BackAndForthItem (pIndex, pElementId, pProperty, pMax, pStep, pInterval)
{
   //
   // attributes
   //
   this.index = pIndex;
   this.id = pElementId;
   this.element = $(this.id);
   this.timerId;
   this.property = pProperty;
   this.max = pMax;
   this.step = pStep;
   this.iteration = 0;
   this.interval = pInterval;
   this.stop = false;

   //
   // functions
   //
   this.doBackAndForth = jsiAnimation_DoBackAndForth;
   //
   // Constructor
   //
   this.doBackAndForth ();

}

function jsiAnimation_DoBackAndForth () {

   if (this.stop == false) {
      this.element.style[this.property] = (jsiGetStyleInt (this.id, this.property)  + this.step) + "px";
    	this.iteration += this.step;

      if (this.iteration > this.max) { this.iteration = this.max; this.step = -1; }
      if (this.iteration < 0)        { this.iteration = 0;        this.step = +1; }

      if (this.timerId) window.clearTimeout (this.timerId);
      this.timerId = window.setTimeout ("Animator.objects["+this.index+"].doBackAndForth()", this.interval);
   }
   else window.clearTimeout (this.timerId);

}