////////////////////////////////////////////////
//
// Thumbnail picture handling functions
// for Abbeydale CMS...
//
// this fle needs the following values, defined here or
// commented out and defined in the calling html file...
var sThumbPrefix = "thm";
var sThumbClass  = "thumb";
//    var sImageFolder = "photos/website/";
//
// the following arrays should be filled in the html file
// with the pathnames of the picture file and thumbnail file
// and the title/alt text for each pic...
var arrPics = new Array();
var arrThumbs = new Array();
var arrTitles = new Array();
//
// next pic in cycle...
var nextPic = new Image(570, 448);
// working vars for fade/dissolve...
var maxCycles = 5;          // stop after this number of cycles
var dwellTime = 4000;       // display each image for this number of ms
var fadeIncrement = 0.05    // fade up/down by this amount at each step
var fadeDelay = 25;         // wait this no. of ms between fade steps
var crntPic = 0;            // start with this pic (array index)
var tmrMainPic = 0;
var tmrFade = 0;
var numCycles = maxCycles;
var elMainPic;
var elAuxPic;
//gallery css classes and ids...
var captionID = "acms_gallerycaption";
var mainPicID = "acms_gallerymainpic";
var auxPicID = "acms_galleryauxpic";
// video control image file extension...
var videoControlExtension;
if (videoControlExtension == '')
  videoControlExtension = 'png';

/////////////////////////////////////////////////////////
//
// Gallery video control handler
//
// pre-cache control and rollover images...
var ctrlsLo = new Object();      // resting buttons
var ctrlsHi = new Object();      // mouse over button

if (document.images)
  {
  ctrlsLo["ctrlprev"] = new Image(13, 11);   // menu images - normal
  ctrlsLo["ctrlprev"].src = "imgs/ctrlprev_0." + videoControlExtension;
  ctrlsLo["ctrlpause"] = new Image(11, 11);
  ctrlsLo["ctrlpause"].src = "imgs/ctrlpause_0." + videoControlExtension;
  ctrlsLo["ctrlplay"] = new Image(13, 11);
  ctrlsLo["ctrlplay"].src = "imgs/ctrlplay_0." + videoControlExtension;
  ctrlsLo["ctrlnext"] = new Image(13, 11);
  ctrlsLo["ctrlnext"].src = "imgs/ctrlnext_0." + videoControlExtension;

  ctrlsHi["ctrlprev"] = new Image(13, 11);   // menu images - highlight
  ctrlsHi["ctrlprev"].src = "imgs/ctrlprev_1." + videoControlExtension;
  ctrlsHi["ctrlpause"] = new Image(11, 11);
  ctrlsHi["ctrlpause"].src = "imgs/ctrlpause_1." + videoControlExtension;
  ctrlsHi["ctrlplay"] = new Image(13, 11);
  ctrlsHi["ctrlplay"].src = "imgs/ctrlplay_1." + videoControlExtension;
  ctrlsHi["ctrlnext"] = new Image(13, 11);
  ctrlsHi["ctrlnext"].src = "imgs/ctrlnext_1." + videoControlExtension;
  }

function setControlImage(name, state)
  {
  if (document.images)
    {
    if (state == 'hi')
      {
      document.images[name].src = ctrlsHi[name].src;
      return true;
      }
    else if (state == 'lo')
      {
      document.images[name].src = ctrlsLo[name].src;
      return true;
      }
    }
  return false;
  }
////////////////////////////////////////////////
//
// showSelectedPic() is the onclick handler for the
// thumbnail image links...
//
// nPicId: id suffix for this thumbnail pic link
//         eg. 01, 02... for thm01, thm02 etc
//
function showSelectedPic(nPicId)
  {
  // clear current timer setting...
  clearTimeout(tmrMainPic);
  // set new current pic...
  crntPic = nPicId;
  // and go switch it in...
  var elPic = document.getElementById("mainpic");
  if (elPic)
    elPic.src = sPicFile;
  // change the caption text too...
  var elCap = document.getElementById(captionID);
  if (elCap)
    elCap.innerHTML = arrTitles[crntPic];
  }

////////////////////////////////////////////////
//
// fadeSelectedPic() is the onclick handler for the
// thumbnail image links...
//
// nPicId: id suffix for this thumbnail pic link
//         eg. 1, 2... for thm1, thm2 etc
//
function fadeSelectedPic(nPicId)
  {
  // clear current timer setting...
  clearTimeout(tmrMainPic);
  // set new current pic...
  crntPic = nPicId;
  // and go fade it in...
  fadePic(arrPics[crntPic], arrTitles[crntPic]);
  }

