/*
	***** Javascript mini slideshows *****
	
	Ties in with database output - recordset converted to string
	sql statement: SELECT smallimage, largeimage, alttext FROM tblSlideShows
	html: <div id=""ss""></div>
	example call to setup: setupMiniSlideShow('ss', 200, 'images/slideshows/', 'images/slideshows/enlarged/', 
		'" & rs.GetString(adClipString, , "','", "','", "") & "')
	Important bit is the field and column separators output a valid list of arguments
	Don't put any apostrophes in the alt text
*/
		
function setupMiniSlideShow(id, width, smalldir, largedir) {
	//imagelist arguments optional after named args - smallimage, largeimage, alt, smallimage...
	var divMSS = document.getElementById(id);
	divMSS.style.cssText = 'margin: 0px 0px 4px 16px; float: right; position: relative; width: '+(width+20)+'px; display: block; background-color: #ffff; padding: 0px;';
	var html = '<div class="iconimage" style="margin-bottom: 0px;"><img id="mssimg'+id+'" src="'+smalldir+arguments[4]+'" style="border: 0px" vspace=0 hspace=0 /></div><br clear="right"/>'
		+'<div class="mssnav" style="width: '+(width+10)+'px;" ><a href="#" style="" id="mssenlarge'+id+'">enlarge+</a>';
	var imagenum=1;
	for(var i=4; i< (arguments.length-1); i+=3) {
		if(arguments[i]!='') {
			if(i==4) { 
				html+='<a href="#" title="'+(arguments[i+2]==undefined ? '' : (arguments[i+2].length!=0?arguments[i+2]:arguments[i+0]))+'" style="cursor: pointer;" class="visited" onclick="mssShowImage(\''+id+'\', \''+smalldir+arguments[i]+'\',\''+(arguments[i+1].length>0?largedir+arguments[i+1]:'')+'\',\''+(arguments[i+2].length>0?arguments[i+2]:arguments[i+1])+'\');this.className+=\' visited\';return false;">'+(imagenum++)+'</a> ';
			} else {
				html+='<a href="#" title="'+(arguments[i+2]==undefined ? '' : (arguments[i+2].length!=0?arguments[i+2]:arguments[i+0]))+'" style="cursor: pointer;" onclick="mssShowImage(\''+id+'\', \''+smalldir+arguments[i]+'\',\''+(arguments[i+1].length>0?largedir+arguments[i+1]:'')+'\',\''+(arguments[i+2].length>0?arguments[i+2]:arguments[i+1])+'\');this.className+=\' visited\';return false;">'+(imagenum++)+'</a> ';
			}
		}
	}	
	html+='</div></div>'
	divMSS.innerHTML = html;
	mssShowImage(id, smalldir+arguments[4], (arguments[4+1].length>0?largedir+arguments[4+1]:''), 
		(arguments[4+2]==undefined ? '' : (arguments[4+2].length!=0?arguments[4+2]:arguments[4+0])));
}

function mssShowImage(id, smallimage, largeimage, alttext) {
	var img = document.getElementById('mssimg'+id);
	var lrg = document.getElementById('mssenlarge'+id);
	img.src = smallimage;
	img.alt = alttext;
	if(largeimage.length>0) {
		img.onclick=function() { mssShowLarge(largeimage, alttext); }
		img.style.cursor = 'pointer';
		lrg.onclick=function() { mssShowLarge(largeimage, alttext); }
		lrg.style.color = '#666';
	} else {
		img.onclick=null;
		img.style.cursor = 'default';
		lrg.onclick=null;
		lrg.style.color = '#999';
	}
}

function mssShowLarge(largeimage, alttext) {
	var divId = 'divLargeImage';
	var imgDiv = document.getElementById(divId);
	if(!imgDiv) {
		var container = document.getElementById('wrapper').parentNode;
		imgDiv = document.createElement('div');
		imgDiv.id=divId;
		container.appendChild(imgDiv);
	}
	var top=(window.pageYOffset?window.pageYOffset:(document.body.scrollTop?document.body.scrollTop:(document.documentElement.scrollTop?document.documentElement.scrollTop:0)));
	imgDiv.innerHTML = '<img src="'+largeimage+'" style="cursor: pointer; border: 3px solid #ccc;" alt="'+alttext+' (Click to hide)"/>';
	imgDiv.style.cssText='position: absolute; top: '+(top+50)+'px; left: 0px; z-index: 1000;text-align: center; width: 99%; '
		+'filter:progid:DXImageTransform.Microsoft.Shadow(color=\'#666666\', Direction=135, Strength=6);';
	imgDiv.childNodes[0].onclick=function() { this.parentNode.removeChild(this);};
}

/***** End of JS Mini slideshows *****/