// Image opacity rollovers and rollouts
// Opacity Change code from: 
// http://www.brainerror.net/scripts_js_blendtrans.php
// Modified by Lars Michael Astrom
// 2007 A3 IT Solutions

// how to implement:
// in the div layer that holds the images that are the links, have a background
// image with the rollover states so that when the link images disappear the user
// can see the rollover states

// rollover function
function over(id){
  // arguments: id of element, start, end, speed (in milliseconds)
  opacity(id,100,0,200)
}

// rollout function
function out(id){
  // arguments: id of element, start, end, speed (in milliseconds)
  opacity(id,0,100,150)
}

// function to change opacity
function opacity(id, opacStart, opacEnd, millisec) {
  var speed = Math.round(millisec / 100); //speed for each frame
  var timer = 0;

  // determine the direction for the blending, if start and end are the same nothing happens
  if(opacStart > opacEnd) {
    for(i = opacStart; i >= opacEnd; i--){
      setTimeout("changeOpac(" + i + ",'" + id + "')",(timer * speed));
      timer++;
    }
  }else if(opacStart < opacEnd){
    for(i = opacStart; i <= opacEnd; i++){
      setTimeout("changeOpac(" + i + ",'" + id + "')",(timer * speed));
      timer++;
    }
  }
} 

// change the opacity for different browsers
function changeOpac(opacity, id) {
  var object = document.getElementById(id).style;
  object.opacity = (opacity / 100);
  object.MozOpacity = (opacity / 100);
  object.KhtmlOpacity = (opacity / 100);
  object.filter = "alpha(opacity=" + opacity + ")";
}

// Image gallery script with "x o// if the user reached the beginning and they try to go backward once more they
// potential to be integrated into content management system
// Written by Lars Michael Astrom
// 2007 A3 IT Solutions

// how to implement:
// add the following directly after the "x out of x" layer:
// <!-- Set initial value of the overlay text -->
// <script language="javascript" type="text/javascript">
//   document.getElementById("***NAME OF THE LAYER***").innerHTML = "1 of " + numImgs;
// </script>

var numImgs = 6; // sets the number of images to load
var current = 0; // should be 0, since we start on the first image
var imgs = new Array(numImgs); // declare image array
var positionLayer = "positionOverlay" // name of the layer that holds "x out of x"
var imgID = "mainImg"; // sets the id of the image to be changed
var imgPath = "/images/about/"; // sets the path where the images are stored
var imgPrefix = "facilities"; // sets the name of the images 
// NOTE: all images in the gallery should follow naming conventions 
// example: facilities0.jpg, facilities1.jpg, etc in incremental order

// loads the array with the incremental file names
for (var i = 0; i < numImgs; i++){
  eval("imgs[" + i + "] = '" + imgPath + imgPrefix + i + ".jpg'");
}

// displays the next image and updates the overlay text
function next(){
  if (current < numImgs - 1){
    current += 1;
    eval("document." + imgID + ".src = imgs[current]");
    document.getElementById(positionLayer).innerHTML = (current + 1)  + " of " + numImgs;
  }else{
    goToStart();
  }
}

// displays the previous image and updates the overlay text
function previous(){
  if (current > 0){
    current -= 1;
    eval("document." + imgID + ".src = imgs[current]");
    document.getElementById(positionLayer).innerHTML = (current + 1)  + " of " + numImgs;
  }else{
    goToEnd();
  }
}

// if the user reached the beginning and they try to go backward once more they
// get sent to the end of the gallery
function goToEnd(){
  current = numImgs;
  eval("document." + imgID + ".src = imgs[current - 1]");
  document.getElementById(positionLayer).innerHTML = numImgs  + " of " + numImgs;
  current -= 1;
}

// if the user reached the end and they try to go forward once more they
// get sent to the beginning of the gallery
function goToStart(){
  current = 0;
  eval("document." + imgID + ".src = imgs[current]");
  document.getElementById(positionLayer).innerHTML = 1  + " of " + numImgs;
}

// Hide / Show a layer with one click of a link
// Written by Lars Michael Astrom
// 2007 A3 IT Solutions
function hideShow(id){
  var obj = document.getElementById(id); // set the object to be changed
  var obj2 = document.getElementById('videoPopupFrame');
  if (obj.style.display == "none"){
    obj.style.display = "block";
    obj2.src = '/flash/impact.html';
  }else{
    obj.style.display = "none";
    obj2.src = 'about:blank';
  }
}