/* Using prototype.js for misc element access in Image Gallery */
/* See the Prototype web site: http://www.prototypejs.org/     */

function gImage(id)
{
	this.id      = id;
	this.tSrc    = "";
	this.fSrc    = "";
	this.alt     = "";
	this.caption = "";
}

var gImages = new Array(15);
var v = new Array(3);

gImages[0] = new gImage(0);
gImages[0].tSrc = "../../img/gallery/thumb_01_SWF_SOLID_woodsiding.jpg";
gImages[0].fSrc = "../../img/gallery/fulls_01_SWF_SOLID_woodsiding.jpg";
gImages[0].alt = "SWF SOLID woodsiding photo";
gImages[0].caption = "Siding: SWF-SOLID, Spruce Green  |  Trim: SWF-SOLID, True White";

gImages[1] = new gImage(1);
gImages[1].tSrc = "../../img/gallery/thumb_02_SWF_SOLID_stainingdeck.jpg";
gImages[1].fSrc = "../../img/gallery/fulls_02_SWF_SOLID_stainingdeck.jpg";
gImages[1].alt = "SWF SOLID stainingdeck photo";
gImages[1].caption = "Deck: SWF-SOLID, Shagbark Brown  |  Railings: SWF-SOLID, True White";

gImages[2] = new gImage(2);
gImages[2].tSrc = "../../img/gallery/thumb_03_CWF_UV5_stainingdeck.jpg";
gImages[2].fSrc = "../../img/gallery/fulls_03_CWF_UV5_stainingdeck.jpg";
gImages[2].alt = "CWF UV5 stainingdeck photo";
gImages[2].caption = "Deck and Siding: CWF-UV® 5, Redwood";


gImages[3] = new gImage(3);
gImages[3].tSrc = "../../img/gallery/thumb_04_SWF_SOLID_stainingdeck.jpg";
gImages[3].fSrc = "../../img/gallery/fulls_04_SWF_SOLID_stainingdeck.jpg";
gImages[3].alt = "SWF SOLID stainingdeck photo";
gImages[3].caption = "Deck: SWF-SOLID, Birch Wood  |  Railings: SWF-SOLID, True White";

gImages[4] = new gImage(4);
gImages[4].tSrc = "../../img/gallery/thumb_05_SWF_SOLID_woodfencestaining.jpg";
gImages[4].fSrc = "../../img/gallery/fulls_05_SWF_SOLID_woodfencestaining.jpg";
gImages[4].alt = "SWF SOLID woodfencestaining photo";
gImages[4].caption = "Fence: SWF-SOLID, Tea Leaf and Autumn Leaf  |  Gate: SWF-SOLID, True White  |  Deck: CWF-UV® 5 OIL, Hickory";

gImages[5] = new gImage(5);
gImages[5].tSrc = "../../img/gallery/thumb_06_CWF_UV5_stainingdeck.jpg";
gImages[5].fSrc = "../../img/gallery/fulls_06_CWF_UV5_stainingdeck.jpg";
gImages[5].alt = "CWF UV5 stainingdeck photo";
gImages[5].caption = "Deck: CWF-UV® 5, Cedar";


gImages[6] = new gImage(6);
gImages[6].tSrc = "../../img/gallery/thumb_07_SWF_SOLID_woodsidingstaining.jpg";
gImages[6].fSrc = "../../img/gallery/fulls_07_SWF_SOLID_woodsidingstaining.jpg";
gImages[6].alt = "SWF SOLID woodsidingstaining photo";
gImages[6].caption = "Siding: SWF-SOLID, Tranquil Sea, Sea Shell and Island Breeze  |  Trim: SWF-SOLID, True White";

gImages[7] = new gImage(7);
gImages[7].tSrc = "../../img/gallery/thumb_08_SPANDECK_woodstaining.jpg";
gImages[7].fSrc = "../../img/gallery/fulls_08_SPANDECK_woodstaining.jpg";
gImages[7].alt = "SPANDECK woodstaining photo";
gImages[7].caption = "Bench: SPA-N-DECK®, Redwood";

gImages[8] = new gImage(8);
gImages[8].tSrc = "../../img/gallery/thumb_09_SPANDECK_SWF_SOLID_stainingdeck.jpg";
gImages[8].fSrc = "../../img/gallery/fulls_09_SPANDECK_SWF_SOLID_stainingdeck.jpg";
gImages[8].alt = "SPANDECK SWF SOLID stainingdeck photo";
gImages[8].caption = "Deck: SPA-N-DECK®, Cedar  |  Siding: SWF-SOLID, Sand Dollar";


gImages[9] = new gImage(9);
gImages[9].tSrc = "../../img/gallery/thumb_10_TWF_SEMI_stainingdeck.jpg";
gImages[9].fSrc = "../../img/gallery/fulls_10_TWF_SEMI_stainingdeck.jpg";
gImages[9].alt = "TWF SEMI stainingdeck photo";
gImages[9].caption = "Deck: TWF-SEMI, Dusty Trail";

gImages[10] = new gImage(10);
gImages[10].tSrc = "../../img/gallery/thumb_11_SWF_SOLID_stainingdeck.jpg";
gImages[10].fSrc = "../../img/gallery/fulls_11_SWF_SOLID_stainingdeck.jpg";
gImages[10].alt = "SWF SOLID stainingdeck photo";
gImages[10].caption = "Deck: SWF-SOLID, Traditional Cape Cod Gray";

