/**
 * @author faehrmann
 * 02 2012 dojo.hash martin ehmen
 */

dojo.require("dojo.hash");


/* GLOBAL VARS */
var einBlendenHandle;
var ausBlendenHandle;
var winResizeHandle;
var contentOpen = 0;
var subMenuActive = 0;

var pageInitialized = false;

var tmpMenuCategory = "agentur";
var oldMainLinkID = "magentur";
var tmpRefContID = -1;
var mWheelScroll = 50; // Mouse-Wheel - Scroll in px

var images;
var bgImages = new Array();
var bgChangeConnect;
var imgArrCount = 1;
var imgChangeTimer;
var imgChangeTimer_is_on = 0;
var imgThumbTimer;
var imgThumbTimer_is_on = 0;
var thumbScrollTimer = new Array();
var thumbScrollTimer_is_on = new Array();
var imgChangeInterval = 3000;

var thumbs = new Array();
var thumbPrevOver = new Array();
var thumbPrevOut = new Array();
var thumbNextOver = new Array();
var thumbNextOut = new Array();
var sites = new Array();

var competenceStore;
var customerStore;
var projectStore;

var competenceItems = new Array();

var dndDojoConnectArr = new Array();

var bg_is_loaded = 0;
var presse_is_loaded = 0;
var about_is_loaded = 0;
var design_is_loaded = 0;
var zweid_is_loaded = 0;
var dreid_is_loaded = 0;
var ref2d_is_loaded = 0;
var ref3d_is_loaded = 0;
var comp_is_loaded = 0;
var kontakt_is_loaded = 0;
var impress_is_loaded = 0;
var aktuelles_is_loaded = 0;
var agentur_is_loaded = 0;

var gaTracker; // used for Google Analytics
var gaTrackerReady = 0;

/* GLOBAL VARS */

dojo.addOnLoad(function(){
//	gaTracker = new dojox.analytics.Urchin({acct:"UA-15187008-3", GAonLoad: function(){
	gaTracker = new dojox.analytics.Urchin({acct:"UA-21011923-3", GAonLoad: function(){
			gaTrackerReady = 1;
		}
	});

	hashInit();

	dojo.byId("loadingText").innerHTML = "Lade Datenstrukturen - 0%";
//	checkAdminLogin();
	prepareElementsStore();
	dojo.byId("loadingText").innerHTML = "Lade Datenstrukturen - 25%";
	setTitlePanePosition();
	dojo.byId("loadingText").innerHTML = "Lade Datenstrukturen - 50%";
	initMenuEffects();
	dojo.byId("loadingText").innerHTML = "Lade Hintergruende - 75%";
	//getBackgroundImages();

	hidePreloader();
	
	dojo.connect(dojo.byId("inhalt"), (!dojo.isMozilla ? "onmousewheel" : "DOMMouseScroll"), function(e){
	   getMouseWheelEvent(e);
	});
});


function handlePageHashState(hashState) {
    console.debug("handlePageHashState ", hashState);
    if (!pageInitialized) {
        //This is one time initialization for all views
        //For specific view initialization, execute it from the proper render function
        console.debug("Perform any required initialization");
        pageInitialized=true;
    }

    if (hashState == null || hashState === "" || hashState === "default") {
        switchContent('agentur','agentur');

    } else if(hashState=="Aktuelles"){
        switchContent('aktuelles','agentur');

    } else if(hashState=="Angebote"){
        switchContent('angebote','agentur');

    } else if(hashState=="Presse"){
        switchContent('presse','agentur');

    } else if(hashState=="Team"){
        switchContent('about','agentur');

    } else if(hashState=="Designprozess"){
        switchContent('designprozess','agentur');

    } else if(hashState=="Kompetenzen"){
        switchContent('kompetenzen','agentur');

    } else if(hashState=="Agentur"){
        switchContent('agentur','agentur');

    } else if(hashState=="Angebote"){
        switchContent('angebote','angebote');

    } else if(hashState=="Zwei-d-design"){
        switchContent('2d','2d');

    } else if(hashState=="2D_Referenzen"){
        switchContent('2d_referenzen','2d');

    } else if(hashState=="Drei-d-design"){
        switchContent('3d','3d');

    } else if(hashState=="3D_Referenzen"){
        switchContent('3d_referenzen','3d');

    } else if(hashState=="Kontakt"){
        switchContent('kontakt','kontakt');

    } else if(hashState=="Impressum"){
        switchContent('impressum','impressum');

    }else{
        console.debug("Calling a default action in case you can't find a proper hash state");
        switchContent('aktuelles','agentur');
        //This will force the execution of pageHandleHashState with default as hash value
        //This is one the nice features with the hash controller that you can force executing it
        //with specific hash value
        //This will force an update in URL hash so the undefined one is replaced
        //This can happen if user manually modified the hash value with wrong one
        //dojo.hash("Agentur");
    }
}


function setHashAndTitle(newtitle){
    dojo.hash(newtitle);
    document.title="designagentur projektpartner - "+newtitle;
}
function resetPageTitle(){
    console.debug("resetPageTitle");
    document.title="designagentur projektpartner";
}

function hashInit(){
        console.debug("hash: init");
        dojo.subscribe("/dojo/hashchange", this, handlePageHashState);
        handlePageHashState(dojo.hash());
}




function initMenuEffects() {
	//user menu special effects
	var userMenu = dojo.byId("userMenu");
	if (userMenu) {
		dojo.query(".slideup").forEach(function(n) {
			var l = dojo.query(n);
	        l.parent().at(0).onmouseenter(function(){
	        	  dojo.style(l[0], "left", "1px");
	        	  var wipeIn = dojo.fx.wipeIn({node: l[0], duration: 250});
	        	  if(subMenuActive) {
	        		  var subSelected = dojo.query(".menuItemSelected", l[0]);
	        		  if(subSelected != "") {
	        			  var menuActiveBlock = dojo.byId("menuActiveBlock");
	        			  dojo.fx.wipeOut({node: menuActiveBlock, duration: 250}).play();
	        		  }
	        	  }
	        	  wipeIn.play()
	        }).onmouseleave(function(){
	        	var wipeOut = dojo.fx.wipeOut({node: l[0], duration: 250});
	        	dojo.connect(wipeOut, "onEnd", function() {
	        		dojo.style(l[0], "display", "none");
	        		if(subMenuActive) {
	        			var menuActiveBlock = dojo.byId("menuActiveBlock");
	        			dojo.fx.wipeIn({node: menuActiveBlock, duration: 250}).play();
		        	}
	        	});
	        	wipeOut.play()
	        }).onclick(function() {
	        	var wipeOut = dojo.fx.wipeOut({node: l[0], duration: 250});
	        	dojo.connect(wipeOut, "onEnd", function() {
	        		dojo.style(l[0], "display", "none");
	        	});
	        	wipeOut.play()
	        });
	    });
	  }
}

function getBackgroundImages() {	
	dojo.xhrGet( {
		url: "/inc/db.php",
		handleAs: "json",
		timeout: 10000, // Time in milliseconds
		sync: false,

		load: function(response, ioArgs) {
			bgImages = response[0];
			setBgImgList(bgImages.agentur, 0);
		
			var ws = dojo.window.getBox();
			var bgHeight = ws.h;

			var imgWidth = 2560;
			var imgHeight = 1440;

			var bgAspectRatio = bgHeight / ws.w;
	
			if(bgAspectRatio > (imgHeight / imgWidth)) {
				calcImgWidth = ((bgHeight / imgHeight) * imgWidth);
				calcImgHeight = bgHeight;
			}
			else {
				calcImgWidth = ws.w;
				calcImgHeight = ((ws.w / imgWidth) * imgHeight);
			}

			if(calcImgWidth > 2560 && calcImgHeight > 1440) {
				calcImgWidth = 2560;
				calcImgHeigth = 1440;
			}

			var imgNode = dojo.create("img", {
				id: "mainBgImg",
				src: "/inc/imgResize.php?img=" + bgImages.agentur[0] + "&w=" + calcImgWidth + "&h=" + calcImgHeight
			}, "mainBgImgPane", "first");

				var bgOnLoadConnect = dojo.connect(imgNode, "onload", this, function(event){
					dojo.disconnect(bgOnLoadConnect);
					resizeBgImg(imgNode);
				//	hidePreloader();
				});

			return response; 
		},
		error: function(response, ioArgs) { 
		       return response;
	        },
		content: {action:"getBackgroundImages"}
	});
}

