if (!window.addEvent) {
	function addEvent(objElement, strEventType, ptrEventFunc, bCapture) {
		if (bCapture == null) bCapture = false;
		if (objElement.addEventListener) objElement.addEventListener(strEventType, ptrEventFunc, bCapture);
			else if (objElement.attachEvent) objElement.attachEvent('on' + strEventType, ptrEventFunc);
	}
}

var sMPHolderClassName = 'moving-picture';
var sMPContentClassName = 'moving-content';
var oMPLeftArrow = { src: '/i/arr-left.gif', width: 9, height: 16, moveH: -50, moveV: 0 }
var oMPRightArrow = { src: '/i/arr-right.gif', width: 9, height: 16, moveH: 50, moveV: 0 }
var oMPUpArrow = { src: '/i/arr-up.gif', width: 16, height: 9, moveH: 0, moveV: -50 }
var oMPDownArrow = { src: '/i/arr-down.gif', width: 16, height: 9, moveH: 0, moveV: 50 }

var aMovingPictures = [];
var iMPCounter = 0;
var activeMovingPicture = null;

function MovingPicture(eDiv) {
	this.eHolder = eDiv;
	/* get content (moving) element */
	for (var j = 0; (eInnerDiv = eDiv.getElementsByTagName('div')[j]); j++) {
		if (eInnerDiv.className == sMPContentClassName) {
			this.eContent = eInnerDiv;
			break;
		}
	}
	if (this.eContent) {
		/* get default horizontal alignment (left or right) */
		this.sAlignmentH = 'left';
		this.iOffsetH = 0;
		this.iMaxOffsetH = 0;
		if (isNaN(parseInt(this.eContent.style.right))){
			this.iOffsetH = parseInt(this.eContent.style.left);
			if (isNaN(this.iOffsetH)) this.iOffsetH = 0; 
		} else {
			this.sAlignmentH = 'right';
			this.iOffsetH = parseInt(this.eContent.style.right);
		}
		

		/* vertical alignment */
		this.sAlignmentV = 'top';
		this.iOffsetV = 0;
		this.iMaxOffsetV = 0;
		if (isNaN(parseInt(this.eContent.style.bottom))){
			this.iOffsetV = parseInt(this.eContent.style.top);
			if (isNaN(this.iOffsetV)) this.iOffsetV = 0;
		} else {
			this.sAlignmentV = 'bottom';
			this.iOffsetV = parseInt(this.eContent.style.bottom);
		}

		this.isDragH = false;
		this.isDragV = false;
		/* create, position and display arrows */
		positionMovingPictureArrows(this);

		/* moving variables */
		this.clickPageOffsetX = 0;
		this.clickPageOffsetY = 0;


		/* capturing events */
		this.eHolder.onmousedown = mouseDownOnMovingPicture;
		
		/* disable dragging in MSIE */
		this.eContent.ondragstart = function() { return false; }

		return this;
	} else return null;
}


function createMovingPictureArrow(eParent, oMPArrow) {
	var eArrow = document.createElement('img');
	eParent.appendChild(eArrow);
	eArrow.setAttribute('src', oMPArrow.src);
	eArrow.setAttribute('width', oMPArrow.width);
	eArrow.setAttribute('height', oMPArrow.height);
	eArrow.className = 'arrow';
	eArrow.onmousedown = function() { moveMovingPicture(eParent.id, oMPArrow.moveH, oMPArrow.moveV); }
	return eArrow;
}