gImages[11] = new gImage(11);
gImages[11].tSrc = "../../img/gallery/thumb_12_TWF_SEMI_SWF_SOLID_woodsiding.jpg";
gImages[11].fSrc = "../../img/gallery/fulls_12_TWF_SEMI_SWF_SOLID_woodsiding.jpg";
gImages[11].alt = "TWF SEMI SWF SOLID woodsiding photo";
gImages[11].caption = "Siding: TWF-SEMI, Warm Earth and SWF-SOLID, Wave Crest  |  Trim: SWF-SOLID, True White";


gImages[12] = new gImage(12);
gImages[12].tSrc = "../../img/gallery/thumb_13_SPANDECK_stainingdeck.jpg";
gImages[12].fSrc = "../../img/gallery/fulls_13_SPANDECK_stainingdeck.jpg";
gImages[12].alt = "SPANDECK stainingdeck photo";
gImages[12].caption = "Deck: SPA-N-DECK®, Chestnut";

gImages[13] = new gImage(13);
gImages[13].tSrc = "../../img/gallery/thumb_14_SWF_SOLID_stenciling.jpg";
gImages[13].fSrc = "../../img/gallery/fulls_14_SWF_SOLID_stenciling.jpg";
gImages[13].alt = "SWF SOLID stenciling photo";
gImages[13].caption = "Deck: SWF-SOLID, Pewter Gray  |  Bench/Railings: SWF-SOLID, Robin's Egg  |  Arbor: SWF-SOLID, Autumn Leaf  |  Stenciling: Various Colors";

gImages[14] = new gImage(14);
gImages[14].tSrc = "../../img/gallery/thumb_15_CWF_UV5_OIL_stainingdeck.jpg";
gImages[14].fSrc = "../../img/gallery/fulls_15_CWF_UV5_OIL_stainingdeck.jpg";
gImages[14].alt = "CWF UV5 OIL stainingdeck photo";
gImages[14].caption = "Deck: CWF-UV® 5 OIL, Redwood";


function swapThumbs()
{
	$('gThumb_0').src = gImages[(v[0])].tSrc;
	$('gThumb_0').alt = gImages[(v[0])].alt;

	$('gThumb_1').src = gImages[(v[1])].tSrc;
	$('gThumb_1').alt = gImages[(v[1])].alt;

	$('gThumb_2').src = gImages[(v[2])].tSrc;
	$('gThumb_2').alt = gImages[(v[2])].alt;
	
	//alert(v[0]);	
	//$('gMoreLeft').src = "../../img/gallery/clear.gif";
	//$('gMoreLeft').alt = alt="";
	//<a href="javascript:gClick('gMoreLeft' )"><img id="gMoreLeft"  src="../../img/gallery/moreLeft.gif"  width="30"  height="217" alt="more left"  /></a>
}


function gInit()
{	
	v[0] = 0;
	v[1] = 1;
	v[2] = 2;

	swapThumbs();
	
	$('gMainImg').src = gImages[(v[0])].fSrc;
	$('gMainImg').alt = gImages[(v[0])].alt;
	
	$('gMoreRight').src = "../../img/gallery/moreRight.gif";
	$('gMoreRight').alt = "more right";
	
	$('gCaptionSpan').innerHTML = gImages[v[0]].caption;
}


function gClick(clickID)
{
	if (clickID == 'gMoreLeft')
	{
		/* if on last screen */
		if (v[2] == (gImages.length - 1))
		{
			/* show right button */
			$('gMoreRight').src = "../../img/gallery/moreRight.gif";
			$('gMoreRight').alt = "more right";
		}
		/* if not on first screen */
		if (v[0] > 0)
		{
			for (i = 0; i < 3; i++)
			{
				v[i] -= 3;
			}
			swapThumbs();
			
			/* click left when on next to first screen */
			if (v[0] == 0)
			{
				/* hide left button */
				$('gMoreLeft').src = "../../img/gallery/clear.gif";
				$('gMoreLeft').alt = "";
			}
			
		}	
	}
	
	if (clickID == 'gMoreRight')
	{
		/* if on first screen */
		if (v[0] == 0)
		{
			/* show left button */
			$('gMoreLeft').src = "../../img/gallery/moreLeft.gif";
			$('gMoreLeft').alt = "more left";
		}
		/* if not on last screen */
		if (v[2] < (gImages.length - 1))
		{
			for (i = 0; i < 3; i++)
			{
				v[i] += 3;
			}
			
			swapThumbs();
			
			/* click right when on next to last screen */
			if (v[2] == (gImages.length - 1))
			{
				/* hide right button */
				$('gMoreRight').src = "../../img/gallery/clear.gif";
				$('gMoreRight').alt = "";
			}
		}
	}

	if (clickID == 'gThumb_0') { gSetMainImg(0); }
	if (clickID == 'gThumb_1') { gSetMainImg(1); }
	if (clickID == 'gThumb_2') { gSetMainImg(2); }
}


function gSetMainImg(i)
{
	$('gMainImg').src = gImages[v[i]].fSrc;
	$('gCaptionSpan').innerHTML = gImages[v[i]].caption;
}