/**
 * Initialize.
 * 
 */
 
$(document).ready(function() {
						   
   /****
   
	$('#homeButton').hover(
		function() {
			$(this).find('img').attr('src', 'images/homeButtonOver.jpg');
		},
		function() {
			$(this).find('img').attr('src', 'images/homeButton.jpg');
		}
	);
	$('#recommendButton').hover(
		function() {
			$(this).find('img').attr('src', 'images/recommendButtonOver.jpg');
		},
		function() {
			$(this).find('img').attr('src', 'images/recommendButton.jpg');
		}
	);
	$('#favoritesButton').hover(
		function() {
			$(this).find('img').attr('src', 'images/favoritesButtonOver.jpg');
		},
		function() {
			$(this).find('img').attr('src', 'images/favoritesButton.jpg');
		}
	);
	
	*/
	
	/*
	$('a.printButtonSmall').hover(printButtonOver, printButtonOut);
	$('a.paintButtonSmall').hover(paintButtonOver, paintButtonOut);
	$('a.paintButtonBig').hover(
		function() {
			$(this).find('img').attr('src', 'images/paintButtonBigOver.png');				
		},
		function() {
			$(this).find('img').attr('src', 'images/paintButtonBig.png');				
		}
	);
	$('a.printButtonBig').hover(
		function() {
			$(this).find('img').attr('src', 'images/printButtonBigOver.png');				
		},
		function() {
			$(this).find('img').attr('src', 'images/printButtonBig.png');				
		}
	);
	
	*/
	
	$('table.categoryBox').hover(categoryBoxOver, categoryBoxOut);
	$('#favoritesButton').click(function(e) {
        e.preventDefault();
        var bookmarkUrl = this.href;
        var bookmarkTitle = this.title;
        if (window.sidebar) { 
        	window.sidebar.addPanel(bookmarkTitle, bookmarkUrl, '');
        } else if(window.external || document.all) {
        	window.external.AddFavorite(bookmarkUrl, bookmarkTitle);
        } else if(window.opera) {
        	$(this).attr("href",bookmarkUrl);
        	$(this).attr("title",bookmarkTitle);
        	$(this).attr("rel","sidebar");
        } else {
        	alert('Tu navegador no soporta esta acción, usa Ctrl + D.');
        }
	});	
});

/**
 * Category box over.
 * 
 */
function categoryBoxOver() {
	$(this).removeClass('borderLightGreenBox');
	$(this).addClass('borderGreenBox');			
}

/**
 * Category box out.
 * 
 */
function categoryBoxOut() {
	$(this).removeClass('borderGreenBox');
	$(this).addClass('borderLightGreenBox');		
}

/**
 * Print button over.
 * 
 */
function printButtonOver() {
	$(this).find('img').attr('src', 'images/printButtonSmallOver.jpg');	
}

/**
 * Print button out.
 * 
 */
function printButtonOut() {
	$(this).find('img').attr('src', 'images/printButtonSmall.jpg');		
}

/**
 * Paint button over.
 * 
 */
function paintButtonOver() {
	$(this).find('img').attr('src', 'images/paintButtonSmallOver.jpg');	
}

/**
 * Paint button out.
 * 
 */
function paintButtonOut() {
	$(this).find('img').attr('src', 'images/paintButtonSmall.jpg');		
}

/**
 * Opens send popup.
 * 
 */
function openSendPopup() {

	// Make content.
	
	var container = $('<div class="form"/>');

	var form = $('<form action="javascript:send();" />')
	$(container).append(form);

	var list = $('<ul/>');
	$(form).append(list);
	
	var nameLabel = $('<li class="label"><label for="recommendName">Tu nombre<span class="separator">&raquo;</span></label></li>');
	$(list).append(nameLabel);
	
	var nameField = $('<li class="field"><div class="roundedCornersInput"><div class="topBorder"><div class="bottomBorder"><div class="topLeftCorner"><div class="topRightCorner"><div class="bottomLeftCorner"><div class="bottomRightCorner"><div class="holder"><input type="text" id="recommendName" /></div></div></div></div></div></div></div></div></li>');
	$(list).append(nameField);

	var mailLabel = $('<li class="label"><label for="recommendMail">Email de destino<span class="separator">&raquo;</span></label></li>');
	$(list).append(mailLabel);
	
	var mailField = $('<li class="field"><div class="roundedCornersInput"><div class="topBorder"><div class="bottomBorder"><div class="topLeftCorner"><div class="topRightCorner"><div class="bottomLeftCorner"><div class="bottomRightCorner"><div class="holder"><input type="text" id="recommendMail" /></div></div></div></div></div></div></div></div></li>');
	$(list).append(mailField);

	var submit = $('<li class="submit"><div class="blueButton"><div class="left"/><div class="center"><input type="submit" value="Enviar"/></div><div class="right"/></div></li>');
	$(list).append(submit);
	
	// Open popup.
	
	$.popup.open('send', container, $('#recommendButton').position().top, ($('#recommendButton').position().left - 150));
	
}