function setTitlePanePosition() {
	var ws = dojo.window.getBox();
	var psMenu = dojo.position('menuContentPane');
	var psTitle = dojo.position('titleContainer');
	var inhalt = dojo.byId('inhalt');
	var inhaltPos = dojo.position('inhalt');
	var sliderPane = dojo.byId('sliderPane');
	var verticalSlider = dojo.byId('verticalSlider2');
	var movePosStart = "9";
	var topShadowPadding = "25";
	var bottomSpacing = "40";
	var movePosEnd = ws.h - psMenu.h - psTitle.h - topShadowPadding;

	var hInhalt = ws.h - psMenu.h - psTitle.h - movePosStart - topShadowPadding - bottomSpacing;
	var posLeft = (inhaltPos.x + inhaltPos.w) - 645;
	if(presse_is_loaded) {
		dojo.style("press_paper_background", {"height": hInhalt + "px", "left": posLeft + "px", "top": (ws.h - psMenu.h)});
	}

	dojo.style("inhaltBorderContainer", {width: "1040px"});
	if(!contentOpen) {
		dojo.animateProperty({
			node: dojo.byId("inhaltBorderContainer"),
			duration: 1,
			properties: {
				top: { end: movePosEnd, start: movePosEnd, units: "px"}
			}
		}).play();

		if(ausBlendenHandle) {
			dojo.disconnect(ausBlendenHandle);
			ausBlendenHandle = "";
		}
		einBlendenHandle = dojo.connect(dojo.byId("titleContainer"),"onclick",einBlenden);
	}
	else {
		var hInhalt = ws.h - psMenu.h - psTitle.h - movePosStart - topShadowPadding - bottomSpacing;
		var hSlider = hInhalt;
		dojo.style(inhalt, {height: hInhalt + "px"});
		if(dijit.byId("verticalSlider2")) {
			initSlider(dijit.byId("verticalSlider2").attr("value"));
		}
		else {
			initSlider(0);
		}
		var posLeft = (inhaltPos.x + inhaltPos.w) - 645;
		if(presse_is_loaded) {
			dojo.style("press_paper_background", {"height": hInhalt + "px", "left": posLeft + "px"});
		}
	}

	if(!winResizeHandle) {
		winResizeHandle = dojo.connect(window, "onresize", function() {
			setTitlePanePosition();
			if(dojo.byId("mainBgImg")) {
				resizeBgImg('mainBgImg');
			}
		});
	}
}

function ausBlenden(){
	var ws = dojo.window.getBox();
	var psMenu = dojo.position('menuContentPane');
	var psTitle = dojo.position('titleContainer');
	var inhalt = dojo.byId('inhalt');
	var movePosStart = "9";
	var topShadowPadding = "25";
	var movePosEnd = ws.h - psMenu.h - psTitle.h - topShadowPadding;
	dojo.fx.combine([
		dojo.animateProperty({
			node: dojo.byId("inhaltBorderContainer"),
			duration: 500,
			properties: {
				top: { end: movePosEnd, start: movePosStart, units: "px"}
			},
			onEnd: function() {
				dojo.byId("menuArrow").innerHTML = '<img src="/images/arrow_up_black.png">';
			}
		}),

	]).play();

	if(presse_is_loaded) {
		dojo.animateProperty({
			node: dojo.byId("press_paper_background"),
			duration: 500,
			properties: {
				top: { end: (ws.h - psMenu.h), start: 130, units: "px"}
			}
		}).play();
	}

	dojo.disconnect(ausBlendenHandle);
	einBlendenHandle = dojo.connect(dojo.byId("titleContainer"),"onclick",einBlenden);
	contentOpen = 0;  
}

function einBlenden(){
	var ws = dojo.window.getBox();
	var psMenu = dojo.position('menuContentPane');
	var psTitle = dojo.position('titleContainer');
	var inhaltCont = dojo.byId('inhaltContainer');
	var inhalt = dojo.byId('inhalt');
	var inhaltPos = dojo.position('inhalt');
	var sliderPane = dojo.byId('sliderPane');
	var verticalSlider = dojo.byId('verticalSlider2');
	var movePosEnd = "9";
	var topShadowPadding = "25";
	var bottomSpacing = "40";
	var movePosStart = ws.h - psMenu.h - psTitle.h - topShadowPadding;
	var hInhalt = ws.h - psMenu.h - psTitle.h - movePosEnd - topShadowPadding - bottomSpacing;
	var hInhaltCont = hInhalt + bottomSpacing;
	var hSlider = hInhalt;

	dojo.fx.combine([
		dojo.animateProperty({
			node: dojo.byId("inhaltBorderContainer"),
			duration: 500,
			properties: {
				top: { end: movePosEnd, start: movePosStart, units: "px"}
			},
			onBegin: function() {
				dojo.fx.wipeIn({node: inhalt, duration: 0}).play();
				dojo.style(inhalt, {height: hInhalt + "px"});
				dojo.style(inhaltCont, {height: hInhaltCont + "px"});

				if(dijit.byId("verticalSlider2")) {
					initSlider(dijit.byId("verticalSlider2").get("value"));
				}
				else {
					initSlider(0);
				}

				dijit.byId('agentur').resize();
				if(!bg_is_loaded) {
					getBackgroundImages();
					bg_is_loaded = 1;
				}
			},
			onEnd: function() {
			       dojo.byId("menuArrow").innerHTML = '<img src="images/arrow_down_black.png">';
			}
		})

	]).play();

	if(presse_is_loaded) {
		dojo.animateProperty({
			node: dojo.byId("press_paper_background"),
			duration: 500,
			properties: {
				top: { end: 130, start: (ws.h - psMenu.h), units: "px"}
			}
		}).play();
	}

	dojo.disconnect(einBlendenHandle);
	ausBlendenHandle = dojo.connect(dojo.byId("titleContainer"),"onclick",ausBlenden);
	contentOpen = 1;

	if(imgChangeTimer_is_on) {
		imgChangeTimer_is_on = 0;
		clearTimeout(imgChangeTimer);
		dojo.removeClass(dojo.query(".slideShowStart")[0].id, "slideShowHighlight");
	}
}

function getMouseWheelEvent(event) {
	// except the direction is REVERSED, and the event isn't normalized! one more line to normalize that:
	var scroll = event[(!dojo.isMozilla ? "wheelDelta" : "detail")] * (!dojo.isMozilla ? 1 : -1);
	var slVal = dijit.byId("verticalSlider2").get("value");
	var scrollOffset = getScrollbarOffset();

	if(scroll < 0) {
		slVal += mWheelScroll;
		if(slVal > scrollOffset) {
			slVal = scrollOffset;
		}
	}
	else {
		slVal -= mWheelScroll;
		if(slVal < 0) {
			slVal = 0;
		}
	}

	dijit.byId("verticalSlider2").set("value", slVal);
}

function initSlider(scrollPos) {
	var psInhalt = dojo.position('inhalt');
	dijit.byId("verticalSlider2").destroyDescendants();
	dijit.byId("verticalSlider2").destroy();
	var scrollOffset = getScrollbarOffset();

	if(scrollOffset == 0) {
		scrollOffset = 1;
		disabled = true;
	}
	else {
		disabled = false;
	}

	var slider = new dijit.form.VerticalSlider({
		id: "verticalSlider2",
		name: "vertical",
		value: scrollPos,
		minimum: scrollOffset,
		maximum: 0,
		intermediateChanges: true,
		showButtons: false,
		disabled: disabled,
		onChange: function(value) {
			getSliderValue(value);
		},
		style: "height: " + psInhalt.h + "px"
	});
	dojo.place(slider.domNode, "verticalSlider", "first");
}

function getSliderValue(value) {
	var contentBox = dojo.byId("inhalt");
	var scrollOffset = getScrollbarOffset();
	value = parseInt(value);
	contentBox.scrollTop = value;
}

function getScrollbarOffset() {
	var inhalt = document.getElementById('inhalt'); // div element

	var h = inhalt.scrollHeight; // height of div scroll
	var c = inhalt.clientHeight; // scroll bar height
	var toScroll = h - c; // offset of scroll not visible

	return toScroll;
}

function resizeBgImg(imgNode) {
	var ws = dojo.window.getBox();
	var psMenu = dojo.position('menuContentPane');
	var bgHeight = ws.h - psMenu.h;

	var imgDimension = dojo.position(imgNode);

	var bgAspectRatio = bgHeight / ws.w;

	if(bgAspectRatio > (imgDimension.h / imgDimension.w)) {
		calcImgWidth = ((bgHeight / imgDimension.h) * imgDimension.w);
		calcImgHeight = bgHeight;
	}
	else {
		calcImgWidth = ws.w;
		calcImgHeight = ((ws.w / imgDimension.w) * imgDimension.h);
	}

	dojo.marginBox(imgNode, {
		w: calcImgWidth, 
		h: calcImgHeight,
		l: (0 - ((calcImgWidth - ws.w)) / 2),
		t: (0 - ((calcImgHeight - bgHeight)) / 2)
	});
}

var hidePreloader = function(){
	// This really hides the preloader
	var hide = function(){
		dojo.fadeOut({
			node:"preloader",
			duration: 500,
			onBegin: function() {
				dojo.byId("loadingText").innerHTML = "Vorgang abgeschlossen - 100%";
			},
			onEnd: function(){
				dojo.style("preloader", "display", "none");
				dojo.style("inhalt", "visibility", "visible");
				setTimeout(function(){
					if(!contentOpen) {
						einBlenden();
					}
				}, 3000);
			}
		}).play();
	};

	// Set a timeout to ensure the preloader is visible.
	// This is only for testing !!!
	setTimeout(hide, 100);
};

