if (!Array.prototype.push) {
	Array.prototype.push = function() {
		var startLength = this.length;
		for (var i = 0; i < arguments.length; i++) this[startLength + i] = arguments[i];
		return this.length;
	}
}

function $(elementId) {
	return document.getElementById(elementId);
}

function getElementsByClassName(className, children) {
	var children = children || document.getElementsByTagName('*')
	var elements = new Array()
	for (var i = 0; i < children.length; i++) {
		var child = children[i];
		var classNames = child.className.split(' ');
		for (var j = 0; j < classNames.length; j++) {
			if (classNames[j] == className) {
				elements.push(child);
				break;
			}
		}
	}
	return elements
}

function getClientSize() {
	return (document.body.scrollHeight > document.body.offsetHeight) ? [document.body.scrollWidth, document.body.scrollHeight] : [document.body.offsetWidth, document.body.offsetHeight];
}

function getBodyHeight() {
	if (self.innerWidth) return self.innerHeight;
	else if (document.documentElement && document.documentElement.clientWidth) return document.documentElement.clientHeight;
	else if (document.body) return document.body.clientHeight;
}

function getRelLeft(el) {
	var pos = el.offsetLeft;
	while (el.offsetParent != null) { el = el.offsetParent; pos += el.offsetLeft; if (el.tagName == 'BODY') break; }
	return pos;
}

function getRelTop(el) {
	var pos = el.offsetTop;
	while (el.offsetParent != null) { el = el.offsetParent; pos += el.offsetTop; if (el.tagName == 'BODY') break; }
	return pos;
}

function zybexHighliteShow(e) {
	var id = this.id.replace(/\w+\-/,'')
	if (!id) return
	if (currentMode == 2) return
	clearTimeout(highliteTM)
	zybexHighliteHideContinue()
	hilitedCells.push(id)
	zybexHighliteShowContinue(id)
}

function zybexHighliteShowContinue(id) {
	$('left-' + id).className = 'content-over left'
	$('right-' + id).className = 'contentr-over right'
}

function zybexHighliteHide(e) {
	var id = this.id.replace(/\w+\-/,'')
	if (!id) return
	if (currentMode == 2) return
	highliteCurId = id
	highliteTM = setTimeout('zybexHighliteHideContinue()', 100)
}

function zybexHighliteHideContinue() {
	if (hilitedCells.length == 0) return
	for(var i = 0; i < hilitedCells.length; i++) {
		if ($('left-' + hilitedCells[i])!=null)	$('left-' + hilitedCells[i]).className = 'left'		
		if ($('right-' + hilitedCells[i])!=null) $('right-' + hilitedCells[i]).className = 'contentr-out right'
	}
	hilitedCells = new Array()
}

function zybexBalloonShow(e) {
		clearTimeout(highliteTM)
		clearTimeout(hideTM)
		hideInProgress = false
		var e = e || window.event
		if (!this.getAttribute('moreinfo') || currentMode == 2) return false
		if(t = this.getAttribute('paragraphId')) $('commentForm').paragraphId.value = t
		currentMode = this.getAttribute('moreinfo')
		if (currentTarget && (this != currentTarget)) {
			currentTarget.className = currentTarget.className.replace(/\s*hilite/, '')
		}
		if ((this == currentTarget) && showInProgress) return false
		currentTarget = this
		zybexHighliteShowContinue(currentTarget.getAttribute('rowId'))
		oBalloon.setPointer(getRelLeft(this) - 4, getRelTop(this) + 6)
		oBalloon.displayPointer('')
		oBalloon.setMode()
		var el = this.getElementsByTagName('div')
		var pAvatar = '', pNick = '', pInfo = '', cText = '', driveAdm = false
		for (var i = 0; i < el.length; i++) {
			switch (el[i].className) {
				case 'commentText': cText = el[i].innerHTML; break;
			}
		}
		oBalloon.iHTML = '<div id="bmessage">' + cText + '</div>'
		
		if (currentMode != 2) currentTarget.className = currentTarget.className + ' hilite'
		oBalloon.Show()
		return false	
}

