// JavaScript Document

// Common
// scripts/module/common.js

var Common = function() {
	this.imageNum;
	this.currentNum = 0;
	this.margin = 10;
	this.isIE6 = ( navigator.userAgent.indexOf("MSIE 6") >= 0 ) ? true : false;
	this.constructor.apply(this);
}

Common.prototype = {
	constructor : function() {
		//console.log("Common.constructor");
		if( this.isIE6 ){ $(document).pngFix(); };
		this.imageNum = $('#wrap ul li').length;
		
		var self = this;
		$(window).bind('resize', function(){self.resize();});
		$(window).trigger('resize');
		$('#wrap ul li').css("opacity", 0.0);
		$('#wrap ul li:first').animate({opacity:1.0}, 3200, "easeInOutQuart", function(){ self.slideShow(); });
	},
	
	slideShow : function(){
		var self = this;
		
		$(document).everyTime( 3200, 'timer',function(){
			$('#wrap ul li:first').animate({opacity:0.0}, 3200, "easeInOutQuart")
			.next('#wrap ul li').animate({opacity:1.0}, 3200, "easeInOutQuart")
			.end()
			.appendTo($("#wrap ul"));
			
			if(self.currentNum < self.imageNum){
				self.currentNum++;
			} else {
				self.currentNum = 0;	
			}
		});			
	},
	
	resize : function() {
		var self = this;
		$('#wrap ul li').each(function(i){
			var $img = $('img', this);
			var dw = parseInt($(window).width()) - self.margin*2;
			var dh = parseInt($(window).height()) - self.margin*2;
			var w = parseInt($img.attr("width"));
			var h = parseInt($img.attr("height"));
			var t;
			var l;
			var per;
		
			if(h>w){
				//console.log("ID = " + i + " TYPE = portrait type");				
				per = dh/h;
				t = self.margin;
				l =  (dw - w*per)*.5 + self.margin;
			} else {				
				//console.log("ID = " + i + " TYPE = landscape type");
				per = dw/w;				
				if(h*per > dh){
					per = dh/h;
				}			
				t =  (dh - h*per)*.5 + self.margin;
				l =  (dw - w*per) + self.margin;			
			}
			
			
			$img.css("width", Math.floor(w*per));
			$img.css("height", Math.floor(h*per));
			$(this).css("top", Math.ceil(t));
			$(this).css("left", Math.ceil(l));
			
		});		
	},
	
	resizeWrapWindow : function() {
		$('#wrap ul li').each(function(i){
			var $img = $('img', this);
			var dw = parseInt($(window).width()) - self.margin*2;
			var dh = parseInt($(window).height()) - self.margin*2;
			var w = parseInt($img.attr("width"));
			var h = parseInt($img.attr("height"));
			var per = dw/w;
			
			if(h*per < dh){
				per = dh/h;
			}
				
			$img.css("width", Math.floor(w*per));
			$img.css("height", Math.floor(h*per));			
			
			var t =  (dh - h*per)*.5 + self.margin;
			var l =  (dw - w*per)*.5 + self.margin;
			$(this).css("top", Math.floor(t));
			$(this).css("left", Math.floor(l));
			
		});		
	}
}

//For debug
var Debug = function() {
	this.$gridButton;
	this.grid = false;
	this.constructor.apply(this);
}

Debug.prototype = {
	
	constructor : function(){
		//console.log("Debug.constructor");		
		var self = this;
		$("body").append( '<div id="grid"><a href="#">Show Grid</a></div>');
		this.$gridButton = $('#grid');
		this.$gridButton.click(function(){
			self.showGrid();
			return false;
		});		
	},
	
	showGrid : function(){
		if( !this.grid ){
			$("body").append( '<div class="grid"></div>');
			$('#grid a').html("Hide Grid");
			this.grid = true;
		} else {
			$("body div.grid").remove();
			$('#grid a').html("Show Grid");
			this.grid = false;
		}
	}
};


$(document).ready(function(){
	//console.log("common.ready");
	var common = new Common();
	//var debug = new Debug();
});