/**
 * Sends.
 * 
 */
function send() {
	$.rpc.send(
		'MailService',
		'recommend',
		[{name:$('#recommendName').val(), mail:$('#recommendMail').val()}],
		function(result) {
			$.popup.close();
			alert('Mail enviado con éxito!');
		},
		function(fault) {
			$.popup.showMessage(fault);
		}
	);
}

//////////////
//          //
// CATEGORY //
//          //
//////////////

var mainCurrentPage = 1;
var mainId;
var mainTotalPages;
var mainFirstPage = 1;

var secondaryCurrentPage = 1;
var secondaryId;
var secondaryTotalPages;
var secondaryFirstPage = 1;

var relatedCurrentPage = 1;
var relatedId;
var relatedTotalPages;
var relatedFirstPage = 1;

/**
 * Gets category box.
 * 
 * @param object record
 */
function getCategoryBox(record) {

	var categoryBox = $('<table class="borderLightGreenBox categoryBox" cellpadding="0" cellspacing="0">');
	$(categoryBox).hover(categoryBoxOver, categoryBoxOut);;
	
	var top = $('<tr class="top"><td class="left"></td><td class="center"></td><td class="right"></td></tr>');
	$(categoryBox).append(top);
	
	var middle = $('<tr class="middle"/>');
	$(categoryBox).append(middle);
	
	var left = $('<td class="left"/>');
	$(middle).append(left);
	
	var center = $('<td class="center"><a href="'+ ((record.path ? (record.path + '/') : '') + record.urlName) +'"><img src="gateway.php?action=download&id='+ record.imageId +'" alt="'+ record.name +'" title="'+ record.name +'"/></a></td>');
	$(middle).append(center);
	
	var right = $('<td class="right"/>');
	$(middle).append(right);
	
	var bottom = $('<tr class="bottom"><td class="left"></td><td class="center"></td><td class="right"></td></tr>');
	$(categoryBox).append(bottom);
	
	return categoryBox;
	
}

/**
 * Gets draw box.
 * 
 * @param object record
 */
function getDrawBox(record) {
	
	var categoryBox = $('<table class="borderLightGreenBox drawBox" cellpadding="0" cellspacing="0">');
	
	var top = $('<tr class="top"><td class="left"></td><td class="center"></td><td class="right"></td></tr>');
	$(categoryBox).append(top);
	
	var middle = $('<tr class="middle"/>');
	$(categoryBox).append(middle);
	
	var left = $('<td class="left"/>');
	$(middle).append(left);
	
	var center = $('<td class="center"/>');
	$(middle).append(center);
	
	var whiteBox = $('<div class="borderWhiteBox"><div class="topBorder"><div class="bottomBorder"><div class="leftBorder"><div class="rightBorder"><div class="topLeftCorner"><div class="topRightCorner"><div class="bottomLeftCorner"><div class="bottomRightCorner"><div class="holder"><a href="'+ record.path +'/'+ record.urlName  +'" alt=" '+ record.name +'" title="'+ record.name +'" ><img title="'+ record.name +'" alt="'+ record.name +'" src="gateway.php?thumb=true&size=s&action=download&id='+ record.imageId +'"/></a></div></div></div></div></div></div></div></div></div></div>');
	$(center).append(whiteBox);
	
	var paintButton = $('<a class="paintButtonSmall" href="'+ record.path +'/'+ record.urlName  +'"><img title="pintar" alt="pintar" src="images/paintButtonSmall.jpg"/></a>');
	$(paintButton).hover(paintButtonOver, paintButtonOut);
	$(whiteBox).append(paintButton);

	var printButton = $('<a href="gateway.php?action=print&amp;id='+ record.imageId +'" class="printButtonSmall" target="_blank"><img title="imprimir" alt="imprimir" src="images/printButtonSmall.jpg"/></a>');
	$(printButton).hover(printButtonOver, printButtonOut);
	$(whiteBox).append(printButton);
	
	var right = $('<td class="right"/>');
	$(middle).append(right);
	
	var bottom = $('<tr class="bottom"><td class="left"></td><td class="center"></td><td class="right"></td></tr>');
	$(categoryBox).append(bottom);
	
	return categoryBox;	
	
}

