

/*	James

	File:		Grid JS
	Author:		James Brannon

	-------------------------------------------------------------------------------------------------------------------- */
	
	function Grid(construct) {this.total;this.init(construct);}
		Grid.prototype = {
			init: function(construct) {
				this.construct = construct;
				var instance = this;
				
				//- object vars
				this.subject = '#'+construct.layout.grid
				this.previews = $(this.subject+' li a');
				this.total = this.previews.length;
				
				//- add listeners
				$(this.previews).mouseover(function() {instance.over(this)});
				$(this.previews).mouseout(function() {instance.out(this)});
				$(this.previews).click(function() {instance.click(this)});
				
				//- check for active tile
				this.check();
			},
			over: function(subject){
		
				var pane = $(subject).children('div'),
					padding = (parseInt($(subject.getElementsByTagName('h2')).css('marginTop'))*4),
					offset = $(subject.getElementsByTagName('h2')).height()+padding,
					p,
					request = $.address.value().replace('/', '');
					
				//- animate grid opacity
				for(p=0;p<this.total;p++){
					//- don't affect active tile if present
					if(request!=$(this.previews[p]).attr('data-base')){
						$(this.previews[p]).stop().animate({opacity:'.4'}, 300, 'easeInOutCirc');
					}else{
						$(this.previews[p]).stop().css({'opacity': 1});
					}
				}
				
				//- animate subject tile
				$(subject).stop().css({'opacity': 1}).addClass('alt');
				pane.stop().animate({top:-offset}, 500, 'easeOutBack');
				
			},
			out: function(subject){
		
				var pane = $(subject).children('div'),
					request = $.address.value().replace('/', '');
				
				//- animate back opacity
				this.previews.stop().animate({opacity:'1'}, 300, 'easeInOutCirc');
				
				//- animate out if not active
				if(request!=$(subject).attr('data-base')){
					pane.stop().animate({top:0}, 250, 'easeOutCirc', function(){
						$(subject).removeClass('alt');
					});
				}
				
			},
			click: function(subject){
			
				var info = $(subject).children('div'),
					padding = (parseInt($(subject.getElementsByTagName('h2')).css('marginTop'))*4),
					offset = $(subject.getElementsByTagName('h2')).height()+padding,
					colour = info.css('background-color'),
					basename = $(subject).attr('data-base'),
					anchor;
					
				//- request job
				$.address.value(basename);
				
				//- track request
				trackme('grid','click',$(subject).attr('title').toLowerCase());
				
				//- animate page to view
				anchor = $("#page-anchor").offset().top-$('header.main nav').height();
				if($(window).scrollTop()>anchor){
					$('html,body').stop().animate({scrollTop: anchor}, 500);
				}
				
				//- fade grid opacity 
				this.previews.stop().animate({opacity:'.4'}, 300, 'easeInOutCirc');
				
				//- set tile to active
				this.check();
				
			},
			check: function(){
				var request = $.address.value().replace('/', ''),
					padding = (parseInt(this.previews.find('h2').css('marginTop'))*4),
					p,offset;
					
				if(request){
				
					//- loop through tiles and affect dependent on request
					for(p=0;p<this.total;p++){
						
						//- check the tile name against request
						//- if no match found, reset
						//- else, set to active
						if(request!=$(this.previews[p]).attr('data-base')){
							//- reset element
							this.reset($(this.previews[p]));
						}else{
							
							//- calculate info pane offset
							offset = $(this.previews[p]).find('h2').height()+padding;
							
							//- set element styles to active
							$(this.previews[p]).addClass('alt');
							$(this.previews[p]).stop().css('opacity',1);
							$(this.previews[p]).children('div').css('top',-offset);
							
						}
					}
				}else{
					for(p=0;p<this.total;p++){
						this.reset($(this.previews[p]));
					}
				}
				
			},
			reset: function(subject){
				var pane = subject.children('div');
				
				//- animate out pane and then remove active background colour
				pane.stop().animate({top:0}, 200, 'easeOutCirc', function(){
						subject.removeClass('alt');
				});
			}
	}
