/*
 * rcgmbh.teaser
 * Funktionen zur Anzeige und Animation des Teasers
 */

if(window.rcgmbh === undefined || window.rcgmbh === null) {
	window.rcgmbh = {};
}
if(window.rcgmbh.teaser === undefined || window.rcgmbh.teaser === null) {
	window.rcgmbh.teaser = {};
}

window.rcgmbh = {
	prefix : '',
	debug : false,
	automaticAnimation : true,
	teaserFont : null,
	host : "http://"+window.location.hostname+":"+window.location.port,

	teaserColorGrey : new dojo.Color([89,95,91]),
	teaserColorGreen : new dojo.Color([202,209,34]),
	
	teaserBoxes : [], 
	
	init : function(){
	
		dojo.attr(dojo.body(),'class','tundra');

		rcgmbh.connectLightboxImages();
		dojo.parser.parse();
		
		rcgmbh.connectNavi();
		rcgmbh.setMenuWidths();
		rcgmbh.teaserFont = dojox.gfx.getVectorFont(rcgmbh.prefix+'/fileadmin/templates/fonts/ffscala.svg');
		rcgmbh.teaser.init();
	},

	connectLightboxImages : function(){
		var _lightboxImages = dojo.query('a.lightbox-image');
		// var _lightboxImages = dojo.query('a[target=thePicture]');
		
		for(var i=0;i<_lightboxImages.length;i++){
			dojo.attr(_lightboxImages[i],'dojoType','dojox.image.Lightbox');
			if(_lightboxImages.length > 1){
				dojo.attr(_lightboxImages[i],'group','group1');
			}
		}
	},

	connectNavi : function(){
		if(dojo.isIE === 6){
			dojo.query('#navi li.hova').connect('onmouseenter',function(){rcgmbh.showNaviElement(this);});
			dojo.query('#navi li.hova').connect('onmouseleave',function(){rcgmbh.hideNaviElement(this);});
			dojo.query('#navi ul li ul li').connect('onmouseenter',function(){dojo.addClass(this,'active');});
			dojo.query('#navi ul li ul li').connect('onmouseleave',function(){dojo.removeClass(this,'active');});
		}
	},
	showNaviElement : function(node) {
		if(dojo.hasClass(node,'main-active')){
			dojo.addClass(node,'active-over');
		} else {
			dojo.addClass(node,'over');
		}
		dojo.style(dojo.query('.dropdown',node)[0],'display','block');
	},
	hideNaviElement : function(node) {
		dojo.removeClass(node,'over');
		dojo.removeClass(node,'active-over');
		dojo.style(dojo.query('.dropdown',node)[0],'display','none');
	},

	setMenuWidths : function(){
		var cssClass = "dropdown";
		
		var elementStyle = {
			"position" : "absolute",
			"left" : "-9999px"
		};
			
		var node = dojo.create('div',null, dojo.byId('wrapper'));
		dojo.attr(node,{id : 'temp'});
		dojo.style(node,elementStyle);
		
		var _maxWidth = 0;
		
		dojo.query('.'+cssClass).forEach(function(node){

			var _as = dojo.query('li a',node);
			var _maxWidth = 0;
			
			for(i=0;i<_as.length;i++){
				dojo.byId('temp').innerHTML = _as[i].innerHTML;
				if(dojo.coords(dojo.byId('temp')).w > _maxWidth){
					_maxWidth = dojo.coords(dojo.byId('temp')).w;
				}
				dojo.byId('temp').innerHTML = "";
			}
			_maxWidth = Number(_maxWidth);
			_newWidth = Math.max(85,_maxWidth)+50;
			dojo.attr(node,'style',{width:_newWidth+'px'});
			
		});
		dojo.destroy('temp');
	}
};

