dsPhotoItems.addObserver(pathFilter);

var rows = dsPhotoItems.getData();
var selectedThumbnailNumber = 0;
var gBehaviorsArray = [];
var gSlideShowTimer = null;
var gImageLoader = null;

var arPositions = new Array();

function pathFilter(notificationType, notifier, data)
{
	if (notificationType != "onPostLoad")
	return;
	
	// Get the unfiltered set of rows from the data set.		
	var rows = dsPhotoItems.getData(true);	
	var numRows = rows.length;
	
	// Loop over every row, replace the paths for the 'secure' and 'non-secure' SAWS directories		
	for (var i = 0; i < numRows; i++){
		rows[i][ "item_image_thumb" ] = rows[i]["item_image_thumb"].replace("non-secure||","images/");
		rows[i][ "item_image_large" ] = rows[i]["item_image_large"].replace("non-secure||","images/");
		rows[i][ "item_image_thumb" ] = rows[i]["item_image_thumb"].replace("secure||","images/");
		rows[i][ "item_image_large" ] = rows[i]["item_image_large"].replace("secure||","images/");
		rows[i][ "item_image_thumb" ] = rows[i]["item_image_thumb"].replace(/\\/g, "/");
		rows[i][ "item_image_large" ] = rows[i]["item_image_large"].replace(/\\/g, "/");		
		
		arPositions[i]=i;		
	}
}

function swapImage(rowNumber){	
	// if thumbnail clicked is already selected, do nothing
	if (rowNumber != selectedThumbnailNumber){
		
		var rows = dsPhotoItems.getData(); 
								
		// fade in the old thumbnail
		oldthumbID = 'thmb' + selectedThumbnailNumber;
		new Spry.Effect.DoFade(oldthumbID,{duration: 800,from: 30,to: 100, toggle: false});
	
		// fade out the currently selected thumbnail
		newthumbID = 'thmb' + rowNumber;		
		new Spry.Effect.DoFade(newthumbID,{duration: 800,from: 100,to: 30, toggle: false});						
		
		// set the Spry current number variable and the global variable for selectedThumbnail
		dsPhotoItems.setCurrentRowNumber(rowNumber);		
		selectedThumbnailNumber = rowNumber;
		
		loadLargeImage(rows[rowNumber]["item_image_large"]);
	}
}

function swapImageReplace(rowNumber){								
	var rows = dsPhotoItems.getData();
	
	// change the thumbnail	
	replaceableThumbID = 'thmb'+ rowNumber;	
	imgReplaceable = document.getElementById(replaceableThumbID);		
	imgReplaceable.src = rows[arPositions[0]]["item_image_thumb"];	
		
	var tempPosition = arPositions[rowNumber];
	arPositions[rowNumber] = arPositions[0];
	arPositions[0] = tempPosition;	
	
	// change the large image
	dsPhotoItems.setCurrentRowNumber(arPositions[rowNumber]);
	selectedThumbnailNumber = arPositions[rowNumber];
	loadLargeImage(rows[arPositions[0]]["item_image_large"]);		
}

function CancelBehavior(id){
  if (gBehaviorsArray[id])
  {
    gBehaviorsArray[id].stop();
    gBehaviorsArray[id] = null;
  }
}


function loadLargeImage(imgPath){
  var img = document.getElementById("LargeImage");
  if (!img)
    return;

  CancelBehavior("LargeImage");
  
  if (gImageLoader)
  {
    gImageLoader.onload = function() {};
    gImageLoader = null;
  }
  
   gBehaviorsArray["LargeImage"] = new Spry.Effect.DoFade(img, {duration: 1, from:100, to: 0,
    finish: function(b)
	{						
      	  // Image loader ensures that fade appears only after the image it is completely loaded.
	      gImageLoader = new Image();
		  gImageLoader.onload = function()
		  {
	        img.src = gImageLoader.src;			
			gImageLoader = null;
	        gBehaviorsArray["LargeImage"] = new Spry.Effect.DoFade(img, { duration: 1000, from: 0, to: 100, finish: function(b) { gBehaviorsArray["LargeImage"] = null; }});
		  };
		  gImageLoader.src = imgPath;
	    }
  });
}


function popupImage(rowNumber,windowWidth,windowHeight){
	
	var rows = dsPhotoItems.getData();	

	var winWidth = windowWidth + 4; //extra pixels used for spacing around image
	var winHeight = windowHeight;
	
	winTitle = "  ";
	winContent = '<img src="' + rows[rowNumber]['item_image_large'] + '">';		
	winParam = 'width=' + winWidth + 'px,height=' + winHeight + 'px,left=10px,top=10px,resize=0,scrolling=0,center=0';

	dhtmlwindow.open("winPhoto", "inline", winContent, winTitle, winParam, "recal");
}