/**
 * Update categories.
 * 
 * @param string type
 * @param array result
 */
function update(type, result) {

	var totalPages;
	var currentPage;
	var pageLength;
	var firstPage;
	var target;
	
	// Initialize.
	
	if (type != 'recent' && type != 'related') {
		totalPages = mainTotalPages;
		currentPage = mainCurrentPage;
		pageLength = mainPageLength;
		firstPage = mainFirstPage;
		target = 'main';
		id = mainId;
	} 
	else if (type == 'related'){
		totalPages = relatedTotalPages;
		currentPage = relatedCurrentPage;
		pageLength = relatedPageLength;
		firstPage = relatedFirstPage;
		target = 'secondary';
		id = relatedId;		
	}
	else {
		totalPages = secondaryTotalPages;
		currentPage = secondaryCurrentPage;
		pageLength = secondaryPageLength;
		firstPage = secondaryFirstPage;
		target = 'secondary';
		id = secondaryId;		
	}

	// Update data.
	
	if (type != 'recent' && type != 'related') {
		mainTotalPages = Math.ceil(result.count / mainPageLength);
		totalPages = mainTotalPages;			
	} 
	else if(type == 'related'){
		relatedTotalPages = Math.ceil(result.count / relatedPageLength);
		totalPages = relatedTotalPages;		
	}
	else {
		secondaryTotalPages = Math.ceil(result.count / secondaryPageLength);
		totalPages = secondaryTotalPages;		
	}
	
	// Clean navigation.
	
	$('#'+ target +'Navigation div.pages').html('');
	
	// Update navigation.
	
	if ((currentPage - firstPage) > 4) {
		if (type != 'recent' && type != 'related') {
			mainFirstPage += 5;
			firstPage = mainFirstPage;
		} 
		else if(type == 'related'){
		    firstPage = relatedFirstPage;
			relatedFirstPage += 5;	
	    }
		else {
			firstPage = secondaryFirstPage;
			secondaryFirstPage += 5;
		} 
	} else if((currentPage - firstPage) == -1 && firstPage > 1) {
		if (type != 'recent' && type != 'related') {
			mainFirstPage -= 5;
			firstPage = mainFirstPage;
		} 
		else if(type == 'related'){
		    relatedFirstPage -= 5;
			firstPage = relatedFirstPage;
		}
		else {
			secondaryFirstPage -= 5;
			firstPage = secondaryFirstPage;
		}	
	}
	for (var p=firstPage; p<=totalPages; p++) {
		if (p != firstPage) {
			var separator = $('<span>|</span>');
			$('#'+ target +'Navigation div.pages').append(separator);
		}
		var page = $('<a '+ (p == currentPage ? 'class="current"' : '') +' href="javascript:go(\'set\', \''+ type +'\', '+ (id ? id : 'null') +', '+ p +');">'+ p +'</a>');
		$('#'+ target +'Navigation div.pages').append(page);
		if ((p - firstPage) == 4) {
			break;
		}
	}
	
	// Clean.
	
	$('#'+ target +'Boxes ul').remove();
	
	// Render.
	
	var rows = $('<ul/>');
	for (var i=0; i<result.records.length; i++) {
		
		// Make row.
		
		var row = $('<li/>');
		$(rows).append(row);
		
		// Make cols.
		
		var cols = $('<ul/>');
		$(row).append(cols);
		
		// Add columns.
		
		for (var j=0; j<7; j++) {

			// Get record.

			var record = result.records[i + j];
			
			// Check record.
			
			if (!record) {
				break;
			}
			
			// Add column.
			
			var col = $('<li/>');
			$(cols).append(col);
			
			// Make box.

			$(col).append(type == 'category' ? getCategoryBox(record) : getDrawBox(record));
			
		}
		
		// Update index.
		
		i += j;
		
	}

	$('#'+ target +'Boxes').append(rows);
	
}

