// 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 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(divID, rowID, ds)
{
	// If we have an effect already in progress, don't do anything
	// We'll set the rowID when we're done.
	
	if (gEffectInProgress || ds == undefined)
	{
		gPendingSetRowIDRequest = rowID;
		return;
	}

	// If the correct row is already showing, don't do anything!
	
	if (rowID == ds.getCurrentRowID())
		return;

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

function hideContentThenSetRow(divID, rowID, ds)
{
	// If we have an effect already in progress, don't do anything
	// We'll set the rowID when we're done.
	
	if (gEffectInProgress || ds == undefined)
	{
		gPendingSetRowIDRequest = rowID;
		return;
	}

	// If the correct row is already showing, don't do anything!
	
	if (rowID == ds.getCurrentRowID())
		return;

	gEffectInProgress = new Spry.Effect.Fade(divID, { to: 0, from: 100, duration: 0, finish: function() {
		ds.setCurrentRow(rowID);
	}});
	gEffectInProgress.start();
}


//
// 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 PRODUCT PAGE...
	/*
	var qsID = queryStringParse("id");
	Spry.Utils.SelectionManager.select("default", document.getElementById(qsID), "productSelected");	
	var row = data.region.getDataSets()[0].findRowsWithColumnValues({ "@id" : qsID}, true);
	if (row)
		data.region.getDataSets()[0].setCurrentRow(row.ds_RowID);
	*/
	
	
	if (notificationType != "onPostUpdate")
		return;
	
	var effect = new Spry.Effect.Fade(data.regionID, { to: 100, from: 0, duration: 500, finish: function() {
		// The region is now showing. Process any pending row change request.
		gEffectInProgress = null;
		if (gPendingSetRowIDRequest >= 0)
		{
			var id = gPendingSetRowIDRequest;
			gPendingSetRowIDRequest = -1;
			fadeOutContentThenSetRow(data.regionID, id, data.region.getDataSets()[0]);
		}
	}});
	effect.start();
}

function queryStringParse(ji) {
	hu = window.location.search.substring(1);
	gy = hu.split("&");
	for (i=0;i<gy.length;i++) {
		ft = gy[i].split("=");
		if (ft[0] == ji) {
			return ft[1];
		}
	}
}