function ButtonWithHover(button, buttonImages) {
	var images = buttonImages;
	button.src = images.normal;
	button.style.cursor = "pointer";

	if (button.attachEvent) {
		button.attachEvent('onmouseover', function (e) {e.srcElement.src = images.hover;});
		button.attachEvent('onmouseout', function (e) {e.srcElement.src = images.normal;});
        } else if (button.addEventListener) {
		button.addEventListener('mouseover', function (e) {e.currentTarget.src = images.hover;}, false);
		button.addEventListener('mouseout', function (e) {e.currentTarget.src = images.normal;}, false);
	}
}

function scroller(nCurrent, nItems, arrowLeft, arrowRight, imageElement, textElement, refElement) {
	var _this = this;
	var _current = nCurrent;
	var items = nItems
	var al = arrowLeft;
	var ar = arrowRight;
	var ime = imageElement;
	var te = textElement;
	var ref = refElement;

	if (ar.attachEvent) {
		ar.attachEvent('onclick', function (e) {nextItem();});
        } else if (ar.addEventListener) {
		ar.addEventListener('click', function (e) {nextItem();}, false);
        }
	if (al.attachEvent) {
		al.attachEvent('onclick', function (e) {prevItem();});
        } else if (al.addEventListener) {
		al.addEventListener('click', function (e) {prevItem();}, false);
        }

	showItem(_current);

	function nextItem() {
		if (_current + 1 > items.length - 1) {
			showItem(0);
		} else {
			showItem(_current+1);
		}
	}

	function prevItem() {
		if (_current == 0) {
			showItem(items.length - 1);
		} else {
			showItem(_current-1);
		}
	}

	function showItem(id) {
		if (id > items.length) {
			return;
		} else {
			_current = id;
			ime.setAttribute("src", items[id].img);
			te.innerHTML = items[id].txt;
			ref.setAttribute("href", items[id].ref);
		}
	}
}

function bookScroller(nCurrent, nItems, arrowLeft, arrowRight, page1Element, page2Element, bookmarkElement, bookmark_list) {
	var _this = this;
	var _current = nCurrent;
	var items = nItems
	var al = arrowLeft;
	var ar = arrowRight;
	var page1 = page1Element;
	var page2 = page2Element;
	var bmark = bookmarkElement;
	var bmark_list = bookmark_list;

	if (ar) {
		if (ar.attachEvent) {
			ar.attachEvent('onclick', function (e) {nextItem();});
        	} else if (ar.addEventListener) {
			ar.addEventListener('click', function (e) {nextItem();}, false);
        	}
	}
	
	if (al) {
		if (al.attachEvent) {
			al.attachEvent('onclick', function (e) {prevItem();});
		} else if (al.addEventListener) {
			al.addEventListener('click', function (e) {prevItem();}, false);
		}
	}

	this.showItem = function(id){
		if (id > items.length) {
			return;
		} else {
			_current = id;
			page1.innerHTML = items[2*id];
			page2.innerHTML = items[2*id + 1];
			bookmarkElement.src = get_current_bookmark(id);
		}
	}

	function get_current_bookmark(id) {
		return bmark_list[id];
	}

	function nextItem() {
		if (_current + 1 > (items.length - 1)/2) {
			return;
		} else {
			_this.showItem(_current+1);
		}
	}

	function prevItem() {
		if (_current == 0) {
			return;
		} else {
			_this.showItem(_current-1);
		}
	}

	this.showItem(_current);
}

