// JavaScript Document

var currContent = 1;
var direction;
var animArray = new Array();
var isAnimating = false;
var animInt = 20;


/******animObj
	targ: the DOM object to animate
	newXPos: the position to animate to
	currPos: an array with currPos[0] = the current position, currPos[1] = units
	speed: animation speed
	accel: acceleration
	posDef: the CSS positioning style (targ.style.right, left, top, bottom)
*/

function startScroll(scrollNum) {
	targ = document.getElementById('backgroundPics');
	currPos = targ.style.top;
	scrollNum--;
	if (currPos == "") {
		currPos = 0;	
	} else {
		currPos = parseInt(currPos);
	}
	newPos = -scrollNum*255;
	if (newPos > currPos) {
		speed = 1;
		accel = 1;
	}  else {
		speed = -1;
		accel = -1;
	}
	
	varArray = Array(targ, newPos, Array(currPos, 'px'), speed, accel, 'top');
	//alert(varArray);
	animObj(targ, newPos, Array(currPos, 'px'), speed, accel, 'top');
}

function startFade(target, startColor, endColor) {
	//alert(target);
	if (startColor > endColor) {
		speed = -0x040000;
	} else {
		speed = 0x060000;
	}
	//alert(speed);
	//alert(Math.abs(startColor + speed) + " " + Math.abs(endColor));
	//alert(newColor.toString(16));
	animObj(target, endColor, Array(startColor, ''), speed, 0, 'color');
}


function animObj(targ, newPos, currPos, speed, accel, posDef) {
	
	animDef = Array(targ, newPos, currPos, speed, accel, posDef, true);
	//alert(animDef);
	animArray.push(animDef);
	if (!isAnimating) {
		isAnimating = true;
		animLoop();
	}
}



function animLoop() {
	
		var numAnim = animArray.length;
		var numTrue = 0;
		//alert(numAnim);
		for (var i=0; i < numAnim; i++) {
			currAnim = animArray[i];
			if (currAnim[6]) {
				if (currAnim[3] > 0) {
					if ((currAnim[2][0] + currAnim[3]) > currAnim[1]) {
						currAnim[2][0] = currAnim[1];
						currAnim[6] = false;
					} else {
						currAnim[2][0] = currAnim[2][0] + currAnim[3];
						numTrue++;
					}
				} else {
					if (currAnim[5] == 'color') {
						if (currAnim[2][0] + currAnim[3] < currAnim[1]) {
						currAnim[2][0] = currAnim[1];
						currAnim[6] = false;
						//alert(i);
					} else {
						currAnim[2][0] = currAnim[2][0] + currAnim[3];
						numTrue++;
					}
					} else {
					
					if (Math.abs(currAnim[2][0] + currAnim[3]) > Math.abs(currAnim[1])) {
						currAnim[2][0] = currAnim[1];
						currAnim[6] = false;
						//alert(i);
					} else {
						currAnim[2][0] = currAnim[2][0] + currAnim[3];
						numTrue++;
					}
					}
				}
				currAnim[3] = currAnim[3] + currAnim[4];
				if (currAnim[5] == 'color') {
					newColor = currAnim[2][0].toString(16);
					while(newColor.length<6){newColor="0"+newColor;}
					currAnim[0].style[currAnim[5]] = '#' + newColor;
				} else {	 
					currAnim[0].style[currAnim[5]] = currAnim[2].join('');
				}
			}
		}
		
		
		
		if (numTrue > 0) {
			s = setTimeout(animLoop, animInt);
			//alert(posDef);
		} else {
			isAnimating = false;	
		}
}

// main function to process the fade request //
function colorFade(id,element,start,end,steps,speed) {
  var startrgb,endrgb,er,eg,eb,step,rint,gint,bint,step;
  var target = id; //document.getElementById(id);
  steps = steps || 20;
  speed = speed || 20;
  clearInterval(target.timer);
  endrgb = colorConv(end);
  er = endrgb[0];
  eg = endrgb[1];
  eb = endrgb[2];
  if(!target.r) {
    startrgb = colorConv(start);
    r = startrgb[0];
    g = startrgb[1];
    b = startrgb[2];
    target.r = r;
    target.g = g;
    target.b = b;
  }
  rint = Math.round(Math.abs(target.r-er)/steps);
  gint = Math.round(Math.abs(target.g-eg)/steps);
  bint = Math.round(Math.abs(target.b-eb)/steps);
  if(rint == 0) { rint = 1 }
  if(gint == 0) { gint = 1 }
  if(bint == 0) { bint = 1 }
  target.step = 1;
  target.timer = setInterval( function() { animateColor(id,element,steps,er,eg,eb,rint,gint,bint) }, speed);
}

// incrementally close the gap between the two colors //
function animateColor(id,element,steps,er,eg,eb,rint,gint,bint) {
  var target = id //document.getElementById(id);
  var color;
  if(target.step <= steps) {
    var r = target.r;
    var g = target.g;
    var b = target.b;
    if(r >= er) {
      r = r - rint;
    } else {
      r = parseInt(r) + parseInt(rint);
    }
    if(g >= eg) {
      g = g - gint;
    } else {
      g = parseInt(g) + parseInt(gint);
    }
    if(b >= eb) {
      b = b - bint;
    } else {
      b = parseInt(b) + parseInt(bint);
    }
    color = 'rgb(' + r + ',' + g + ',' + b + ')';
    if(element == 'background') {
      target.style.backgroundColor = color;
    } else if(element == 'border') {
      target.style.borderColor = color;
    } else {
      target.style.color = color;
    }
    target.r = r;
    target.g = g;
    target.b = b;
    target.step = target.step + 1;
  } else {
    clearInterval(target.timer);
    color = 'rgb(' + er + ',' + eg + ',' + eb + ')';
    if(element == 'background') {
      target.style.backgroundColor = color;
    } else if(element == 'border') {
      target.style.borderColor = color;
    } else {
      target.style.color = color;
    }
  }
}

// convert the color to rgb from hex //
function colorConv(color) {
  var rgb = [parseInt(color.substring(0,2),16), 
    parseInt(color.substring(2,4),16), 
    parseInt(color.substring(4,6),16)];
  return rgb;
}