var currentSlider = null,sliderField = null;
var dx, dy;
var resizeType;
var startCropX = 0;
var startCropY = 0;
var theImage;
var imgCoords;
var minX;
var minY;
var maxX;
var maxY;
var crop_enable;
var clientIsOpera;

function initSlider() {
	currentSlider = document.getElementById('ant');
	theImage = document.getElementById('theImage');
	if (theImage) {
		imgCoords = getElementCoords(theImage);
		minX = imgCoords[0];
		minY = imgCoords[1];
		maxX = imgCoords[0] + theImage.width - 2;
		maxY = imgCoords[1] + theImage.height - 2;
	}
	dx = -1;
	dy = -1;
	crop_enable = false;
	clientIsOpera = (navigator.userAgent.toLowerCase().indexOf('opera') != -1 );
}

function updateSlider() {
	if (currentSlider == null) {
		currentSlider = document.getElementById('ant');
	}

	var top = parseInt(currentSlider.style.top);
	var left = parseInt(currentSlider.style.left);
	var width = parseInt(currentSlider.style.width);
	var height = parseInt(currentSlider.style.height);

	document.getElementById('nw-resize').style.top = top - 4 + "px";
	document.getElementById('nw-resize').style.left = left - 4 + "px";

	document.getElementById('n-resize').style.top  = top - 4 + "px";
	document.getElementById('n-resize').style.left = left + width / 2 - 4 + "px";

	document.getElementById('ne-resize').style.top = top - 4 + "px";
	document.getElementById('ne-resize').style.left = left + width - 4 + "px";

	document.getElementById('e-resize').style.top = top + height / 2 - 4 + "px";
	document.getElementById('e-resize').style.left = left + width - 4 + "px";

	document.getElementById('se-resize').style.top = top + height - 4 + "px";
	document.getElementById('se-resize').style.left = left + width - 4 + "px";

	document.getElementById('s-resize').style.top = top + height - 4 + "px";
	document.getElementById('s-resize').style.left = left + width / 2 - 4 + "px";

	document.getElementById('sw-resize').style.top = top + height - 4 + "px";
	document.getElementById('sw-resize').style.left = left - 4 + "px";

	document.getElementById('w-resize').style.top = top + height / 2 - 4 + "px";
	document.getElementById('w-resize').style.left = left - 4 + "px";
}

function updateZones() {
	if (currentSlider == null) {
		currentSlider = document.getElementById('ant');
	}

	var top = parseInt(currentSlider.style.top);
	var left = parseInt(currentSlider.style.left);
	var width = parseInt(currentSlider.style.width);
	var height = parseInt(currentSlider.style.height);

	var top_zone = document.getElementById('top_zone');
	var bottom_zone = document.getElementById('bottom_zone');
	var left_zone = document.getElementById('left_zone');
	var rigth_zone = document.getElementById('rigth_zone');
	

	if (top < 0 || left < 0) {
		top_zone.style.top = "-5px";
		top_zone.style.left = "-5px";
		top_zone.style.width = "0px";
		top_zone.style.height = "0px";

		bottom_zone.style.left = "-5px";
		bottom_zone.style.width = "0px";
		bottom_zone.style.top = "-5px";
		bottom_zone.style.height = "0px";

		left_zone.style.top = "-5px";
		left_zone.style.height = "0px";
		left_zone.style.left = "-5px";
		left_zone.style.width = "0px";

		rigth_zone.style.top = "-5px";
		rigth_zone.style.height = "0px";
		rigth_zone.style.left = "-5px";
		rigth_zone.style.width = "0px";
	} else {
		top_zone.style.top = minY + "px";
		top_zone.style.left = minX + "px";
		if (maxX - minX + 2 < 0) {
			top_zone.style.width = 0 + "px";
		} else {
			top_zone.style.width = maxX - minX + 2 + "px";
		}
		if (top - minY < 0) {
			top_zone.style.height = 0 + "px";
		} else {
			top_zone.style.height = top - minY + "px";
		}

		bottom_zone.style.left = minX + "px";
		bottom_zone.style.width = maxX - minX + 2 + "px";
		bottom_zone.style.top = top + height + "px";
		bottom_zone.style.height = (maxY - top - height) + 2 + "px";

		left_zone.style.top = top + "px";
		left_zone.style.height = height + "px";
		left_zone.style.left = minX + "px";
		if (left - minX < 0) {
			left_zone.style.width = 0 + "px";
		} else {
			left_zone.style.width = left - minX + "px";
			
		}

		rigth_zone.style.top = top + "px";
		rigth_zone.style.height = height + "px";
		rigth_zone.style.left = left + width  + 1 + "px";
		if (maxX - left - width < 0) {
			rigth_zone.style.width = 0 + "px";
		} else {
			rigth_zone.style.width = maxX - left - width + "px";
		}
	}
}