/**
 * Searchs.
 * 
 */
function search() {
	rpc('search', null, 1, $('#name').val());
}

/**
 * Rpc.
 * 
 * @param string type
 * @param uint id
 * @param uint pageNumber
 * @param string value
 */
function rpc(type, id, pageNumber, value) {
	var service;
	var method;
	var parameters;
	var resultHandler;
	switch (type) {
		case 'category':
			service = 'CategoryService';	
			method = 'search';	
			parameters = [{parentId:id, pageNumber:pageNumber, pageLength:mainPageLength}];
			resultHandler = function(result) {
				mainCurrentPage = pageNumber;	
				mainId = id;
				update(type, result);				
			}
		break;
		case 'draw':
			service = 'DrawService';
			method = 'search';			
			parameters = [{categoryId:id, pageNumber:pageNumber, pageLength:mainPageLength}];
			resultHandler = function(result) {
				mainCurrentPage = pageNumber;	
				mainId = id;
				update(type, result);				
			}
		break;
		case 'lastDraws':
			service = 'DrawService';
			method = 'search';			
			parameters = [{pageNumber:pageNumber, pageLength:mainPageLength, orderBy:'id', desc:true}];
			resultHandler = function(result) {
				mainCurrentPage = pageNumber;
				mainId = id;					
				update(type, result);				
			}		
		break;
		case 'morePainted':
			service = 'DrawService';
			method = 'search';			
			parameters = [{pageNumber:pageNumber, pageLength:mainPageLength, orderBy:'visits', desc:true}];
			resultHandler = function(result) {
				mainCurrentPage = pageNumber;
				mainId = id;					
				update(type, result);				
			}			
		break;
		case 'bestDraws':
			service = 'DrawService';
			method = 'search';			
			parameters = [{pageNumber:pageNumber, pageLength:mainPageLength, orderBy:'ranking', desc:true}];
			resultHandler = function(result) {
				mainCurrentPage = pageNumber;
				mainId = id;					
				update(type, result);				
			}			
		break;
		case 'search':
			service = 'DrawService';
			method = 'search';			
			parameters = [{name:value, categoryId:null, pageNumber:pageNumber, pageLength:mainPageLength}];
			resultHandler = function(result) {
				mainCurrentPage = pageNumber;
				mainId = id;					
				update(type, result);				
			}		
		break;
		case 'recent':
			service = 'DrawService';
			method = 'search';			
			parameters = [{recursive:true, categoryId:id, pageNumber:pageNumber, pageLength:secondaryPageLength}];			
			resultHandler = function(result) {
			    secondaryCurrentPage = pageNumber;
				secondaryId = id;					
				update(type, result);				
			}
		break;
		case 'related':
			service = 'DrawService';
			method = 'search';			
			parameters = [{recursive:true, categoryId:id, pageNumber:pageNumber, pageLength:relatedPageLength}];			
			resultHandler = function(result) {
			    relatedCurrentPage = pageNumber;
				relatedId = id;					
				update(type, result);
			}
		break;
	}
	$.rpc.send(
		service,
		method,
		parameters,
		resultHandler,
		function(fault) {
			alert(fault);
		}
	);		
}

/**
 * Goes.
 * 
 * @param string action
 * @param string type
 * @param uint id
 * @param uint pageNumber
 * @param string value
 */
