//colourRun.js
//Dave Carnaghan

//Not fully implemented -prototype only

//Javascript's delay functions don't seem to offer
//much time accuracy, at least in MSIE and Mozilla

//A Javascript "class": ColourRun. Animates the specified 
//CSS colour property of a specified element based on it's starting 
//colour. When stopColourRun() is called, the element is returned
//to it's original colour.
//A new ColourRun object should be instantiated for each
//element to be animated.

/*Example usage: An HTML doc's body tag:

<div id="myEl" onmouseover="myElCR.startColourRun();" 
onmouseout="myElCR.stopColourRun();"></div>

-somewhere further down:-
var myElCR = new ColourRun(document.getElementById("myEl"));
*/

//To do: allow which CSS colour property to be specified

//To do: initialise inc and delay variables with a speed argument

//To do: determine initial colour values by theEl's original colour

//To do: determine min and max colours with a constructer argument


var instanceCounter=0;
var instanceArray = new Array();


//colourRun object constructer
function ColourRun(element, delay) //(element, rgbCol)
{
  this.theEl = element; //reference to the element to be animated

  this.thisObjNum = instanceCounter++;
  //alert to demonstrate the creation of unique object instances
  //alert(this.theEl.id +" "+ this.thisObjNum +" "+ delay);
  instanceArray[this.thisObjNum] = this;

  //this.rgbCol = rgbCol;
  
  this.rgbCol = new Array();  //see to-do list above
  this.rgbCol[0]={init:129, cur:129, min:81, max:171}; 
  this.rgbCol[1]={init:129, cur:129, min:81, max:171};
  this.rgbCol[2]={init:78, cur:78, min:30, max:120};
  //can't seem to define object properties as constant

  this.inc = 9; //colour increment
  this.incSwitch = this.inc*2;

  this.delay = delay;
  //this.delay = 30; //milliseconds

  this.theint = null; //interval reference


  /* methods follow: */
  this.startColourRun = startColourRun;
  this.stopColourRun = stopColourRun;

}


function reset_rgbCol(theObj)
{
  with(theObj){
    for(var z=0; z < rgbCol.length; z++)
      rgbCol[z].cur = rgbCol[z].init;
  }
  renderColour(theObj);
}

function renderColour(theObj)
{
  with(theObj){
    var colour = eval("'"+"rgb("+String(rgbCol[0].cur)+","+String(rgbCol[1].cur)+","+rgbCol[2].cur+")"+"'");

    theEl.style.backgroundColor = colour;
  }
}


function startColourRun()
{
  //alert(this.theEl.id); //realtimethrill.com test

  genFrame(this, true);


  /*--are calls from setInterval() from the global scope?!--*/
  //does not work
  //this.theint = setInterval(genFrame(this), this.delay);

  //WORKS!
  instanceNum = this.thisObjNum;
  this.theint = setInterval("genFrame(instanceArray[instanceNum], false)", this.delay);

  //this.theint = setInterval("genFrame("+ this +")", this.delay);
  //this.theint = setInterval("genFrame("+ eval(this) +")", this.delay);

  //works in Mozilla but not MSIE
  //this.theint = setInterval(genFrame, this.delay, this);
}


function stopColourRun()
{
  if (this.theint) clearInterval(this.theint);

  reset_rgbCol(this);
}


//generate and assign current colour
function genFrame(theObj, firstCall)
{
  if (window.console) console.log("inc = "+theObj.inc);

  //check if firstCall of cycle
  //if so, make sure to increment colour, 
  //not decrement
  if (firstCall) {
    if (theObj.inc < 0) theObj.inc += theObj.incSwitch;
  }

  with(theObj){

    for(var z=0; z < rgbCol.length; z++){
      rgbCol[z].cur += inc;
    }

    //when upper limit reached, start decrementing
    if(rgbCol[0].cur >= rgbCol[0].max){
      inc -= incSwitch;
    }
    //when lower limit reached, start incrementing
    if(rgbCol[0].cur <= rgbCol[0].min){
      inc += incSwitch;
    }
  }

  renderColour(theObj);

  //if (window.console) console.log(colour);
}