function getMouseXY(e) {
	try {
		x = event.clientX + document.documentElement.scrollLeft;
		y = event.clientY + document.documentElement.scrollTop;
		
	} catch(except) {
		x = e.clientX + window.scrollX;
		y = e.clientY +  window.scrollY;
	}
	var out = new Array(x,y);
	return out;
}

function createCropSlider() {
	if (crop_enable == false) {
		return false;
	}
	startCropX = 0;
	startCropY = 0;
	if (currentSlider == null) {
		currentSlider = document.getElementById('ant');
	}
	currentSlider.style.width = 0;
	currentSlider.style.height = 0;
	updateSlider();
	document.onmouseup = stopCropSlider;
	document.onmousemove = resizeCropSlider;
	return false;
}


function resizeCropSlider(e) {
	var x,y = 0;
	
	var tmp = getMouseXY(e);
	x = tmp[0];
	y = tmp[1];
	
	if (startCropX == 0) {
		startCropX = x;
	}
	if (startCropY == 0) {
		startCropY = y;
	}

	if (currentSlider == null) {
		currentSlider = document.getElementById('ant');
	}

	currentSlider.style.top = startCropY + 'px';
	currentSlider.style.left = startCropX + 'px';

	if (x > maxX) {
		x = maxX;
	}
	if (y > maxY) {
		y = maxY;
	}
	if (x < minX) {
		x = minX;
	}
	if (y < minY) {
		y = minY;
	}

	if (x >= startCropX) {
		currentSlider.style.width = x - startCropX + 'px';
	}
	if (y >= startCropY) {
		currentSlider.style.height = y - startCropY + 'px';
	}
	if (x < startCropX) {
		currentSlider.style.left = x + 'px';
		currentSlider.style.width = startCropX - x + 'px';
	}
	if (y < startCropY) {
		currentSlider.style.top = y + 'px';
		currentSlider.style.height = startCropY - y + 'px';
	}
	updateSlider();
	//document.getElementById('coords').value = '(x,y)=('+x+','+y+')';
}

function stopCropSlider() {
	if (currentSlider == null) {
		currentSlider = document.getElementById('ant');
	}
	if ( parseInt(currentSlider.style.width) == 0 ||  parseInt(currentSlider.style.height) == 0 ) {
		currentSlider.style.top = "-15px";
		currentSlider.style.left = "-15px";
		updateSlider();
		updateZones();
	}
	updateZones();
	document.onmousemove = null;
	return null;
}

function startMoveSlider() {
	document.onmouseup = stopMoveSlider;
	document.onmousemove = moveSlider;
	return false;
}

function moveSlider(e) {
	var x, y;
	var newx, newy;

	var tmp = getMouseXY(e);
	x = tmp[0];
	y = tmp[1];
	
	if (currentSlider == null) {
		currentSlider = document.getElementById('ant');
	}
	
	var top = parseInt(currentSlider.style.top);
	var left = parseInt(currentSlider.style.left);
	var width = parseInt(currentSlider.style.width);
	var height = parseInt(currentSlider.style.height);
	
	if (dx == -1) {
		dx = x - left;
	}
	
	if (dy == -1) {
		dy = y - top;
	}
	

	newx = x - dx;
	if (newx < minX) {
		newx = minX;
	}
	if (newx + width > maxX ) {
		newx = maxX - width;
	}
	
	newy = y - dy;
	if (y - dy < minY) {
		newy = minY;
	}
    
	if (newy + height > maxY) {
		newy = maxY - height;
	}
	
	//!!!!!!
	currentSlider.style.top = newy + "px";
	currentSlider.style.left = newx + "px";
	updateSlider();	
}

function stopMoveSlider() {
	updateZones();
	document.onmousemove = null;
	dx = -1;
	dy = -1;
	return false;
}


