var htmlHelper = {
	cutString: function( gameName, maxLength ) {
		if( gameName.length > maxLength ) {
			return gameName.substring(0,40) + "...";
		} else {
			return gameName;
		}
	}
}

var jsonGames = {
	gamesArray: new Array(),
	popularGamesArray: new Array(),
	gameId: -1,
	sort: -1,
	outputType: "",
	gamesOutput: {
		size: 10,
		getGames: function() {
			var listOfGames = "";
			for(var i=0;i<jsonGames.gamesArray.length && i<jsonGames.gamesOutput.size; i++) {
				listOfGames += '<div class="game">';
				listOfGames += '<div class="boxshotContainer"><div class="boxshot">';
				listOfGames += '<a href="/games/'+ jsonGames.gamesArray[i].id+'/">';
				listOfGames += '<img src="http://service.futuremark.com/gom/images/boxshot/' + jsonGames.gamesArray[i].id +'.jpg" />';
				listOfGames += '</a></div></div>';
				listOfGames += '<div class="detailsContainer"><div class="padding">';
				listOfGames += '<a href="/games/'+ jsonGames.gamesArray[i].id+'/"><h2 class="margin">'+ htmlHelper.cutString(jsonGames.gamesArray[i].name, 40)+'</h2></a>';
				listOfGames += '<span class="gameInfoTitle">Publisher:</span><span class="gameInfo"> '+ jsonGames.gamesArray[i].publisher +'</span><br/><span class="gameInfoTitle">Genre:</span><span class="gameInfo"> '+ jsonGames.gamesArray[i].genre +'</span>';
				listOfGames += '<br/><br/><a href="/games/10363/"><img border="0" src="/images/game_page/readmore.gif"/></a>';
				listOfGames += '</div></div>';
				listOfGames += '<div class="gomButtonContainer"><div class="gomButton">';
				listOfGames += '<a href="/gameometer/'+ jsonGames.gamesArray[i].id +'/"><img alt="'+ jsonGames.gamesArray[i].name +' system requirements" src="/images/game_page/gom_not_runned.jpg"/></a>';
				listOfGames += '</div></div>';
				listOfGames += '<div class="reviewButtonContainer"><div class="reviewButton">';
				listOfGames += '<img src="/images/game_page/no_review.jpg"/>';
				listOfGames += '</div></div>';
				listOfGames +='</div>';
			}
			$('div#gameList').html(listOfGames);
		},	
		getDropdown: function() {	
			var options_games = '<option value="-1">Select a Game to find out...</option>';
         	 		$.each(jsonGames.gamesArray, function(i,jsonGame){
            				options_games += '<option value="' + jsonGame.id + '/">' + jsonGame.name + '</option>'; 
       	 		});		
			$('select#gamesDropdown').html(options_games);	
		},
		getPopularBoxshots: function(){
			var boxshotRows = '<div class="row">';
			$.each(jsonGames.popularGamesArray, function(i,jsonGame){	
				if( i < 6 ) {
					boxshotRows += '<div class="boxshotBg" onmouseover="this.className=\'boxshotBg boxshotHover\'" onmouseout="this.className=\'boxshotBg\'"><div class="padding">';
					boxshotRows += '<a href="/gameometer/' + jsonGame.id + '/">';
					boxshotRows += '<div class="boxshot" style="background: url(http://service.futuremark.com/gom/images/boxshot/' + jsonGame.id + '.jpg) center 8px no-repeat;">';
					boxshotRows += '<div class="name">' + jsonGame.name + '</div></div></a></div></div>';			
				}
				if( i == 5 ) {
					boxshotRows += '<div class="clear"></div></div><div class="row">';
				}
				if( i > 5 && i < 12 ) {
					boxshotRows += '<div class="boxshotBg2" onmouseover="this.className=\'boxshotBg2 boxshotHover2\'" onmouseout="this.className=\'boxshotBg2\'"><div class="padding">';
					boxshotRows += '<a href="/gameometer/' + jsonGame.id + '/">';
					boxshotRows += '<div class="boxshot" style="background: url(http://service.futuremark.com/gom/images/boxshot/' + jsonGame.id + '.jpg) center 8px no-repeat;">';
					boxshotRows += '<div class="name">' + jsonGame.name + '</div></div></a></div></div>';
				}
				if( i == 11 ) {
					boxshotRows += '<div class="clear"></div></div>';
				}
			});
			$('#boxshotRows').html(boxshotRows);	
		}
	},
	init: function(){
		$.getJSON('http://service.futuremark.com/gom/ajax/gamesJSON.action?format=json&callback=?', function(jsonData) {
		/*$.getJSON('http://www.yougamers.com/scratch/terovtest/games2_0/jsongames/?callback=?', function(jsonData) {*/
         	 		$.each(jsonData.games, function(i,jsonGame){
				jsonGames.gamesArray.push(jsonGame);	
       	 		});
			if( jsonGames.sort == -1 && jsonGames.outputType.length == 0 ) {
				jsonGames.gamesOutput.getGames();
			}
			if( jsonGames.outputType == "dropdown" ) {
				jsonGames.gamesOutput.getDropdown();
			}			
		});		
	},
	getPopularGames: function() {
		$.getJSON('http://service.futuremark.com/gom/ajax/popularGamesJSON.action?format=json&callback=?', function(jsonData) {
         	 		$.each(jsonData.games, function(i,jsonGame){
				jsonGames.popularGamesArray.push(jsonGame);	
       	 		});
			jsonGames.gamesOutput.getPopularBoxshots();
		});
	}
}