// mouseTrails.js
// Richard A. DeVenezia, Sep 2003
// http://www.devenezia.com
//

//--------------------------------------------------------------
// global variables

var overColor = '#7093DB'
var outColor  = '#FFFFFF'

var steps = 50
var stepDuration = 40

var cells = new Array()

//--------------------------------------------------------------
function htmlColorString (r,g,b) {
  var r = r.toString(16); if (r.length == 1) r = '0'+r;
  var g = g.toString(16); if (g.length == 1) g = '0'+g;
  var b = b.toString(16); if (b.length == 1) b = '0'+b;

  return "#" + r + g + b
}

//--------------------------------------------------------------
function doTransition (index) {
  var cell = cells [ index ]

  if (cell.step) {
    cell.step --

    var from = overColor.substr(1)
    var   to = outColor.substr(1)
    var step = cell.step

    var r0 = parseInt (from.substr(0,2),16)
    var g0 = parseInt (from.substr(2,2),16)
    var b0 = parseInt (from.substr(4,2),16)

    var r1 = parseInt (  to.substr(0,2),16)
    var g1 = parseInt (  to.substr(2,2),16)
    var b1 = parseInt (  to.substr(4,2),16)

    var r = Math.floor (r1 * ((steps-step)/steps) + r0 * (step/steps))
    var g = Math.floor (g1 * ((steps-step)/steps) + g0 * (step/steps))
    var b = Math.floor (b1 * ((steps-step)/steps) + b0 * (step/steps))

    var color = htmlColorString (r,g,b)

    cell.style.backgroundColor = color
  }

  if ( cell.step != 0 )
    cell.timerId = setTimeout ("doTransition("+index+")", stepDuration)
}

//--------------------------------------------------------------
function over (cell) {
  clearTimeout (cell.timerId)
  cell.step = steps
  cell.style.backgroundColor = overColor
}

//--------------------------------------------------------------
function out (cell) {
  cell.timerId = setTimeout ("doTransition("+cell.index+")", 0)
}

//--------------------------------------------------------------
function makeGrid (nRows, nCols) {
  // Presume TABLE with ID="GRID" already exists

  table = document.getElementById ('GRID');

  for (var i=0; i < table.rows.length; ) {
    table.deleteRow(0)
  }

  cells = new Array()

  for (var i=0; i<nRows; i++) {
    newrow = table.insertRow (i)
    for (var j=0; j< nCols; j++) {
      newcell = newrow.insertCell (j)

      newcell.index = i * nCols + j
      newcell.step = 0
      newcell.timerId = 0

      newcell.onmouseover = function (evt) { over (this) }
      newcell.onmouseout  = function (evt) { out  (this) }

      cells [ newcell.index ] = newcell

      newcell = null
    }
  }
}

//--------------------------------------------------------------
function makeGridSubmit () {
  if (document.GridInput.NROWS.value > 40) document.GridInput.NROWS.value = 40
  if (document.GridInput.NCOLS.value > 40) document.GridInput.NCOLS.value = 40

  makeGrid ( document.GridInput.NROWS.value
           , document.GridInput.NCOLS.value
           )
  return false
}