// JavaScript Document


//
// STEP 2: Define some global variables that will help us deal with the case
//         where the user may rapidly click on items in the master region. We
//         want our effect transitions to be as smooth as possible.
//
var gEffectInProgress = null;
var gPendingSetRowIDRequest = -1;

//
// STEP 3: Define a function observer that will fade-in the detail content
//         whenever the content in the region is re-generated and inserted into the
//         document.
//
//         Note that there is a CSS rule, defined in the style block above, for #description
//         that gives it an opacity of zero, which basically means that when the page
//         is first loaded, the detail region is completely invisible/see-thru. This
//         prevents an initial flash from occuring in some browsers if the content is
//         rendered to the screen before the fade-in effect kicks in.
//
function fadeInContent(notificationType, notifier, data)
{
	if (notificationType != "onPostUpdate")
		return;
	var effect = new Spry.Effect.Fade('photoToFade', { to: 100, from: 0, duration: 1000, finish: function() {
		// The region is now showing. Process any pending row change request.
		gEffectInProgress = null;
		if (gPendingSetRowIDRequest >= 0)
		{
			var id = gPendingSetRowIDRequest;
			gPendingSetRowIDRequest = -1;
			fadeOutContentThenSetRow(id);
		}
	}});
	effect.start();
}

//
// STEP 4: Register the function as an observer on the detail region.
//
Spry.Data.Region.addObserver('photoToFade', fadeInContent);

//
// STEP 5: Define a function which will be used to fade-out the detail region. This
//         same function will define a custom finish function, which will be called by
//         the fade-out effect when it is finished, to trigger a call to setCurrentRow().
//         This custom finish function is registered with the effect by passing it as an
//         option to the effect constructor.
//
function fadeOutContentThenSetRow(rowID)
{
	// If we have an effect already in progress, don't do anything
	// We'll set the rowID when we're done.

	if (gEffectInProgress)
	{
		gPendingSetRowIDRequest = rowID;
		return;
	}

	// If the correct row is already showing, don't do anything!

	if (rowID == dsPhotos.getCurrentRowID())
		return;

	gEffectInProgress = new Spry.Effect.Fade('photoToFade', { to: 0, from: 100, duration: 500, finish: function() {
		dsPhotos.setCurrentRow(rowID);
	}});
	gEffectInProgress.start();
}
//
//
//

Spry.Data.Region.addObserver("showcasethumbnails", { onPostUpdate: function()
{
	if (gThumbViewer)
	{
		// The thumbnails region has been updated with
		// new content. If gThumbViewer is not null, we
		// know that we already created our widgets, so
		// all we really have to do, is make sure that the
		// thumb viewer adds the grow, shrink, and click
		// behaviors to the new thumbnails.

		gThumbViewer.attachBehaviors();
		gThumbViewer.select(0);
		return;
	}

	// The thumbnails region has updated for the very first
	// time, so lets create the gallery widgets. After this
	// call, gThumbViewer should be non-null, so we should
	// never hit this code again.

	InitializeGallery();

	// Now that we've created our widgets, override the default
	// link behavior for each link in the galleryLinks section
	// so that they load new XML into our dsPhotos data set instead
	// of taking us to new pages.


}});

//
//

function AdvanceToNextImage(moveBackwards)
{
	var rows = dsPhotos.getData();
	var curRow = dsPhotos.getCurrentRow();
	
	if (rows.length < 1)
		return;
	
	for (var i = 0; i < rows.length; i++)
	{
		if (rows[i] == curRow)
		{
			if (moveBackwards)
				--i;
			else
				++i;
			break;
		}
	}
	
	if (!moveBackwards && i >= rows.length)
		i = 0;
	else if (moveBackwards && i < 0)
		i = rows.length - 1;
	
	curRow = rows[i];
	//dsPhotos.setCurrentRow(curRow["ds_RowID"]);
	fadeOutContentThenSetRow(curRow["ds_RowID"]);
	//
	//ShowCurrentImage();
}