//
// drawThumbnailArray()
//
// draws the array of thumbnails into the page
// call at the point where thumbnails should appear
//
function drawThumbnailArray()
  {
  for (var i = 0; i < arrPics.length; i++)
    {
    document.write("<a onclick='return fadeSelectedPic(" + i + ");'><img class='" + sThumbClass + "' id='" + sThumbPrefix + i + "' src='" + arrThumbs[i] + "' alt='" + arrTitles[i] + "'></a>");
    }
  }


function getTitle(ndx)
  {
  return arrTitles[ndx];
  }
//

////////////////////////////////////////
//
// ctrl(code)
//
// Show the selected picture depending on
// which control was clicked...
//
function ctrl(code)
  {
  // clear current timer setting...
  clearTimeout(tmrMainPic);
  // calc which pic is next...
  switch (code)
    {
    case -1:
    case 1:
      crntPic = calcNextPic(code);
      break;

    case 0:
      break;

    case 2:
      numCycles = maxCycles;
      setTimeout("playNextPic()", 750);
      return;
    }
  fadePic(arrPics[crntPic], arrTitles[crntPic]);
  }

////////////////////////////////////////
//
// waitThenPlayNextPic()
//
// set timer to call playNextPic() in a little while...
//
function waitThenPlayNextPic(waitTime)
  {
  numCycles = maxCycles;
  // set timer to fade pic in a bit...
  tmrMainPic = setTimeout('playNextPic()', waitTime);
  // pre-load next pic into browser cache ready...
  var next = calcNextPic(1);
  nextPic.src = arrPics[next];
  }

////////////////////////////////////////
//
// playNextPic()
//
// show the next picture and set timer to
// do it again in a wee while...
//
function playNextPic()
  {
  // check for max cycles...
  if (crntPic == 0 && maxCycles > 0 && numCycles-- == 0)
    return;
  // fade into next picture...
  crntPic = calcNextPic(1);
  fadePic(arrPics[crntPic], arrTitles[crntPic]);
  // pre-load next pic into browser cache ready...
  var next = calcNextPic(1);
  nextPic.src = arrPics[next];
  // set timer to do it again - allowing for fade up time since we
  // get here after the first fade increment, not the last!
  tmrMainPic = setTimeout('playNextPic()', dwellTime + fadeDelay / fadeIncrement);
  }

////////////////////////////////////////
//
// calcNextPic()
//
// determine which pic will be shown next
// depending on which direction we're going.
// +1 forwards, -1 backwards, 0 stop...
//
function calcNextPic(dir)
  {
  var next = crntPic;
  switch (dir)
    {
    case -1:
      next--;
      if (next < 0)
        next = arrPics.length - 1;
      break;

    case 1:
      next++;
      if (next >= arrPics.length)
        next = 0;
      break;

    default:
      break;
    }
  return next;
  }

////////////////////////////////////////
//
// fadePic(sPicFile, sCaption)
//
// dissolve to the specified pic by creating a new
// picture (aux) at zero opacity, and placing it
// over the top of the current pic (main)...
//
// sPicFile: path to target pic file
// sCaption: caption text for next pic
//

function fadePic(sPicFile, sCaption)
  {
  // load the new pic and wait for it to complete loading
  // so we can check it's width & height for positioning...
  elMainPic = document.getElementById(mainPicID);
  //dbg alert("fadePic(): src=" + elMainPic.src + ", alt=" + elMainPic.alt);
  elAuxPic = document.getElementById(auxPicID);
  //if we're fading to the same pic don't bother...
  if (elMainPic.src.substr(-sPicFile.length, sPicFile.length) == sPicFile)
    return;
  // sort out caption change...
  var elCap = document.getElementById(captionID);
  if (elCap)
    {
    //dbg alert("current caption: " + elcap.innerHTML);
    elCap.style.visibility = "hidden";
    elCap.innerHTML = sCaption;
    }
  // prepare auxPic...
  elAuxPic.style.filter = "alpha(opacity=0)";
  elAuxPic.style.opacity = 0;
  elAuxPic.style.MozOpacity = 0;
  // load auxPic...
  elAuxPic.onload = fadePic2;   // sneaky trick!
  elAuxPic.src = sPicFile;
  // the rest of the process, carried out by fadePic2()
  // starts only when the new image has loaded.
  }