function zybexBalloonHide() {
	if (currentMode != 2) hideTM = setTimeout('oBalloon.Hide()', 300)
}

function zybexDrag(e) {
	oBalloon.displayPointer('none')
	dx = (( window.event ) ? event.clientX : e.clientX) - oBalloon.balloon.offsetLeft;
	dy = (( window.event ) ? event.clientY : e.clientY) - oBalloon.balloon.offsetTop;
	dragInProgress = true
	return false
}
	
function zybexDrop() {
	dragInProgress = false
}

function zybexMove(e) {
	if (dragInProgress) {
		var x = ( ( window.event ) ? event.clientX : e.clientX ) - dx;	
		var y = ( ( window.event ) ? event.clientY : e.clientY ) - dy;
		var size = getClientSize()
		if (x < 5) { x = 5; } else if (x > size[0] - oBalloon.balloon.offsetWidth - 40) { x = size[0] - oBalloon.balloon.offsetWidth - 40; }
		if (y < 5) { y = 5; } else if (y > size[1] - oBalloon.balloon.offsetHeight - 40) { y = size[1] - oBalloon.balloon.offsetHeight - 40; }
		oBalloon.setPos(x, y)
	}
}

function zybexBalloon() {
	var balloonWidth = 380
	var sOffset = 2
	var pointerOffset = pointerOffsetDefault = 0 // 0..1
	var steps = 10
	
	var bAnimW, bAnimH, bAnimDX, bAnimDY, bAnimWmax, bAnimHmax, animTM
	var showTriggerTM
	var pointerX = 0, pointerY = 0
	var balloon = $('balloon')
	this.balloon = balloon
	var shadow = $('shadow')
	var arrow = $('arrow')
	var arrowshadow = $('arrowshadow')
	var bcontent = $('bcontent')
	var btitle = $('bcontent')
	var btitledrag = $('btitledrag')
	this.iHTML = ''

	var closeBtnImg = new Image(); closeBtnImg.src = 'images/button-x.gif'
	var closeBtnImgOver = new Image(); closeBtnImgOver.src = 'images/button-x-o.gif'
	
	this.deleteHandlers = function() {
		balloon.onmouseover = balloon.onmouseout = arrow.onmouseover = arrow.onmouseout = null
	}

	this.setHandlers = function() {
		balloon.onmouseover = arrow.onmouseover = zybexBalloonShow
		balloon.onmouseout = arrow.onmouseout = zybexBalloonHide
	}

	btitledrag.onmousedown = zybexDrag
	document.onmouseup = zybexDrop
	document.onmousemove = zybexMove
	btitledrag.ondragstart = function() { return false; }
	btitledrag.onselectstart = function() { return false; }
	
	this.setPointer = function(x, y) {
		pointerX = x;
		pointerY = y+65;
	}

	this.displayPointer = function(display) {
		arrow.style.display = arrowshadow.style.display = display
	}

	this.setMode = function() {
		var postfix = (currentMode == 2) ? '-h' : ''
		$('btitlei').style.display = 'none'
		$('btitledrag').style.cursor = (currentMode == 2) ? 'move' : 'auto'
		$('btl').className = 'bstl' + postfix
		$('btitle').className = 'bst' + postfix
		$('btr').className = 'bstr' + postfix
	}
	
	this.hiliteCloseBtn = function(state) {
		$('closebtn').src = (state) ? closeBtnImgOver.src : closeBtnImg.src
	}
	
	this.Show = function() {
		showInProgress = true
		clearTimeout(hideTM)
		clearTimeout(animTM)
		clearTimeout(showTriggerTM)
		this.ShowTrigger(true);
	}
	this.ShowTrigger = function(flag) {
		if (flag) {
			showTriggerTM = setTimeout('oBalloon.ShowTrigger(false)', 350);
		} else {
			clearTimeout(showTriggerTM)
			this.ShowReal();
		}
	}
	this.ShowReal = function() {
		pointerOffset = pointerOffsetDefault
		bAnimW = 30
		bAnimH = 35
		bcontent.innerHTML = (currentMode == 2) ? $('addform').innerHTML : this.iHTML
		bcontent.style.display = 'block'
		$('bmessage').className = ($('bmessage').offsetHeight < 300) ? '' : 'scroll'
		this.setSize(balloonWidth)
		bAnimWmax = balloonWidth
		bAnimHmax = balloon.offsetHeight
		bAnimDX = parseInt((bAnimWmax - bAnimW) / steps)
		bAnimDY = parseInt((bAnimHmax - bAnimH) / steps)
		bcontent.style.display = 'none'
		
		var scrollTop = (document.documentElement && document.documentElement.scrollTop) ? document.documentElement.scrollTop : document.body.scrollTop
		var bodyHeight = getBodyHeight()

		var tOffset = (pointerY - scrollTop - 20)/(bAnimHmax - 15)
		if ( tOffset < pointerOffset) pointerOffset = tOffset
		if (pointerOffset < 0.1) pointerOffset = 0.1
		
		tOffset = 1 - ((bodyHeight + scrollTop - pointerY - 20)/(bAnimHmax - 15))
		if ( tOffset > pointerOffset) pointerOffset = tOffset
		if (pointerOffset > 1) pointerOffset = 1

		this.setSize(bAnimW, bAnimH)
		this.Display('visible')
		this.animShow()
	}
	this.animShow = function () {
		this.setSize(bAnimW, bAnimH)
		bAnimW += bAnimDX
		bAnimH += bAnimDY
		bAnimDY += 5
		bAnimDX += 5
		if (bAnimW >= bAnimWmax) {
			bcontent.style.display = 'block'
			this.setSize(bAnimWmax)
			if (currentMode == 2) $('btitlei').style.display = ''
			return
		}
		animTM = setTimeout('oBalloon.animShow()', 0)
	}

	this.Hide = function() {
		if (hideInProgress) return
		clearTimeout(animTM)
		clearTimeout(showTriggerTM)
		hideInProgress = true
		showInProgress = false
		bAnimW = bAnimWmax
		bAnimH = bAnimHmax
		bAnimDX = parseInt((bAnimWmax - 30) / steps)
		bAnimDY = parseInt((bAnimHmax - 35) / steps)
		bcontent.style.display = 'none'
		$('btitlei').style.display = 'none'
		currentTarget.className = currentTarget.className.replace(/\s*hilite/, '')
		oBalloon.animHide()
	}

	this.animHide = function() {
		bcontent.style.display = 'none'
		this.setSize(bAnimW, bAnimH)
		bAnimW -= bAnimDX
		bAnimH -= bAnimDY
		bAnimDY += 5
		bAnimDX += 5
		if (bAnimW <= 30) {
			this.Display('hidden')
			bcontent.innerHTML = ''
			arrow.style.left = arrow.style.top = arrowshadow.style.left = arrowshadow.style.top = balloon.style.left = balloon.style.top = shadow.style.left = shadow.style.top = 0
			hideInProgress = false
			currentMode = 1
			return
		}
		animTM = setTimeout('oBalloon.animHide()', 0)
	}

	this.Display = function(f) {
			balloon.style.visibility = arrow.style.visibility = shadow.style.visibility = arrowshadow.style.visibility = f
	}

	this.setPos = function(x, y) {
		var offset = 2 + parseInt ((balloon.offsetHeight - 17) * pointerOffset)
		balloon.style.left = x  + 'px'
		balloon.style.top = y + 'px'
		this.setPointer(x + balloon.offsetWidth + 5, y + offset + 7)
		shadow.style.left = x - 18 + pointerOffset + 'px'
		shadow.style.top = y - 18 + pointerOffset + 'px'
		
	}
	this.setSize = function(w, h) {
		if ((w == null) || (isNaN(w))) return
		arrow.style.left = (pointerX - 6) + 'px'
		arrow.style.top = (pointerY - 12) + 'px'
	
		arrowshadow.style.left = (pointerX - 7 + sOffset) + 'px'
		arrowshadow.style.top = (pointerY - 12 + sOffset) + 'px'
	
		balloon.style.width = w + 'px'
		if (h) {
			if (h < 1) h = 1
			balloon.style.height = h + 'px'
			$('ballooni').style.height = h + 'px'
		} else {
			balloon.style.height = 'auto'
			$('ballooni').style.height = 'auto'
		}
		h = balloon.offsetHeight
		var offset = 2 + parseInt ((h - 17) * pointerOffset)
		
		balloon.style.left = (pointerX - w - 5) + 'px'
		balloon.style.top = (pointerY - offset - 6) + 'px'
		shadow.style.left = (pointerX - w - 25 + sOffset) + 'px'
		shadow.style.top = (pointerY - 26 - offset + sOffset) + 'px'
		shadow.style.width = (w + 40) + 'px'
		shadow.style.height = (h + 40) + 'px'
		
		if (h>=20){
			$('shmiddle').style.height = (h - 20) + 'px'
		}else{
			$('shmiddle').style.height = '0px'
		}

		h = balloon.offsetWidth
	}

	this.setHandlers()
	return this
}

