window.addEvent('domready', function() {

	// initialize page and sitecontentdiv
	var contentSlide = new Fx.Slide('content-box', {mode: 'horizontal'});		
	var contentSlideDiv = $('page').getElements('div[class=content]');
	var contentRight = $('content-right');
		contentRight.setStyle('opacity', '0');
	
	// initialize navigation elements
	var navElements = $$('#page .nav a');
	var quickNavElements = $('bottom').getElements('a[class=moofoo]');
	
	// initialize pictures on the right
	var navPics = $('pics').getElements('img');
		navPics.setStyle('opacity', '0.0');
		$('pic-start').setStyle('opacity', '1.0');
	
	// set some options
	var delayTime = 400;
	
	// hide slider, add events to buttons
	contentSlide.hide();
	addMouseEvents();
 	
	// if page anchor is transmitted, open it
	var anchorURI = window.location.hash;
	if(anchorURI != "") {
		loadAjaxContent(anchorURI.substr(1, anchorURI.length), $('content-right'), function() {
			navPics.fade(0);
			contentRight.fade(1.0);	
			contentSlideDiv.setStyle('left', '0');
		});
	}


	// *** FUNCTIONS ***
	 	
	// adds action events to all clickable elements
	function addMouseEvents() {
			
			// mouseovereffekt for nav elements
			navElements.addEvent('mouseover', function () {
				this.getElements('img').setProperty('src', 'imgs/nav/' + this.getProperty('rel') + '-hover-trans.png');		
			});
			
			// mouseleaveeffekt for nav elements
			navElements.addEvent('mouseleave', function () {
				this.getElements('img').setProperty('src', 'imgs/nav/' + this.getProperty('rel') + '-trans.png');		
			});
			
			// set clickevents on main nav
			navElements.addEvent('click', function () {
								
				// if picture ist not visible, make it visible
				if(navPics.getStyle('opacity') == 0) {
					navPics.fade(1.0);
					contentRight.set('text', '');
				}
								
				// if slide is not there, just load and slide in
				if(contentSlide.open == false) {
					loadAjaxContent(this.getProperty('rel'), $('content-box'), function() {
						contentSlideDiv.setStyle('left', '50%');
						contentSlideDiv.setStyle('border', '0px solid black');
						contentSlide.slideIn();
					});
					
				} 
				
				if(contentSlide.open == true) {
					
					contentSlide.slideOut();
					contentSlide.addEvent('complete', function() {
						loadAjaxContent(this.getProperty('rel'), $('content-box'), function() {
							contentSlideDiv.setStyle('left', '50%');
							contentSlide.slideIn();
							contentSlide.removeEvents('complete');
						});
					}.bind(this));
					
				}

			});
			

			quickNavElements.addEvent('click', function () {
								
				// if there is already a content on the right, do fade effect
				if(contentRight.getStyle('opacity') > 0) {
					contentRight.setStyle('opacity', '0');	
				}
				
				// if slide is not there, just load content
				if(contentSlide.open == false) {
					loadAjaxContent(this.getProperty('rel'), $('content-right'), function() {
							contentSlideDiv.setStyle('left', '0');
							navPics.fade(0);
							contentRight.fade(1.0);
					});	
				} 
				
				// if slide is open, close it first
				if(contentSlide.open == true) {
					
					contentSlide.slideOut();
					contentSlide.addEvent('complete', function() {
						loadAjaxContent(this.getProperty('rel'), $('content-right'), function() {
							contentSlideDiv.setStyle('left', '0');
							navPics.fade(0);
							contentRight.fade(1.0);
							contentSlide.removeEvents('complete');
						});
					}.bind(this));
				}
				
			});

	}
	 
	// loads content into specified div 
	function loadAjaxContent(name, target, doAfter) {
		
		var req = new Request.HTML({url:"php/" + name + ".php", 
			onSuccess: function(html) {
				target.set('text', '');
				target.adopt(html);
				addScripts(target, name);
				doAfter();
			},
			onFailure: function() {
				alert('The request failed.');
			}
		}).send();
		
		return true;

	} 
	
	// searches for links in ajax content and gives them events
	function addScripts(target, pagename) {
		
		// if ajax content is portfolio add addition functionality
		if(pagename == "portfolio") {
			updatePortfolio();
			$$('#referenzen .portfolio-navigation a.active').fireEvent('click');
		}
		
		// if ajax content is location map, load the map
		if(pagename == "anfahrt") {
			loadGoogleMap();	
		}
		
		// if ajax content ist contactform, add the functionality
		if(pagename == "kontaktformular") {
			$('formular').addEvent('submit', function(e) {
				//Prevents the default submit event from loading a new page.
				e.stop();
				this.set('send', {onComplete: function(response) { 
					$('kontaktformular').set('html', response);
					addScripts(target, "kontaktformular");
				}});
				//Send the form.
				this.send();
			});
		}
		
		// is ajax content usual content, just add the click events
		if(pagename != "portfolio" && pagename.contains('portfolio') == false) {
			
			var links = target.getElements('a');
			links.addEvent('click', function() {
				contentSlide.slideOut();
				contentSlide.addEvent('complete', function() {
					loadAjaxContent(this.getProperty('rel'), $('content-right'), function() {
								contentSlideDiv.setStyle('left', '0');
								navPics.fade(0);
								contentRight.fade(1.0);
								contentSlide.removeEvents('complete');
					});
				}.bind(this));
			});
			
			// close buttons aktivieren
			var closebutton = target.getElements('a.close');
			closebutton.removeEvents('click');
			closebutton.addEvent('click', function() {
					contentSlide.slideOut();							   
			});
		}
		
		// if page has a gallery like used in the portfolio, build the script
		if( $$('#referenzen .bildergalerie') ) {
			
			var thumbs = $$('#referenzen .bildergalerie .thumbs a');
			var stage = $$('#referenzen .bildergalerie .stage');
			var stageSrc = $$('#referenzen .bildergalerie .stage').getProperty('src').toString();
				stageSrc = stageSrc.substr(0, (stageSrc.length-5));
			
			thumbs.addEvent('click', function() {
				var thisPicture = this.getProperty('rel');
				stage.setStyle('opacity', '0');
				stage.setProperty('src', stageSrc + thisPicture + '.jpg');
				( function() { stage.fade(1); }).delay(200);
			});
			
		}
		
		// if page has a video on it, implement everything
		if ($$('#referenzen .video') ) {
                    var videos	=	$$('#referenzen .video');
                        videos.each(function(item,index) {
                            var src		=	item.getProperty('src');
                            var img		=	item.getProperty('img');	
                            var height	=	item.getProperty('height');	
                            var width	=	item.getProperty('width');			
                            item.setProperty('html', '<object wmode="transparent"><param name="wmode" value="transparent"/><param name="FlashVars" value="file='+src+'&amp;backcolor=0x000000&amp;frontcolor=0xCCCCCC&amp;lightcolor=0x557722&amp;image='+img+'"/><embed type="application/x-shockwave-flash" src="imgs/flvplayer.swf" style="" id="single" name="single" quality="high" allowfullscreen="true" flashvars="file='+src+'&amp;backcolor=0x000000&amp;frontcolor=0xCCCCCC&amp;lightcolor=0x557722&amp;image='+img+'" height="'+height+'" width="'+width+'"></object>');
                        });
        }	
		
	}
	
	// Google Maps
	function loadGoogleMap() {
    
		if (GBrowserIsCompatible()) {
	  
			var map = new GMap2(document.getElementById("map"));
	
			googleMaps			=	new Array();
			googleMaps['ort']		=	"60599 Frankfurt am Main";	
			googleMaps['strasse']	=	"Geleitsstraße 14";	
			googleMaps['name']		=	"meat* concept and design";	
			googleMaps['webseite']	=	"";			
			googleMaps['adress']	=	googleMaps['ort']+", "+googleMaps['strasse'];
	
			map.addControl(new GSmallMapControl());
			geocoder = new GClientGeocoder();
	
			eventTabOne		=	"<b>"+googleMaps['name']+"</b><br/>"+googleMaps['strasse']+"<br/>"+googleMaps['ort']+"<br/><a href='"+googleMaps['webseite']+"'>"+googleMaps['webseite']+"</a>";
			eventTabTwo		=	"";
			var tabsArray	=	new Array();
			tabsArray[0]	=	new GInfoWindowTab("Adresse", eventTabOne);
	
			geocoder.getLatLng(
				googleMaps['adress'],
				function(point) {
					if (!point) {
					  alert(address + " not found");
					} 
					map.setCenter(point, 13);
					map.panDirection(0, +0.4);
							  
					var marker = new GMarker(point);
					map.addOverlay(marker);
					// marker.openInfoWindowTabs(tabsArray); 				  
					GEvent.addListener(marker, "click", function() { marker.openInfoWindowTabs(tabsArray); });
											
				}
			);

      	}
    }
	
	
	// *** PORTFOLIO ***/ 
	
	// slideit moo
	function createScrollableIndex(items, itemwidth){
		
			/* create thumbnail navigation */
			new SlideItMoo({
						overallContainer: 'referenzen-galerie',
						elementScrolled: 'referenzen-galerie-inner',
						thumbsContainer: 'referenzen-galerie-items',		
						itemsVisible: items,
						itemsSelector: '.slide-element',
						itemWidth: itemwidth,
						showControls:1
			});
			
			var indexItems = $$('#referenzen-galerie a');
			indexItems.addEvent('click', function() {
				$('referenzen-content').setStyle('opacity', '0');
				loadAjaxContent(this.getProperty('rel'), $('referenzen-content'), function() {
					$('referenzen-content').fade(1);
				});
			});
			
	}
	
	// gives the portfolio all required functionality
	function updatePortfolio() {
		
		// add click events to portfolio nav
		var navItems = $$('#referenzen .portfolio-navigation a');
		navItems.addEvent('click', function() {
			
			// get the current section for the index slider
			var section = this.getProperty('rel').split("/")[1];
			
			// set the contents invisible
			$('referenzen-content').setStyle('opacity', '0.0');
			$('referenzen-galerie').setStyle('opacity', '0.0');
			
			loadAjaxContent('portfolio/' + section + '/index', $('referenzen-galerie'), function() {
				if(section == "print") {
					$$('#referenzen-galerie-items .slide-element').setStyle('width', '102px');
					$$('#referenzen-galerie').setStyle('bottom', '10px');
					createScrollableIndex(4, 102);
				} else {
					$$('#referenzen-galerie-items .slide-element').setStyle('width', '136px');
					$$('#referenzen-galerie').setStyle('bottom', '0');
					createScrollableIndex(3, 136);
				}
				$('referenzen-galerie').fade(1);
			}.bind(this));
			
			loadAjaxContent(this.getProperty('rel'), $('referenzen-content'), function() {
				navItems.removeClass('active');
				this.addClass('active');	
				$('referenzen-content').fade(1);
			}.bind(this));
			
		});
		
	}
	

});