function positionMovingPictureArrows(oMP) {
	/* create arrows */
	if (oMP.eContent.offsetWidth > oMP.eHolder.offsetWidth) {
		oMP.isDragH = true;
		if (!oMP.eLeftArrow) oMP.eLeftArrow = createMovingPictureArrow(oMP.eHolder, oMPLeftArrow);
		if (!oMP.eRightArrow) oMP.eRightArrow = createMovingPictureArrow(oMP.eHolder, oMPRightArrow);
	} else oMP.isDragH = false;
	if (oMP.eContent.offsetHeight > oMP.eHolder.offsetHeight) {
		oMP.isDragV = true;
		if (!oMP.eUpArrow) oMP.eUpArrow = createMovingPictureArrow(oMP.eHolder, oMPUpArrow);
		if (!oMP.eDownArrow) oMP.eDownArrow = createMovingPictureArrow(oMP.eHolder, oMPDownArrow);
	} else oMP.isDragV = false;

	/* fix horizontal position */
	oMP.iMaxOffsetH = oMP.eHolder.offsetWidth - oMP.eContent.offsetWidth;
	if (oMP.iMaxOffsetH > 0) oMP.iMaxOffsetH = 0;
	if (oMP.iMaxOffsetH > oMP.iOffsetH) {
		oMP.iOffsetH = oMP.iMaxOffsetH;
		moveMPContentHoriontally(oMP);
	}

	/* fix vertical position */
	oMP.iMaxOffsetV = oMP.eHolder.offsetHeight - oMP.eContent.offsetHeight;
	if (oMP.iMaxOffsetV > 0) oMP.iMaxOffsetV = 0;
	if (oMP.iMaxOffsetV > oMP.iOffsetV) {
		oMP.iOffsetV = oMP.iMaxOffsetV;
		if (oMP.sAlignmentH == 'top') oMP.eContent.style.top = oMP.iOffsetV;
		else oMP.eContent.style.bottom = oMP.iOffsetV;
	}

	/* set mouse cursor */			
	oMP.eContent.style.cursor = (oMP.isDragH || oMP.isDragV)? 'move' : 'default';

	/* position arrows */
	if (oMP.eLeftArrow) {
		oMP.eLeftArrow.style.top = Math.round((oMP.eHolder.offsetHeight - oMPLeftArrow.height) / 2);
	}
	if (oMP.eRightArrow) {
		oMP.eRightArrow.style.left = 'auto';
		oMP.eRightArrow.style.right = '3px';
		oMP.eRightArrow.style.top = Math.round((oMP.eHolder.offsetHeight - oMPRightArrow.height) / 2);
	}
	if (oMP.eUpArrow) {
		oMP.eUpArrow.style.left = Math.round((oMP.eHolder.offsetWidth - oMPUpArrow.width) / 2);
	}
	if (oMP.eDownArrow) {
		oMP.eDownArrow.style.top = 'auto';
		oMP.eDownArrow.style.bottom = '3px';
		oMP.eDownArrow.style.left = Math.round((oMP.eHolder.offsetWidth - oMPDownArrow.width) / 2);
	}
	setMovingPictureArrows(oMP);
}

function setMovingPictureArrows(oMP) {
	/* horizontal */
	if (oMP.eLeftArrow && oMP.eRightArrow) {
		if (oMP.sAlignmentH == 'left') {
			oMP.eLeftArrow.style.display = (oMP.iOffsetH < 0)? 'block' : 'none';
			oMP.eRightArrow.style.display = ((oMP.eContent.offsetWidth + oMP.iOffsetH) > oMP.eHolder.offsetWidth)? 'block' : 'none';
		} else {
			oMP.eLeftArrow.style.display = ((oMP.eContent.offsetWidth + oMP.iOffsetH) > oMP.eHolder.offsetWidth)? 'block' : 'none';
			oMP.eRightArrow.style.display = (oMP.iOffsetH < 0)? 'block' : 'none';
		}
	}
	/* vertical */
	if (oMP.eUpArrow && oMP.eDownArrow) {
		if (oMP.sAlignmentV == 'top') {
			oMP.eUpArrow.style.display = (oMP.iOffsetV < 0)? 'block' : 'none';
			oMP.eDownArrow.style.display = ((oMP.eContent.offsetHeight + oMP.iOffsetV) > oMP.eHolder.offsetHeight)? 'block' : 'none';
		} else {
			oMP.eUpArrow.style.display = ((oMP.eContent.offsetHeight + oMP.iOffsetV) > oMP.eHolder.offsetHeight)? 'block' : 'none';
			oMP.eDownArrow.style.display = (oMP.iOffsetV < 0)? 'block' : 'none';
		}
	}
}

function resizeMovingPictures() {
	for (var oMP in aMovingPictures) positionMovingPictureArrows(aMovingPictures[oMP]);
}

function mouseDownOnMovingPicture(evt) {
	if (this.id && aMovingPictures[this.id]) {
		var oMP = aMovingPictures[this.id];
		if (oMP.isDragH || oMP.isDragV) {
			if (!evt && window.event) evt = window.event;
			if (oMP.isDragH) {
				/* get X-coordinate */
				if (evt.pageX) oMP.clickPageOffsetX = evt.pageX;
				else oMP.clickPageOffsetX = evt.clientX + document.body.scrollLeft;
			}
			if (oMP.isDragV) {
				/* get Y-coordinate */
				if (evt.pageY) oMP.clickPageOffsetY = evt.pageY;
				else oMP.clickPageOffsetY = evt.clientY + document.body.scrollTop;
			}
			activeMovingPicture = oMP;
		}
	}
	return false;
}