function setBgImgList(img_array, imgNr) {
	dojo.byId("imgList").innerHTML = "";
	images = img_array;
	var imgList = dojo.create("ul", null, "imgList");
	for(var i = 0; i <= images.length; i++) {
		dojo.create("li", { 
			id: "image_" + i,
			onClick: "setBgImage(" + i + ");",
			onMouseOver: "dojo.toggleClass(this.id, 'imgSelectHover');",
			onMouseOut: "dojo.toggleClass(this.id, 'imgSelectHover');"
		}, imgList);
	}
	dojo.addClass("image_" + imgNr, "imgSelectHighlight");
	dojo.addClass("image_" + images.length, "slideShowStart");
	dojo.byId("image_" + images.length).setAttribute("onClick", "restartBgImageChange();");
	dojo.byId("image_" + images.length).setAttribute("title", "Diashow");
	dojo.query(".slideShowStart").forEach(function(n) {
		var l = dojo.query(n);
		l.onmouseenter(function() {
			dojo.toggleClass(this.id, "slideShowHover");
			}).onmouseout(function() {
				dojo.toggleClass(this.id, "slideShowHover");
				});
		});

	imgArrCount = imgNr;
}

function restartBgImageChange() {
	dojo.addClass(dojo.query(".slideShowStart")[0].id, "slideShowHighlight");
	if(imgChangeTimer_is_on) {
		clearTimeout(imgChangeTimer);
		dojo.removeClass(dojo.query(".slideShowStart")[0].id, "slideShowHighlight");
	}
	else {
		changeBgImages(images[imgArrCount], 1);

		if(contentOpen) {
			setTimeout("ausBlenden()", 500);
		}
	}	
}

function setBgImage(imageID) {
	var imgNode = dojo.byId("mainBgImg");
	dojo.query(".imgSelectHighlight").removeClass("imgSelectHighlight");
	dojo.addClass("image_" + imageID, "imgSelectHighlight");
	changeBgImages(images[imageID], 0);
	if(imgChangeTimer_is_on) {
		imgChangeTimer_is_on = 0;
		clearTimeout(imgChangeTimer);
		dojo.removeClass(dojo.query(".slideShowStart")[0].id, "slideShowHighlight");
	}
	if(contentOpen) {
		setTimeout("ausBlenden()", 500);
	}

	imgArrCount = imageID;
}

function changeBgImages(image, slideShow) {
	if(bgChangeConnect) {
		dojo.disconnect(bgChangeConnect);
	}

	var ws = dojo.window.getBox();
	var imgNode = dojo.byId("mainBgImg");
	var fadeDuration = "1000";
	//Create a temporary image to trigger onload event
	var tmpImg = dojo.create("img", {
		style: { 
			position: "absolute", 
			left: "0",
			top: "0",
			zIndex: "-20",
			opacity: "0"
		}
	}, dojo.body(), "last");

	bgChangeConnect = dojo.connect(tmpImg, "onload", this, function(event){
		resizeBgImg(tmpImg);
		dojo.fx.combine([
			dojo.fadeOut({
				node: imgNode,
				duration: fadeDuration,
				onBegin: function() {
					var imgLen = images.length - 1;
					if(imgArrCount == imgLen) {
						dojo.query(".imgSelectHighlight").removeClass("imgSelectHighlight");
						dojo.addClass("image_" + imgArrCount, "imgSelectHighlight");
						imgArrCount = 0;
					}
					else {
						dojo.query(".imgSelectHighlight").removeClass("imgSelectHighlight");
						dojo.addClass("image_" + imgArrCount, "imgSelectHighlight");
						imgArrCount += 1;
					}
				},
				onEnd: function() {
					imgNode.src = "";
				}
			}),
			dojo.fx.chain([
				dojo.fadeIn({
					node: tmpImg,
					duration: fadeDuration,
					onEnd: function() {
						imgNode.src = tmpImg.src;
						if(slideShow) {
							imgChangeTimer_is_on = 1;
							imgChangeTimer = setTimeout("changeBgImages(\'" + images[imgArrCount] + "\', 1);", imgChangeInterval);
						}
					}
				}),
				dojo.fadeIn({
					node: imgNode,
					duration: fadeDuration, /*15022012 mae war: 1*/
					onBegin: function() {
						resizeBgImg(imgNode);
					},
					onEnd: function() {
						dojo.destroy(tmpImg);
					}	
				})
			])
		]).play();
	});

	var bgHeight = ws.h;

	var imgWidth = 2560;
	var imgHeight = 1440;

	var bgAspectRatio = bgHeight / ws.w;

	if(bgAspectRatio > (imgHeight / imgWidth)) {
		calcImgWidth = ((bgHeight / imgHeight) * imgWidth);
		calcImgHeight = bgHeight;
	}
	else {
		calcImgWidth = ws.w;
		calcImgHeight = ((ws.w / imgWidth) * imgHeight);
	}

	if(calcImgWidth > 2560 && calcImgHeight > 1440) {
		calcImgWidth = 2560;
		calcImgHeigth = 1440;
	}
	tmpImg.src = "/inc/imgResize.php?img=" + image + "&w=" + calcImgWidth + "&h=" + calcImgHeight;
}

function setCompetenceDetails(compID, competence) {
	tmpRefContID = -1;
	dojo.query(".competence_listHighlight").removeClass("competence_listHighlight");
	dojo.addClass(compID, "competence_listHighlight");

	dojo.xhrGet( {
		url: "inc/db.php",
		handleAs: "json",
		timeout: 10000, // Time in milliseconds

		load: function(response, ioArgs) {
			if(response) {
				if(response.competence_header) {
					//dijit.byId("competence_header").set("value", response.competence_header);
					dojo.byId("competence_header").innerHTML = response.competence_header;
				}
				else {
					//dijit.byId("competence_header").set("value", competence);
					dojo.byId("competence_header").innerHTML = competence;
				}
				if(response.competenceTextBlock1) {
					//dijit.byId("competenceTextBlock1").set("value", response.competenceTextBlock1);
					dojo.byId("competenceTextBlock1").innerHTML = response.competenceTextBlock1;
				}
				else {
					//dijit.byId("competenceTextBlock1").set("value", "Hier koennte ihre Werbung stehen!");
					dojo.byId("competenceTextBlock1").innerHTML =  "Hier koennte ihre Werbung stehen!";
				}
				if(response.competenceTextBlock2) {
					//dijit.byId("competenceTextBlock2").set("value", response.competenceTextBlock2);
					dojo.byId("competenceTextBlock2").innerHTML =  response.competenceTextBlock2;
				}
				else {
				//	dijit.byId("competenceTextBlock2").set("value", "got text?");
					dojo.byId("competenceTextBlock2").innerHTML = "got text?";
				}
			}
			else {
				dojo.byId("competence_header").innerHTML= competence;
				dojo.byId("competenceTextBlock1").innerHTML = "Hier koennte ihre Werbung stehen!";
				dojo.byId("competenceTextBlock2").innerHTML = "got text?";
			}

			searchCompList(competence);
			return response; 
		},
		error: function(response, ioArgs) { 
	       		return response;
	       	},
		content: {action:"getCompetenceContextElement", competence: competence}
	});

	//searchCompList(competence);
}

function showExampleDetails(paneID, height) {
	showRefDetails(paneID, height);
}

