//--- CONFIGURATION VARIABLES:
	//	Change these variables to reflect your implementation of vsDrawer
	var vsDrawerTimeoutLength = 500; // Milliseconds, i.e.: 1000 = 1 sec
	var vsDrawerOpenLength = 0.25; // Decimal seconds, i.e.: 1.0 = 1 sec
	var vsDrawerCloseLength = 0.25; // Decimal seconds, i.e.: 1.0 = 1 sec
	var vsDrawer = 'vsDrawer'; // ID of the drawer's HTML element
	var vsDrawerWidth = 423; // integer width of the drawer
	var vsDrawerHeight = 100; // integer height of the drawer
	var vsImageContainer = 'vsImageContainer'; // ID of the main image container's HTML element
	var vsImage = 'vsImage'; // ID of the main image
	var vsImageWidth = 220; // integer width of the main image
	var vsImageHeight = 375; // integet height of the main image
	var vsImageClassName = 'fullImage'; // class name of the  main image (full size image not zoom image)
	var vsThumbClassName = 'thumbnail'; // class for thumnail images
	var vsThumbCurrentClassName = 'currentThumbnail'; // class for the thumbnail of the image currently in the viewer
	var vsThumbActiveClassName = 'activeThumbnail'; // class for the rollover/active state of the thumbnail images
	var vsControlImage = 'vsControlImage'; // ID of the control image
	var vsControlImageOffSrc = '/images/proddisplay/moreimg_off.gif'; // src of control image in off state
	var vsControlImageDrawerOnSrc = '/images/proddisplay/moreimg_drawerOn.gif'; // src of control image when the drawer is open
	var vsControlImageZoomOnSrc = '/images/proddisplay/moreimg_zoomOn.gif'; // src of control image when zoom is active
	// --- DO NOT EDIT ANYTHING BELOW THIS

	// Global Variable Setup
	var vsDrawerTimeout;

	// vsDrawer Functions
	function vsDrawerTimeoutSet(){ 
	vsDrawerTimeout = setTimeout("vsDrawerClose(vsDrawer)", vsDrawerTimeoutLength); }

	function vsDrawerTimeoutClear(){
	 clearTimeout(vsDrawerTimeout); }

	function vsDrawerClose(target){
		// .getAttribute for IE, .getStyle for others
		var drawerTop = $(target).offsetTop;
		//var drawerTop = $('target').getStyle('top') || $('target').getAttribute('top');
		if(parseInt(drawerTop) < vsImageHeight){
			new Effect.Move(target, {duration: vsDrawerCloseLength, y: vsDrawerHeight, afterFinish: function(){
				$(target).style.top = vsImageHeight + 'px'
			}});
			$(vsControlImage).src = vsControlImageOffSrc;
		}
	}

	function vsDrawerOpen(target){
		vsDrawerTimeoutClear();
		// .getAttribute for IE, .getStyle for others
		var drawerTop = $(target).offsetTop;
		//var drawerTop = $(target).getStyle('top') || $(target).getAttribute('top');
		if(parseInt(drawerTop) >= vsImageHeight){
			$(target).top = vsImageHeight + 'px';
			new Effect.Move(target, {duration: vsDrawerOpenLength, y: -vsDrawerHeight});
			$(vsControlImage).src = vsControlImageDrawerOnSrc;
		}
	}

	function vsDrawerToggle(target){
		// .getAttribute for IE, .getStyle for others
		var drawerTop = $(target).offsetTop;
		//var drawerTop = $(target).getAttribute("height");
		//var drawerTop = $('target').getStyle('top') || $('target').getAttribute('top');
		if(parseInt(drawerTop) >= vsImageHeight){
			vsDrawerOpen(target);
		} else {
			vsDrawerClose(target);
		}
	}

	function vsEmptyElement(target){
		while($(target).childNodes.length > 0){
			$(target).removeChild($(target).firstChild);
		}
	}

	function vsSwapZoomInstrstructions(direction){
		if(direction == 'on'){
			if($(vsControlImage).src != vsControlImageZoomOnSrc){
				$(vsControlImage).src = vsControlImageZoomOnSrc;
			}
		} else {
			$(vsControlImage).src = vsControlImageOffSrc;
		}
	}

	function vsSwapMainImage(thumbLink){
		// Change the class for all the thumbnails to the default class
		var thumbArray = $('vsDrawer').getElementsByTagName('img');
		for(var i = 0; i < thumbArray.length; i++){
			thumbArray[i].className = vsThumbClassName;
		}
				
		// Get a reference to the thumbnail image
		var thumbImage = $(event.srcElement.id);
		// Assign the current thubmnail the vsThumbnailCurrentClassName value
		thumbImage.className = vsThumbClassName + ' ' + vsThumbCurrentClassName;
		// Load the zoom image.
		tmpImage = new Image();

		tmpImage.src = thumbImage.getAttribute('zoomsrc');
		var fullImage = document.createElement('img');
		fullImage.id = vsImage;
		fullImage.width = vsImageWidth;
		fullImage.height = vsImageHeight;
		fullImage.className = vsImageClassName;
		fullImage.src = thumbImage.getAttribute('fullsrc');
		fullImage.setAttribute('data-magnifysrc', thumbImage.getAttribute('zoomsrc'));
		fullImage.setAttribute('rel', thumbImage.id);
		vsEmptyElement(vsImageContainer);

		$(vsImageContainer).appendChild(fullImage);

		// Run the Zoom.init() script again since we have changed up the image info.
	}

	function vsThumbActivate(event){
		var thumbImage = $(event.srcElement.id);
		thumbImage.className = vsThumbClassName + ' ' + vsThumbActiveClassName;
		thumbImage.style.cursor = 'pointer';
	}

	function vsThumbDeactivate(event){
		var thumbImage = $(event.srcElement.id);
		if(thumbImage.className.indexOf(vsThumbCurrentClassName) > -1){
			thumbImage.className = vsThumbClassName + ' ' + vsThumbCurrentClassName;
		} else {
			thumbImage.className = vsThumbClassName;
		}
	}

	function vsDrawerPrep(){
		$(vsDrawer).makePositioned;
		//document.getElementById('vsDrawer').makePositioned();
		Event.observe(vsDrawer, 'mouseover', vsDrawerTimeoutClear);
		Event.observe(vsDrawer, 'mouseout', vsDrawerTimeoutSet);
		// We have to go backwards since we are removing nodes.
		//	If we start at the top (index: 0) removed nodes alter the node order.
		for(var i = $(vsDrawer).childNodes.length - 1; i >=0; i--){
			currentNode = $(vsDrawer).childNodes[i];

			if(currentNode.nodeType != 1 && currentNode.nodeName.toUpperCase() != 'IMG'){
				$(vsDrawer).removeChild(currentNode);
			}
		}
		var currentNode;
		for(var i = $(vsDrawer).childNodes.length - 1; i >= 0; i--){
			currentNode = $(vsDrawer).childNodes[i];
			currentNode.id = 'vsDrawerThumb' + i;

			if(i == 0){
				currentNode.className = currentNode.className + ' ' + vsThumbCurrentClassName;
			}

			Event.observe(currentNode, 'click', vsSwapMainImage);
			Event.observe(currentNode, 'mouseover', vsThumbActivate);
			Event.observe(currentNode, 'mouseout', vsThumbDeactivate);
		}
	}
	//Event.observe(window, 'load', vsDrawerPrep);
	