function go(action, type, id, pageNumber, value) {

	var totalPages;
	var currentPage;
	var target;
	var pageLength;
	
	if (type != 'recent' && type != 'related') {
		mainParentId = id;
		pageLength = mainPageLength;
		totalPages = mainTotalPages;
		currentPage = mainCurrentPage;
		target = 'main';
	} 
	else if(type == 'related'){
	    relatedParentId = id;
		pageLength = relatedPageLength;	
		totalPages = relatedTotalPages;
		currentPage = relatedCurrentPage;
		target = 'secondary';
	}
	else {
		secondaryParentId = id;
		pageLength = secondaryPageLength;	
		totalPages = secondaryTotalPages;
		currentPage = secondaryCurrentPage;
		target = 'secondary';
	}
	switch (action) {
		case 'set':
			if (pageNumber != currentPage) {
				rpc(type, id, pageNumber, value);
			}		
		break;
		case 'previous':
			if (currentPage > 1) {
				rpc(type, id, (currentPage - 1), value);		
			}		
		break;
		case 'next':
			if (totalPages) {
				if ((currentPage + 1) <= totalPages) {
					rpc(type, id, (currentPage + 1), value);			
				}
			} else {
				if ($('#'+ target +'Navigation div.pages a').length > 1) {
					rpc(type, id, (currentPage + 1), value);			
				}		
			}		
		break;
	}	
}

/**
 * Shows player.
 * 
 * @param uint drawId
 * @param uint imageId
 * @param string baseUrl
 * @param string logo
 */
function showPlayer(drawId, imageId, baseUrl, logo) {

	var requiredMajorVersion = 10;
	var requiredMinorVersion = 0;
	var requiredRevision = 0;
	var hasProductInstall = DetectFlashVer(6, 0, 65);
	var hasRequestedVersion = DetectFlashVer(requiredMajorVersion, requiredMinorVersion, requiredRevision);
	
	if (hasProductInstall && !hasRequestedVersion) {
		var MMPlayerType = (isIE == true) ? "ActiveX" : "PlugIn";
		var MMredirectURL = window.location;
	    document.title = document.title.slice(0, 47) + " - Flash Player Installation";
	    var MMdoctitle = document.title;
		AC_FL_RunContent(
			"src", "swfs/playerProductInstall",
			"FlashVars", "MMredirectURL="+MMredirectURL+'&MMplayerType='+MMPlayerType+'&MMdoctitle='+MMdoctitle+"",
			"width", "100%",
			"height", "100%",
			"align", "middle",
			"id", "player",
			"quality", "high",
			"bgcolor", "#eaba02",
			"name", "player",
			"allowScriptAccess","sameDomain",
			"type", "application/x-shockwave-flash",
			"wmode", "transparent",
			"pluginspage", "http://www.adobe.com/go/getflashplayer"
		);
	} else if (hasRequestedVersion) {
		AC_FL_RunContent(
				"src", "swfs/player",
				"width", "100%",
				"height", "100%",
				"align", "middle",
				"id", "player",
				"quality", "high",
				"bgcolor", "#eaba02",
				"name", "player",
				"allowScriptAccess","sameDomain",
				"type", "application/x-shockwave-flash",
				"wmode", "transparent",
				"pluginspage", "http://www.adobe.com/go/getflashplayer",
				"FlashVars", ("imageId="+ imageId +"&drawId="+ drawId + (logo ? "&logo="+ logo : '') +'&baseUrl='+ baseUrl)
		);
	} else {
		var alternateContent = 'Alternate HTML content should be placed here. '
		+ 'This content requires the Adobe Flash Player. '
		+ '<a href=http://www.adobe.com/go/getflash/>Get Flash</a>';
		document.write(alternateContent);
	}	
	
}

/**
 * Resizes
 * 
 * @param uint height
 */
function resize(height) {
	$('#application').css('height', (height +'px'));
}

/**
 * Navigates.
 * 
 * @param string action
 * @param uint drawId
 * @param uint categoryId
 */
function navigate(action, drawId, categoryId) {
	$.rpc.send(
		'DrawService',
		'search',
		[{categoryId:categoryId}],
		function(result) {
			if (result.count > 0) {
				for (var i=0; i<result.records.length; i++) {
					if (result.records[i].id == drawId) {
						var draw;
						switch(action) {
							case 'next':
								draw = result.records[i + 1];							
							break;
							case 'previous':
								draw = result.records[i - 1];								
							break;
						}			
						if (draw) {
							location.href = (draw.path +'/'+ draw.urlName);
						}	
					}
				}
			}
		}
	);
};