function mouseUpOnMovingPicture(evt) {
	activeMovingPicture = null;
}

function mouseMoveOnMovingPicture(evt) {
	if (activeMovingPicture) {
		var oMP = activeMovingPicture;
		if (oMP.isDragH || oMP.isDragV) {
			if (!evt && window.event) evt = window.event;
			if (oMP.isDragH) {
				var iPageOffsetX = (evt.pageX)? evt.pageX : evt.clientX + document.body.scrollLeft;
				var iMoveOffsetH = (oMP.sAlignmentH == 'left')? oMP.clickPageOffsetX - iPageOffsetX : iPageOffsetX - oMP.clickPageOffsetX;
				oMP.iOffsetH -= iMoveOffsetH;
				moveMPContentHoriontally(oMP, iPageOffsetX);
			}
			if (oMP.isDragV) {
				var iPageOffsetY = (evt.pageY)? evt.pageY : evt.clientY + document.body.scrollTop;
				var iMoveOffsetV = (oMP.sAlignmentV == 'top')? oMP.clickPageOffsetY - iPageOffsetY : iPageOffsetY - oMP.clickPageOffsetY;
				oMP.iOffsetV -= iMoveOffsetV;
				moveMPContentVertially(oMP, iPageOffsetY);
			}
			setMovingPictureArrows(oMP);
		}
	}
}

function moveMPContentHoriontally(oMP, iPageOffsetX) {
	if (oMP.iOffsetH > 0) oMP.iOffsetH = 0;
	else if (oMP.iOffsetH < oMP.iMaxOffsetH) oMP.iOffsetH = oMP.iMaxOffsetH;
	else if (iPageOffsetX) oMP.clickPageOffsetX = iPageOffsetX;
	if (oMP.sAlignmentH == 'left') oMP.eContent.style.left = oMP.iOffsetH;
	else oMP.eContent.style.right = oMP.iOffsetH;
}

function moveMPContentVertially(oMP, iPageOffsetY) {
	if (oMP.iOffsetV > 0) oMP.iOffsetV = 0;
	else if (oMP.iOffsetV < oMP.iMaxOffsetV) oMP.iOffsetV = oMP.iMaxOffsetV;
	else if (iPageOffsetY) oMP.clickPageOffsetY = iPageOffsetY;
	if (oMP.sAlignmentV == 'top') oMP.eContent.style.top = oMP.iOffsetV;
	else oMP.eContent.style.bottom = oMP.iOffsetV;
}

function moveMovingPicture(sMPId, iMoveOffsetH, iMoveOffsetV) {
	if (sMPId && aMovingPictures[sMPId]) {
		var oMP = aMovingPictures[sMPId];
		if (iMoveOffsetH != 0 && oMP.isDragH) {
			if (oMP.sAlignmentH == 'left') oMP.iOffsetH -= iMoveOffsetH;
			else oMP.iOffsetH += iMoveOffsetH;
			moveMPContentHoriontally(oMP);
		}
		if (iMoveOffsetV != 0 && oMP.isDragV) {
			if (oMP.sAlignmentV == 'top') oMP.iOffsetV -= iMoveOffsetV;
			else oMP.iOffsetV += iMoveOffsetV;
			moveMPContentVertially(oMP);
		}
		setMovingPictureArrows(oMP);
	}
}

function initMovingPictures() {
	for (var i = 0; (eDiv = document.getElementsByTagName('div')[i]); i++) {
		if (eDiv.className == sMPHolderClassName) {
			/* assingning ID */
			if (!eDiv.id) eDiv.id = 'movingPicture' + iMPCounter;
			iMPCounter++;
			/* creating object */
			aMovingPictures[eDiv.id] = new MovingPicture(eDiv);
		}
	}
}

addEvent(window, 'load', initMovingPictures);
addEvent(window, 'resize', resizeMovingPictures);
addEvent(document, 'mousemove', mouseMoveOnMovingPicture);
addEvent(document, 'mouseup', mouseUpOnMovingPicture);