function startResize(type) {
	// type - nw, n, ne, e, se, s, sw, w;
	resizeType = type;
	document.onmousemove = resizeSlider;
	document.onmouseup = stopMoveSlider;
	return false;
}

function resizeSlider(e) {
	var x, y;
	var newx, newy;

	
	var tmp = getMouseXY(e);
	x = tmp[0];
	y = tmp[1];
	
	if (currentSlider == null) {
		currentSlider = document.getElementById('ant');
	}
	
	var top = parseInt(currentSlider.style.top);
	var left = parseInt(currentSlider.style.left);
	var width = parseInt(currentSlider.style.width);
	var height = parseInt(currentSlider.style.height);
	
	
	switch (resizeType)  {
		case 'nw' :
			if (x <= minX) {
				x = minX;
			}
			if (x >= left + width) {
				x = left + width;
			}
			currentSlider.style.width = left - x + width;
			currentSlider.style.left = x + "px";
			
			if (y <= minY) {
				y= minY;
			}
			if (y >= top + height) {
				y = top + height
			}
			currentSlider.style.height = top - y + height;
			currentSlider.style.top = y + "px";
			break;
		case 'n' :
			if (y <= minY) {
				y= minY;
			}
			if (y >= top + height) {
				y = top + height
			}
			currentSlider.style.height = top - y + height;
			currentSlider.style.top = y + "px";
			break;
		case 'ne' :
			if (y <= minY) {
				y= minY;
			}
			if (y >= top + height) {
				y = top + height
			}
			currentSlider.style.height = top - y + height;
			currentSlider.style.top = y + "px";

			if (x >= maxX) {
				x = maxX;
			}
			if (x <= left) {
				x = left;
			}
			if (x - left < 0) {
				x = left;
			}
			currentSlider.style.width = x - left + "px";
			
			break;
		case 'e' :
			if (x >= maxX) {
				x = maxX;
			}
			if (x <= left) {
				x = left;
			}
			if (x - left < 0) {
				x = left;
			}
			currentSlider.style.width = x - left + "px";
			break;
		case 'se' :
			if (x >= maxX) {
				x = maxX;
			}
			if (x <= left) {
				x = left;
			}
			if (x - left < 0) {
				x = left;
			}
			currentSlider.style.width = x - left + "px";
			
			if (y >= maxY) {
				y = maxY;
			}
			if (y <= top) {
				y = top;
			}
			if (y - top < 0) {
				y = top;
			}
			currentSlider.style.height = y - top + "px";
			break;
		case 's' :
			if (y >= maxY) {
				y = maxY;
			}
			if (y <= top) {
				y = top;
			}
			if (y - top < 0) {
				y = top;
			}
			currentSlider.style.height = y - top + "px";
			break;
		case 'sw' :
			if (y >= maxY) {
				y = maxY;
			}
			if (y <= top) {
				y = top;
			}
			if (y - top < 0) {
				y = top;
			}
			currentSlider.style.height = y - top + "px";
		
			if (x <= minX) {
				x = minX;
			}
			if (x >= left + width) {
				x = left + width;
			}
			currentSlider.style.width = left - x + width;
			currentSlider.style.left = x + "px";
		
			break;
		case 'w' :
			if (x <= minX) {
				x = minX;
			}
			if (x >= left + width) {
				x = left + width;
			}
			currentSlider.style.width = left - x + width;
			currentSlider.style.left = x + "px";
			break;
		default:
			document.onmousemove = null;
			return false;	
		break;
	}
	updateSlider();	
	updateZones();
}

function stopResize () {
	document.onmousemove = null;
	return false;
}


function getElementCoords(elm) {
	var offsetTrail = elm;
	var left_ = 0;
	var top_ = 0;

	while (offsetTrail) {
        
		left_ += offsetTrail.offsetLeft;
		top_ += offsetTrail.offsetTop;
		offsetTrail = offsetTrail.offsetParent;
	}
	
	

	var out = new Array(left_,top_);
	return out;
}