var hoefler_roman = {
  src: '/html/includes/proddisplay/hoefler_roman.swf'
};

sIFR.useStyleCheck = true;
sIFR.activate(hoefler_roman);

sIFR.replace(hoefler_roman, {
  selector: 'div.headings h1',
  ratios: [9, 1.16, 16, 1.09, 24, 1.06, 37, 1.04, 74, 1.02, 1.01],
  css:
  [
      '.sIFR-root {  color: #000000; font-size:16px; letter-spacing: 0;}'
      ,'a { text-decoration: none; }'
      ,'a:link { color: #000000; }'
      ,'a:hover { color:#000000; }'
    ],
 // leading: -50,
 tuneHeight: -3,
 offsetTop: 0,
 wmode: 'transparent'
});

sIFR.replace(hoefler_roman, {
  selector: 'div.headings h2',
  ratios: [9, 1.16, 16, 1.09, 24, 1.06, 37, 1.04, 74, 1.02, 1.01],
  css:
  [
      '.sIFR-root {  color: #000000; letter-spacing: 0;}'
      ,'a { text-decoration: none; }'
      ,'a:link { color: #000000; }'
      ,'a:hover { color:#000000; }'
    ],
 // leading: -50,
 tuneHeight: -1,
 offsetTop: 0,
 wmode: 'transparent'
});


sIFR.replace(hoefler_roman, {
  selector: 'div.headings h3',
  ratios: [9, 1.16, 16, 1.09, 24, 1.06, 37, 1.04, 74, 1.02, 1.01],
  css:
    [
      '.sIFR-root {  color:#000000; letter-spacing: 0;}'
      ,'a { text-decoration: none; }'
      ,'a:link { color:#000000; }'
      ,'a:hover { color:#000000; }'

    ],
  // leading: -50,
  tuneHeight: -3,//-5
  offsetTop: -1,
  wmode: 'transparent'
});

