// JavaScript Document

function slideOpen(t) {
	$("#"+t).animate({width:'710px'}, 1000);
}

function slideClose(t) {
	$("#"+t).animate({width:'235px'}, 1000);
}

var slideLastOpened = null;

function slide(tn) {
	var jt = $("#"+tn);
	var t = jt.get(0);
	var js = jt.find('.subContainer');
	
	// if(t.moving != null && t.moving != 0) return;
	
	// find out if to open or to close
	var isClosed = (t.isOpen != true) && (t.moving != 1);
	if(isClosed) {
		if(t.moving == 1) {
			// it's opening already - we don't need to do anything
			return;
		}
		else if(t.moving == -1) {
			// it's closing - stop that and go on here
			t.stopClosing = true;
		}
		
		// is another thing open that we need to close?
		if(slideLastOpened != null && slideLastOpened != tn) {
			// check if really open
			var ot = $("#"+slideLastOpened).get(0);
			if(ot.isOpen == true || ot.moving == 1) {
				slide(slideLastOpened);
			}
		}
		
		t.moving = 1;
		slideLastOpened = tn;
		
		// bring to front
		jt.css('z-index', 10);

		// store current values (how closed looks like)
		if(t._x == null) {
			t._x = jt.css('left');
			t._w = jt.css('width');
			t._sx = js.css('left');
		}

		var x = parseInt(t._x);
		var w = parseInt(t._w);
		var sx = parseInt(t._sx);

		// opening means: go to 0 and full width
		var dx = -x;
		var dw = 710 - w;
		var dsx = -sx;

		var cnt = 1;
		var steps = 15; // Math.round(Math.abs(dw / 50));
		var intv = setInterval(function() {
			if(t.stopOpening == true) { // can be null
				clearInterval(intv);
				t.stopOpening = false;
				return;
			}
			
			var q = cnt/steps;
			jt.css('width',Math.round((q*dw)+w)+'px').css('left',Math.round((q*dx)+x)+'px');
			js.css('left',Math.round(sx+(q*dsx))+'px');
			
			if(cnt == steps) {
				// stop
				clearInterval(intv);
				t.moving = 0;
				t.isOpen = true;
			}
			cnt++;
		}, 40);
		
		// jt.css('z-index', 10).animate({width:'710px',left:'0px'}, 1000, function(){this.moving=false;this.isOpen=true});
	}
	else {
		if(t.moving == -1) {
			// it's closing already - we don't need to do anything
			return;
		}
		else if(t.moving == 1) {
			// it's opening - stop that and go on here
			t.stopOpening = true;
		}
		t.moving = -1;

		// store current values
		var cx = parseInt(jt.css('left'));
		var cw = parseInt(jt.css('width'));
		var csx = parseInt(js.css('left'));

		var tx = parseInt(t._x);
		var tw = parseInt(t._w);
		var tsx = parseInt(t._sx);

		var dx = tx - cx;
		var dw = tw - cw;
		var dsx = tsx - csx;

		var cnt = 1;
		var steps = 15;
		var intv = setInterval(function() {
			if(t.stopClosing == true) { // can be null
				clearInterval(intv);
				t.stopClosing = false;
				return;
			}
			
			var q = cnt/steps;
			jt.css('width',Math.round(cw+(q*dw))+'px').css('left',Math.round(cx+(q*dx))+'px');
			js.css('left',Math.round(csx+(q*dsx))+'px');
			
			if(cnt == steps) {
				// stop
				clearInterval(intv);
				t.moving = 0;
				t.isOpen = false;
				// bring to front
				jt.css('z-index', 1);
			}
			cnt++;
		}, 40);
		// jt.css('z-index', 1).animate({width:t._w,left:t._x}, 1000, function(){this.moving=false;this.isOpen=false});
	}

}

function toggleVisible(t) {
	var t = $("#"+t);
	t.css('visibility', t.css('visibility') == 'hidden' ? 'visible' : 'hidden');
}

xfadeSeries = {};
function xfadeInit(id, imgs, callback, start) {
	// get the images
	xfadeSeries[id] = {imgs: $("#"+imgs.join(",#")), cur: 0, callback: callback};
	xfadeSeries[id].imgs.css('opacity', 0).css('visibility', 'visible');
	$(xfadeSeries[id].imgs.get(0)).css('opacity', 1);
	
	// fire callback for the first
	if(xfadeSeries[id].callback) xfadeSeries[id].callback(0);
	
	if(start != false) xfadeStart(id);
}

function xfadeNext(id) {
	var x = xfadeSeries[id];
	if(x.cur == x.imgs.length-1) {
		// the last one - make first visible
		$(x.imgs.get(0)).css('opacity',1);
		// and fade out last
		$(x.imgs.get(x.imgs.length-1)).animate({opacity: 0}, 300);
		x.cur = 0;
	}
	else {
		// fade next one in and when done, hide previous
		$(x.imgs.get(++(x.cur))).animate({opacity: 1}, 300, function() {$(x.imgs.get(x.cur-1)).css('opacity',0)});
	}
	if(x.callback) {
		x.callback(x.cur);
	}
}

function xfadeGet(id, i) {
	var x = xfadeSeries[id];
	if(i < 0 || i > x.length || i == x.cur) return;
	
	if(x.cur > i) {
		// the new one is behind old -> make new one visible..
		$(x.imgs.get(i)).css('opacity',1);
		// and fade out last
		$(x.imgs.get(x.cur)).animate({opacity: 0}, 300);
		x.cur = i;
	}
	else {
		// fade next one in and when done, hide previous
		var old = x.imgs.get(x.cur);
		$(x.imgs.get(i)).animate({opacity: 1}, 300, function() {$(old).css('opacity',0)});
		x.cur = i;
	}
	if(x.callback) {
		x.callback(x.cur);
	}
}

function xfadeStart(id) {
	if(xfadeSeries[id].intv != null) return;
	xfadeSeries[id].intv = setInterval(function() {
		xfadeNext(id);
	}, 3000);
}

function xfadeStop(id) {
	if(xfadeSeries[id].intv == null) return;
	clearInterval(xfadeSeries[id].intv);
	xfadeSeries[id].intv = null;
}

function xfadeToggle(id) {
	var playing = xfadeSeries[id].intv != null;

	if(!playing) xfadeStart(id);
	else xfadeStop(id);
	
	return !playing;
}

/**
 * shows text from one element in another
 */
function showText(sourceElement, targetElement) {
	var sEl = $("#"+sourceElement);
	var tEl = $("#"+targetElement);
	
	tEl.toggle();
	tEl.html(sEl.html());
	tEl.fadeIn(500);
}