// Utility functions for effects etc

// global to indicate animation is in progress (stop users multiple clicking on buttons etc)
var bumbleAnimationInProgress = 0;

// ******** GENERAL / UTILITY ******** 

// find X coordinate of object
function bumbleGetX(objId) {
  obj = document.getElementById(objId);
  var curleft = 0;
  if (obj.offsetParent)
    while(1) {
      curleft += obj.offsetLeft;
      if (!obj.offsetParent)
      break;
      obj = obj.offsetParent;
    }
  else if (obj.x) curleft += obj.x;
  return curleft;
}
// find Y coordinate of object
function bumbleGetY(objId) {
  obj = document.getElementById(objId);
  var curtop = 0;
  if (obj.offsetParent)
    while(1) {
      curtop += obj.offsetTop;
      if (!obj.offsetParent)
      break;
      obj = obj.offsetParent;
    }
  else if(obj.y) curtop += obj.y;
  return curtop;
}
// get object width
function bumbleGetWidth(objId) {
  obj = document.getElementById(objId);
  if (typeof obj.clip !== "undefined") {
    return obj.clip.width;
  } 
  else {
    if (obj.style.pixelWidth) { 
      return obj.style.pixelWidth;
    } 
    else {
      return obj.offsetWidth;
    }
  }
}
// get object height
function bumbleGetHeight(objId) {
  obj = document.getElementById(objId);
  if (typeof obj.clip !== "undefined") {
    return obj.clip.height;
  } 
  else {
    if (obj.style.pixelHeight) {
      return obj.style.pixelHeight;
    } 
    else {
      return obj.offsetHeight;
    }
  }
}

// ******** FADE IN / OUT  ********

// Fade object in
function bumbleFadeIn(objId, timeMs) { 
  // default duration for transition
  if (!timeMs || timeMs < 1) timeMs = 200;
  obj = document.getElementById(objId);
  // set object to invisible
  obj.style.visibility == 'hidden'
  bumbleFadeChangeOpacity(0, objId);
  // fade in
  bumbleTransitionObj(objId, 'opacity', 0, 100, '', timeMs);
}

// Fade object out
function bumbleFadeOut(objId, timeMs) {
  // default duration for transition
  if (!timeMs || timeMs < 1) timeMs = 200;
  obj = document.getElementById(objId);
  // set object to visible
  obj.style.visibility == 'visible'
  bumbleFadeChangeOpacity(100, objId);
  // fade out
  bumbleTransitionObj(objId, 'opacity', 100, 0, '', timeMs);
}


// Toggle fade in/out for an object
function bumbleFadeToggle(objId, timeMs) {
  // default duration for transition
  if (timeMs < 1) timeMs == 1500;
  obj = document.getElementById(objId);
  if (obj.style.visibility == 'hidden') {
    bumbleFadeIn(objId, timeMs);
  }
  else {
    bumbleFadeOut(objId, timeMs);
  }
}


// ******** MOVEMENT  ********

// slide target object by fixed amount
function bumbleSlideObj(objId, direction, pixels, timeMs, maxPixels) {
  targetObj = document.getElementById(objId);
  pixels = parseInt(pixels);
  // get current position of target
  targetX = bumbleGetX(objId);
  targetY = bumbleGetY(objId);
    
  switch(direction) {
    case "left": 
      var targetLeft = targetObj.style.left ? targetObj.style.left : 0;
      targetLeft = parseInt(targetLeft); 
      var newPos = targetLeft - pixels; 
      targetObj.style.position = 'relative'; 
      bumbleTransitionObj(objId, 'left', targetLeft, newPos, 'px', timeMs, maxPixels)
      break;
    case "right": 
      var targetLeft = targetObj.style.left ? targetObj.style.left : 0;
      targetLeft = parseInt(targetLeft); 
      var newPos = targetLeft + pixels; 
      targetObj.style.position = 'relative'; 
      bumbleTransitionObj(objId, 'left', targetLeft, newPos, 'px', timeMs, maxPixels)
      break;
  }
}

// perform animation by transitioning between two style values
function bumbleTransitionObj(objId, style, startVal, endVal, unit, timeMs, maxPixels) {
  // set animation start time
  var startTime = new Date().getTime();   
  if (bumbleAnimationInProgress == 0)
    bumbleTransitionObjDo(objId, style, startVal, endVal, unit, timeMs, startTime, maxPixels);  
  bumbleAnimationInProgress = 1;
}
function bumbleTransitionObjDo(objId, style, startVal, endVal, unit, timeMs, startTime, maxPixels) {
  var elapsed = new Date().getTime() - startTime;
  var distancePercent = (1 - Math.cos((elapsed/timeMs) * Math.PI)) / 2;
  // if time run is less than specified length
  if (elapsed < timeMs) { 
    if (startVal < endVal) {       
      var currentVal = startVal + ((endVal - startVal) * distancePercent);
    }
    else {
      var currentVal = startVal - ((startVal - endVal) * distancePercent);
    }     
    bumbleChangeStyle(style, currentVal, objId, unit);
    window.setTimeout('bumbleTransitionObjDo(\'' + objId + '\', \'' + style + '\', ' + startVal + ', ' + endVal + ', \'' + unit + '\', \'' + timeMs + '\', \'' + startTime + '\', ' + maxPixels + ')', 10);
  }
  // if animation has finished
  else {
    bumbleChangeStyle(style, endVal, objId, unit);
    var distance = 0 - endVal;
    // if maximum pixel value is reached (relative to zero) reset to starting point - used to reset slideshow positioning
    if ((maxPixels && maxPixels !== "undefined")) {
      if (distance >= maxPixels)
        bumbleChangeStyle(style, 0, objId, unit);
      else if (distance < 0) {
        var distanceDiff = endVal - startVal;
        var moveToEnd = 10 - (parseInt(document.getElementById(objId).style.width) - (distanceDiff * 3)); 
        bumbleChangeStyle(style, moveToEnd, objId, unit);
      }
    }
    bumbleAnimationInProgress = 0;
  }
}

