
<!--
// preload images
var imgs = new Array()  // use an Array so we can use indices effectively
imgs[0] = new Image()
imgs[0].src = "images/int/00.jpg"
imgs[1] = new Image()
imgs[1].src = "images/int/01.jpg"
imgs[2] = new Image()
imgs[2].src = "images/int/02.jpg"
imgs[3] = new Image()
imgs[3].src = "images/int/03.jpg"
imgs[4] = new Image()
imgs[4].src = "images/int/04.jpg"
imgs[5] = new Image()
imgs[5].src = "images/int/05.jpg"
imgs[6] = new Image()
imgs[6].src = "images/int/06.jpg"
imgs[7] = new Image()
imgs[7].src = "images/int/07.jpg"
imgs[8] = new Image()
imgs[8].src = "images/int/08.jpg"
imgs[9] = new Image()
imgs[9].src = "images/int/09.jpg"
imgs[10] = new Image()
imgs[10].src = "images/int/10.jpg"
imgs[11] = new Image()
imgs[11].src = "images/int/11.jpg"
imgs[12] = new Image()
imgs[12].src = "images/int/12.jpg"
imgs[13] = new Image()
imgs[13].src = "images/int/13.jpg"
imgs[14] = new Image()
imgs[14].src = "images/int/14.jpg"
imgs[15] = new Image()
imgs[15].src = "images/int/15.jpg"
imgs[16] = new Image()
imgs[16].src = "images/int/16.jpg"
imgs[17] = new Image()
imgs[17].src = "images/int/17.jpg"
imgs[18] = new Image()
imgs[18].src = "images/int/18.jpg"
imgs[19] = new Image()
imgs[19].src = "images/int/19.jpg"
imgs[20] = new Image()
imgs[20].src = "images/int/20.jpg"
imgs[21] = new Image()
imgs[21].src = "images/int/21.jpg"
imgs[22] = new Image()
imgs[22].src = "images/int/22.jpg"
imgs[23] = new Image()
imgs[23].src = "images/int/23.jpg"
imgs[24] = new Image()
imgs[24].src = "images/int/24.jpg"
imgs[25] = new Image()
imgs[25].src = "images/int/25.jpg"
imgs[26] = new Image()
imgs[26].src = "images/int/26.jpg"
imgs[27] = new Image()
imgs[27].src = "images/int/27.jpg"
imgs[28] = new Image()
imgs[28].src = "images/int/28.jpg"
imgs[29] = new Image()
imgs[29].src = "images/int/29.jpg"
imgs[30] = new Image()
imgs[30].src = "images/int/30.jpg"
imgs[31] = new Image()
imgs[31].src = "images/int/31.jpg"
imgs[32] = new Image()
imgs[32].src = "images/int/32.jpg"
imgs[33] = new Image()
imgs[33].src = "images/int/33.jpg"
imgs[34] = new Image()
imgs[34].src = "images/int/34.jpg"
imgs[35] = new Image()
imgs[35].src = "images/int/35.jpg"
imgs[36] = new Image()
imgs[36].src = "images/int/36.jpg"
imgs[37] = new Image()
imgs[37].src = "images/int/37.jpg"
imgs[38] = new Image()
imgs[38].src = "images/int/38.jpg"
imgs[39] = new Image()
imgs[39].src = "images/int/39.jpg"
imgs[40] = new Image()
imgs[40].src = "images/int/40.jpg"
imgs[41] = new Image()
imgs[41].src = "images/int/41.jpg"
imgs[42] = new Image()
imgs[42].src = "images/int/42.jpg"
imgs[43] = new Image()
imgs[43].src = "images/int/43.jpg"
imgs[44] = new Image()
imgs[44].src = "images/int/44.jpg"
imgs[45] = new Image()
imgs[45].src = "images/int/45.jpg"
imgs[46] = new Image()
imgs[46].src = "images/int/46.jpg"
imgs[47] = new Image()
imgs[47].src = "images/int/47.jpg"
imgs[48] = new Image()
imgs[48].src = "images/int/48.jpg"
imgs[49] = new Image()
imgs[49].src = "images/int/49.jpg"
imgs[50] = new Image()
imgs[50].src = "images/int/50.jpg"

var freq = 4000
var fade_speed = 10
/* set_opacity: of main image,
     0: totally opaque, completely blocking out image
   100: totally transparent, completely revealing image
*/
function set_opacity(opacity) 
{
  var main = document.getElementById("main")
  main.style.MozOpacity = opacity/100;
  main.style.filter = 
	 'progid:DXImageTransform.Microsoft.Alpha(opacity=' + opacity + ')';
}

var opacity = 100
var timer = null

/* 
  fade_out/fade_in: 
    fade_out:
      opacity goes 100 -> 0 in 20 steps of 5, 1 step per 50 ms.
      thus 20 * 50 = 1000 ms = 1sec to fade out

    fade_in:
      opacity goes 0 -> 100 in 20 steps of 5, 1 step per 50 ms.
      thus 1sec to fade in
*/
function fade_out() {   // called every 50ms. when active
  opacity = opacity - 5

  set_opacity(opacity)
  
  if (opacity == 0) { // completely faded out
	
    // stop fade_out timer
    clearInterval(timer)

    // change to next image
    var main = document.getElementById("main")
    main.src = imgs[ind].src

    var num = document.getElementById("num")
    num.innerHTML = ind		
		
    // start fade_in timer
    timer = setInterval( "fade_in()", fade_speed ) // every 50 millisec
  }
}

function fade_in() {   // called every 50ms. when active
  opacity = opacity + 5

  set_opacity(opacity)
  
  if (opacity == 100) { // next image faded in completely

    // stop fade_in timer, set up next segment timer
    clearInterval(timer)
    timer = setInterval( "next_img(0)", freq )       //freq usually is 7000
  }
}

var ind = 0;

/* next_img:
     change index to next image. 
     start fade out of current (takes 1 sec.)
     fade_out, when done, starts fade in of new image (takes 1 sec.)
*/

function next_img(x) {
//  ind = ind + 1
ind = Math.ceil(Math.random()*51)
  if (ind > 50) ind = 0
//    	ind = Math.ceil(Math.random()*100)%26		// 
   // stop segment timer start fade_out/fade_in 
    clearInterval(timer)
  timer = setInterval( "fade_out()", fade_speed ) // every 50 millisec
}


// set the initial image and start the timer
function init() 
{
  var main = document.getElementById("main")
  main.src = imgs[0].src

  var num = document.getElementById("num")
  num.innerHTML = 0

  // set change image to start in 7 sec.
  timer = setInterval( "next_img(0)", freq )
}

function fix_img(x) {
//  ind = x-50
ind = x
  var main = document.getElementById("main")
  main.src = imgs[x].src
}