// JavaScript Document
var debug = false;
$(window).resize(function(){window.location.href = window.location.href;});
$(function(){
	// position the cells
	positionCells();
	activateCells();
	
});

function activateCells(){
	// over event
	$('.cell').click(function(){
		focusCell(this);
	});
	

}

var cellWidth = 188;
var cellHeight = 188;
var borderWidth = 1;
var marginRight = 7;
var marginBottom = 1;

var focusCellWidth = 578;
var focusCellHeight = 530 + marginBottom;
var flashCellHeight = 343 + marginBottom;

var speedOpen = 300;
var speedClose = 100;

var currentTop = Array();
var currentLeft = Array();

function focusCell(cell){
	unfocusCells();
	// save the current cell's location
	
	//hide thumbnail
	$(cell).children('.thumbnail').addClass('no-display');
	$(cell).children('.flash').removeClass('no-display');
	$(cell).children('.copy').removeClass('no-display');
	
	if ($(cell).is('.copycell')) {
	// do nothing 
	} else {
            currentTop[$(cell).attr('id')] = $(cell).css('top');
            logMe($(cell).attr('id') + ' top: ' + currentTop[$(cell).attr('id')]);
            currentLeft[$(cell).attr('id')] = $(cell).css('left');
            logMe($(cell).attr('id') + ' left: ' + currentLeft[$(cell).attr('id')]);
            $(cell).addClass('active');
            // resize it
            $(cell).css({zIndex: 10});
            // If the cell's going to go outside of the window, resize it from a different corner
            if(parseInt($(cell).css('left')) + focusCellWidth > $(document).width() || parseInt($(cell).css('top')) + focusCellHeight > $(document).height()){
                    // get the top pixels
                    var cellTop = parseInt($(cell).css('top')) - (focusCellHeight - cellHeight) + marginBottom;
                    // get the left pixels
                    var cellLeft = parseInt($(cell).css('left')) - (focusCellWidth - cellWidth);
                    // Higher and wider
                    if(parseInt($(cell).css('left')) + focusCellWidth > $(document).width() && parseInt($(cell).css('top')) + focusCellHeight > $(document).height()){
                            maximiseCell(cell, cellTop, cellLeft);
                    }
                    // Wider
                    else if(parseInt($(cell).css('left')) + focusCellWidth > $(document).width()){
                            maximiseCell(cell, parseInt($(cell).css('top')), cellLeft);
                    }
                    // higher
                    else if(parseInt($(cell).css('top')) + focusCellHeight > $(document).height()){
                            maximiseCell(cell,cellTop, parseInt($(cell).css('left')));
                    }
            } else {
                    maximiseCell(cell,parseInt($(cell).css('top')), parseInt($(cell).css('left')));
            }
	}
}

function unfocusCells(){
	logMe('unfocusing all cells');
	$('.cell').each(function(){
		$(this).removeClass('active');
		$(this).children('.thumbnail').removeClass('no-display');
		$(this).children('.flash').addClass('no-display');
		$(this).children('.copy').addClass('no-display');
		// If is maximised resize it
		if($(this).css("width") == focusCellWidth + "px"){
			// resize it
			$(this).css({zIndex: 1});
			$(this).animate({width: cellWidth + "px", height: cellHeight + "px", top: currentTop[$(this).attr('id')], left: currentLeft[$(this).attr('id')]},speedClose);
		}
	});
}

// maximise the selected cell
function maximiseCell(cell, cellTop, cellLeft){
	// if maximised, minimise it
	if($(cell).width() == focusCellWidth){
		minimiseCell(cell);
		
	} else if($(cell).is('.video')) {
		logMe('maximise cell ' + $(cell).attr('id'));
		$('img.loader').css('display','none');
		$(cell).unbind();
		$('a.close').css('display','block');
		$(cell).animate({width: focusCellWidth + "px", height: flashCellHeight + "px", top: cellTop + 'px', left: cellLeft + 'px'}, speedOpen, "easeOutQuart", function(){
			$(cell).click(function(){minimiseCell(cell)});
		});
		logMe('attatching minimise to ' + $(cell).attr('id'));
	} else {
		$('img.loader').css('display','none');
		logMe('maximise cell ' + $(cell).attr('id'));
		$(cell).unbind();
		$(cell).animate({width: focusCellWidth + "px", height: focusCellHeight + "px", top: cellTop + 'px', left: cellLeft + 'px'}, speedOpen, "easeOutQuart", function(){
                    // Load the image
                    var cellImage = new Image();
                    $(cellImage).load(function(){
                        $(cell).css('background-image', 'url(' + this.src + ')');
                    });
                    cellImage.src = $(cell).attr('rel');
                    $(cell).click(function(){minimiseCell(cell)});
		});
		logMe('attatching minimise to ' + $(cell).attr('id'));
		
	} 
	
}

// minimise function, minimise a specific cell
function minimiseCell(theCell)	{
	logMe('minimising cell with id ' + $(theCell).attr('id'));
	$(theCell).removeClass('active');
	$(theCell).children('.thumbnail').removeClass('no-display');
	$(theCell).children('.flash').addClass('no-display');
	$(theCell).children('.copy').addClass('no-display');
	// resie, unbind the minizmise click and add the focus cell event
	$(theCell).css({zIndex: 1});
	logMe($(theCell).attr('id') + ' top: ' + currentTop[$(theCell).attr('id')]);
	$(theCell).animate({width: cellWidth + "px", height: cellHeight + "px", top: currentTop[$(theCell).attr('id')], left: currentLeft[$(theCell).attr('id')]},speedClose);
	// 
	$(theCell).unbind().click(function(){focusCell(theCell)});
	$('a.close').css('display','none');
	
}

function positionCells()	{
	var i = 1;
	var cellTop = 0;
	var cellLeft = 0;
	var rowCount = 0;
	$('.cell').each(function(){
		// position the cell
		$(this).css({top:cellTop + "px", left:cellLeft + "px"});
		$(this).attr('id','cell-' + i);
		// get the location for the next cell
		// If new row, left = 0
		if((cellLeft + cellWidth + marginRight) > $(document).width() - (cellWidth + marginRight)){
			cellLeft = 0;
			cellTop = cellTop + cellHeight + marginBottom;
			++rowCount;
		}
		// same row
		else {
			cellLeft = cellLeft + cellWidth + marginRight;
			cellTop = (rowCount * (marginBottom + cellHeight));
		}
		++i;
	});
}

$('a.click').click(function() {
	minimiseCell();
});

// LOGGING
function logMe(msg){
	if(debug == true){
		console.log(msg);
	}
}