function showRefDetails(id, minHeight) {
	var maxHeight = 434;

	if(tmpRefContID != "-1") {
		if(tmpRefContID > 0) {
			minHeight = 79;
		}
		else {
			minHeight = 166;
		}
	}
	else {
		if(id > 0) {
			minHeight = 79;
		}
		else {
			minHeight = 166;
		}
	}

	var galID;
	if(id > 0) {
		galID = id;
	}
	else {
		galID = id.split("comp_");
		galID = galID[1];
	}

	if(dijit.byId("ref_pane_" + tmpRefContID)) {
		var animMinimize = dojo.animateProperty({
			node: dojo.byId("ref_pane_" + tmpRefContID),
			duration: 500,
			properties: {
				height: {
					start: maxHeight,
					end: minHeight
				}
			}
		});

		var minHandle = dojo.connect(animMinimize, "onEnd", function() {
			dojo.removeClass("ref_pane_click_" + tmpRefContID, "ref_pane_click_active");
			dojo.addClass("ref_pane_click_" + tmpRefContID, "ref_pane_click");

			dojo.style("ref_pane_border_" + tmpRefContID, {"height": minHeight + "px"});
			dojo.style("ref_pane_gallery_" + tmpRefContID, {"height": minHeight + "px"});
			dojo.style("gallery_" + tmpRefContID, {"height": "0px", "display": "none"});

			dojo.style("compDetails_" + tmpRefContID, {"visibility": "hidden"});

			if(dojo.byId("pre-thumbs_" + tmpRefContID)) {
				dojo.style("pre-thumbs_" + tmpRefContID, {"display":"block"});
				dojo.style("thumbs_" + tmpRefContID, {"display":"none"});
			}

			recalcSlider(id, animMaximize);

			dojo.disconnect(thumbPrevOver[tmpRefContID]);
			dojo.disconnect(thumbPrevOut[tmpRefContID]);
			dojo.disconnect(thumbNextOver[tmpRefContID]);
			dojo.disconnect(thumbNextOut[tmpRefContID]);
		});
	}

	var animMaximize = dojo.animateProperty({
		node: dojo.byId("ref_pane_" + id),
		duration: 500,
		properties: {
			height: {
				start: minHeight,
				end: maxHeight
			}
		}
	});

	var animMaxBeforeBeginHandle = dojo.connect(animMaximize, "beforeBegin", function() {
		dojo.removeClass("ref_pane_click_" + id, "ref_pane_click");
		dojo.addClass("ref_pane_click_" + id, "ref_pane_click_active");

		dojo.style("ref_pane_border_" + id, {"height": maxHeight + "px"});
		dojo.style("ref_pane_gallery_" + id, {"height": maxHeight + "px"});
		dojo.style("gallery_" + id, {"height": "340px", "display":"block"});

		dojo.style("compDetails_" + id, {"fontSize": "12px", "visibility":"visible"});

		if(dojo.byId("pre-thumbs_" + id)) {
			dojo.style("pre-thumbs_" + id, {"display":"none"});
			dojo.style("thumbs_" + id, {"display":"block"});
		}

		dojo.disconnect(animMaxBeforeBeginHandle);
	});

	var animMaxEndHandle = dojo.connect(animMaximize, "onEnd", function() {
		tmpRefContID = id;
		dijit.byId("ref_pane_" + id).resize();
		var inhaltBox = dojo.byId("inhalt");
		initSlider(inhaltBox.scrollTop);
		dojo.disconnect(animMaxEndHandle);

		getRefBG(id);

		if(dojo.byId("thumbCtrlWrapperPrev_" + galID)) {
			thumbPrevOver[galID] = dojo.connect(dojo.byId("thumbCtrlWrapperPrev_" + galID), "onmouseover", function() {dojo.style("thumbCtrlPrevButton_" + galID, {"display":"block"});});
			thumbPrevOut[galID] = dojo.connect(dojo.byId("thumbCtrlWrapperPrev_" + galID), "onmouseout", function() {dojo.style("thumbCtrlPrevButton_" + galID, {"display":"none"});});
			thumbNextOver[galID] = dojo.connect(dojo.byId("thumbCtrlWrapperNext_" + galID), "onmouseover", function() {dojo.style("thumbCtrlNextButton_" + galID, {"display":"block"});});
			thumbNextOut[galID] = dojo.connect(dojo.byId("thumbCtrlWrapperNext_" + galID), "onmouseout", function() {dojo.style("thumbCtrlNextButton_" + galID, {"display":"none"});});
		}

		recalcSlider(id);
	});

	if(tmpRefContID != id) {
		if (dijit.byId("ref_pane_" + tmpRefContID)) {
			animMinimize.play();
		}
		else {
			recalcSlider(id, animMaximize);
		}
	}
	else {
		if(dijit.byId("ref_pane_" + tmpRefContID)) {
			dojo.disconnect(minHandle);

			minHandle = dojo.connect(animMinimize, "onEnd", function() {
				dojo.removeClass("ref_pane_click_" + tmpRefContID, "ref_pane_click_active");
				dojo.addClass("ref_pane_click_" + tmpRefContID, "ref_pane_click");

				dojo.style("ref_pane_border_" + tmpRefContID, {"height": minHeight +"px"});
				dojo.style("ref_pane_gallery_" + tmpRefContID, {"height": minHeight + "px"});
				dojo.style("gallery_" + tmpRefContID, {"height": "0px", "display": "none"});

				dojo.style("compDetails_" + tmpRefContID, {"visibility": "hidden"});

				if(dojo.byId("pre-thumbs_" + tmpRefContID)) {
					dojo.style("pre-thumbs_" + tmpRefContID, {"display":"block"});
					dojo.style("thumbs_" + tmpRefContID, {"display":"none"});
				}

				if(tmpRefContID == id) {
					var inhaltBox = dojo.byId("inhalt");
					initSlider(inhaltBox.scrollTop);
				}

				dojo.disconnect(minHandle);
				tmpRefContID = -1;
			});

			animMinimize.play();
		}
	}
}

function setRefBackground(image) {
	var ws = dojo.window.getBox();
	var imgNode = dojo.byId("mainBgImg");
	var fadeDuration = "1000";
	//Create a temporary image to trigger onload event
	var tmpImg = dojo.create("img", {
		style: { 
			position: "absolute", 
			left: "0",
			top: "0",
			zIndex: "-20",
			opacity: "0"
		}
	}, dojo.body(), "last");

	dojo.connect(tmpImg, "onload", this, function(event){
		resizeBgImg(tmpImg);
		dojo.fx.combine([
			dojo.fadeOut({
				node: imgNode,
				duration: fadeDuration
			}),
			dojo.fx.chain([
				dojo.fadeIn({
					node: tmpImg,
					duration: fadeDuration,
					onEnd: function() {
						imgNode.src = tmpImg.src;
					}
				}),
				dojo.fadeIn({
					node: imgNode,
					duration: fadeDuration,			// 20.02.2012 mae war: 1
					onEnd: function() {
						dojo.destroy(tmpImg);
						resizeBgImg(imgNode);
					}	
				})
			])
		]).play();
	});

	var bgHeight = ws.h;

	var imgWidth = 2560;
	var imgHeight = 1440;

	var bgAspectRatio = bgHeight / ws.w;

	if(bgAspectRatio > (imgHeight / imgWidth)) {
		calcImgWidth = ((bgHeight / imgHeight) * imgWidth);
		calcImgHeight = bgHeight;
	}
	else {
		calcImgWidth = ws.w;
		calcImgHeight = ((ws.w / imgWidth) * imgHeight);
	}

	if(calcImgWidth > 2560 && calcImgHeight > 1440) {
		calcImgWidth = 2560;
		calcImgHeigth = 1440;
	}
	tmpImg.src = "/inc/imgResize.php?img=" + image + "&w=" + calcImgWidth + "&h=" + calcImgHeight;
}

function recalcSlider(id, animation) {
	var node = dojo.byId("ref_pane_border_" + id);
	var nodePos = dojo.position(node);
	var inhaltBox = dojo.byId("inhalt");
	var inhaltPos = dojo.position(inhaltBox);

	var scrollOffset = getScrollbarOffset();
	var slVal = tmpSlVal = dijit.byId("verticalSlider2").get("value");

	var toScroll = nodePos.y - inhaltPos.y;

	if(dojo.isIE){
		console.log("Internet Explorer " + dojo.isIE);
		scTmp = slVal + toScroll;
	}
	else if (dojo.isFF) {
		scTmp = slVal + toScroll;
	} 
	else if (dojo.isMozilla) {
		console.log("Mozilla " + dojo.isMozilla);
		scTmp = slVal + toScroll;
	} 
	else if (dojo.isOpera) {
		console.log("Opera " + dojo.isOpera);
		scTmp = slVal + toScroll;
	} 
	else if (dojo.isChrome) {
		if((inhaltPos.h + slVal) > scrollOffset) {
			scTmp = (scrollOffset - (inhaltPos.h - nodePos.y)) - 40; // 40px bottom-spacing
		}
		else {
			scTmp = slVal + toScroll;
		}
	}
	else if (dojo.isSafari) {
		scTmp = slVal + toScroll;
	}

	scTmp = Math.abs(scTmp);
	if(scTmp > scrollOffset) {
		scTmp = scrollOffset;
	}

	if(scrollOffset > 0) {
		slVal = scTmp;
	}
	else {
		slVal = 0;
	}

	autoScroll(tmpSlVal, slVal, animation);
}

function autoScroll(tmp, val, animation) {
	var inhaltBox = dojo.byId("inhalt");
	if(tmp != val) {
		if((tmp - 0.5) < val) {
			if((tmp + 400) < val) {
				tmp = val;
			}
			else if((tmp + 50) < val) {
				tmp += 50;
			}
			else if((tmp + 40) < val) {
				tmp += 40;
			}
			else if((tmp + 30) < val) {
				tmp += 30;
			}
			else if((tmp + 20) < val) {
				tmp += 20;
			}
			else if((tmp + 10) < val) {
				tmp += 10;
			}
			else if((tmp + 5) < val) {
				tmp += 5;
			}
			else if((tmp + 1) < val) {
				tmp += 1;
			}
			else {
				tmp = val;
			}
		}
		else if((tmp + 0.5) > val) {
			if((tmp - 400) > val) {
				tmp = val;
			}
			else if((tmp - 50) > val) {
				tmp -= 50;
			}
			else if((tmp - 40) > val) {
				tmp -= 40;
			}
			else if((tmp - 30) > val) {
				tmp -= 30;
			}
			else if((tmp - 20) > val) {
				tmp -= 20;
			}
			else if((tmp - 10) > val) {
				tmp -= 10;
			}
			else if((tmp - 5) > val) {
				tmp -= 5;
			}
			else if((tmp - 1) > val) {
				tmp -= 1;
			}
			else {
				tmp = val;
			}
		}
		else {
			tmp = val;
		}
		inhaltBox.scrollTop = tmp;
		initSlider(inhaltBox.scrollTop);
		setTimeout(function() {
			autoScroll(tmp, val, animation);
		}, 50);
	}
	else {
		inhaltBox.scrollTop = val;
		if(animation) {
			animation.play();
		}
	}
}

