/**
 * jQuery Blocks v1.2 - http://marunouchi.com/
 *
 * Layouting blocks smoothly like puzzles.
 *
 * Requirement:
 *  - jQuery v1.3.2 or higher
 *   + http://jquery.com/
 *  - jQuery Easing v1.3 or higher
 *   + http://gsgd.co.uk/sandbox/jquery/easing/
 *  - Prototype v1.6.0 or higher
 *   + http://www.prototypejs.org/
 */


/**
 * Avoid conflict with Prototype.
 */
jQuery.noConflict();

(function(){

	/**
	 * Settings
	 */
	var BLOCK_WIDTH = 190;
	var BLOCK_MARGIN = 10;
	var BLOCK_SIZE = BLOCK_WIDTH + BLOCK_MARGIN;
	var BLOCK_MINLIMIT = 3;
	var BLOCK_ANIMATE_DURATION = 500;
	var BLOCK_ANIMATE_TYPE = 'easeInOutCubic';
	var FONTSIZE_CHECK_INTERVAL = 3000;
	var REMIX_INTERVAL = 1500;

	/**
	 * Init
	 */
	var area_offset_x = area_offset_y = 0;
	var basic_fontsize = current_fontsize = 0;
	var blind_timerid;

	jQuery(window).ready(function(){
			area_offset_x = jQuery('#blocks').offset().left;
			area_offset_y = jQuery('#blocks').offset().top;

			jQuery('#blocks > div.block').css('width', BLOCK_WIDTH + 'px');
			jQuery('#blocks div.doublesize').css('width', BLOCK_WIDTH*2 + BLOCK_MARGIN + 'px');

			jQuery('div#footer table.search').hide(BLOCK_ANIMATE_DURATION, BLOCK_ANIMATE_TYPE);

			remix();

			// Fontsize Check
			// basic_fontsize = current_fontsize = jQuery('div#fontsizeCheck').width();
			// setInterval(fontsizeCheck, FONTSIZE_CHECK_INTERVAL);

	        // Remixing by interval
			setInterval(remix, REMIX_INTERVAL);

			if (jQuery('#blind')){
				blind_timerid = setTimeout('hide_blind()',1000);
				hide_blind();
			}
	});

	function hide_blind(){
		jQuery('#blind').fadeOut(1000);
		clearTimeout(blind_timerid);
	}

	/**
	jQuery(window).resize(function(){
			remix();
	});
	*/


	/**
	 * Interval watch font sizes (and Remixing)
	 */
	/*
	function fontsizeCheck(){
			current_fontsize = jQuery('div#fontsizeCheck').width();
			if(basic_fontsize != current_fontsize){
					remix();
					basic_fontsize = current_fontsize = jQuery('div#fontsizeCheck').width();
			}
	}
	*/


	/**
	 * Remix blocks. (Re-Layouting)
	 */
	function remix(){
			// Size define
			var windowsize_h = jQuery(window).height();
			var windowsize_w = jQuery(window).width();
			var sidebar_h = jQuery('#sidebar').height();
			var sidebar_w = jQuery('#sidebar').outerWidth();
			var layoutarea_w = windowsize_w - sidebar_w;
			var block_row_max = Math.max(BLOCK_MINLIMIT, parseInt(layoutarea_w / BLOCK_SIZE));

			// Position define
			var block_row = 0;
			var startpos_x = startpos_y = 0;
			var maxpos_y = Array();
			for(i=0; i<block_row_max; i++){
					maxpos_y[i] = 0;
			}

			// Each cards calculating layouts.
			jQuery('#blocks > div.block').each(function() {
					var item_width = jQuery(this).outerWidth();
					var item_height = jQuery(this).outerHeight();
					var block_rowsize = Math.floor(item_width / BLOCK_WIDTH);
					if(block_rowsize == 1){
							// Detect block position.
							// Scan for all rows, detect min height.
							block_row = 0;
							var minpos_y = maxpos_y.min();
							for(i=block_row_max; i>=0; i--){
									if(minpos_y == maxpos_y[i]){
											block_row = i;
									}
							}
							startpos_x = block_row * BLOCK_SIZE;
							startpos_y = maxpos_y[block_row];

							// Animation.
							jQuery(this).animate({
											left: startpos_x + 'px',
											top: startpos_y + BLOCK_MARGIN + 'px',
											borderWidth: BLOCK_MARGIN + 'px'
									},
									BLOCK_ANIMATE_DURATION,
									BLOCK_ANIMATE_TYPE
							);

							// Lock field for this block.
							maxpos_y[block_row] = maxpos_y[block_row] + item_height + BLOCK_MARGIN;
					}else if(block_rowsize == 2){
							// Detect block position.
							// Scan for all rows, detect min height with doublesized block.
							block_row = 0;
							var pos_pair_max = Array();
							for(i=0; i<(block_row_max-1); i++){
									var pair = new Array(maxpos_y[i],  maxpos_y[i+1]);
									pos_pair_max[i] = pair.max();
							}
							var pos_pair_min = pos_pair_max.min();
							for(i=(block_row_max-1); i>=0; i--){
									if(pos_pair_min == pos_pair_max[i]){
											block_row = i;
									}
							}

							startpos_x = block_row * BLOCK_SIZE;
							if(maxpos_y[block_row] >= maxpos_y[block_row+1]){
									startpos_y = maxpos_y[block_row];
							}else{
									startpos_y = maxpos_y[block_row+1];
							}

							// Animation.
							jQuery(this).animate({
											left: startpos_x + 'px',
											top: startpos_y + BLOCK_MARGIN + 'px',
											borderWidth: BLOCK_MARGIN + 'px'
									},
									BLOCK_ANIMATE_DURATION,
									BLOCK_ANIMATE_TYPE
							);

							// Lock fields for this blocks.
							maxpos_y[block_row] = startpos_y + item_height + BLOCK_MARGIN;
							maxpos_y[block_row+1] = startpos_y + item_height + BLOCK_MARGIN;
					}
			});

			// Calculating rendering startpoint.
			var renderpos_x = parseInt((layoutarea_w - (BLOCK_SIZE * block_row_max))/2 );

			// Animate displayareas.
			var footer_h = Math.max(maxpos_y.max(), sidebar_h) + 39;
			var footer_w = BLOCK_SIZE * block_row_max + sidebar_w;
	        if(footer_w <= 790) footer_w = 790;
			jQuery('#footer').animate({
					top: footer_h + 'px',
					left: renderpos_x + 'px',
	                width: footer_w
					},
					BLOCK_ANIMATE_DURATION,
					BLOCK_ANIMATE_TYPE
			);
			jQuery('#header').animate({
					left: renderpos_x + 'px',
	                width: footer_w
					},
					BLOCK_ANIMATE_DURATION,
					BLOCK_ANIMATE_TYPE
			);
			jQuery('#blocks').animate({
					left: renderpos_x + 'px'
					},
					BLOCK_ANIMATE_DURATION,
					BLOCK_ANIMATE_TYPE
			);
			jQuery('#sidebar').animate({
					left: renderpos_x + block_row_max * BLOCK_SIZE + 'px'
					},
					BLOCK_ANIMATE_DURATION,
					BLOCK_ANIMATE_TYPE
			);

	}
})();

