function Scroller(elem, width, height) {

	this.onBottomHit = function(){};
	this.onTopHit = function(){};
	this.onBeforeScroll = function(){};
		
	this.addControll = function(dir, elem) {
		var self = this;
		$(elem).onclick = function() {
			self["ctrl"+dir]();
			return false;
		};
	}
	
	
	this.createFog = function(h) {
		for(var i=0; i<5; i++) {
			var topFog = new Element("div", {className:"semi"});
			var bottomFog = new Element("div", {className:"semi"});
			this.scrollable.insert({top:topFog,bottom:bottomFog});
		}
		
		var w = this.width;
		this.scrollable.select(".semi").each(function(elem, idx){
			elem.setStyle({
				height: h + "px",
				width: w + "px",
				backgroundColor: "white",
				position: "absolute",
				zIndex: 10,
				bottom: (idx<5 ? "auto" : ((idx-5)*h)+"px"),
				top: (idx<5 ? (idx*h)+"px" : "auto"),
				opacity: (idx<5) ? ((6-idx)*0.20) : ((11-idx)*0.20)
			});
		});
	}
	this.ctrlup = function() {
		this.timedDy = -5;
		this.timedTargetDy = -this.scrollDistanceY;
		this.timedScroll();
	}
	this.ctrldown = function() {
		this.timedDy = 5;
		this.timedTargetDy = this.scrollDistanceY;
		this.timedScroll();
	}
	this.timedScroll = function() {
		this.scroll(0,this.timedDy);
		this.timedTargetDy -= this.timedDy;
		if(this.timedTargetDy*this.timedDy > 0) {
			var self = this;
			window.setTimeout(
				function() {self.timedScroll()},
				10
			);
		}
	}
	

	
	//todo x-way
	this.scroll = function(byx, byy) {

		this.onBeforeScroll();
		this.offsetY += byy;
		if(byy>0 && this.offsetY>=0) {
			this.offsetY=0;
			this.onBottomHit();
		} else if(byy<0 && this.offsetY + this.content.getHeight() + 32 <= this.height) {
			this.offsetY = this.height - this.content.getHeight() - 32;
			this.onTopHit();
		}
		this.content.setStyle({top: this.offsetY+"px"});
	}
	
	this.getBox = function() {
	    return this.box;
	}


	this.box = $(elem);
	this.box.makePositioned();
	this.height = height;
	this.width = width;
	this.scrollable = this.box.select(".scrollable")[0];
	this.scrollable.makePositioned();
	this.content = this.box.select(".content")[0];
	this.offsetY = 0;
	this.scrollDistanceY = this.height/2;	
	this.content.setStyle({
		display: "block",
		width: width + "px"
	});
	this.content.absolutize();
	this.scrollable.setStyle({
		display: "block",
		width: width + "px",
		height: height + "px",
		overflow: "hidden"
	});
	this.onBottomHit();

}


var visiblePB = null;
var selectedPB = null;

function getURLParam( input, key ) {
    var result = null;
    var spi = input.indexOf(key+"=");
    if(spi!=-1) {
        result = input.substring(spi+key.length+1);
        var epi = result.indexOf("&");
        if(epi!=-1) {
            result = result.substring(0,epi);
        }
    }
    return result;
}
function cmap(elem) {
    //elem.onmouseout = cmapout;
	glover(elem);
}
function cmapClose(elem) {
    selectedPB = null;
//    gloverElem(null);
}
function cmapout() {
    gloverElem(selectedPB);
}

/******************* START NEU 2010-08-26 Frank Klewe HIGHTLIGHT-Funktion bei Mouseover *********/
var visibleEL = null;

/* FUNKTION FÜR hilight(this), ohne Angabe ID
function hilight(elem) {
	 if(elem == visibleEL){
		 return;
	 }
	 if(visibleEL){
	 	visibleEL.setStyle({ color:"#444", fontWeight:"normal" });
	 }
	 if(elem != visibleEL){
	 	elem.setStyle({ color:"#CDCC32", fontWeight: "bold" });
	 }
	 visibleEL = elem;
}
*/
function hilight(elem) {
	var scrollbox = document.getElementById('CountryCustomers').getElementsByClassName('content')[0];
	  if(scrollbox){
		  scrollbox.setStyle({ top: "0px" }); /* Setze bei Überblendung die Scrollbox wieder auf Ausgangsposition */
	  }
	
	var target = document.getElementById(elem);	
	 if(target == visibleEL){
		 return;
	 }
	 if(visibleEL){
	 	visibleEL.setStyle({ color:"#444", fontWeight:"normal" });
	 }
	 if(target != visibleEL){
	 	target.setStyle({ color:"#CDCC32", fontWeight: "bold" });
	 }
	 visibleEL = target;
}
/******************* ENDE NEU 2010-08-26 Frank Klewe HIGHTLIGHT-Funktion bei Mouseover *********/

function glover(elem) {
	var act = getURLParam(elem.href, "act");
	if(act!=null) {
		var target = document.getElementById(act);
        gloverElem(target);		
	}
}

function gloverElem( target ) {
	if(target == visiblePB) {
	    return;
	}
	
	if(visiblePB) {
		visiblePB.fade = "out";
		fadeOut(visiblePB);
	}
	if(target!=null) {
	    target.fade = "in";
	    fadeIn(target);
	}
	visiblePB = target;
}

function glout() {
	return;
	var act = this.href;
	var spi = act.indexOf('act=');
	if(spi>0) {
		act = act.substring(spi+4);
		var target = document.getElementById(act);
		if(target && target.style) {
			target.style.display = "none";
		}
	}
}

function fadeIn(elem) {
	if(elem.fade=="out") {
		return;
	}
	var disp = elem.style.display;
	var opac = getOpacity(elem);
	if(!disp || disp=='none') {
		opac = 0;
		elem.style.display = "block";
	}
	opac += 0.04;
	setOpacity(elem, opac);
	if(opac<1) {
		window.setTimeout(function(){fadeIn(elem);},10);
	}
}
function fadeOut(elem) {
	if(elem.fade == "in") {
		return;
	}
	var disp = elem.style.display;
	var opac = getOpacity(elem);
	if(disp=='none') {
		return;
	}
	if(opac>0) {
		opac -= 0.06;
		setOpacity(elem, opac);
		window.setTimeout(function(){fadeOut(elem);},10);
	} else {
		setOpacity(elem, 0);
		elem.style.display = "none";
	}
}
function getOpacity(elem) {
   // if(!elem._currentOpac) {
   //     elem._currentOpac = 0;
   // }
   //	return elem._currentOpac;

    return 1 * ( $(elem).getStyle("opacity") );
}

function setOpacity(elem, val) {

    //elem._currentOpac = val;
    $(elem).setOpacity(val);
    //$(elem).setStyle("opacity", val);
}

function retag() {
	var colex = $$('ul.xRTspan li');
	decorate(colex, "<span>", "</span>" );
}
function decorate(collection, prefix, postfix) {
	collection.each(function(elem){
		elem.innerHTML = prefix + elem.innerHTML + postfix;
	});
}
function init(page) {
	if(window.pageInit) {
		pageInit();
	}   
	var act = getURLParam( document.location.href, "act");
    if(act!=null) {
		visiblePB = document.getElementById(act);
    	selectedPB = visiblePB;
		setOpacity(visiblePB, 1);
    }
	retag();
}