function galleryScrollLeft(thumbsID) {
	if(thumbScrollTimer_is_on[thumbsID]) {
		clearTimeout(thumbScrollTimer[thumbsID]);
		thumbScrollTimer_is_on[thumbsID] = 0;	
	}
	if(dojo.byId("thumbs_" + thumbsID).scrollLeft == 0) {
		dojo.disconnect(thumbPrevOver[thumbsID]);
		thumbPrevOver[thumbsID] = null;
		dojo.style("thumbCtrlPrevButton_" + thumbsID, {"display":"none"});
	}
	else {
		dojo.byId("thumbs_" + thumbsID).scrollLeft -= 1; //scroll div to right to show prev img

		if(!imgThumbTimer_is_on) {
			imgThumbTimer = setTimeout("galleryScrollLeft(\'" + thumbsID + "\')", 5);
		}
	}

	if(!thumbNextOver[thumbsID]) {
		thumbNextOver[thumbsID] = dojo.connect(dojo.byId("thumbCtrlWrapperNext_" + thumbsID), "onmouseover", function() {dojo.style("thumbCtrlNextButton_" + thumbsID, {"display":"block"});});
	}
}

function galleryScrollRight(thumbsID) {
	if(thumbScrollTimer_is_on[thumbsID]) {
		clearTimeout(thumbScrollTimer[thumbsID]);
		thumbScrollTimer_is_on[thumbsID] = 0;	
	}

	var maxRight = dojo.byId("thumbs_" + thumbsID).scrollWidth;
	var visibleWidth = dojo.position("thumbs_" + thumbsID);
	var scrollOffset = maxRight - visibleWidth.w;

	if(dojo.byId("thumbs_" + thumbsID).scrollLeft == scrollOffset) {
		dojo.disconnect(thumbNextOver[thumbsID]);
		thumbNextOver[thumbsID] = null;
		dojo.style("thumbCtrlNextButton_" + thumbsID, {"display":"none"});
	}
	else {
		dojo.byId("thumbs_" + thumbsID).scrollLeft += 1; // scroll div to left to show next img

		if(!imgThumbTimer_is_on) {
			imgThumbTimer = setTimeout("galleryScrollRight(\'" + thumbsID + "\')", 5);
		}
	}

	if(!thumbPrevOver[thumbsID]) {
		thumbPrevOver[thumbsID] = dojo.connect(dojo.byId("thumbCtrlWrapperPrev_" + thumbsID), "onmouseover", function() {dojo.style("thumbCtrlPrevButton_" + thumbsID, {"display":"block"});});
	}
}

function calcThumbScrollPos(id, direction) {
	var scrollPos = dojo.byId("thumbs_" + id).scrollLeft;
	var toScroll = scrollPos / 155;	
	var toScrollTmp = Math.ceil(toScroll);
	if(direction == "left") {
		if(scrollPos > 155) {
			toScroll = Math.abs(scrollPos - (toScrollTmp * 155));
			toScroll = 155 - toScroll;
		}
		else {
			toScroll = scrollPos;
		}
	}
	else if(direction == "right") {
		if(scrollPos > 0) {
			toScroll = Math.abs(scrollPos - (toScrollTmp * 155));
			toScroll = toScroll * (-1);
		}
		else {
			toScroll = scrollPos;
		}
	}

	var scrollEnd = dojo.byId("thumbs_" + id).scrollLeft - toScroll;
	autoScrollThumbs(id, scrollEnd, direction);
}

function autoScrollThumbs(id, scrollEnd, direction) {
	if(dojo.byId("thumbs_" + id)) {
		if(dojo.byId("thumbs_" + id).scrollLeft != scrollEnd) {
			if(direction == "left") {
				dojo.byId("thumbs_" + id).scrollLeft -= 1;
			}
			else if(direction == "right") {
				dojo.byId("thumbs_" + id).scrollLeft += 1;
			}
			if(!thumbScrollTimer_is_on[id]) {
				thumbScrollTimer_is_on[id] = 1;
			}
			thumbScrollTimer[id] = setTimeout(function() {
					autoScrollThumbs(id ,scrollEnd, direction);
					}, 5);
		}
		else {
			if(thumbScrollTimer_is_on[id]) {
				thumbScrollTimer_is_on[id] = 0;
				clearTimeout(thumbScrollTimer[id]);
			}
		}
	}
}

function showThumbInSlide(galleryID, index) {
	if(dijit.byId('gallery_' + galleryID)) {
		dijit.byId('gallery_' + galleryID).showImage(index);
	}

	if(tmpRefContID != galleryID) {
		showRefDetails(galleryID, dojo.position("thumbSlide_img_" + galleryID + "_0").h);
	}
}

function fadeRefListImg(img, fade) {
	var colorImg = img.replace(/_gray/, "");
	if(fade == "out") {
		dojo.fadeOut({
node: img,
duration: 200,
onBegin: function() {
dojo.style(colorImg, {"display":"block"});
}
}).play();
}
else if(fade == "in") {
	dojo.fadeIn({
node: img,
duration: 200
}).play();
}
}

