//HomeThumbRotator
var HomeThumbRotator = Class.extend({
	init: function(thisObj,imgs){
		this.obj = thisObj;
		this.speed = 2000;
		var rand = Math.floor(Math.random() * 10);
		if(rand === 0){
			rand = 1;
		}
		this.delay = 3000 + (rand*100);
		this.presentImage = 0;
		this.imgs = imgs;
		this.paused = true;
		this.interval =  null;
		this.play();
	},
	play: function(){
		var self = this;
		if(this.paused === true){
			this.change();
			this.paused = false;
		}
		function change(){
			self.change();
		}
		this.interval = setInterval(change,this.delay);
		//self.change()
	},
	pause: function(){
		var self = this;
		this.paused = true;
		clearInterval(this.interval);
	},
	animateIn: function(){
		/******/
		//needs easing works and use ani out
		/******/
		//console.log(this.presentImage);
		var self = this;
		$('#'+self.obj.parent.id+self.obj.id+' img').animate({
			opacity: 0
		})
		$('#'+self.obj.parent.id+self.obj.id+' img:eq('+self.presentImage+')').animate({
			opacity: 1
		},self.speed,'easeInQuint',function(){});
	},
	animateOut: function(){
		var self = this;
	},
	change: function(){
		var self = this;
		this.animateIn();
		//update index
		if(self.presentImage >= self.imgs.length-1){
			self.presentImage = 0;
		}else {
			self.presentImage += 1;
		}
	}
});
//PROJECT
var Project = Class.extend({
	init: function(thisObj,parent,id){
		this.self = thisObj;
		this.name = $(thisObj).attr('name');
		this.type = $(thisObj).attr('type');
		this.category = $(thisObj).attr('category');
		this.id = id;
		this.parent = parent;
		this.markup = '<li class="box '+this.name+' '+this.type+'" id="'+this.parent.id+this.id+'"></li>';
		this.homeThumbs = [];
		this.rotator;
		this.lineONE;
		this.lineTWO;
		this.LineTHREE;
		//functions
		$('div.'+this.parent.name+' ul').append(this.markup);
		if(this.parent.name === 'News'){
			this.loadNews();
		}else{
			this.loadImages();
		}
		var self = this;
		$('#'+this.parent.id+this.id+'').click(function(){self.clickHandler();});
	},
	loadImages: function(){
		var self = this;
		$('#'+self.parent.id+self.id).append('<p class="name">'+self.name+'</p>');
		$(this.self).find('img').each(function(k){
			var markup = '<img src="'+root+'images/project_images/'+self.parent.name+'/'+self.name+'/_home_thumbs/'+$(this).text()+'.jpg">';
			self.homeThumbs.push(markup);
		});
		$('#'+self.parent.id+self.id).append('<div class="thumbWrap">'+self.homeThumbs.join('')+'</div>');
		this.rotator = new HomeThumbRotator(this,this.homeThumbs);
	},
	loadNews: function(){
		var self = this;
		var name = $(this.self).attr('name');
		$(this.self).find('img').each(function(k){
			var markup = '<div class="newsWrap"><p>'+name+'</p>'+$(this).text()+'</div>';
			$('#'+self.parent.id+self.id).append(markup);
		});
	},
	clickHandler: function(){
		Site.state = 'project';
		//console.log(this.name +' '+this.type);
		if(this.type ==='news'){
			/******update*****/
			window.location = 'news.html#'+this.name;
		}else{
			this.loadPage();
		}
	},
	loadPage: function(){
		var self = this;
		$('.loader').empty();
		$('.loader').css('top','0');
		//fix later
		$('.nav li.projects a').attr('href','index.html');
		$('.nav li.exhibitions a').attr('href','index.html');
		$('.nav li.publications a').attr('href','index.html');
		
		$('.mainScrollBar').hide();
		var lineOne = [];
		var lineTwo = [];
		var lineThree = [];
		$(this.self).find('img').each(function(k){
			var markup = '<li><img src="'+root+'images/project_images/'+self.parent.name+'/'+self.name+'/_thumbs/'+$(this).text()+'.jpg"></li>';
			if($(this).attr('line') === 'one')
				lineOne.push(markup);
			if($(this).attr('line') === 'two')
				lineTwo.push(markup);
			if($(this).attr('line') === 'three')
				lineThree.push(markup);
		});
		var textHeight;
		var creditTop;
		var rowNumber;
		if(lineOne.length > 0){
			this.lineONE = new PRow('lineOne',lineOne);
			textHeight = 460;
			creditTop = 128;
			rowNumber = "oneRow";
		}
		if(lineTwo.length > 0){
			this.lineTWO = new PRow('lineTwo',lineTwo);
			rowNumber = "twoRows";
			textHeight = 350;
			creditTop = 238;
		}
		if(lineThree.length > 0){
			this.lineThree = new PRow('lineThree',lineThree);
			rowNumber = "threeRows";
			textHeight = 235;
			creditTop = 355;
		}
		this.loadText(rowNumber,textHeight);
		this.credits(creditTop);
		this.imgClick();
	},
	loadText: function(rowNumber,textHeight){
		var self = this;
		$(this.self).find('desc').each(function(k){
			var string = $(this).text();
			var splitResults = string.split('\t');
			var splitMarkup = [];
			for(var l=0;l<splitResults.length; l++){
				if(splitResults[l].length>0)
				splitMarkup.push('<p>'+splitResults[l]+'</p>');
			}
			var markup = '<div class="textbox"><div class="textWrap">'+splitMarkup.join('')+'</div></div>';
			$('.loader').append(markup);
		});
		$('.textbox').css({height:textHeight});
		$('.textbox').addClass(rowNumber);
		if($('.textWrap').height() > $('.textbox').height()){
			var scrollmarkup = '<div class="verticalScrollBar"><div class="verticalScrollThumb"></div></div>'
			$('.textbox').append(scrollmarkup);
			$('.verticalScrollBar').css({height:textHeight});
			$('.textWrap').css({height:$('.textWrap').height()+40})
			this.textScroller();
		}
	},
	textScroller: function(){
		var scrollContainer = $('.textbox');
		var scrollArea = $('.textWrap');
		var track = $('.verticalScrollBar');
		var thumb = $('.verticalScrollThumb');
		thumb.mouseover(function(){
			$(this).css('background-color','#a80000');
		}).mouseout(function(){
			$(this).css('background-color','#fff');
		});
		thumb.draggable({ 
			axis: 'y',
			containment: 'parent', 
			start: function() {
			},
			drag : function(){
				$(this).css('background-color','#a80000');
				var ThumboffSet = thumb.position();
				var trackHeight = track.parent().height() - thumb.height();
				var percentageTop = ThumboffSet.top / trackHeight;
				var newTop = ( scrollArea.height() - scrollArea.parent().height() ) * percentageTop;
				scrollArea.css({ 'top': -newTop });
			},
			stop: function(){
				$(this).css('background-color','#fff');
			}
		});
	},
	credits: function(creditTop){
		$(this.self).find('credits').each(function(k){
			var nameOfProject = $(this).find('nameOfProject').text();
			var location = $(this).find('location').text();
			var year = $(this).find('year').text();
			var program = $(this).find('program').text();
			var client = $(this).find('client').text();
			var status =$(this).find('status').text();
			var team = $(this).find('team').text();
			var markup = '<div class="credits"><ul>'+
				'<li><span>'+nameOfProject+'</span>, '+location+', '+year+'</li>'+
				'<li>PROGRAM: '+program+'</li>'+
				'<li>CLIENT: '+client+'</li>'+
				'<li>STATUS: '+status+'</li>'+
				'<li>CREDITS<br/>'+team+'</li>'+
				'</ul></div>'
			$('.loader').append(markup);
			$('.credits').css({top:creditTop});
		});
	},
	imgClick: function(){
		var self = this;
		$('.prow ul li img').click(function(){
			var src = $(this).attr('src');
			var split = src.split('_thumbs/');
			var join = split[0]+split[1];
			self.loadImg(join);
		});
	},
	loadImg: function(path){
		//console.log(path)
		var markup = '<div class="bigImgWrap"><div class="wrap"><p class="count">ARCHI[TE]NSIONS+<span>110</span>% <span class="sm clicktoclose">click image to close</span></p><img src="'+path+'"></div></div>';
		$('.content').append(markup);
		$('.bigImgWrap').fadeIn('fast',function(){
			$('.bigImgWrap .wrap').animate({
				opacity:1,
				width:880,
				height:585,
				left:0
			}, 300, null, function(){
				$('.bigImgWrap .wrap img').fadeIn('slow');
			});
			$('.bigImgWrap .wrap p.count').fadeIn();
		});
		function count(){
			for(var i = 0; i<101; i++){
				$('.bigImgWrap .wrap p.count span').html(i);
			}
		}
		$('.bigImgWrap .wrap img').click(function(){
			$('.bigImgWrap').remove();
		});
		$('.clicktoclose').click(function(){
			$('.bigImgWrap').remove();
		});
	}
});

