jQuery.noConflict();
var jq$ = jQuery;

var COLUMN_MIN = 8;
var COLUMN_WIDTH = 93;
var COLUMN_MARGIN = 4; 

var _offset_x=_offset_y=0;

jq$.grid = {
	init: function() {
		for (module in jq$.grid) {
			if (jq$.grid[module].init)
				jq$.grid[module].init();
		}
	}
};

jq$(document).ready(jq$.grid.init);
// 2009.10.3 Drawing and Manual
jq$.event.add(window, "load", function(){adjust(false);});

jq$.grid.window = {
	init: function() {
		jq$(window)
			.bind('resize', this.resize)
			.each(this.preload);
	},
	preload: function() {
		_offset_y = jq$('#grid').offset().top;
		_offset_x = jq$('#grid').offset().left;
		adjust(false);
	},
	resize: function() {
		adjust(true);
	}
};

function adjust(mode){

	var _max_y = new Array();
	var _max_h = 0;
	var _max_col = 0;

	var _window_h=jq$(window).height();
	var _window_w=jq$(window).width();

	var _header_w=jq$('#header').outerWidth();
	var _target_w=_window_w-_header_w;

	var _footer_y=0;
	var columns = Math.max(COLUMN_MIN, parseInt(_target_w / (COLUMN_WIDTH+COLUMN_MARGIN)));
//	jq$('#grid > div.item').css('width',COLUMN_WIDTH*2+COLUMN_MARGIN);
	jq$('#grid > div.item_half').css('width',COLUMN_WIDTH);
	jq$('#grid div.item_double').css('width',COLUMN_WIDTH*4+COLUMN_MARGIN*3);
	jq$('#grid div.item_tripple').css('width',COLUMN_WIDTH*6+COLUMN_MARGIN*5);
	jq$('#grid div.item_2double').css('width',COLUMN_WIDTH*8+COLUMN_MARGIN*7);
	var _auto=Math.floor((_target_w)/(COLUMN_WIDTH+COLUMN_MARGIN));
	_auto=(_auto<8)?8:_auto;
	var _autoW = (COLUMN_WIDTH+COLUMN_MARGIN)*_auto-COLUMN_MARGIN;

	for (x=0;x<columns;x++) _max_y[x] = 0;
	jq$('#grid > div.item').each(function(i) {
		var pos, cursor, width, height= 0;
		var item_x=item_y=0;
		width=(this.className.match(/item_auto/))?_auto:(Math.floor(jq$(this).outerWidth()/COLUMN_WIDTH));
		cursor=0;
		if (width>1) {
			for (x=0;x<columns-(width-1);x++) cursor=(_max_y[x]<_max_y[cursor])?x:cursor;
			pos=cursor;
			for(var x=0; x<width; x++) height=Math.max(height, _max_y[pos+x]);
			for(var x=0; x<width; x++) _max_y[pos+x]=parseInt(jq$(this).outerHeight())+COLUMN_MARGIN+height;
			item_x=pos*(COLUMN_WIDTH+COLUMN_MARGIN);
			item_y=height+_offset_y;
		}else{
			for (x=0;x<columns;x++) cursor=(_max_y[x]<_max_y[cursor])?x:cursor;
			item_x=cursor*(COLUMN_WIDTH+COLUMN_MARGIN);
			item_y=_max_y[cursor]+_offset_y;
			_max_y[cursor] += jq$(this).outerHeight()+COLUMN_MARGIN;
		}
		_max_h=(_max_y[cursor]>_max_h)?_max_y[cursor]:_max_h;
		_footer_y=(_footer_y<_max_h)?_max_h:_footer_y;
		if(!mode){
			jq$(this).css('left', item_x + 'px').css('top',item_y+COLUMN_MARGIN+'px');
			if(this.className.match(/item_auto/)) jq$(this).css('width',_autoW+'px');
		}else{
			jq$(this).stop();
			if(this.className.match(/item_auto/)){
				jq$(this).animate({left: item_x + 'px',top: item_y+COLUMN_MARGIN+'px',width:_autoW+'px'},250,'easeInOutCubic');
			}else{
				jq$(this).animate({left: item_x + 'px',top: item_y+COLUMN_MARGIN+'px'},250,'easeInOutCubic');
			}
		}
		_max_col=(_max_col<cursor)?cursor:_max_col;
	});

	var target_w=columns*(COLUMN_WIDTH+COLUMN_MARGIN)-COLUMN_MARGIN;

	var target_x=(_window_w-((columns+1)*(COLUMN_WIDTH+COLUMN_MARGIN)))/2;
	target_x=(0<target_x)?target_x:0;
	target_x=(47<target_x)?target_x:0
	offset_x=(0<target_x)?-47:0;
	var grid_x=(_window_w-target_w-_header_w-COLUMN_MARGIN)/2;
	grid_x=(0<grid_x)?grid_x:0;

	jq$('#grid').stop();
	jq$('#header').stop();
	jq$('body').stop();
	jq$('#footer').stop();
	var header_x = target_x+target_w+COLUMN_MARGIN+offset_x;
	if(!mode){
		jq$('#grid > div.block').css('width', target_w).css('top',COLUMN_MARGIN);
		jq$('#grid').css('left',grid_x);
		jq$('#header').css('left',header_x);
		jq$('body').css('background-position',header_x);
		jq$('#footer').css('left',grid_x).css('top',_footer_y).css('width',columns*COLUMN_WIDTH);
	}else{
		jq$('#grid').animate({left:grid_x+'px'},250,'easeInOutCubic');
		jq$('#grid > div.block').animate({width:target_w+'px'},250,'easeInOutCubic');
		jq$('#header').animate({left: header_x + 'px'},250,'easeInOutCubic');
		jq$('body').animate({backgroundPosition: header_x+'px'+' 0px'},250,'easeInOutCubic')
		jq$('#footer').animate({left:grid_x+'px',top:_footer_y+'px',width:columns*COLUMN_WIDTH+'px'},250,'easeInOutCubic');
	}
	jq$('#grid > div.item_hover').mouseover(function() {
		jq$(this).css({'background-color':'#eee'})
	});
	jq$('#grid > div.item_hover').mouseout(function() {
		jq$(this).css({'background-color':'#fff'})
	});
};