function viewScroller(nCurrent, nItems, arrowLeft, arrowRight, listElement, cItem) {
	var _this = this;
	var _current = nCurrent;
	var items = nItems
	var al = arrowLeft;
	var ar = arrowRight;
	var le = listElement;
	var _current_item = cItem;

	if (ar) {
		if (ar.attachEvent) {
			ar.attachEvent('onclick', function (e) {nextItem();});
		} else if (ar.addEventListener) {
			ar.addEventListener('click', function (e) {nextItem();}, false);
		}
	}
	if (al) {
		if (al.attachEvent) {
			al.attachEvent('onclick', function (e) {prevItem();});
		} else if (al.addEventListener) {
			al.addEventListener('click', function (e) {prevItem();}, false);
		}
	}

	showItem(_current);

	function nextItem() {
		if (_current + 1 > items.length - 1) {
			showItem(0);
		} else {
			showItem(_current+1);
		}
	}

	function prevItem() {
		if (_current == 0) {
			showItem(items.length - 1);
		} else {
			showItem(_current-1);
		}
	}

	function showItem(id) {
		if (id > items.length) {
			return;
		} else {
			_current = id;
			removeChildNodes(le);
			le.style.background = "url(\"" + items[id].img + "\") no-repeat top left";
			var len = items[id].list.length;
			for (var x = 0; x < len; x++) {
				var a = document.createElement("a");
				a.setAttribute("id", x);
				a.className = "sprite";
				a.setAttribute("href", items[id].list[x].ref);
				a.setAttribute("title", items[id].list[x].title);
				a.style.width = String(items[id].list[x].width) + "px";
				a.style.height = String(items[id].list[x].height) + "px";
				a.style.left = String(items[id].list[x].left) + "px";
				a.style.top = String(items[id].list[x].top) + "px";
				a.style.zIndex = String(items[id].list[x].zIndex);

				if (_current_item) {
					var found = false;
					var ci_len = _current_item.length;
					for (var ci_x = 0; ci_x < ci_len; ci_x++) {
						if (x == _current_item[ci_x]) {
							a.style.background = "url(\"" + items[id].imgHover + "\") " + String(items[id].list[x].hover_x) + "px " + String(items[id].list[x].hover_y) + "px";
							found = true;
							break;
						}
					}
					if (!found) {
						if (a.attachEvent) {
							a.attachEvent('onmouseover', function (e) {mouseOver(e.srcElement);});
						} else if (a.addEventListener) {
							a.addEventListener('mouseover', function (e) {mouseOver(e.currentTarget);}, false);
						}
						if (a.attachEvent) {
							a.attachEvent('onmouseout', function (e) {mouseOut(e.srcElement);});
						} else if (a.addEventListener) {
							a.addEventListener('mouseout', function (e) {mouseOut(e.currentTarget);}, false);
						}
					}
				} else {
					if (a.attachEvent) {
						a.attachEvent('onmouseover', function (e) {mouseOver(e.srcElement);});
					} else if (a.addEventListener) {
						a.addEventListener('mouseover', function (e) {mouseOver(e.currentTarget);}, false);
					}
					if (a.attachEvent) {
						a.attachEvent('onmouseout', function (e) {mouseOut(e.srcElement);});
					} else if (a.addEventListener) {
						a.addEventListener('mouseout', function (e) {mouseOut(e.currentTarget);}, false);
					}
				}
				le.appendChild(a);
			}
		}
	}

	function removeChildNodes(node) {
		if (!node) {
			return;
		}
		while(node.hasChildNodes()) {
			if (node.lastChild.hasChildNodes()) {
				removeChildNodes(node.lastChild);
			}
			node.removeChild(node.lastChild);
		}
	}

	function mouseOver(item) {
		var id = item.getAttribute("id");
		item.style.background = "url(\"" + items[_current].imgHover + "\") " + String(items[_current].list[id].hover_x) + "px " + String(items[_current].list[id].hover_y) + "px";
	}

	function mouseOut(item) {
		item.style.background = "url(\"empty_1x1.gif\") 0px 0px";
	}
}