//PROW
var PRow = Class.extend({
	init: function(name,imgs){
		this.name = name;
		this.id = name;
		this.markup = '<div class="row prow '+this.name+' clearfix" id="'+this.id+'"><ul class="clearfix"></ul></div>';
		this.imgs = imgs;
		//functions
		$('.loader').append(this.markup);
		this.createBoxes();
		//this.scrollBar();
		this.widthsSum;
		
	},
	createBoxes: function(){
		var self = this;
		for(var i=0;i<this.imgs.length;i++){
			$('#'+this.id+' ul').append(self.imgs[i]);
		}
		var widths = [];
		$('#'+this.id+' ul li').each(function(){
			widths.push($(this).width()+10);
		});
		this.widthsSum= widths.sum() + 50;
		if(this.widthsSum > 605){
			$('#'+this.id+' ul').css({width:this.widthsSum});
			this.scrollBar();
		}
		
	},
	scrollBar: function(){
		var self = this;
		var numofboxes = $('#'+this.id+' ul li').length;
		if(this.widthsSum > 605){
			var scrollmarkup = '<div class="horizontalScrollBar"><div class="horizontalScrollThumb"></div></div>'
			$('#'+this.id).append(scrollmarkup);
			scroll();
		}
		function scroll(){
			var scrollContainer = $('#'+self.id);
			var scrollArea = $('#'+self.id+' ul');
			var track = $('#'+self.id+' .horizontalScrollBar');
			var thumb = $('#'+self.id+' .horizontalScrollThumb');
			thumb.mouseover(function(){
				$(this).css('background-color','#a80000');
			}).mouseout(function(){
				$(this).css('background-color','#fff');
			});
			thumb.draggable({ 
				axis: 'x',
				containment: 'parent', 
				start: function() {
				},
				drag : function(){
					$(this).css('background-color','#a80000');
					var ThumboffSet = thumb.position();
					var trackWidth = track.parent().width() - thumb.width();
					var percentageLeft = ThumboffSet.left / trackWidth;
					var newLeft = ( scrollArea.width() - scrollArea.parent().width() ) * percentageLeft;
					scrollArea.css({ 'left': -newLeft });
				},
				stop: function(){
					$(this).css('background-color','#fff');
				}
			});
		}
	}
});