// JavaScript Document

var Common = function(){
	this.$index = $('#index');
	this.$posts = $('#index div.post');
	this.degree = 20;
	this.aboutBackground;
	this.profileBackground;
	
	this.aboutBackgroundImages = new Array();
	this.aboutBackgroundImages[0] = "about_background01.png";
	this.aboutBackgroundImages[1] = "about_background02.png";
	this.aboutBackgroundImages[2] = "about_background03.png";
	this.aboutBackgroundImages[3] = "about_background03.png";
	this.aboutBackgroundImages[4] = "about_background02.png";
	
	this.profileBackgroundImages = new Array();
	for( var i = 0; i < 8; i++ ){ this.profileBackgroundImages[i] = "profile_background.png"; };
	
	this.isIE6 = ( navigator.userAgent.indexOf("MSIE 6") >= 0 ) ? true : false;
	//console.log( "isIE6 = " + this.isIE6 );
	this.isSmartPhone = this.checkUA();
	//console.log("isSmartPhone = " + this.isSmartPhone);
	
	this.constructor.apply(this);
}

Common.prototype = {
	
	constructor : function() {
		//console.log("Common.constructor");
		
		if( this.isIE6 ){ $(document).pngFix(); };
		this.$index.fadeTo( 0, 0 );
		this.setColorBox($('#head'));
		this.setColorBox($('#navigation .news'));
		this.setColorBox($('#navigation .profile'));
		this.setColorBox($('#navigation .contact'));
		
		var self = this;
		
		//Setting Auto Pager
		this.$index.infinitescroll({
				navSelector:"div.pagenavi",
				nextSelector:"div.pagenavi a",
				itemSelector:"#index div.post",
				animate:false,
				bufferPx:100,
				extraScrollPx:0,
				loadingImg:"http://doppoinc.com/wp/wp-content/themes/doppo/images/loading.gif",
				donetext:"",
				dataType:"html"
				
			}, function( loadedPosts ){
				var $loadedPosts = $( loadedPosts );
				$loadedPosts.fadeTo(0,0);				
				$loadedPosts.imagesLoaded(function(){					
					self.onPostsLoaded($loadedPosts);
				});
		});
		
		//初回読み込み→表示まで
		this.$index.imagesLoaded(function( $images ){	
			//console.log("Common.imagesLoaded");
			self.$index.masonry({
				itemSelector:"#index div.post",
				columnWidth:8,
				isAnimated:true
			});
			
			self.$posts.fadeTo( 0, 0 );
			self.$index.fadeTo( 0, 1 );
			
			self.$posts.each(function(i){
				self.setColorBox($(this));		
				self.setHover($(this));
				var d = parseInt( Math.random() * 1200 );
				$(this).delay(d).fadeTo( 1200, 1 );
			});
	 	});
	
		self.aboutBackground = new BackgroundImages();
		self.profileBackground = new BackgroundImages();
		
		if(!this.isSmartPhone){
			var car = new Car();
			car.initialize( $("body") );
		}
		

	},
	
	//Mouseover transition
	setHover : function( $target ) {
		//console.log("Common.setHover");
		var self = this;
		var degree;
		var d;
		$target.hover(function(){
			degree = parseInt( Math.random() * self.degree * 2 ) - self.degree;
			d = 400 + parseInt( Math.random() * 800 );
			$target.rotate({
				animateTo:degree,
				duration:d,
				easing:$.easing.easeOutBack,
			});
		},
		function(){
			degree = parseInt( degree * - 0.5 );
			d = 400 + parseInt( Math.random() * 800 );
			$target.rotate({
				animateTo:degree,
				duration:d,
				easing:$.easing.easeOutBack,
			});	
		});		
	},
	
	//Setting ColorBox
	setColorBox : function( $target ) {
		//console.log("Common.setColorBox");
		
		var self = this;
		
		if( $target.hasClass("news") ){
			$("a", $target).colorbox({
				href:function(){
					var url=$(this).attr('href');
					return url;
				},
				width:1004,
				height:600,
				initialWidth:440,
				initialHeight:272,
				speed:400,
				scrolling:false,
				close:"<a>close</a>",
				fixed:true,
				onOpen:function(){ self.onNewsOpend(); },
				onLoad:function(){ /*console.log( "onLoad" );*/ },
				onComplete:function(){ self.onNewsLoaded( false ); },
				onClosed:function(){ self.onNewsRemoved(); },
				iframe:true
			});
			
		} else {
			
			var scrollable;		
			if($target.hasClass("works") || $target.hasClass("news")){
				scrollable = false;
			} else {
				scrollable = true;
			};
			
			$("a", $target).colorbox({	
				href:function(){ 
					var url=$(this).attr('href');
					url = url + " div#detail";
					return url;
				},
				maxWidth:"75%",
				maxHeight:"75%",
				initialWidth:440,
				initialHeight:272,
				speed:400,
				scrolling:false,
				close:"<a>close</a>",
				fixed:true,
				onOpen:function(){ self.onDetailOpend(); },
				onLoad:function(){ /*console.log( "onLoad" );*/ },
				onComplete:function(){ self.onDetailLoaded( scrollable ); },
				onClosed:function(){ self.onDetailRemoved(); }
			});
			
			if( scrollable ){ $("a", $target).colorbox({ maxWidth:1004 }); };
		}
	},
	
	onPostsLoaded : function( $posts ){
		//console.log("Common.onPostsLoaded");
		//console.log("$images.length = " + $images.length);
		if( this.isIE6 ){ $posts.pngFix(); };
		
		var self = this;
		this.$index.masonry( 'option', { isAnimated:false } );
		this.$index.masonry( 'appended', $posts, false );
		
		$posts.fadeTo( 0, 0 );
		self.$index.fadeTo( 0, 1 );
			
		$posts.each(function(i){
			self.setColorBox($(this));		
			self.setHover($(this));
			var d = parseInt( Math.random() * 1200 );
			$(this).delay(d).fadeTo( 1200, 1 );
		});
		
		this.$index.masonry( 'option', { isAnimated:true } );
	},

	onDetailOpend : function() {
		//console.log("Common.onDetailOpend");
		$('#cboxClose').fadeTo(0,0);
	},
	
	onDetailLoaded : function( scrollable ) {
		//console.log("Common.onDetailLoaded");
		
		var postID = $('#cboxContent').find('.post').attr("id");
		//console.log("postID = :" + postID);
		if( postID == "about" ){ this.aboutBackground.initialize( $('#cboxContent'), this.aboutBackgroundImages, postID ); };
		if( postID == "profile" ){ this.profileBackground.initialize( $('#cboxContent'), this.profileBackgroundImages, postID ); };
		
		if( scrollable == true ){
			$('#cboxContent').addClass( postID );
			$('#cboxClose a').addClass( "scrollable" );
			$('#cboxLoadedContent').jScrollPane();
		}
		$("#cboxClose").fadeTo( 800, 1 );
		
	},
	
	onDetailRemoved : function() {
		//console.log("Common.onDetailRemoved");
		$('#cboxContent').removeClass();
		$('#cboxClose a').removeClass();
		this.aboutBackground.remove();
		this.profileBackground.remove();
	},
	
	onNewsOpend : function(){
		//console.log("Common.onNewsOpend");
		$('#cboxClose').fadeTo(0,0);
	},
	
	onNewsLoaded : function(){
		//console.log("Common.onNewsLoaded");
		$('#cboxContent').addClass( "news" );
		$('#cboxClose a').addClass( "scrollable" );
		$('#cboxClose').fadeTo( 800, 1 );		
	},
	
	onNewsRemoved : function(){
		//console.log("Common.onNewsRemoved");
		$('#cboxContent').removeClass();
		$('#cboxClose a').removeClass();
	},

	checkUA : function(){
		var bool = false;
		
		if ((navigator.userAgent.indexOf('iPhone') > 0 ) || (navigator.userAgent.indexOf('iPad') > 0) || navigator.userAgent.indexOf('iPod') > 0 || navigator.userAgent.indexOf('Android') > 0) {
			bool = true;
		}
		return bool;
	}
};