function switchContent(content, menuCategory) {
	var siteRef = "";
	var refTmpLink = "";

	if(!contentOpen) {
		einBlenden();
	}

	var ref = content.split("_");
	if(ref.length > 2) {
		content = ref[0] + "_" + ref[1];
		siteRef = ref[2];
	}


	dijit.byId('inhalt').selectChild(content);
	dojo.byId('inhalt').scrollTop = 0;

	if(content == 'about' && !about_is_loaded) {
		var tmpConnect = dojo.connect(dijit.byId(content), 'onDownloadEnd', function() {
				initSlider(0);
				dojo.disconnect(tmpConnect);
				});
		dijit.byId(content).set('href', content + ".php");
		setHashAndTitle('Team');
		about_is_loaded = 0;
	}
	else if(content == 'presse' && !presse_is_loaded) {
		var tmpConnect = dojo.connect(dijit.byId(content), 'onDownloadEnd', function() {
				var ws = dojo.window.getBox();
				var psMenu = dojo.position('menuContentPane');
				var psTitle = dojo.position('titleContainer');
				var inhaltPos = dojo.position('inhalt');
				var movePosStart = "9";
				var topShadowPadding = "25";
				var bottomSpacing = "40";
				var hInhalt = ws.h - psMenu.h - psTitle.h - movePosStart - topShadowPadding - bottomSpacing;
				var posLeft = (inhaltPos.x + inhaltPos.w) - 645;

				dojo.style("press_paper_background", {"height": hInhalt + "px", "left": posLeft + "px", "top": (ws.h - psMenu.h)});
				dojo.animateProperty({
node: dojo.byId("press_paper_background"),
duration: 400,
properties: {
top: { end: 130, start: (ws.h - psMenu.h), units: "px"}
}
}).play();
initSlider(0);
dojo.disconnect(tmpConnect);
});
dijit.byId(content).set('href', content + ".php");
setHashAndTitle('Presse');
presse_is_loaded = 1;
}
else if(content == 'designprozess' && !design_is_loaded) {
	var tmpConnect = dojo.connect(dijit.byId(content), 'onDownloadEnd', function() {
			initSlider(0);
			dojo.disconnect(tmpConnect);
			});
	dijit.byId(content).set('href', content + ".php");
setHashAndTitle('Designprozess');
	design_is_loaded = 0;
}
else if(content == '2d' && !zweid_is_loaded) {
	var tmpConnect = dojo.connect(dijit.byId(content), 'onDownloadEnd', function() {
			initSlider(0);
			dojo.disconnect(tmpConnect);
			});
	dijit.byId(content).set('href', content + ".php");
	setHashAndTitle('Zwei-d-design');
	zweid_is_loaded = 0;
}
else if(content == '3d' && !dreid_is_loaded) {
	var tmpConnect = dojo.connect(dijit.byId(content), 'onDownloadEnd', function() {
			initSlider(0);
			dojo.disconnect(tmpConnect);
			});
	dijit.byId(content).set('href', content + ".php");
	setHashAndTitle('Drei-d-design');
	dreid_is_loaded = 0;
}
else if(content == '2d_referenzen' && !ref2d_is_loaded) {
	getReferenceElements("2d");
	initSlider(0);
	setHashAndTitle('2D_Referenzen');
	ref2d_is_loaded = 0;
}
else if(content == '3d_referenzen' && !ref3d_is_loaded) {
	getReferenceElements("3d");
	initSlider(0);
	setHashAndTitle('3D_Referenzen');
	ref3d_is_loaded = 0;
}
else if(content == 'kompetenzen' && !comp_is_loaded) {
	var tmpConnect = dojo.connect(dijit.byId(content), 'onDownloadEnd', function() {
			initCompetenceList();
			initSlider(0);
			dojo.disconnect(tmpConnect);
			});
	setHashAndTitle('Kompetenzen');
	comp_is_loaded = 0;
}	
else if(content == 'kontakt' && !kontakt_is_loaded) {
	var tmpConnect = dojo.connect(dijit.byId(content), 'onDownloadEnd', function() {
			initSlider(0);
			dojo.disconnect(tmpConnect);
			});
	dijit.byId(content).set('href', content + ".php");
	setHashAndTitle('Kontakt');
	kontakt_is_loaded = 0;
}
else if(content == 'impressum' && !impress_is_loaded) {
	var tmpConnect = dojo.connect(dijit.byId(content), 'onDownloadEnd', function() {
			initSlider(0);
			dojo.disconnect(tmpConnect);
			});
	dijit.byId(content).set('href', content + ".php");
	setHashAndTitle('Impressum');
	impress_is_loaded = 0;
}
else if(content == 'aktuelles' && !aktuelles_is_loaded) {
	var tmpConnect = dojo.connect(dijit.byId(content), 'onDownloadEnd', function() {
			initSlider(0);
			dojo.disconnect(tmpConnect);
			});
	dijit.byId(content).set('href', content + ".php");
	setHashAndTitle('Aktuelles');
	aktuelles_is_loaded = 0;
}
else if(content == 'angebote') {
	var tmpConnect = dojo.connect(dijit.byId(content), 'onDownloadEnd', function() {
			initSlider(0);
			dojo.disconnect(tmpConnect);
			});
	dijit.byId(content).set('href', content + ".php");
	setHashAndTitle('Angebote');
}
else if(content == 'agentur' && !agentur_is_loaded) {
	var tmpConnect = dojo.connect(dijit.byId(content), 'onDownloadEnd', function() {
			initSlider(0);
			dojo.disconnect(tmpConnect);
			});
	dijit.byId(content).set('href', content + ".php");
	setHashAndTitle('Agentur');
	agentur_is_loaded = 0;
}

//if(gaTracker.tracker) {
if(gaTrackerReady) {
	try {
		//gaTracker.trackPageView("/" + content);
		_gaq.push(['_trackPageview', content]);
	}
	catch(e) {
		console.debug(e);
	}
}

/*dijit.byId('inhalt').selectChild(content);
  dojo.byId('inhalt').scrollTop = 0;*/
initSlider(0);

var mainLinkID = "m" + content;
var menuCategoryID = "m" + menuCategory;

if(oldMainLinkID != mainLinkID) {
	dojo.addClass(mainLinkID, "menuItemSelected");
	dojo.removeClass(oldMainLinkID, "menuItemSelected");
	refTmpLink = oldMainLinkID;
	oldMainLinkID = mainLinkID;
}

var subSelected = dojo.query(".slideup > .menuItemSelected > a");
var menuActiveBlock = dojo.byId("menuActiveBlock");
if(subSelected[0]) {
	var itemText = subSelected[0].innerHTML;
	var catPos;
	catPos = dojo.position(menuCategoryID);
	var wipeOut = dojo.fx.wipeOut({node: menuActiveBlock, duration: 250});
	dojo.connect(wipeOut, "onEnd", function() {
			menuActiveBlock.innerHTML = "<span>" + itemText + "</span>";
			dojo.style(menuActiveBlock, {"left":catPos.x + "px"});
			dojo.fx.wipeIn({node: menuActiveBlock, duration: 250}).play();
			});
	wipeOut.play();
	subMenuActive = 1;
}
else {
	var wipeout = dojo.fx.wipeOut({node: menuActiveBlock, duration: 250}).play();
	subMenuActive = 0;
}

if(menuCategory != tmpMenuCategory) {
	if(menuCategory == "agentur" || menuCategory == "kontakt" || menuCategory == "impressum") {
		images = bgImages.agentur;
	}
	else if(menuCategory == "2d") {
		images = bgImages.zweid;
	}
	else if(menuCategory == "3d") {
		images = bgImages.dreid;
	}
	else {
		images = bgImages.agentur;
	}
	if(images) {
		var randNr = Math.floor(Math.random() * images.length);
		setBgImgList(images, randNr);
		changeBgImages(images[randNr], 0);
	}
	tmpMenuCategory = menuCategory;
}

if(siteRef != "") {
	showRefDetails(siteRef);
}
}

function prepareElementsStore() {
	dojo.xhrGet( {
        url: "inc/db.php",
        handleAs: "json",
        timeout: 30000, // Time in milliseconds
        
        load: function(response, ioArgs) {
			competenceStore = new dojo.data.ItemFileWriteStore({data: response});
			//getReferenceElements();
			//initCompetenceList();
            return response; 
        },
        error: function(response, ioArgs) { 
            return response;
        },
        content: {action:"getCompetenceElements"}
	});	
}

function initCompetenceList() {
	//Fetch the data.
    competenceStore.fetch({
        query: {
            kompetenz: /\w+/
        },
        onComplete: gotInitCompItems,
        onError: fetchFailed,
        queryOptions: {
            deep: true,
            ignoreCase: true
        }
    });
}

function gotInitCompItems(items, request) {
	for (i = 0; i < items.length; i++) {
    	var item = items[i];
    	dojo.byId("competences_list").innerHTML += '<li id="'+ item.id +'"><a href="#" onClick="setCompetenceDetails(\'' + item.id +'\',\'' + item.kompetenz + '\'); return false;">' + item.kompetenz +'</a></li>';
	}
	
	var initialCompetence = competenceStore.getValue(items[0], "kompetenz");
	var initialID = competenceStore.getValue(items[0],"id");
	setCompetenceDetails(initialID, initialCompetence);
}