window.rcgmbh.teaser = {
	
	indent : 55, // linker und rechter Abstand der ersten Box vom Teaserrand
	slotWidth : 146, // Breite einer Teaserbox
	slotGap : 20, // Abstand zwischen den Teaserboxen
	teaserWidth : 999, // Gesamtbreite des Teasers
	
	delay : 12000,
	timeout : null,
	
	numberOfTeaserBoxes : null,
	slotPositions : null,
	textPositions : null,

	surfaces : [],
	rectangles : [],
	signatures : [],
	fonts : [],
	
	polylineActive : [{x:34,y:70},{x:14,y:70},{x:14,y:90}],
	polylineActive3Textlines : [{x:34,y:95},{x:14,y:95},{x:14,y:115}],
	polylineInactive : [{x:114,y:100},{x:130,y:114},{x:114,y:128}],
	
	sliderWidth : 980,
	sliderHeight : 365,
	
	currentState : null,
	nextState : null,
	animatedNode : null,
	
	animationObject : null,
	imageAnimation : null,
	switchToStateAfterAnimation : null,

	animArgs : {
		node: null,
		top: 189,
	    left: 0,
	    unit: "px",
	    duration:1000,
	    onEnd: function(){}
	},

	init : function(){
		rcgmbh.teaser.getConfig();
		
		if(rcgmbh.teaser.elementExists('teaser')){
			
			var _a = rcgmbh.teaser.indent;
			var _b = rcgmbh.teaser.slotWidth;
			var _c = rcgmbh.teaser.slotGap;
			var _d = rcgmbh.teaser.teaserWidth;
			
			var _e = rcgmbh.teaser.countTeaserBoxes();

			rcgmbh.teaser.slotPositions = {
				l1 : _a,l2 : _a+1*(_b+_c),l3 : _a+2*(_b+_c),l4 : _a+3*(_b+_c),l5 : _a+4*(_b+_c),
				r1 : _d-5*_b-4*_c-_a,r2 : _d-4*_b-3*_c-_a,r3 : _d-3*_b-2*_c-_a,r4 : _d-2*_b-_c-_a,r5 : _d-_b-_a
			};
			rcgmbh.teaser.textPositions = {
				t1 : 607, t2: 30, t3: 30, t4: 30, t5: 30
			};
			
			// Setting the slot position for each box
			for (var tb in rcgmbh.teaserBoxes) {
				if (rcgmbh.teaserBoxes.hasOwnProperty(tb)) {
					rcgmbh.teaserBoxes[tb].position = Number(tb)+1;
					var _slotLeft = rcgmbh.teaser.slotPositions['l'+rcgmbh.teaserBoxes[tb].position];
					var _rightSlowIndex = 5-rcgmbh.teaser.getNumberOfTeaserBoxes() + rcgmbh.teaserBoxes[tb].position;
					var _slotRight = rcgmbh.teaser.slotPositions['r'+_rightSlowIndex];
					rcgmbh.teaserBoxes[tb].leftSlot = _slotLeft;
					rcgmbh.teaserBoxes[tb].rightSlot = _slotRight;
				}
			}
			
			rcgmbh.teaser.createTeaserBoxes();
			dojo.query('#teaser .teaser-box').connect('onclick', rcgmbh.teaser.switchState);
			dojo.query('#teaser .teaser-box').connect('onmouseenter', function(){rcgmbh.teaser.toggleHover(this,true)});
			dojo.query('#teaser .teaser-box').connect('onmouseleave', function(){rcgmbh.teaser.toggleHover(this,false)});
			rcgmbh.teaser.switchTo(1);
		}
	},
	
	tempHoverColor : null,
	
	toggleHover : function(myNode,switchOn){
		var _stateObject = dojo.fromJson(dojo.attr(myNode,'stateObject'));
		
		var _tempFill = rcgmbh.teaser.rectangles[_stateObject.divId].getFill();
		if(switchOn){
			if(_tempFill.toHex() !== rcgmbh.teaserColorGreen.toHex()){	
				rcgmbh.teaser.tempHoverColor = rcgmbh.teaser.rectangles[_stateObject.divId].getFill();
				rcgmbh.teaser.changeFillColor(_stateObject.divId,rcgmbh.teaserColorGreen);
			} else {
				rcgmbh.teaser.tempHoverColor = rcgmbh.teaserColorGreen;
			}
		} else {
			rcgmbh.teaser.changeFillColor(_stateObject.divId,rcgmbh.teaser.tempHoverColor);
		}
	},
	
	setAnimationTimeOut : function(){
		window.clearTimeout(rcgmbh.teaser.timeout);
		if(rcgmbh.teaser.currentState+1 == rcgmbh.teaser.getNumberOfTeaserBoxes()){
			rcgmbh.teaser.nextState = rcgmbh.teaser.currentState+1;
		} else {
			rcgmbh.teaser.nextState = (rcgmbh.teaser.currentState+1) % rcgmbh.teaser.getNumberOfTeaserBoxes();
		}
		rcgmbh.teaser.timeout = window.setTimeout('rcgmbh.teaser.switchTo(rcgmbh.teaser.nextState)', rcgmbh.teaser.delay);
	},
	
	getConfig : function(){		
		
		dojo.xhrGet ({
            url: rcgmbh.host+rcgmbh.prefix+"/fileadmin/templates/teaserconfig.xml",
            sync: true,
            load: function (response, ioArgs){
				var jsdom = dojox.xml.DomParser.parse(response);

				var boxes = jsdom.byName('box');
				for(var box in boxes){
					var boxConfig = {};
									
					boxConfig.divId = boxes[box].byName('divId')[0].childNodes[0].nodeValue;
					boxConfig.heading = boxes[box].byName('heading')[0].childNodes[0].nodeValue;
					boxConfig.image = boxes[box].byName('image')[0].childNodes[0].nodeValue;
					boxConfig.imagePosition = boxes[box].byName('imagePosition')[0].childNodes[0].nodeValue;
					boxConfig.position = null;
					boxConfig.leftSlot = null;
					boxConfig.rightSlot = null;
					boxConfig.text = boxes[box].byName('text')[0].childNodes[0].nodeValue;
					boxConfig.textlines = [];
					
					var textlines = boxes[box].byName('textlines')[0].childrenByName('line');
					var numberOfTextlines = 0;
					for(var tl in textlines){
						if(textlines[tl].childNodes[0] !== undefined){
							numberOfTextlines++;
							boxConfig.textlines.push(textlines[tl].childNodes[0].nodeValue);
						} else { // Leere Textzeile einfuegen
							boxConfig.textlines.push("");
						}
					}
					boxConfig.numberOfTextlines = numberOfTextlines;
					rcgmbh.teaserBoxes.push(boxConfig);
				}
            }
		});
	},
	
	countTeaserBoxes : function(){
		var count = 0;
		for (var tb in rcgmbh.teaserBoxes) {
			if (rcgmbh.teaserBoxes.hasOwnProperty(tb)) {
				count++;
			}
		}
		rcgmbh.teaser.numberOfTeaserBoxes = count;
		return count;
	},
	getNumberOfTeaserBoxes : function(){
		if(rcgmbh.teaser.numberOfTeaserBoxes === null){
			rcgmbh.teaser.countTeaserBoxes();
		}
		return rcgmbh.teaser.numberOfTeaserBoxes;
	},
	
	getAnimatedNode : function(){
		return rcgmbh.teaser.animatedNode;
	},
	setAnimatedNode : function(node){
		rcgmbh.teaser.animatedNode = node;
	},

	switchState : function(){
		var _stateObject = dojo.fromJson(dojo.attr(this,'stateObject'));
		rcgmbh.teaser.switchTo(_stateObject.pos);
	},
	
	switchTo : function(targetState){
		if(targetState !== rcgmbh.teaser.currentState){
			window.clearTimeout(rcgmbh.teaser.timeout);
			rcgmbh.teaser.currentState = targetState;
			rcgmbh.teaser.animate(targetState);
			if(rcgmbh.automaticAnimation === true){
				rcgmbh.teaser.setAnimationTimeOut();
			}
		}
	},
	
	animate : function(targetState){
		for (var tb in rcgmbh.teaserBoxes){
			if (rcgmbh.teaserBoxes.hasOwnProperty(tb)) {
				rcgmbh.teaser.animArgs.node = rcgmbh.teaserBoxes[tb].divId;
				
				if(rcgmbh.teaserBoxes[tb].position <= targetState){
					rcgmbh.teaser.animArgs.left = rcgmbh.teaserBoxes[tb].leftSlot;
				} else {
					rcgmbh.teaser.animArgs.left = rcgmbh.teaserBoxes[tb].rightSlot;
				}
				
				if(rcgmbh.teaserBoxes[tb].position == targetState){
					rcgmbh.teaser.changeFillColor(rcgmbh.teaserBoxes[tb].divId,rcgmbh.teaserColorGreen);
					rcgmbh.teaser.tempHoverColor = rcgmbh.teaserColorGreen;
					rcgmbh.teaser.changeTeaserSignature(rcgmbh.teaserBoxes[tb].divId,true,rcgmbh.teaserBoxes[tb].numberOfTextlines);
					
					var activeTb = tb; // Zwischenspeichern der Teaserbox fuer die Callback-Funktion
					
					/*
					 *  Die Animation sollte nicht mehrfach laufen, deswegen enthaelt
					 *  imageAnimation waehrend einer Animation das dojo._Animation Objekt.
					 *  Falls die Animation laeuft, wird sie nicht erneut gestartet, sondern der
					 *  letzte State gespeichert, um nach Beenden aller Animationen in den
					 *  dann aktiven State zu wechseln.
					 */
					var _pos = dojo.coords(dojo.byId('teaser-image')).l;

					if(rcgmbh.teaser.imageAnimation === null){
						rcgmbh.teaser.imageAnimation = dojo.fx.chain([
							dojo.fx.combine([
								dojo.fx.slideTo({node: 'teaser-image',
								top: 0,
								left: _pos-300,
								unit: "px",
								duration:1000,
								onEnd: function(){
									dojo.style('teaser-image','backgroundImage','url('+rcgmbh.prefix+rcgmbh.teaserBoxes[activeTb].image+')');
									dojo.query('#teaser-text h1')[0].innerHTML = rcgmbh.teaserBoxes[activeTb].heading;
									dojo.query('#teaser-text p')[0].innerHTML = rcgmbh.teaserBoxes[activeTb].text;
									dojo.style('teaser-image','left',(Number(rcgmbh.teaserBoxes[activeTb].imagePosition)-300)+'px');
									dojo.attr('teaser-text','style',{left:rcgmbh.teaser.textPositions['t'+rcgmbh.teaserBoxes[activeTb].position]+"px"});
					            }}),
					            dojo.fadeOut({
					                node: "teaser-image",
					                duration: 1000
					            }),
					            dojo.fx.wipeOut({
					                node: "teaser-text",
					                duration: 500
					            })]),
							dojo.fx.combine([
								dojo.fadeIn({
									node: "teaser-image",
									duration: 1000
								}),
								dojo.fx.wipeIn({
									node: "teaser-text",
									duration: 500
								}),
								dojo.fx.slideTo({
									node: 'teaser-image',
									top: 0,
									left: rcgmbh.teaserBoxes[activeTb].imagePosition,
									unit: "px",
									duration:1000,
									onEnd: function(){
										rcgmbh.teaser.imageAnimation = null;
										if(rcgmbh.teaser.switchToStateAfterAnimation !== null){
											rcgmbh.teaser.animate(rcgmbh.teaser.switchToStateAfterAnimation);
											rcgmbh.teaser.switchToStateAfterAnimation = null;
										}
										//dojo.style('teaser-image','backgroundImage','url('+rcgmbh.teaserBoxes[tb].image+')');
									}
							})])
						]).play();
					} else {
						rcgmbh.teaser.switchToStateAfterAnimation = targetState;
					}
				} else {
					rcgmbh.teaser.changeFillColor(rcgmbh.teaserBoxes[tb].divId,rcgmbh.teaserColorGrey);
					rcgmbh.teaser.changeTeaserSignature(rcgmbh.teaserBoxes[tb].divId,false,rcgmbh.teaserBoxes[tb].numberOfTextlines);
				}
				rcgmbh.teaser.animationObject = dojo.fx.slideTo(rcgmbh.teaser.animArgs).play();
			}
		}
	},
	
	createTeaserBoxes : function(){
		var left = rcgmbh.teaser.indent;
		
		for (var tb in rcgmbh.teaserBoxes){
			if (rcgmbh.teaserBoxes.hasOwnProperty(tb)) {
				rcgmbh.teaser.createTeaserBox(left,rcgmbh.teaserBoxes[tb]);
				rcgmbh.teaser.createTeaserBoxLabel(rcgmbh.teaserBoxes[tb]);
				
				left = left + rcgmbh.teaser.slotWidth + rcgmbh.teaser.slotGap;
			}
		}
	},
	
	createTeaserBoxLabel : function(tb){
		var s = dojox.gfx.createSurface(dojo.byId(tb.divId+'-label'), 126, 126);
		rcgmbh.teaser.fonts[tb.divId] = [];
		for(i=0;i<3;i++){
			var g = s.createGroup();
			var phrase1 = rcgmbh.teaserFont.draw(
			    g,
			    { text: tb.textlines[i], align: "left", x : 0, y : Number(i*25)},
			    { size: "2em" },
			    "white"
			);
			rcgmbh.teaser.fonts[tb.divId][i] = phrase1;
		}
	},
	
	createTeaserBox : function(xPos,tb){

		var elementStyle = {
			"position" : "absolute",
			"left" : xPos+"px",
			"top" : "189px",
            "width": "146px",
            "height": "146px",
			"float": "left"
		};
		var myNode = dojo.create('div',null, dojo.query('#teaser .slider')[0]);
		dojo.attr(myNode, {id : tb.divId, stateObject : "{divId : '"+tb.divId+"', pos : "+tb.position+"}"});
		dojo.addClass(myNode,'teaser-box');
		
		dojo.style(myNode, elementStyle);
		
		myNode = dojo.create('div',null, dojo.byId(tb.divId));
		
		dojo.attr(myNode, {id : tb.divId+"-bg"});
		dojo.addClass(myNode,'teaser-box-bg');
		
		elementStyle.left = "0px";
		elementStyle.top = "0px";
		dojo.style(myNode, elementStyle);
		
		var surfaceWidth = 146;
		var surfaceHeight = 146;
		var surface = dojox.gfx.createSurface(myNode,surfaceWidth,surfaceHeight);
		
		var rect = { x: 0, y: 0, width: 146, height: 146, r: 10 };
		
		group = surface.createGroup();
		
		rcgmbh.teaser.rectangles[tb.divId] = group.createRect(rect)
			.setFill([rcgmbh.teaserColorGrey.r, rcgmbh.teaserColorGrey.g, rcgmbh.teaserColorGrey.b, 1.0])
			.applyTransform(dojox.gfx.matrix.identity);
		
		myNode = dojo.create('div',null, dojo.byId(tb.divId));
		dojo.attr(myNode, {id : tb.divId+"-label"});
		dojo.addClass(myNode,'teaser-box-label');
		
		elementStyle.left = "10px";
		elementStyle.top = "10px";
		elementStyle.width = "126px";
		elementStyle.height = "126px";
		dojo.style(myNode, elementStyle);
		
		rcgmbh.teaser.surfaces[tb.divId] = group;
		
	},
	
	changeFillColor : function(rectKey,color){
		rcgmbh.teaser.rectangles[rectKey].setFill([color.r, color.g, color.b, 1.0]);
	},
	changeTeaserSignature : function(rectKey,active,numberOfTextlines){

		if(rcgmbh.teaser.signatures[rectKey] !== undefined) {
			rcgmbh.teaser.signatures[rectKey].removeShape();
		}
		
		if(active === true){
			if(numberOfTextlines === 3){
				rcgmbh.teaser.signatures[rectKey] = rcgmbh.teaser.surfaces[rectKey].createPolyline(rcgmbh.teaser.polylineActive3Textlines).setStroke({width: 2, color: "white"}).setTransform([dojox.gfx.matrix.rotategAt(0,14,95)]);
			} else {
				rcgmbh.teaser.signatures[rectKey] = rcgmbh.teaser.surfaces[rectKey].createPolyline(rcgmbh.teaser.polylineActive).setStroke({width: 2, color: "white"}).setTransform([dojox.gfx.matrix.rotategAt(0,14,70)]);
			}
		} else {
			rcgmbh.teaser.signatures[rectKey] = rcgmbh.teaser.surfaces[rectKey].createPolyline(rcgmbh.teaser.polylineInactive).setStroke({width: 2, color: "white"});
		}		
	},
		
	elementExists : function(elementId) {
		if(dojo.byId(elementId) !== null && dojo.byId(elementId) !== undefined){
			return true;
		} else {
			return false;
		}
	}
};

window.rcgmbh.imageBox = {
	init: function(){
		//Initialisierung der Href Links:
		dojo.query('a.imagebox').connect('onclick', rcgmbh.eventHandling.imageLinkOnClick);
	}
};
window.rcgmbh.eventHandling = {
	imageLinkOnClick : function(){
		console.log("imagelink clicked.");
	}
};

dojo.addOnLoad(window.rcgmbh.init);