sIFR.replace(hoefler_roman, {
  selector: 'h3.sub-heads', 
  ratios: [9, 1.16, 16, 1.09, 24, 1.06, 37, 1.04, 74, 1.02, 1.01],
  css: 
    [
      '.sIFR-root {  color:#333333; letter-spacing: 0;}'
      ,'a { text-decoration: none; }'
      ,'a:link { color:#333333; }'
      ,'a:hover { color:#333333; }'
	  
    ],
  // leading: -50,
  tuneHeight: -3,//-5
  offsetTop: -1,
  wmode: 'transparent'
});
sIFR.replace(hoefler_roman, {
  selector: 'div.headings h4',
  ratios: [9, 1.16, 16, 1.09, 24, 1.06, 37, 1.04, 74, 1.02, 1.01],
  css:
    [
      '.sIFR-root {  color:#000000; font-size:12px; letter-spacing: 0;}'
      ,'a { text-decoration: underline; }'
      ,'a:link { color:#000000; }'
      ,'a:hover { color:#000000; }'

    ],
  // leading: -50,
  tuneHeight: -3,//-5
  offsetTop: -1,
  wmode: 'transparent'
});

/* Scott Added Code Starts Here.... */

var killHideDrawer = false;
var vsDrawerTimeout;

function killHideTimeout() {
    clearTimeout(vsDrawerTimeout);
}

function unKillHideTimeout() {
	closeScottDrawer();
}
var activeThumb = 0;

function populateDrawer() {

    var scottDrawer = document.getElementById("scott_drawer");
	var vsControl = document.getElementById("vsControl");
	if (scottImgDrawer.length < 2) {		
		return;
	}
	vsControl.style.display = "block"; // display since CSS had it not displayed
    resetDrawerArray();

    var out = "";
    for (var i = 0; i < scottImgDrawer.length; i++) {
        out = out + "<img id=\"drawerimg_" + i + "\" src=\"" + scottImgDrawer[i] + "\" class=\"thumbnail\" onclick=\"swapImage(" + i + ");\" onmouseover=\"killHideTimeout();thumbCurrent(" + i + ");\" onmouseout=\"closeScottDrawer();thumbNormal(" + i + ");\"/>";
    }
    out = out.replace(/prodlgvw/g,"prodpri2");
	out = out.replace(/prodpri2/g,"tmbsm");
	scottDrawer.innerHTML = out;
	var dimg = document.getElementById("drawerimg_"+activeThumb);
    dimg.className = "currentThumbnail";    
}

function thumbCurrent(i) {
	var dimg = document.getElementById("drawerimg_"+i);
	dimg.className = "activeThumbnail";

}
function thumbNormal(i) {
	var dimg = document.getElementById("drawerimg_"+i);
	if (i != activeThumb) {
		dimg.className = "thumbnail";
	} else {
		dimg.className = "currentThumbnail";    
	}
}

function resetDrawerArray() {

    var newArray = new Array();
    for (var i = 0; i < scottImgDrawer.length; i++) {
        var innew = false;
        for (var j = 0; j < newArray.length; j++) {
            if (newArray[j] == scottImgDrawer[i]) {
                innew = true;
                break;
            }
        }
        if (innew == false) {
            newArray.push(scottImgDrawer[i]);
        }
    }
    scottImgDrawer = newArray;
}

var vsImageSwapped = false;

function swapImage(i) {
	vsImageSwapped = true; // for swatches
    var img = document.getElementById("vsImage");   
    var newImgSrc = scottImgDrawer[i];
    newImgSrc = newImgSrc.replace(/prodlgvw/g,"prodpri2");
    img.src = newImgSrc;
	for (var j = 0; j < scottImgDrawer.length; j++) {
		var dimg = document.getElementById("drawerimg_"+j);
		dimg.style.border = "1px solid #999999";   
	}
	var dimg2 = document.getElementById("drawerimg_"+i);
    dimg2.style.border = "1px solid #FF0000";   
	hideScottDrawer();
}

function openScottDrawer() {
	clearTimeout(vsDrawerTimeout); // clear anything in place
    var scottDrawer = document.getElementById("scott_drawer");
	var bodyCont = document.getElementById("bodycontainer");
	var vsControl = document.getElementById("vsControl");
	var left = getPosition(vsControl).x;
	var top = getPosition(vsControl).y - 100;
	scottDrawer.style.left = left; 
	scottDrawer.style.top = top; 	
    scottDrawer.style.visibility="visible";
}


function closeScottDrawer() {
	clearTimeout(vsDrawerTimeout); // clear anything in place
	vsDrawerTimeout = setTimeout(hideScottDrawer,2000);
	
}

function hideScottDrawer() {
	var scottDrawer = document.getElementById("scott_drawer");
	scottDrawer.style.visibility="hidden";
}

function getPosition(e){
	var left = 0;
	var top  = 500;

	while (e.offsetParent){
		left += e.offsetLeft;
		top  += e.offsetTop;
		e     = e.offsetParent;
	}

	left += e.offsetLeft;
	top  += e.offsetTop;

	return {x:left, y:top};
}