function searchCompList(query) {
	var testArr = new Array();
    //Fetch the data.
    competenceStore.fetch({
        query: {
            kompetenz: query
        },
        onItem: gotCompetenceElementsTemp,
        onComplete: function(items, request) {
        	competenceStore.fetch({
                query: {
                    extKompetenz: query
                },
                onItem: gotExtCompetenceElementsTemp,
                onComplete: function(extItems, request) {
                	gotCompetenceElementsList(testArr, request.query.extKompetenz);
                },
                onError: fetchFailed,
                queryOptions: {
                    deep: true,
                    ignoreCase: true
                }
            });
        },
        onError: fetchFailed,
        queryOptions: {
            deep: true,
            ignoreCase: true
        }
    });
    

    function gotCompetenceElementsTemp(item, request) {
    	dojo.forEach(item.children, function(entry) {
    		testArr.push(entry);
    	});
    }
    
    function gotExtCompetenceElementsTemp(item, request) {
    	testArr.push(item);
	}
    
    function gotCompetenceElementsList(items, query) {
    	items.sort(function (a, b) {
			return a.kunde[0].toLowerCase().localeCompare(b.kunde[0].toLowerCase());
		});
    	
    	var exampleList = "<ul class='competence_list'>";
    	var content = "";
    	
    	var itemNameMap = {imageLargeAttr: "bild"};
    	var requestImg = {query: {}, count: 5};
    	var imageStores = new Array();

    	dojo.forEach(items, function(entry){
    		var item = entry;
    		var tmpKunde = "";
       		var imgItems = new Array();
           	for(var index = 0; index < item.children.length; index++) {
           		 imgItems.push({id: item.children[index].id[0], bild: item.children[index].bild[0], title: item.children[index].title[0]});
           	}
   			var imageItemStore = new dojo.data.ItemFileWriteStore({data: {items: imgItems}});
   			imageStores.push({id: item.pID[0], itemStore: imageItemStore});
    					
   			var kunde = item.kunde[0];
   			if(kunde != tmpKunde) {
   				exampleList += "<li><a href='#' onClick='showExampleDetails(\"comp_" + item.pID[0] + "\", 166); return false;'>" + item.kunde[0] + "</a></li>";
   				tmpKunde = kunde;
   			}
      					
       		content += '<hr class="competence_dottedLine">' +
       		'<div id="ref_pane_comp_' + item.pID[0] + '" class="competence_pane" dojoType="dijit.layout.ContentPane">' +
       		'	<div id="ref_pane_border_comp_' + item.pID[0] + '" class="ref_pane_border" dojoType="dijit.layout.BorderContainer" gutters="false">' +
       		'		<div class="ref_pane_txt_wrap" dojoType="dijit.layout.ContentPane" region="left">' +
       		'			<div id="ref_pane_click_comp_' + item.pID[0] + '" class="ref_pane_click" onClick="showRefDetails(\'comp_' + item.pID[0] + '\', \'166\'); return false;">' +
       		'				<div id="compName_comp_' + item.pID[0] + '" class="ref_compName">' +
       		'					<b>' + item.kunde[0] + '</b>' + 
       		'					<br>' +
       							item.projekt[0] +
       		'				</div>' +
       		'			</div>' +
       		'			<div class="ref_txt_line"></div>' +
    		'			<div id="compEffortsList_comp_' + item.pID[0] + '" class="ref_compEffortsList">' +
       		'				<table class="ref_compEffortsListTable">' +
       		'					<tr>' +
       		'						<td style="vertical-align: top; width: 50%;">' +
       		'							<ul id="ref_effortsListLeft_comp_' + item.pID[0] + '" class="ref_compEffortsListLeft">' +
       		'								<li id="effortsList_comp_' + item.pID[0] + '_' + item.leistung[0] + '" class="ref_compEffortsListHighlight">' + item.leistung[0] + '</li>';
       										for(var i=1; i < (item.leistung.length/2); i++) {
       											content += '<li id="effortsList_comp_' + item.pID[0] + '_' + item.leistung[i] + '">' + item.leistung[i] + '</li>';
       										}
       		content	+= '				</ul>' +
       		'						</td>' +
       		'						<td style="vertical-align: top;">' +
       		'							<ul id="ref_effortsListLeft_comp_' + item.pID[0] + '" class="ref_compEffortsListRight">';
       										for(var i = Math.ceil(item.leistung.length / 2); i < item.leistung.length; i++) {
       											content += '<li id="effortsList_comp_' + item.pID[0] + '_' + item.leistung[i] + '">' + item.leistung[i] + '</li>';
       										}		
       		content += '				</ul>' +
       		'						</td>' +
       		'					</tr>' +
       		'				</table>' +
       		'			</div>' +
       		'			<div id="compDetails_comp_' + item.pID[0] + '" class="ref_compDetails">' +
       		'				<div id="compEffortsTxt_comp_' + item.pID[0] + '">' +
       		'					<input type="hidden" id="compEffortsListID_comp_' + item.pID[0] + '" value="' + item.pID[0] + '_0">';
								content += '<div id="compEffortsText_comp_' + item.pID[0] + '">' + item.children[0].text + '</div>';
			content += '	</div>' +
       		'			</div>' +
       		'		</div>' +
       		'		<div id="ref_pane_gallery_comp_' + item.pID[0] + '" class="competence_pane_gallery" dojoType="dijit.layout.ContentPane" region="center">' +
       		'			<div id="gallery_comp_' + item.pID[0] + '" class="ref_gallery" dojoType="dojox.image.SlideShow" imageWidth="605" imageHeight="340" pageSize="50" autoLoad="false" slideshowInterval="5" fixedHeight="true" style="padding-bottom: 15px;"></div>' +
       		'			<div id="pre-thumbs_comp_' + item.pID[0] + '" class="competence_thumbs">';
       					
       		content += '<img id="thumbSlide_img_comp_' + item.pID[0] + '_' + 0 + '" src="' + item.children[0].bild + '" class="competence_pre-thumbSlide_img" onClick="showThumbInSlide(\'comp_' + item.pID[0] + '\',' + 0 + '); return false;">';
       		content += '<span style="padding-right: 15px; margin: 0px;"></span>';
       					var compExIsSet = 0;
   						if(query == item.competence[0]) {
   							for(var  j = 1; j < item.children.length; j++) {
   								if(item.children[j].kompetenz_beispiel == 1) {
   									content += '<img id="thumbSlide_img_comp_' + item.pID[0] + '_' + j + '" src="' + item.children[j].bild + '" class="competence_pre-thumbSlide_img" onClick="showThumbInSlide(\'comp_' + item.pID[0] + '\',' + j + '); return false;">';
   									compExIsSet = 1;
   									break;
   								}
   							}
   						}
       					else {
       						for(var  j = 0; j < item.extKompetenz.length; j++) {
       							if(item.extKompetenz[j] == query) {
           							content += '<img id="thumbSlide_img_comp_' + item.pID[0] + '_' + j + '" src="' + item.children[j].bild + '" class="competence_pre-thumbSlide_img" onClick="showThumbInSlide(\'comp_' + item.pID[0] + '\',' + j + '); return false;">';
           							compExIsSet = 1;
           							break;
           						}
       						}
       					}
       					if(compExIsSet == 0) {
       						content += '<img id="thumbSlide_img_comp_' + item.pID[0] + '_' + 1 + '" src="' + item.children[1].bild + '" class="competence_pre-thumbSlide_img" onClick="showThumbInSlide(\'comp_' + item.pID[0] + '\',' + 1 + '); return false;">';
       					}

       		content += '</div>' +
       		'			<div id="thumbs_comp_' + item.pID[0] + '" class="ref_thumbs" style="display: none;">';
       						if(item.children.length > 4) {
       							content += '<div id="thumbCtrlWrapperPrev_comp_' + item.pID[0] + '" class="thumbCtrlWrapper thumbCtrlWrapperPrev">' +
       		'						<div id="thumbCtrlPrevButton_comp_' + item.pID[0] + '" class="thumbCtrlPrev" onMouseOver="galleryScrollLeft(\'comp_' + item.pID[0] + '\');" onMouseOut="calcThumbScrollPos(\'comp_' + item.pID[0] +'\', \'left\'); clearTimeout(imgThumbTimer);"></div>' +
       		'					</div>' +
       								
       		'					<div id="thumbCtrlWrapperNext_comp_' + item.pID[0] + '" class="thumbCtrlWrapper thumbCtrlWrapperNext">' +
       		'						<div id="thumbCtrlNextButton_comp_' + item.pID[0] + '" class="thumbCtrlNext" onMouseOver="galleryScrollRight(\'comp_' + item.pID[0] + '\');" onMouseOut="calcThumbScrollPos(\'comp_' + item.pID[0] +'\', \'right\'); clearTimeout(imgThumbTimer);"></div>' +
       		'					</div>';
       						}
       						for(var j = 0; j < item.children.length; j++) {
       							content += '<img id="thumbSlide_img_comp_' + item.pID[0] + '_' + j + '" src="' + item.children[j].bild + '" class="ref_thumbSlide_img" onClick="showThumbInSlide(\'comp_' + item.pID[0] + '\',' + j + '); return false;">';
       							if(j < (item.children.length - 1)) {
       								content += '<span style="padding-right: 15px; margin: 0px;"></span>';
       							}
       						}
       		content += '</div>' +
       		'		</div>' +
       		'	</div>' +
       		'</div>';
        });
        
    	exampleList += "</ul>";
    	
    	dojo.byId("competence_examples").innerHTML = exampleList; 
    	dijit.byId("compRefList").set("content", content);
    	
    	dojo.forEach(items, function(entry) {
    		if(entry.children.length > 4) {
    			thumbPrevOver["comp_" + entry.pID[0]] = dojo.connect(dojo.byId("thumbCtrlWrapperPrev_comp_" + entry.pID[0]), "onmouseover", function() {dojo.style("thumbCtrlPrevButton_comp_" + entry.pID[0], {"display":"block"});});
    			dojo.connect(dojo.byId("thumbCtrlWrapperPrev_comp_" + entry.pID[0]), "onmouseout", function() {dojo.style("thumbCtrlPrevButton_comp_" + entry.pID[0], {"display":"none"});});
    			thumbNextOver["comp_" + entry.pID[0]] = dojo.connect(dojo.byId("thumbCtrlWrapperNext_comp_" + entry.pID[0]), "onmouseover", function() {dojo.style("thumbCtrlNextButton_comp_" + entry.pID[0], {"display":"block"});});
    			dojo.connect(dojo.byId("thumbCtrlWrapperNext_comp_" + entry.pID[0]), "onmouseout", function() {dojo.style("thumbCtrlNextButton_comp_" + entry.pID[0], {"display":"none"});});
    		}
    	});
    	
    	for(var i = 0; i < imageStores.length; i++) {
    		if(dijit.byId('gallery_comp_' + imageStores[i].id)) {
    			dijit.byId('gallery_comp_' + imageStores[i].id).setDataStore(imageStores[i].itemStore, requestImg, itemNameMap);
    			
    			dojo.connect(dijit.byId("gallery_comp_" + imageStores[i].id), "_setTitle", function() {
    				var id = this.id;
    				id = id.split("gallery_comp_");
    				id = id[1];
    				
    				var titleSubscribe = dojo.subscribe(dijit.byId(this.id).getShowTopicName(), function(packet) {
    					dojo.unsubscribe(titleSubscribe);
    					titleSubscribe = "";
    					
    					var imgContext = dijit.byId("gallery_comp_" + id).imageStore._arrayOfAllItems[packet.index].title[0].split(/##/);
        				var imgTitle = imgContext[0];
        				var imgText = imgContext[1];
    					
        				var imgId = dijit.byId("gallery_comp_" + id).imageStore._arrayOfAllItems[packet.index].id;
        				dojo.byId("compEffortsListID_comp_" + id).value = imgId + "_" + packet.index;
    			
        				dojo.byId("compEffortsText_comp_" + id).innerHTML = imgText;
        				
        				dojo.query("#compEffortsList_comp_" + id + " .ref_compEffortsListHighlight").removeClass("ref_compEffortsListHighlight");
        				dojo.addClass("effortsList_comp_" + id + "_" + imgTitle, "ref_compEffortsListHighlight");
    				});
    			});
    		}
    	}

    	initSlider(dijit.byId("verticalSlider2").get("value"));
    }
}

//Callback for if the lookup fails.
function fetchFailed(error, request) {
    alert("lookup failed. " + request + " " + error);
}

function getReferenceElements(ref) {
//	var refProperty = new Array('2d','3d');
	
//	dojo.forEach(refProperty, function(entry){
		  competenceStore.fetch({
		       	query: {
  //          			reference: entry
				reference: ref
	        	},
        		onComplete: gotReferenceElements,
	        	onError: fetchFailed,
        		queryOptions: {
            			deep: true,
		            	ignoreCase: true
        		}
    		});
//	});
}

function gotReferenceElements(items, request) {
	var content = "";
	var itemNameMap = {imageLargeAttr: "bild"};
	var requestImg = {query: {}, count: 5};
	var imageStores = new Array();
	var imgRefOverviewItems = new Array();
	
	items.sort(function () { return Math.floor(Math.random()*3)-1; });
	
    for (var i = 0; i < items.length; i++) {
    	var item = items[i];
    	var imgItems = new Array();
    	for(var index = 0; index < item.children.length; index++) {
    		 imgItems.push({id: item.children[index].id[0], bild: item.children[index].bild[0], title: item.children[index].title[0]});
    	}
    	
    	var grayscaleImg = item.children[0].bild[0].replace(/Projekt\/(\w.*-\d+)\.jpg/, 'Projekt/grayscale/$1-gray.jpg');
    	imgRefOverviewItems.push({id: item.children[0].id[0], bild: item.children[0].bild[0], grayscale: grayscaleImg});
    	
		var imageItemStore = new dojo.data.ItemFileWriteStore({data: {items: imgItems}});
		imageStores.push({id: item.pID[0], itemStore: imageItemStore});
		
    	if(i > 0 && i < items.length) {
    		content += '<hr class="competence_dottedLine">';
    	}
    		
    	content +=  '<div id="ref_pane_' + item.pID[0] + '" class="ref_pane" dojoType="dijit.layout.ContentPane">' +
    			'	<div id="ref_pane_border_' + item.pID[0] + '" class="ref_pane_border" dojoType="dijit.layout.BorderContainer" gutters="false">' +
    			' 		<div class="ref_pane_txt_wrap" dojoType="dijit.layout.ContentPane" region="left">' +
    			' 			<div id="ref_pane_click_' + item.pID[0] + '" class="ref_pane_click" onClick="showRefDetails(' + item.pID[0] + ', \'79\'); return false;">' +
    			' 				<div id="compName_' + item.pID[0] + '" class="ref_compName">' +
			'					<b>' + item.kunde + '</b>' +
			'					<br>' +
								item.projekt +
			'				</div>' +
			'			</div>' +
			'			<div id="compDetails_' + item.pID[0] + '" class="ref_compDetails">' +
			'				<div class="ref_txt_line"></div>' +
			'				<div id="compEffortsList_' + item.pID[0] + '" class="ref_compEffortsList">' +
			'					<table class="ref_compEffortsListTable">' +
			'						<tr>' +
			'							<td style="vertical-align: top; width: 139px; margin: 0; padding: 0;">' +
			'								<ul id="ref_effortsListLeft_' + item.pID[0] + '" class="ref_compEffortsListLeft">' +
			'									<li id="effortsList_' + item.pID[0] + '_' + item.leistung[0] + '" class="ref_compEffortsListHighlight">' + item.leistung[0] + '</li>';
    			for(var j = 1; j < (item.leistung.length / 2); j++) {
    				content += '<li id="effortsList_' + item.pID[0] + '_' + item.leistung[j] + '">' + item.leistung[j] + '</li>';
    			}
    	content +=  '								</ul>' +
			'							</td>' +
			'							<td style="vertical-align: top; width: 139px; margin: 0; padding: 0;">' +
			'								<ul id="ref_effortsListRight_' + item.pID[0] + '" class="ref_compEffortsListRight">';
			for(var j = Math.ceil(item.leistung.length / 2); j < item.leistung.length; j++) {
				content += '<li id="effortsList_' + item.pID[0] + '_' + item.leistung[j] + '">' + item.leistung[j] + '</li>';
			}		
	content +=  '								</ul>' +
			'							</td>' +
			'						</tr>' +
			'					</table>' +
			'				</div>' +
			'				<div id="compEffortsTxt_' + item.pID[0] + '">' +
			'					<input type="hidden" id="compEffortsListID_' + item.pID[0] + '" value="' + item.pID[0] + '_0">';
	content += '<div id="compEffortsText_' + item.pID[0] + '">' + item.children[0].text + '</div>';
	content +=	'				</div>' +
			'			</div>' +
			'		</div>' +
			'		<div id="ref_pane_gallery_' + item.pID[0] + '" class="ref_pane_gallery" dojoType="dijit.layout.ContentPane" region="center">' +
			'			<div id="gallery_' + item.pID[0] + '" class="ref_gallery" dojoType="dojox.image.SlideShow" imageWidth="605" imageHeight="340" pageSize="50" autoLoad="false" slideshowInterval="5" fixedHeight="true" titleAttr="-" style="padding-bottom: 15px; margin:0;"></div>' +
			'			<div id="thumbs_' + item.pID[0] + '" class="ref_thumbs">';
			if(item.children.length > 4) {
				content +=  '<div id="thumbCtrlWrapperPrev_' + item.pID[0] + '" class="thumbCtrlWrapper thumbCtrlWrapperPrev">' +
				'	<div id="thumbCtrlPrevButton_' + item.pID[0] + '" class="thumbCtrlPrev thumbCtrlHide" onMouseOver="galleryScrollLeft(' + item.pID[0] + ');" onMouseOut="calcThumbScrollPos(' + item.pID[0] + ', \'left\'); clearTimeout(imgThumbTimer);"></div>' +
				'</div>' +
						
				'<div id="thumbCtrlWrapperNext_' + item.pID[0] + '" class="thumbCtrlWrapper thumbCtrlWrapperNext">' +
				'	<div id="thumbCtrlNextButton_' + item.pID[0] + '" class="thumbCtrlNext thumbCtrlHide" onMouseOver="galleryScrollRight(' + item.pID[0] + ');" onMouseOut="calcThumbScrollPos(' + item.pID[0] + ', \'right\'); clearTimeout(imgThumbTimer);"></div>' +
				'</div>';
			}

			for(var j = 0; j <  item.children.length; j++) {
				content += '<img id="thumbSlide_img_' + item.pID[0] + '_' + j + '" src="' + item.children[j].thumb + '" class="ref_thumbSlide_img" onClick="showThumbInSlide(' + item.pID[0] + ',' + j + '); return false;">';
				if(j < ( item.children.length - 1)) {
					content += '<span style="padding-right: 15px; margin: 0px;"></span>';
				}
			}		
	content +=  '			</div>' + 
			'		</div>' +
			'	</div>' +
			'</div>';
    }

    dijit.byId(request.query.reference + "_referenzen").set("content", content);
   	
	for(var i = 0; i < imageStores.length; i++) {
		if(dijit.byId('gallery_' + imageStores[i].id)) {
			dijit.byId('gallery_' + imageStores[i].id).setDataStore(imageStores[i].itemStore, requestImg, itemNameMap);
			
			dojo.connect(dijit.byId("gallery_" + imageStores[i].id), "_setTitle", function() {
				var id = this.id;
				id = id.split("gallery_");
				id = id[1];
				
				var titleSubscribe = dojo.subscribe(dijit.byId(this.id).getShowTopicName(), function(packet) {
					dojo.unsubscribe(titleSubscribe);
					titleSubscribe = "";
					
	    				var imgContext = dijit.byId("gallery_" + id).imageStore._arrayOfAllItems[packet.index].title[0].split(/##/);
    					var imgTitle = imgContext[0];
    					var imgText = imgContext[1];
    				
    					var imgId = dijit.byId("gallery_" + id).imageStore._arrayOfAllItems[packet.index].id;
	    				dojo.byId("compEffortsListID_" + id).value = imgId + "_" + packet.index;
    				
    					dojo.byId("compEffortsText_" + id).innerHTML = imgText;
    					//dijit.byId("compEffortsText_" + id).set("value", imgText);
    				
    					dojo.query("#compEffortsList_" + id + " .ref_compEffortsListHighlight").removeClass("ref_compEffortsListHighlight");
	    				if(dojo.byId("effortsList_" + id + "_" + imgTitle)) {
    						dojo.addClass("effortsList_" + id + "_" + imgTitle, "ref_compEffortsListHighlight");
    					}
				});
			});
		}
	}
}

function getRefBG(id) {
	var id = id.toString();
	id = id.replace(/comp_/, "");

	competenceStore.fetch({
		query: {
	        	pID: id
		},
	        onComplete: gotRefBG,
        	onError: fetchFailed,
	        queryOptions: {
			deep: true,
        	    ignoreCase: true
	        }
	});

	function gotRefBG(items, request) {
		setRefBackground(items[0].background[0]);
	}
}

function submitContactForm() {
	dojo.xhrPost({
		form: "contact_form",
		url: "inc/submitContactForm.php",
		handleAs: "json",
		timeout: 10000, // Time in milliseconds

		load: function(response, ioArgs) {
			if(response.success) {
				dijit.byId("contact_form").reset();
				alert("Nachricht gesendet!");
			}
			else {
				alert("Nachricht nicht gesendet!");
			}
			return response; 
		},
		error: function(response, ioArgs) { 
			return response;
		}
	});
}