function fadePic2()
  {
  // Called as the onload event handler for the new
  // image so runs only when the new image has completely
  // loaded and we can determine its size.
  // first get the old pic's size and position
  // so we can work out where to put the new one...
  var left = findPosX(elMainPic);
  var top = findPosY(elMainPic);
  // boj for bloody IE...
  //var sBrowser = getBrowserType();
  //if (sBrowser.indexOf("MSIE") != - 1)
  //  {
  //  if (sBrowser.indexOf("v6") != - 1)
  //    {
  //    //top += 1;
  //    }
  //  if (sBrowser.indexOf("v7") != - 1)
  //    {
  //    //left -= 1;
  //    //top += 1;
  //    }
  //  }
  // adjust left for relative width of old & new pix...
  left -= (elAuxPic.width - elMainPic.width) / 2;
  //dbg alert("fadePic2(), elAuxPic.width="+elAuxPic.width+", elAuxPic.height="+elAuxPic.height);
  // position the new pic centrally...
  elAuxPic.style.left = left + "px";
  elAuxPic.style.top = top + "px";
  // fade auxPic up over mainPic...
  doFade(fadeIncrement);
  }

////////////////////////////////////////
//
// do fade from mainPic to auxPic in 25
// steps - one every 10ms...
//
function doFade(progress)
  {
  elAuxPic.style.filter = "alpha(opacity=" + Math.floor(progress * 100) + ")";
  elMainPic.style.filter = "alpha(opacity=" + Math.floor((1.0 - progress) * 100) + ")";
  elAuxPic.style.opacity = progress;
  elMainPic.style.opacity = 1.0 -   elAuxPic.style.opacity;
  elAuxPic.style.MozOpacity = progress;
  elMainPic.style.MozOpacity = 1.0 - elAuxPic.style.MozOpacity;
  //dbg alert("progress=" + progress + ", filter=" + auxPic.style.filter);
  if (progress < 0.99)
    {
    tmrFade = setTimeout("doFade(" + (progress + fadeIncrement) + ")", fadeDelay);
    }
  else
    {
    elMainPic.src = elAuxPic.src;
    if (arrTitles[crntPic])
      {
      document.images[mainPicID].title = arrTitles[crntPic];
      document.images[mainPicID].alt = arrTitles[crntPic];
      }
    else
      {
      document.images[mainPicID].title = "";
      document.images[mainPicID].alt = "";
      }
    elMainPic.style.filter = "alpha(opacity=100)";
    elMainPic.style.opacity = 1.0;
    elMainPic.style.MozOpacity = 1.0;
    elAuxPic.style.filter = "alpha(opacity=0)";
    elAuxPic.style.opacity = 0;
    elAuxPic.style.MozOpacity = 0;
    // make new caption visible...
    var elCap = document.getElementById(captionID);
    if (elCap)
      {
      elCap.style.visibility = "visible";
      }
    }
  }

// functions to find the position of an element...
// updated 2/9/2007, MT
// fixes IE offsetParent problem
function findPosX(obj)
  {
  var curleft = obj.offsetLeft;
  while (obj.offsetParent)
    {
    obj = obj.offsetParent;
    curleft += obj.offsetLeft;
    }
  //dbg alert("curleft="+curleft);
  return curleft;
  }

function findPosY(obj)
  {
  var curtop = obj.offsetTop;
  while (obj.offsetParent)
    {
    obj = obj.offsetParent;
    curtop += obj.offsetTop;
    }
  //dbg alert("curtop="+curtop);
  return curtop;
  }

// functions for finding browser type (incl version)...
function getBrowserType()
  {
  var sName = "";
  var sVersion = "";
  var ua = navigator.userAgent;
  var vo = 0;
  //dbg alert("appName:   " + navigator.appName + "\nuserAgent:  " + navigator.userAgent + "\nappVersion: " + navigator.appVersion);
  // test for Firefox...
  if ((vo = ua.indexOf("Firefox")) != -1)
    {
    sName = "Firefox";
    vo += 8;
    sVersion = ua.substring(vo);
    }
  else if ((vo = ua.indexOf("Netscape")) != -1)
    {
    sName = "Netscape";
    vo += 9;
    sVersion = ua.substring(vo, vo + 3);
    }
  else if ((vo = ua.indexOf("Opera")) != -1)
    {
    sName = "Opera";
    vo += 6;
    sVersion = ua.substring(vo, vo + 3);
    }
  else if ((vo = ua.indexOf("Safari")) != -1)
    {
    sName = "Safari";
    vo = ua.indexOf("Version/") + 8;
    sVersion = ua.substring(vo, vo + 5);
    }
  else if ((vo = ua.indexOf("MSIE")) != -1)
    {
    sName = "MSIE";
    vo += 5;
    sVersion = ua.substring(vo, ua.indexOf(";", vo));
    }
  return sName + " v" + sVersion;
  }

//
///// End of File ///////////////////////////////////////