var theHandle, theRoot, theThumb, theScroll;
	var thumbTravel, ratio;
	
	window.onload = function() {
		document.getElementById('designer').src = 'designer/designer.php?paver='+pavers+'&border='+border+'&pavername='+pavernames+'&wall='+walls+'&wallname='+wallnames+'&bordername='+bordernames+'';
		document.getElementById(paverborder).style.border = "solid #cc0000 2px";
document.getElementById(paverborderB).style.border = "solid #cc0000 2px";
document.getElementById(wallborder).style.border = "solid #cc0000 2px";
	resetNames();
	//	document.getElementById('paver').value='belhaven';
	//	searchSuggestUnit();
		if (document.all || document.getElementById)
		{
			var scroll1 = document.all ? document.all["thumb"] : document.getElementById("thumb") 
			var scroll2 = document.all ? document.all["thumb2"] : document.getElementById("thumb2")
			var scroll3 = document.all ? document.all["thumb3"] : document.getElementById("thumb3")

			Drag.init(scroll1, null, 0, 195, -1, -1);
				if (pavers!='Lincoln') {
			Drag.init(scroll2, null, 1, 195, 0, 0);
				}
			Drag.init(scroll3, null, 1, 195, 0, 0);
				scroll1.onDrag = function(x, y) {
					var sdatavar = document.all ? document.all["sdata"] : document.getElementById("sdata")
					var sdwidth =sdatavar.style.width;
						sdw=parseInt(sdwidth);
	sdw=sdw-250;
	var thumbwidth=220;
	var ratio=sdw/thumbwidth;
	x=x*ratio;
		document.getElementById("scrollContent").style.left=-x + "px";
	//	document.getElementById('pavernamed').innerHTML = -x;
		}
				scroll2.onDrag = function(x, y) {
					var sdatavar = document.all ? document.all["sdata2"] : document.getElementById("sdata2")
					var sdwidth =sdatavar.style.width;
						sdw=parseInt(sdwidth);
	sdw=sdw-250;
	var thumbwidth=220;
	var ratio=sdw/thumbwidth;
	x=x*ratio;
		document.getElementById("scrollContent2").style.left=-x + "px";
		}
		scroll3.onDrag = function(x, y) {
			var sdatavar = document.all ? document.all["sdata3"] : document.getElementById("sdata3")
			var sdwidth =sdatavar.style.width;
						sdw=parseInt(sdwidth);
	sdw=sdw-250;
	var thumbwidth=220;
	var ratio=sdw/thumbwidth;
	x=x*ratio;
		document.getElementById("scrollContent3").style.left=-x + "px";
		}
		}
	}
	
	
function clearTime() {
		window.clearTimeout(to);
		i=0;
		}
function goLeft(sid) {
		var sid = sid;
		var i=0;
		if (sid==1) {
		var sdatavar = document.all ? document.all["sdata"] : document.getElementById("sdata")
		var thumvar = document.all ? document.all['thumb'] : document.getElementById('thumb')
		var scrollvar = document.all ? document.all["scrollContent"] : document.getElementById("scrollContent")
		}
		if (sid==2) {
		var sdatavar = document.all ? document.all["sdata2"] : document.getElementById("sdata2")
		var thumvar = document.all ? document.all['thumb2'] : document.getElementById('thumb2')
		var scrollvar = document.all ? document.all["scrollContent2"] : document.getElementById("scrollContent2")
		}
		if (sid==3) {
		var sdatavar = document.all ? document.all["sdata3"] : document.getElementById("sdata3")
		var thumvar = document.all ? document.all['thumb3'] : document.getElementById('thumb3')
		var scrollvar = document.all ? document.all["scrollContent3"] : document.getElementById("scrollContent3")
		}
		var sdwidth =sdatavar.style.width;
	sdw=parseInt(sdwidth);
	sdw=sdw-250;
	var thumbwidth=220;
	var ratio=sdw/thumbwidth;
	if (i==0) {
		var thumbleft=thumvar.style.left;
		thum=parseInt(thumbleft);
		i++;
		var sctop=scrollvar.style.left;
		scrollleft=parseInt(sctop);
		}
		if (thum>10) {
		thum=thum-10;
		thumpx= thum + "px";
		thumvar.style.left=thumpx;
	//    scrollleft=scrollleft+(ratio*10);
	//	if (oldt>0) { oldt=0; }
		scrolllefts=thum*ratio;
		scrolllefts=Math.round(scrolllefts);
		scrollvar.style.left=-scrolllefts + "px";
		} else {
			thumvar.style.left=1 + "px";
			scrollvar.style.left=0 + "px";
			window.clearTimeout(to);
			}
			to=window.setTimeout("goLeft("+sid+")", 200);
		}
        function goRight(sid) {
		var sid = sid;
			if (sid==1) {
		var sdatavar = document.all ? document.all["sdata"] : document.getElementById("sdata")
		var thumvar = document.all ? document.all['thumb'] : document.getElementById('thumb')
		var scrollvar = document.all ? document.all["scrollContent"] : document.getElementById("scrollContent")
		}
			if (sid==2) {
		var sdatavar = document.all ? document.all["sdata2"] : document.getElementById("sdata2")
		var thumvar = document.all ? document.all['thumb2'] : document.getElementById('thumb2')
		var scrollvar = document.all ? document.all["scrollContent2"] : document.getElementById("scrollContent2")
		}
		if (sid==3) {
		var sdatavar = document.all ? document.all["sdata3"] : document.getElementById("sdata3")
		var thumvar = document.all ? document.all['thumb3'] : document.getElementById('thumb3')
		var scrollvar = document.all ? document.all["scrollContent3"] : document.getElementById("scrollContent3")
		}
	var sdwidth=sdatavar.style.width;
	sdw=parseInt(sdwidth);
	sdw=sdw-250;
	var thumbwidth=220;
	var ratio=sdw/thumbwidth;
		var i=0;
		var newt;
	if (i==0) {
		var newleft=thumvar.style.left;
		newleft=parseInt(newleft);
		i++;
		var scleft=scrollvar.style.left;
		oldleft=parseInt(scleft);
		if (oldleft<0) { oldleft=oldleft*-1; }
		}
		
		if (newleft<185) {
		newleft=newleft+10;
		newlefts= newleft + "px";
		thumvar.style.left=newlefts;
		oldleft=newleft*ratio;
		oldleft=Math.round(oldleft);
		scrollvar.style.left=-oldleft + "px";
		} else  {
		thumvar.style.left=(195) + "px";
			scrollvar.style.left= + "px";
			window.clearTimeout(to);
			}
			to=window.setTimeout("goRight("+sid+")", 200);
		}