/*
*	die neue newsticker box für die startseite
*	- ist die imageBox, nur statt bildern gibts die news
*	- die targetBox gibt die breite und höhe vor
*/
function newstickerBox(target, data)
{
	this.target = target;
	this.outer = target.parentNode;
	this.data = data;
	this.index = 0;
	
	this.init();
}	
newstickerBox.prototype.init = function()
{
	this.width = this.target.offsetWidth;	
	this.height = this.outer.offsetHeight - 16 - this.target.offsetTop;
	
	this.target.style.overflow = 'hidden';
	this.target.style.position = 'relative';
	this.target.style.height = this.height + 'px';

	this.minLeft = (this.data.length - 1) * this.width * -1;

	this.leftArrow = document.createElement('div');
	this.leftArrow.className = 'ib_left_arrow';
	jsfAddEvent(this.leftArrow, 'mousedown', function(event){ 
		this.next(true, true);
	}.bindAsEventListener(this));
	this.outer.appendChild(this.leftArrow);
	
	this.rightArrow = document.createElement('div');
	this.rightArrow.className = 'ib_right_arrow';
	jsfAddEvent(this.rightArrow, 'mousedown', function(event){ 
		this.next(false, true);
	}.bindAsEventListener(this));
	this.outer.appendChild(this.rightArrow);
	
	// über hover wird der automatische wechsel unterdrückt
	this.hover = false;
	jsfAddEvent(this.target, 'mouseover', function()
	{
		this.hover = true;
	}.bindAsEventListener(this));
	jsfAddEvent(this.target, 'mouseout', function()
	{
		this.hover = false;
	}.bindAsEventListener (this));
	
	this.a = document.createElement('div');
	this.a.style.width = (this.width * this.data.length) + 'px';
	this.a.style.position = 'absolute';
	this.a.style.left = '0px';
	this.a.style.top = '0px';
	this.target.appendChild(this.a);
	
	this.b = document.createElement('div');
	this.b.style.width = (this.width * this.data.length) + 'px';
	this.b.style.position = 'absolute';
	this.b.style.left = '-' + (this.width * this.data.length) + 'px';
	this.b.style.top = '0px';
	this.target.appendChild(this.b);
	
	this.createNews(this.a);
	this.createNews(this.b);
	
	this.changeTimeout = window.slow_image_box ? 10000 : 4000;
	setInterval(function(){ 
		if(!this.pause && !this.hover)
			this.next(); 
	}.bind(this), this.changeTimeout);
}

newstickerBox.prototype.createNews = function(target)
{
	for(var i=0; i < this.data.length; i++)
	{
		var outer = document.createElement('div');
		outer.className = 'newsticker_inner';
		outer.style.position = 'absolute';
		outer.style.left = (i * this.width) + 'px';
		outer.style.top = '0px';
		outer.style.width = this.target.offsetWidth - 22 + 'px';
		outer.style.height = this.target.offsetHeight - 18 + 'px';
		
		var tmp = '<div class="newsticker_item_title">';
		if(this.data[i].date)
			tmp += this.data[i].date;
		if(this.data[i].date && this.data[i].title)
			tmp += '<span style="color:#DA980C;"> &gt; </span>';
		if(this.data[i].title)
			tmp += this.data[i].title;
		tmp += '</div>';
		tmp += this.data[i].content;
		outer.innerHTML = tmp;
		
		if(this.data[i].link)
		{
			var a = document.createElement('a');
			a.className = 'more_link';
			a.href = this.data[i].link;
			a.style.position = 'absolute';
			a.style.bottom = '10px';
			if(this.data[i].target == '_top')
				a.href = 'javascript:showAjaxContent("' + this.data[i].link + '");';
			else
				a.target = this.data[i].target;
			a.innerHTML = lang == 'de' ? 'mehr' : 'more';
			outer.appendChild(a);
		}
		target.appendChild(outer);
	}
}

newstickerBox.prototype.next = function(prev, user)
{
	if(this.timer) return;
	var t = 0;
	var start_a = this.a.offsetLeft;
	var start_b = this.b.offsetLeft;

	this.moveTimeout = window.slow_image_box ? 200 : 100;	
	this.timer = setInterval(function()
	{
		if(window.slow_image_box)
			t += 0.025;
		else
			t += 0.05;
		var r = Math.sin(Math.sin(Math.sin(t * Math.PI / 2) * Math.PI / 2) * Math.PI / 2);
		if(prev)
		{
			this.a.style.left = (start_a + r * this.width) + 'px';
			this.b.style.left = (start_b + r * this.width) + 'px';
		}
		else
		{
			this.a.style.left = (start_a - r * this.width) + 'px';
			this.b.style.left = (start_b - r * this.width) + 'px';
		}
		
		// ende
		if(r >= 0.95)
		{
			clearTimeout(this.timer);
			this.timer = 0;
			
			// finale position setzen
			if(prev)
			{
				this.a.style.left = (start_a + this.width) + 'px';
				this.b.style.left = (start_b + this.width) + 'px';
			}
			else
			{
				this.a.style.left = (start_a - this.width) + 'px';
				this.b.style.left = (start_b - this.width) + 'px';
			}
			
			// wenn nötige eine der boxen neu ausrichten
			if(prev)
			{
				// links ist nichts mehr von a -> b nach links
				if(this.a.offsetLeft < this.b.offsetLeft && this.a.offsetLeft >= 0)
					this.b.style.left = this.a.offsetLeft - this.a.offsetWidth + 'px';
		
				// links ist nichts mehr von b => a nach links
				else if(this.b.offsetLeft < this.a.offsetLeft && this.b.offsetLeft >= 0)
					this.a.style.left = this.b.offsetLeft - this.b.offsetWidth + 'px';
			}
			else
			{
				// rechts ist nichts mehr von a => b nach rechts
				if(this.a.offsetLeft > this.b.offsetLeft && this.a.offsetLeft <= this.minLeft)
					this.b.style.left = this.a.offsetLeft + this.a.offsetWidth + 'px';
		
				// rechts ist nichts mehr von b => a nach rechts
				else if(this.b.offsetLeft > this.a.offsetLeft && this.b.offsetLeft <= this.minLeft)
					this.a.style.left = this.b.offsetLeft + this.b.offsetWidth + 'px';
			}
			
			// beim user klick auf einen pfeil eine pause für den auto wechsel starten
			if(user)
			{
				this.pause = true;
				setTimeout(function(){ this.pause = false; }.bind(this), 2000);
			}
			
		}
	}.bind(this), 100);
	
}