function viewScrollerWithBlob(nCurrent, nItems, arrowLeft, arrowRight, listElement) {
	var _this = this;
	var _current = nCurrent;
	var items = nItems
	var al = arrowLeft;
	var ar = arrowRight;
	var le = listElement;
	var currentBlob = null;

	if (ar) {
		if (ar.attachEvent) {
			ar.attachEvent('onclick', function (e) {nextItem();});
		} else if (ar.addEventListener) {
			ar.addEventListener('click', function (e) {nextItem();}, false);
		}
	}
	if (al) {
		if (al.attachEvent) {
			al.attachEvent('onclick', function (e) {prevItem();});
		} else if (al.addEventListener) {
			al.addEventListener('click', function (e) {prevItem();}, false);
		}
	}

	showItem(_current);

	function nextItem() {
		if (_current + 1 > items.length - 1) {
			showItem(0);
		} else {
			showItem(_current+1);
		}
	}

	function prevItem() {
		if (_current == 0) {
			showItem(items.length - 1);
		} else {
			showItem(_current-1);
		}
	}

	function showItem(id) {
		if (id > items.length) {
			return;
		} else {
			_current = id;
			removeChildNodes(le);
			le.style.background = "url(\"" + items[id].img + "\") no-repeat top left";
			var len = items[id].list.length;
			for (var x = 0; x < len; x++) {
				var a = document.createElement("a");
				a.setAttribute("id", x);
				a.className = "sprite";
				a.setAttribute("href", items[id].list[x].ref);
				a.setAttribute("title", items[id].list[x].title);
				a.style.width = String(items[id].list[x].width) + "px";
				a.style.height = String(items[id].list[x].height) + "px";
				a.style.left = String(items[id].list[x].left) + "px";
				a.style.top = String(items[id].list[x].top) + "px";
				a.style.zIndex = String(items[id].list[x].zIndex);
				a.style.border = "1px solid #00ff00";
				if (a.attachEvent) {
					a.attachEvent('onmouseover', function (e) {mouseOver(e.srcElement, e);});
				} else if (a.addEventListener) {
					a.addEventListener('mouseover', function (e) {mouseOver(e.currentTarget, e);}, false);
				}

				if (a.attachEvent) {
					a.attachEvent('onmouseout', function (e) {mouseOut(e.srcElement);});
				} else if (a.addEventListener) {
					a.addEventListener('mouseout', function (e) {mouseOut(e.currentTarget);}, false);
				}
				le.appendChild(a);
			}
		}
	}

	function removeChildNodes(node) {
		if (!node) {
			return;
		}
		while(node.hasChildNodes()) {
			if (node.lastChild.hasChildNodes()) {
				removeChildNodes(node.lastChild);
			}
			node.removeChild(node.lastChild);
		}
	}

	function mouseOver(item, event) {
		var id = item.getAttribute("id");
		item.style.background = "url(\"" + items[_current].imgHover + "\") " + String(items[_current].list[id].hover_x) + "px " + String(items[_current].list[id].hover_y) + "px";
		var div = document.createElement("div");
		div.setAttribute("id", "blob" + String(id));
		div.style.position = "absolute";
		div.innerHTML = "test";
		var width = item.style.width;
		width = Number(width.substring(0, width.length - 2));
		var height = item.style.height;
		height = Number(height.substring(0, height.length - 2));
		var target_x = findPosX(item) + width + 10;
		var target_y = findPosY(item) + height/2 + 10;

		div.innerHTML = items[_current].list[id].blob;
		var nheight = div.style.height;
		nheight = Number(nheight.substring(0, nheight.length - 2));

		div.style.left = String(target_x) + "px";
		div.style.top = String(target_y - nheight) + "px";
		div.style.zIndex = 5;
		//alert(String(target_x) + ", " + String(target_y));
		le.appendChild(div);
		currentBlob = div;
	}

	function mouseOut(item) {
		if (currentBlob) {
			removeChildNodes(currentBlob);
			currentBlob.parentNode.removeChild(currentBlob);
		}
		item.style.background = "url(\"empty_1x1.gif\") 0px 0px";
	}

	function findPosX(target) {
		if (!target) {
			return null;
		}
		var curleft = 0;
		if(target.offsetParent) {
			do {
				curleft += target.offsetLeft;
			} while (target == target.offsetParent);
		} else if(target.x) {
			curleft += target.x;
		}
        	return curleft;
    	}

	function findPosY(target) {
		if (!target) {
			return null;
		}
		var curtop = 0;
		if(target.offsetParent) {
			do {
				curtop += target.offsetTop;
			} while (target == target.offsetParent);
		} else if(target.y) {
			curtop += target.y;
		}
        	return curtop;
    }
}