window.addEvent('load', function() {
	
	$('home_flash').set('tween', {duration: '400', onComplete: function(){
			
			if( $defined( window.autoRunProjects ) ) 
				window.autoRunProjects( false );
		}
	});
	$('home_flash').tween( 'top', '10px' );
});


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

	//clientFeeds(); // for testing, remove
	// smooth scrolling
	new Fx.SmoothScroll({ links: $$('a[href^=#]') });
	
	

	
	// project grid
	var grid = document.getElement('.project-grid');
	if (grid) {
		(function(){
			
			var filters   		= $$('ul.sub-navigation li');
			var projects  		= grid.getElements('div.portfolio_item');
			var showingProject 	= false;
			var tmpElement 		= new Element( 'div' );
			var currentProjectID;
			var periodical;
			var ajaxRequest;
			
			var getClasses = function(element){
				var classes = element.get('class').split(' ');
				return classes.filter(function(thisclass){
					return (thisclass.indexOf('work-') == 0);
				});
			};
			
			$('close_project').addEvent( 'click', function() {														   
				
				if( $defined(  window.periodicalProject ) )
					$clear( window.periodicalProject );
				
				hideProject();
				return false;
			});
			
			projects.each(function(project, i){
				// animate project mouseovers
				var img  = project.getElement('img');
				var span = project.getElement('span');
				var spanBottom = -(span.getSize().y + 10);
				img.set({
					styles: { opacity: 1 },
					tween:  { duration: 250 }
				});
				span.set({
					styles: { bottom: spanBottom },
					tween:  { duration: 250 }
				});
				project.addEvents({
								  
					'mouseenter': function(){
						//project.tween('background-color', '#ffffff');
						img.tween('opacity', 0.85);
						span.tween('bottom', 0);
						project.setStyle( 'opacity', '1' );
					},
					'mouseleave': function(){
						//project.tween('background-color', '#1a1818');
						img.tween('opacity', 1);
						span.tween('bottom', spanBottom);
					},
					'focus': function(){
						project.fireEvent('mouseenter');
					},
					'blur': function(){
						project.fireEvent('mouseleave');
					},
					'click': function(){						
						showProject(  project.get( 'id' ), false );
						$clear(periodical);
						//loadProject( project.get( 'id' ) );
					}
				});
			});

			if (filters.length) {
				var effects   = new Fx.Elements(projects, {
					link: 'chain',
					duration: '350'/*,
					onComplete: function(){
						effectsComplete();
					}*/
				});

				// ie doesn't do transparency inheritance properly, f'ing typical!
				if (Browser.Engine.trident6) {
					var effects2 = new Fx.Elements(grid.getElements('li img'), {
						link: 'chain'
					});
				}

				var positions = [];
				var currentlyShowing = 'work-all';

				grid.setStyle('height', grid.getParent().getSize().y);

				// setup the back button
				var history = HistoryManager.register( // arguments are (key, defaults, onMatch, onGenerate, regexp, options)
					// the unique key of the registered module
					'p',
					// Array with default values, here index 0 is the current page index
					[''],
					// onMatch, callback when the state changed
					function(values) {
						
						if( values[0] != '' ) {
							//alert( values[0] );
							showProject( values[0], false );
						}
						//this.to(parseInt(values[0]));
					},
					// onGenerate, callback that returns the string for the hash
					function(values) {
						return '/' + values[0];
					},
					// RegExp for the hash value, works
					'(project_([a-z0-9-]+))+');
				
				/*
				var history = HistoryManager.register(// arguments are (key, defaults, onMatch, onGenerate, regexp, options)
					'project-grid',
					['all'],
					function(values){
						values.each(function(value, i){
							values[i] = 'work-' + value;
						});
						var link = document.getElement('ul.sub-navigation li.' + values[0] + ' a');
						if (link) link.fireEvent('click');
					},
					function(values){
						var retstring = '';
						values.each(function(value){
							//retstring = retstring + '_' + value.substring(5);
							retstring = '/' + value.substring(5);
						});
						return retstring;;
					},
					'(?:\/([a-z0-9-]+))+'
				);
				*/
				
				// get project grid positions
				projects.each(function(project, i){
					project.store('classes', getClasses(project));
					var pos = project.getPosition(grid);
					positions[i] = {
						left: pos.x - project.getStyle('margin-left').toInt(),
						top:  pos.y
					};
				});
				
				//var positionsOrig = $merge( positions );
				//var projectsOrig = $merge( projects );

				projects.each(function(project, i){
					// set project position
					project.setStyles(positions[i]).setStyle('position', 'absolute');
				});

				filters.each(function(filter){
					filter.store('classes', getClasses(filter)).getElement('a').addEvent('click', function(event){
						if (event) event.stop();
						filters.each(function(el){
							if (el != filter) {
								el.removeClass('selected');
							}
						});
						filter.addClass('selected');
						//if (history) history.setValues(filter.retrieve('classes'));
						showWork(filter.retrieve('classes'));
						Cookie.write('lastworkpage', window.location);
					});
				});

				/*
				var shiftProjectsPositions = function() {
					positions[0] = $merge(positions[1]);
					positions[1] = $merge(positions[2]);
					positions[2] = $merge(positions[3]);
					positions[3] = $merge(positions[7]);
					positions[7] = $merge(positions[11]);
					positions[11] = $merge(positions[10]);
					positions[10] = $merge(positions[9]);
					positions[9] = $merge(positions[8]);
					positions[8] = $merge(positions[4]);
					positions[4] = {left:0,top:0};
				};

				var effectobjAuto = {};
				shiftProjectsPositions();
				effects.start(effectobjAuto).chain(function(){ alert('g'); });
				*/
				

				var showWork = function(whichWork){
					
					var effectobj   = {};
					var effectobj2  = {};
					var effectobj3  = {};

					// ie doesn't do transparency inheritance properly, f'ing typical!
					var effect2obj  = {};
					var effect2obj2 = {};
					var effect2obj3 = {};

					if (whichWork.contains('work-all')) {
						projects.each(function(project, i){
							effectobj[i] = positions[i];
							effectobj2[i] = {
								opacity: 1
							};
						});
					} else {
						var k = 0;
						projects.each(function(project, i){
							var showproject = false;

							for (var j in whichWork) {
								if (project.hasClass(whichWork[j])) {
									showproject = true;
									break;
								}
							}
							
							effectobj[i]  = (showproject ? {} : {opacity: 0});
							effectobj2[i] = (showproject ? positions[k++] : {});
							effectobj3[i] = {opacity: (showproject ? 1 : 0)};

							// ie doesn't do transparency inheritance properly, f'ing typical!
							if (effects2) {
								effect2obj[i]  = (showproject ? {} : {opacity: 0});
								effect2obj2[i] = {};
								effect2obj3[i] = {opacity: (showproject ? 0.3 : 0)};
							}
						});
					}

					// if moving between two categories that aren't "all", transition to "all" first
					/**/if (currentlyShowing != 'work-all' && !whichWork.contains('work-all')) {
						showWork(['work-all']);
					} else {
						effects.cancel();
					}
					effects.start(effectobj).start(effectobj2).start(effectobj3);

					// ie doesn't do transparency inheritance properly, f'ing typical!
					if (effects2) {
						effects2.start(effect2obj).start(effect2obj2).start(effect2obj3);
					}

					currentlyShowing = whichWork[0];
				};
				
				var showProject = function( id, boolAutoPlay ){
					
					var effectobj   = {};
					var effectobj2  = {};
					var lenProjects = 0;
					var halfProjects = 0;
					var k = 0;
					var pos;
					var nextItem = 0;
						
					if( $defined( window.endProject ) ) {
						window.endProject();
					}
					
					if( $defined( currentProjectID ) && currentProjectID != id ) {						
						hideProjectEvents();
					}
					
					if (history) 
						history.setValue( 0, id );
					
					currentProjectID = id;					
					tmpElement.cloneEvents($(currentProjectID));					
					$(id).removeEvents( 'mouseleave' );
					$(id).setStyle( 'border-color', '#ffffff' );
					
					if( showingProject ) {
						
						effectsComplete( boolAutoPlay );
					}
					else {
					
						showingProject = true;
						
						projects.each(function(project, i){							
							
							var showproject = false;
	
							if (currentlyShowing == 'work-all' || project.hasClass(currentlyShowing)) {
								showproject = true;			
							}
							
							effectobj[i] = {};
							
							if( showproject ) {
								
								pos = project.getPosition(grid);
								
								if( k == 5 || k == 6 || k == 9 || k == 10 ) {
									
									effectobj[i] = {top:pos.y + 204};
									
									if( k == 9 || k == 10 ) {
										effectobj2[i] = {left:((k-9) * 612 ),top:610};
									}
									else {
										effectobj2[i] = {top:pos.y + 406};
									}
									
									nextItem++;
								}
								
								k++;
							}
	
						});
						
						effects.start(effectobj).start(effectobj2).chain(function(){ effectsComplete( boolAutoPlay ); });
					}
				};
				
				var hideProjectEvents = function(){
					
					$(currentProjectID).cloneEvents(tmpElement);
					tmpElement.removeEvents();
					$(currentProjectID).fireEvent('mouseleave');
					$(currentProjectID).setStyle( 'border-color', '' );
				}
				
				var hideProject = function(){
					
					var effectobj   = {};
					var effectobj2  = {};
					var effectobj3  = {};
					var k = 0;
					var pos;
					
					hideProjectEvents();
					
					if( showingProject ) {
					
						showingProject = false;
						
						$('mainProject').fade( 'hide' );
						
						projects.each(function(project, i){							
							
							var showproject = false;
	
							if (currentlyShowing == 'work-all' || project.hasClass(currentlyShowing)) {
								showproject = true;
								
								project.setStyle( 'opacity', '1' );
								project.addEvent( 'mouseleave', function(){
									project.setStyle( 'opacity', '1' );
								});
							}
							
							effectobj[i] = {};
							
							if( showproject ) {
								
								pos = project.getPosition(grid);
								
								if( k == 5 || k == 6 || k == 9 || k == 10 ) {								
									
									if( k == 5 || k == 6 ) {
										effectobj[i] = {top:pos.y - 202};
										effectobj2[i] = {top:pos.y - 406};
									}
									else { 
										effectobj[i] = {left:pos.x + (( (k-9) * (-408) ) + 204 )};
										effectobj2[i] = {top:pos.y - 202};
									}
									
									effectobj3[i] = effectsComplete();
								}
								
								k++;
							}
						});
						
						effects.start(effectobj).start(effectobj2);
					}
				};
				
				var effectsComplete = function( boolAutoPlay ){					
					
					if( showingProject ) {
						
						$('loading').fade('show');
						$('mainProject').fade( 'hide' );
						$('mainProjectInner').fade( 'hide' );
						
						projects.each(function(project, i){	
	
							if (currentlyShowing == 'work-all' || project.hasClass(currentlyShowing)) {
								
								if( project.get( 'id' ) != currentProjectID ) {								
									project.setStyle( 'opacity', '0.6' );
									project.addEvent( 'mouseleave', function(){
										project.setStyle( 'opacity', '.6' );
									});
								}
								else {								
									project.setStyle( 'opacity', '1' );
									project.addEvent( 'mouseleave', function(){
										project.setStyle( 'opacity', '1' );
									});
								}								
							}
						});
						
						
						//$('mainProjectInner').load('projects.php', { 'evalScripts' : true } );
						ajaxRequest = new Request.HTML({url:'index.php?do=Project&id='+currentProjectID.split( '_' )[1], update:$('mainProjectInner'), evalScripts:true, onSuccess:function(){$('mainProject').fade( 'show' );$('loading').setStyle('visibility','hidden');$('mainProjectInner').fade( 'in' );} }).get({'projectID': 1,'autoPlay':((boolAutoPlay)?1:0) });

					}
				};
			
				
				window.addEvent('load', function(){
					
					var ct = 0;
					var aryOrder = [0,1,2,3,7,11,10,6,5,9,8,4];
					
					// put this in window scope to allow the ajax viewer to call this function
					window.autoRunProjects = function( boolNew ) {
						
						if( $defined( window.endProject ) ) {
							window.endProject();
						}
						
						if( boolNew ) {
							$clear( periodical );
						}
						
						if( ct >= aryOrder.length ) {
							ct = 0;
							$clear( periodical );
							hideProject();
						}
						else {
							if( $defined( projects[aryOrder[ct]] ) ) {
								showProject( projects[aryOrder[ct]].get( 'id' ), true );	
								ct++;
							}
						}
					}
					
					
					//periodical = autoRunProjects.periodical(6000);
				});
				
			}
		})();
	}


	/*
	// videos
	var videos = $$('ul.portfolio li[class^=video-]');
	if (videos.length) {
		(function(){
			videos.each(function(el){
				var videofile = '/videos/' + (el.get('class').split(' '))[0].substring(6) + '.flv';
				var player = new Swiff('/flash/portfolio-video-player.swf', {
					width: 728,
					height: 540,
					params: {
						wmode: 'transparent',
						bgcolor: '#232323'
					},
					vars: {
						videoFile: videofile
					}
				});
				var newli = new Element('li');
				var itemnumber = false;
				el.getParent().getElements('li').each(function(li, i){
					if (itemnumber) {
						var num = i+2;
						li.getElement('span em').set('html', (num < 10 ? '0'+num : num) + '/');
					} else if (li == el) {
						itemnumber = i+2;
					}
				});
				newli.adopt(
					new Element('span', {html: ' Video'}).grab(
						new Element('em', {html: (itemnumber < 10 ? '0'+itemnumber : itemnumber) + '/'}),
						'top'
					),
					player
				).inject(el, 'after');
			});
		})();
	}
	*/


	// start the history manager
	HistoryManager.start();
	//history.start();
});