// Расхлоп картинки
// <IMG SRC="img_small.jpg" imgpopup.srcBig="img_big.jpg" imgpopup.direction="-45" name="aabb" alt="asdf" title="dddssss">
// 

imgpopup_color = '#F0F0F0';
imgpopup_shadow = '/images/img_shadow_tail.png';
imgpopup_shadow_offset = '20px';

/*
if(window.addEventListener) {
	window.addEventListener('onload', imgpopup_init, false);
} else {
	window.attachEvent('onload', imgpopup_init);
}
*/

function imgpopup_init() {
	for(var i=0; i<document.images.length; i++) {
		var srcBig = document.images.item(i).getAttribute('imgpopup.srcBig');
		if(srcBig) {
			if (document.images.item(i).addEventListener) {
			document.images.item(i).style.cursor = 'pointer';
		    document.images.item(i).addEventListener('click', imgpopup_click, false);
			} else {
				document.images.item(i).style.cursor = 'hand';
			    document.images.item(i).attachEvent('onclick', imgpopup_click);
			}
		}
	}
}

function imgpopup_click(e) {
	var el = '';
	if(e.srcElement) el = e.srcElement;
	if(e.target) el = e.target;

	var div = document.createElement('DIV');
	div.style.position = "absolute";
	div.style.border = "#AAA 1px solid";
	div.style.zIndex = 1000;
	// куда расширяемся
	var direction = el.getAttribute('imgpopup.direction');
	if(direction == '' || direction == '-45') {
		div.style.left = getOffsetX(el) - 1;
		div.style.top = getOffsetY(el) - 1;
	}

	var div_shad = document.createElement('DIV');
	div_shad.style.left = imgpopup_shadow_offset;
	div_shad.style.top = imgpopup_shadow_offset;
	div_shad.style.position = "absolute";
	div_shad.style.width = "100%";
	div_shad.style.zIndex = "-1";
	div_shad.style.height = "100%";
	div_shad.style.backgroundImage = "url("+imgpopup_shadow+")";
	div.appendChild(div_shad);
	div_shad.style.filter = "alpha(opacity=75)";


	var div_cont = document.createElement('DIV');
	div_cont.style.padding = "5pt";
	div_cont.style.backgroundColor = imgpopup_color;

		var img = document.createElement('IMG');
		img.src = el.getAttribute('imgpopup.srcBig');
		img.alt = el.alt;
		img.title = el.title;
		// для ie & mozilla
		if (img.addEventListener) {
			img.style.cursor = 'pointer';
		    img.addEventListener('click', imgpopup_clickoff, false);
		} else {
			img.style.cursor = 'hand';
		    img.attachEvent('onclick', imgpopup_clickoff);
		}
		div_cont.appendChild(img);

		var div_text = document.createElement('DIV');
		div_text.style.textAlign = "center";
		div_text.innerHTML = el.alt;
		div_cont.appendChild(div_text);
	
	div.appendChild(div_cont);

	el.parentNode.appendChild(div);

	if(div_shad.style.setExpression) {
		div_shad.style.setExpression("height", 'this.parentNode.clientHeight+"px"'); // IE
	} else {
		div_shad.style.height = "100%";	// OTHER
	}
}

function imgpopup_clickoff(e) {
	var el = '';
	if(e.srcElement) el = e.srcElement;
	if(e.target) el = e.target;
	el.parentNode.parentNode.parentNode.removeChild(el.parentNode.parentNode);
}



function getOffsetX(el) {
	var x = el.offsetLeft;
	while(el = el.offsetParent)
		if(el.offsetLeft) x += el.offsetLeft;
	return(x);
}

function getOffsetY(el) {
	var y = el.offsetTop;
	while(el = el.offsetParent) {
		if(el.offsetTop) y += el.offsetTop;
	}
	return(y);
}