// change a style value for object
function bumbleChangeStyle(style, styleVal, objId, unit) {
    var objStyle = document.getElementById(objId).style;
    if (style == 'opacity') {
      if (styleVal == 0) objStyle.visibility = 'hidden';
      else objStyle.visibility = 'visible';
      objStyle.opacity = (opacity / 100);
      objStyle.MozOpacity = (opacity / 100);
      objStyle.KhtmlOpacity = (opacity / 100);
      objStyle.filter = "alpha(opacity=" + opacity + ")";
    }
    else {
      eval('document.getElementById(\'' + objId + '\').style.' + style + ' = \'' + styleVal + unit + '\';');
    }
} 


// ******** SLIDESHOW / GALLERY  ********

function bumbleSlideShow(imagesDelim, imagePath, containerDivId, width, height, timeMs) {
  
  var container = document.getElementById(containerDivId);
  var gallery = document.createElement("div");
  var galleryId = "slideShow_" + Math.floor(Math.random() * 1000000);
  var imagesArr = imagesDelim.split(',');
  var lastKey = imagesArr.length - 1;
  var firstImg = imagesArr[0];
  var lastImg = imagesArr[lastKey];
  // add last image to beginning of array
  imagesArr.unshift(lastImg);
  // add first image to end of array
  imagesArr.push(firstImg);
  var containerWidth = parseInt(imagesArr.length * width) + 10;
  
  container.style.width = width + 'px';
  container.style.height = height + 'px';
  container.style.border = '1px solid #000';
  container.style.position = 'relative';
  container.style.overflow = 'hidden';
  
  // empty container div
  container.innerHTML = '';
  
  gallery.setAttribute("class", "slideshow_inner_container");
  gallery.setAttribute("id", galleryId);
  gallery.style.height = height + 'px';
  gallery.style.marginLeft = '-' + width + 'px';
  
  // expand container to fit all images
  gallery.style.width = containerWidth + 'px';
  container.appendChild(gallery);
  
  var thisImg = '';
  // add image objects to gallery div
  for (var i = 0; i < imagesArr.length; i++) {
    thisImg = document.createElement("img");
    thisImg.style.width = width + 'px';
    thisImg.style.height = height + 'px';
    thisImg.src = imagePath + imagesArr[i];
    gallery.appendChild(thisImg); 
  }
  
  // add left / right icons for browsing slides
  var leftClick = document.createElement("div");
  var rightClick = document.createElement("div");
  var clickTop = parseInt(Math.floor(height / 2) + 16);
  var clickLeft = parseInt(width - 32);

  leftClick.setAttribute("class", "slideshow_left_browse");
  leftClick.setAttribute("className", "slideshow_left_browse");
  leftClick.style.float = 'left';
  leftClick.style.clear = 'left';
  leftClick.style.width = '32px';
  leftClick.style.height = '32px';
  leftClick.style.position = 'relative';
  var leftAction = "clearInterval(bumbleSlideAuto); bumbleSlideObj('" + galleryId + "', 'right', '" + width + "', '" + timeMs + "', '" + (containerWidth - (2 * width) - 10) + "')";
  leftClick.onclick = function() { eval(leftAction) };
  leftClick.style.top = '-' + clickTop + 'px';
  container.appendChild(leftClick); 
  
  rightClick.setAttribute("class", "slideshow_right_browse");
  rightClick.setAttribute("className", "slideshow_right_browse");
  rightClick.style.float = 'left';
  rightClick.style.clear = 'left';
  rightClick.style.width = '32px';
  rightClick.style.height = '32px';
  rightClick.style.position = 'relative';
  var rightAction = "clearInterval(bumbleSlideAuto); bumbleSlideObj('" + galleryId + "', 'left', '" + width + "', '" + timeMs + "', '" + (containerWidth - (2 * width) - 10) + "')";
  rightClick.onclick = function() { eval(rightAction) };
  rightClick.style.top = '-' + (clickTop + 32) + 'px';
  rightClick.style.left = clickLeft + 'px';
  container.appendChild(rightClick); 
  
  bumbleSlideAuto = window.setInterval("bumbleSlideObj('" + galleryId + "', 'left', '" + width + "', '" + timeMs + "', '" + (containerWidth - (2 * width) - 10) + "')", 3000);
}