var value1;
var leftpx;
value1 = 0.75;
leftpx = "48px";
function scaleIt(v) {
	var scalePhotos = document.getElementsByClassName("scale-image");
	var Image = document.getElementById("picture");
	floorSize = 0.25;
	ceilingSize = 1.0;
	v = floorSize + (v * (ceilingSize - floorSize));
	cur_img_index = document.getElementById('currrent_image_index').value; 
	/*
	for (var i=0; i < scalePhotos.length; i++) 
	{
		scalePhotos[i].style.width = (v*1000)+"px";
		document.getElementById('transImage').style.width = (v*1000) + 'px';
		document.getElementById('transImage').style.height = Image.height + 'px';
		perouter.style.visibility="hidden";
		leftpx =  Math.round((demoSlider.trackLength / (demoSlider.range.end - demoSlider.range.start)) * (v - demoSlider.range.start)) + "px"; 
	}
	*/
	for (var i=0; i < scalePhotos.length; i++) 
	{
		scalePhotos[i].style.width = (v*width[cur_img_index])+"px";
		document.getElementById('transImage').style.width = (v*width[cur_img_index]) + 'px';
		document.getElementById('transImage').style.height = Image.height + 'px';
		perouter.style.visibility="hidden";
		leftpx =  Math.round((demoSlider.trackLength / (demoSlider.range.end - demoSlider.range.start)) * (v - demoSlider.range.start)) + "px"; 
	}
}
var demoSlider = new Control.Slider('handle1','track1', 
      {axis:'horizontal', minimum: 0, maximum:100, alignX: 7, increment: 1, sliderValue: 0.67});

demoSlider.options.onSlide = function(value){
	value1 = value;
	scaleIt(value);
	perouter.style.visibility="hidden";
}
demoSlider.options.onChange = function(value){
	value1 = value;
	scaleIt(value);
}

function increaseImage()
{
	CurrentHandlePosition = document.getElementById('handle1').style.left;
	if(CurrentHandlePosition == "0px" || (value1 >  0 && value1 < 0.10))
	{
		scaleIt(0.10);
		value1 = 0.10;
		document.getElementById('handle1').style.left = "7.2px";
	}	else if (CurrentHandlePosition == "7.2px" || (value1 > 0.10  && value1 < 0.20))	{
		scaleIt(0.20);
		value1 = 0.20;
		document.getElementById('handle1').style.left = "14.4px";
	}	else if (CurrentHandlePosition == "14.4px" || (value1 > 0.20  && value1 < 0.30))	{
		scaleIt(0.30);
		value1 = 0.30;
		document.getElementById('handle1').style.left = "21.6px";
	}	else if (CurrentHandlePosition == "21.6px" || (value1 > 0.30  && value1 < 0.40))	{
		scaleIt(0.40);
		value1 = 0.40;
		document.getElementById('handle1').style.left = "28.8px";	
	}	else if (CurrentHandlePosition == "28.8px" || (value1 > 0.40  && value1 < 0.50))	{
		scaleIt(0.50);
		value1 = 0.50;
		document.getElementById('handle1').style.left = "36px";	
	}	else if (CurrentHandlePosition == "36px" || (value1 > 0.50  && value1 < 0.60))	{
		scaleIt(0.60);
		value1 = 0.60;
		document.getElementById('handle1').style.left = "43.2px";	
	}	else if (CurrentHandlePosition == "43.2px" || CurrentHandlePosition == "48px"  || (value1 > 0.60  && value1 < 0.70))	{
		scaleIt(0.70);
		value1 = 0.70;
		document.getElementById('handle1').style.left = "50.4px";	
	}	else if (CurrentHandlePosition == "50.4px" || (value1 > 0.70  && value1 < 0.70))	{
		scaleIt(0.80);
		value1 = 0.80;
		document.getElementById('handle1').style.left = "57.6px";
	}	else if (CurrentHandlePosition == "57.6px" || (value1 > 0.80  && value1 < 0.90))	{
		scaleIt(0.90);
		value1 = 0.90;
		document.getElementById('handle1').style.left = "64.8px";	
	}	else if (CurrentHandlePosition == "64.8px" || (value1 > 0.90  && value1 < 1))	{
		scaleIt(1);
		value1 = 1;
		document.getElementById('handle1').style.left = "72px";		
	}		
}

function reduceImage()
{
	CurrentHandlePosition = document.getElementById('handle1').style.left;
	if(CurrentHandlePosition == "7.2px" || (value1 >  0 && value1 < 0.10))
	{
		scaleIt(0);
		value1 = 0;
		document.getElementById('handle1').style.left = "0px";
	}	else if (CurrentHandlePosition == "14.4px" || (value1 > 0.10  && value1 < 0.20))	{
		scaleIt(0.10);
		value1 = 0.10;
		document.getElementById('handle1').style.left = "7.2px";
	}	else if (CurrentHandlePosition == "21.6px" || (value1 > 0.20  && value1 < 0.30))	{
		scaleIt(0.20);
		value1 = 0.20;
		document.getElementById('handle1').style.left = "14.4px";	
	}	else if (CurrentHandlePosition == "28.8px" || (value1 > 0.30  && value1 < 0.40))	{
		scaleIt(0.30);
		value1 = 0.30;
		document.getElementById('handle1').style.left = "21.6px";	
	}	else if (CurrentHandlePosition == "36px" || (value1 > 0.40  && value1 < 0.50))	{
		scaleIt(0.40);
		value1 = 0.40;
		document.getElementById('handle1').style.left = "28.8px";
	}	else if (CurrentHandlePosition == "43.2px"  || (value1 > 0.50  && value1 < 0.60))	{
		scaleIt(0.50);
		value1 = 0.50;
		document.getElementById('handle1').style.left = "36px";
	}	else if (CurrentHandlePosition == "50.4px" || value1 == 0.75  || (value1 > 0.60  && value1 < 0.70))	{
		scaleIt(0.60);
		value1 = 0.60;
		document.getElementById('handle1').style.left = "43.2px";
	}	else if (CurrentHandlePosition == "57.6px" || (value1 > 0.70  && value1 < 0.80))	{
		scaleIt(0.70);
		value1 = 0.70;
		document.getElementById('handle1').style.left = "50.4px";	
	}	else if (CurrentHandlePosition == "64.8px" || (value1 > 0.80  && value1 < 0.90))	{
		scaleIt(0.80);
		value1 = 0.80;
		document.getElementById('handle1').style.left = "57.6px";	
	}	else if (CurrentHandlePosition == "72px" || (value1 > 0.90  && value1 < 1))	{
		scaleIt(0.90);
		value1 = 0.90;
		document.getElementById('handle1').style.left = "64.8px";		
	}	
}