function flip_section() {

	var goldSech = document.getElementById('goldenSech');
	var goldSech_img = document.getElementById('goldenSech_spacer');

	
	if (clientIsOpera && goldSech.style.display == 'none') {
		if (!confirm('Для вашего броузера, эта функция работает не всегда коректно.\r\n\Продолжить ?')) {
			return false;
		}
	}
	
	if (currentSlider == null) {
		currentSlider = document.getElementById('ant');
	}
	
	var top = parseInt(currentSlider.style.top);
	var left = parseInt(currentSlider.style.left);
	var width = parseInt(currentSlider.style.width);
	var height = parseInt(currentSlider.style.height);
	
	if (top < 0 || left < 0) {
		load_frame(0,0,0,0);
		crop_enable = true;
		document.getElementById('frame_b').style.display = 'inline';
		goldSech.style.display = 'block';
		goldSech_img.style.display = 'none';
	} else {
		if (goldSech.style.display == 'none') {
			goldSech.style.display = 'block';
			goldSech_img.style.display = 'none';
		} else {
			goldSech.style.display = 'none';
			goldSech_img.style.display = 'inline';
		}
	}

	//alert(goldSech.style.display);
}


function save_frame() {
	if (currentSlider == null) {
		currentSlider = document.getElementById('ant');
	}
	
	var top = parseInt(currentSlider.style.top);
	var left = parseInt(currentSlider.style.left);
	var width = parseInt(currentSlider.style.width);
	var height = parseInt(currentSlider.style.height);
	
	if (top < 0 || left < 0 || width < 2 || height < 2) {
		return false;
	}
	msg = document.getElementById('message');
	if (msg) {
		var x1 = left - minX;
		if (x1 < 0 ) {
			x1 = 0;
		}
		var y1 = top - minY;
		if (y1 < 0) {
			y1 = 0;
		}
		var x2 = maxX - left - width;
		if (x2 < 0) {
			x2 = 0;
		}
		var y2 = maxY - top - height;
		if (y2 < 0) {
			y2 = 0;
		}
		msg.value += '<!--frame('+x1+','+y1+','+x2+','+y2+')-->';
		msg.focus();
	}
	return false;
}

function load_frame(nx1, ny1, nx2, ny2) {
	if (currentSlider == null) {
		currentSlider = document.getElementById('ant');
	}
	
	var top  = minY + ny1;
	var left = minX + nx1;
	
	if (top > maxY) {
		top = minY;
	}
	if (top < minY) {
		top = minY;
	}
	
	if (left > maxX) {
		left = minX;
	}
	if (left < minX) {
		left = minX;
	}
	
	var width = maxX - nx2 - left;
	var height = maxY - ny2 - top;
	
	if (left + width > maxX) {
		width = maxX - left;
	}
	if (width < 0) {
		width = maxX - left;
	}
	
	if (top + height > maxY) {
		height = maxY - top;
	}
	if (height < 0) {
		height = maxY - top;
	}
	
	crop_enable = true;
	document.getElementById('frame_b').style.display = 'inline';
	currentSlider.style.top = top + "px";
	currentSlider.style.left = left + "px";
	
	currentSlider.style.width = width + "px";
	currentSlider.style.height = height + "px";
	updateSlider();
	updateZones();

	window.scrollTo(0, 0);
	return false;
}

function show_fullsize(photo_id) {
	window.open('/cgi-bin/photos/fullsize.cgi?' + photo_id, '', 'width=1, height=1, menubar=no, status=no, location=no, scrollbars=auto, fullscreen=yes, directories=no,resizable=yes');
	return false;
}


function flip_grayscale(button) {
	if (theImage.filters) {
		if (theImage.filters['Gray']) {
			if (theImage.filters['Gray'].enabled == true) {
				theImage.filters['Gray'].enabled = false;
			} else {
				theImage.filters['Gray'].enabled = true;
			}
		} else {
			theImage.style.filter = 'Gray';
		}
	} else {
		alert('Эта опция не поддерживается Вашим броузером');
	}
}

function flip_crop() {
	crop_enable = !crop_enable;
	if (crop_enable == false) {
		document.getElementById('frame_b').style.display = 'none';
		currentSlider.style.top = "-15px";
		currentSlider.style.left = "-15px";
		currentSlider.style.width = 0;
		currentSlider.style.height = 0;
		try {
			theImage.style.cursor = 'pointer';
		} catch (except) {
			try {
			theImage.style.cursor = 'hand';
			} catch (except) {
				
			}
		}
		updateSlider();
		updateZones();
	} else {
		theImage.style.cursor = 'crosshair';
		document.getElementById('frame_b').style.display = 'inline';
		load_frame(0,0,0,0);
	}
}