$(document).ready(function(){
	var common = new Common();
	//var debug = new Debug();
});

//For debug
var Debug = function() {
	this.$initRotateButton;
	this.$gridButton;
	this.grid = false;
	this.constructor.apply(this);
}

Debug.prototype = {
	
	constructor : function(){
		//console.log("Debug.constructor");
		
		var self = this;
		$("body").append( '<div id="rotate"><a href="#">Rotate Init</a></div>');
		this.$initRotateButton = $('#rotate');
		this.$initRotateButton.click(function(){
			self.initRotate();
			return false;
		});
		
		$("body").append( '<div id="grid"><a href="#">Show Grid</a></div>');
		this.$gridButton = $('#grid');
		this.$gridButton.click(function(){
			self.showGrid();
			return false;
		});		
	},
	
	initRotate : function(){
		//console.log("Debug.initRotate");
		$("#index .post").each(function(i){
			$(this).rotate({angle:0});
		});
	},
	
	showGrid : function(){
		if( !this.grid ){
			$("body").append( '<div class="grid"></div>');
			$('#grid a').html("Hide Grid");
			
			$("#head").css("background", "#FF0000");
			$("#wrap").css("background", "#FFFF00");
			$("#index div.post p.size").css("display", "block");
			
			this.grid = true;
		} else {
			$("body div.grid").remove();
			$('#grid a').html("Show Grid");
			
			$("#head").css("background", "#FFFFFF");
			$("#wrap").css("background", "none");
			$("#index div.post p.size").css("display", "none");			
			this.grid = false;
		}
	}
};