function zybexInit() {
	if (!document.getElementsByTagName) return
	bgFix()
	oBalloon = new zybexBalloon()
	var i
	var content = $('site_thumbs')
	var el = content.getElementsByTagName('td')
	
	var leftCol = getElementsByClassName('left', el)
	var rightCol = getElementsByClassName('right', el)
	for (i = 0; i < leftCol.length; i++) {
		leftCol[i].id = 'left-' + i
		rightCol[i].id = 'right-' + i
		rightCol[i].className= 'contentr-out right'
		leftCol[i].onmouseover = zybexHighliteShow
		rightCol[i].onmouseover = zybexHighliteShow
		leftCol[i].onmouseout = zybexHighliteHide
		rightCol[i].onmouseout = zybexHighliteHide
		if (rightCol[i].innerHTML.indexOf('add') != -1 && rightCol[i].getAttribute('paragraphId') != '') {
			//rightCol[i].innerHTML = newcontentEl.innerHTML //.replace('"#"', '"add.html?' + i + '"')
			newcontentLnk = rightCol[i].getElementsByTagName('a').item(0)
			// newcontentLnk.onclick = zybexBalloonShow
			// WARNING : maybe this line was required
			// or not required? who knowns? (s) Shakespear
			newcontentLnk.setAttribute('rowId', i)
			newcontentLnk.setAttribute('paragraphId', rightCol[i].getAttribute('paragraphId'))
		}
		links = rightCol[i].getElementsByTagName('div')
		for (var j = 0; j < links.length; j++) {
			if (links[j].getAttribute('moreinfo')) {

				links[j].setAttribute('rowId', i)
				links[j].onmouseover = zybexBalloonShow
				links[j].onmouseout = zybexBalloonHide
	        }
		}

		links = rightCol[i].getElementsByTagName('a')
		for (var j = 0; j < links.length; j++) {
			if (links[j].getAttribute('moreinfo') == 2) {
				links[j].onclick = zybexBalloonShow
				links[j].setAttribute('rowId', i)
	        }
		}
	}
}

function aShadowFix(w, h) {
	if (!$('ashadow')) return
	var el = $('ashadow')
	if (w < 50 || h < 50) el.style.display = 'none'
	el.style.width = (w + 40) + 'px'
	el.style.height = (h + 40) + 'px'
	$('ashmiddle').style.height = h + 'px'
}


function bgFix() {
	if (!$('bgfix')) return
	var el = $('bgfix')
	if (!bgFixBackground) bgFixBackground = el.style.background
	el.style.background = ((el.offsetWidth - 265) > 200) ? bgFixBackground : ''
}
var bgFixBackground


var hilitedCells = new Array()
var showInProgress = false, hideInProgress = false
var hideTM
var currentTarget = null
var currentMode = 0
var highliteTM, highliteCurId
var dragInProgress = false