path: root/pages/challengelist.php

<?php
htmlHeader(
	array('tutorial', 'challenge', 'stats'), 'Pathery Challenges', 
	'Challenges', array('scores', 'dateformat')
);

include_once ('./includes/maps.php');
include_once ('./includes/mapoftheday.php');
include_once ('./includes/sqlEmbedded.php');
include_once ('./includes/datas.php');
include_once ('./includes/mapclass.php');
include_once ('./includes/constants.php');

echo soundManager2();
topbar($headerLinks);
?>

<script>

//Legacy functions
function challengeLoad() {}
function challengeWall() {}
function challengeGo() {}

// -display sections labeled..
// -*click
// -display levels
// -*click
// -display map.
// -*finish map:
// -highlight 'Next'

//Temporary hack..
isChallenge = true;

var viewTier;
var viewDepth;

function navShowChallengeTiers() {
}

function navShowLevels(tier) {
	$('#mainDisplay')
		.hide()
		.html("")
		.slideDown('fast');
	
	var urlString = 'ajax/challenges.ajax.php?getChallengeIDs=true';
	urlString += "&userID="+userObj.ID;
	urlString += "&tier="+tier;
	$.ajax({
		type: "GET",  
		url: urlString,
		cache: true,
		data: '', 
		fail: function() { alert("ajax error - if this persists check your connection."); },
		complete: function(data) {showLevelsResponse(data.responseText);}
	});
	viewTier = tier;
}

function showLevelsResponse(response) {
	var json = decryptJSON(response);
	var speedDelay = 100;
	$.each(json, function(key, challengeObj) {
		console.log("tests", speedDelay, key, challengeObj);
		//$("#thumb_"+mapID).html(formatMapThumbForNav(data.responseText)).show();
		
		//var randomSpeed = 500 + Math.floor((Math.random()*300)+1);
		//var speedDelay = 100 + (parseInt(challengeObj.mapObject.ID) * 100);
		speedDelay = speedDelay + 200;
		
		$("#mainDisplay").append(formatChallengeThumbnail(challengeObj.mapObject));
		$('#challengeMapThumb_'+challengeObj.mapObject.ID).hide().fadeIn(speedDelay);
		
		mapdata[challengeObj.mapObject.ID] = challengeObj.mapObject;
	});
	//$("#mainDisplay").append('<div style="float:left; margin:8px; width:200px; height:180px;" class="mapThumbnail">Grayed out Obscured Map Here.</div>').show();
	//$("#mainDisplay").append('<div style="float:left; margin:8px; width:200px; height:180px;" class="mapThumbnail">Grayed out Obscured Map Here.</div>').show();
	viewDepth = 1;
	$('#dialogBox').html("Choose a level");
}

function formatChallengeThumbnail(map) {
	var r = '<div id="challengeMapThumb_'+map.ID+'" onclick="displayChallengeMap('+map.ID+')"';
	r+= 'style="float:left; margin:8px;width:200px;height:180px;" class="mapThumbnail">';
	r+= mapThumbnailHTML(map,200, 160)+'</div>';
	return r;
}

function displayChallengeMap(challengeMapID) {
	$("#mainDisplay").html(mapAsHTML(mapdata[challengeMapID]));
	getmapdata(challengeMapID);
	
	var urlString = 'ajax/challenges.ajax.php?getChallenges=true&challengeMapID='+challengeMapID;
	urlString += "&userID="+userObj.ID;
	$.ajax({
		type: "GET",  
		url: urlString,
		cache: true,
		data: '', 
		fail: function() { alert("ajax error - if this persists check your connection."); },
		complete: function(data) {
			$("#mainDisplay").append(challengesHTML(data.responseText, challengeMapID));
		}
	});
	$("#mainDisplay").append(challengeNextBtn(challengeMapID));
	$("#mainDisplay").append(challengePrevBtn(challengeMapID));
	viewDepth = 2;
}

function challengeNextBtn(challengeMapID) {
	var next = (challengeMapID-0)+1;
	return '<a class="next" id="challengesNextBtn" href="javascript:displayChallengeMap('+next+')" >Next &gt;</a>';
}
function challengePrevBtn(challengeMapID) {
	var prev = challengeMapID-1;
	return '<a class="next" id="challengesPrevBtn" href="javascript:displayChallengeMap('+prev+')" >&lt; Prev</a>';
}


function back() {
	if (viewDepth == 2) navShowLevels(viewTier);
	if (viewDepth == 1) showChallengeTiers();
}

function challengesHTML(response, challengeMapID) {
	
	var json = decryptJSON(response);
	var r = '<div id="challenges">';
	r += '<div id="challenges_title">Challenges:</div>';
	r += '<div id="challenges_listing"><ul class="challenge_ulist">';
	
	console.log('CC', json, challengeMapID);
	
	var cssClass;
	$.each(json, function(key, challenge) {
		console.log('d', key, challenge);
		if (challenge.dateSolved) { 
			cssClass = 'challenge_complete'; 
		} else { 
			cssClass = 'challenge_incomplete';
		}
		//TODO: for first incomplete challenge
		//if (challenge.dialogStart) {
			$('#dialogBox').html(challenge.dialogStart);
		//}
	
		var loadSolutionString = " <a href='javascript:requestChallengeSolution(\""+challengeMapID+"\", \""+challenge.challengeID+"\");'> Load this solution</a>";
		r += "<li class='"+cssClass+"' id='challenge_id_"+challenge.challengeID+"'>"
		r += getChallengeDisplayString(challenge) + loadSolutionString + "</li>";
	});
	r += "</ul></div></div>";
	return r;
}

/**
 * Returns a user-friendly string describing the challenge.
 * Example: "Get at least 245, using at most 10 walls and starting from (6,2)
 */
function getChallengeDisplayString(challenge)
{
	var returnMe = "";
	if(challenge.goal == 0)
		returnMe += "Complete the maze";
	else if (challenge.inequality == "greater than")
		returnMe += "Get " + challenge.goal + ' or more';
	else if (challenge.inequality == "less than")
		returnMe += "Get LESS THAN " . challenge.goal;
	else //inequality == "equal"
		returnMe += "Get EXACTLY " + challenge.goal;
	
	var restrictions = new Array();
	var addUsingToText = false; //Grammar hack - specifies whether we want to add the word "using" to $returnMe

	//Wall-count restriction
	if(challenge.restrictWallCount)
	{
		restrictions.push("only " + challenge.restrictWallCount + " wall" + (challenge.restrictWallCount == 1 ? "" : "s"));
		addUsingToText = true;
	}

	
	//Wall-placement restriction
	if(challenge.restrictWallPlacement)
	{
		invalidWalls = challenge.restrictWallPlacement.split(".");
		invalidWallsString = invalidWalls.join(") or (");
		restrictions.push("no walls at (" + invalidWallsString + ")");
		addUsingToText = true;
	}
	

	//Teleport-count
	if(challenge.restrictTeleportCount)
	{
		if(challenge.restrictTeleportCount == 0)
			restrictions.push("no teleports");
		else
			restrictions.push("exactly " + challenge.restrictTeleportCount + " teleports");
		addUsingToText = true;
	}
	
	//Teleport points
	if(challenge.restrictTeleportsUsed)
	{
		invalidTeleports = challenge.restrictTeleportsUsed.split(".");
		invalidTeleportsString = invalidTeleports.join(") or (");
		restrictions.push("without using the teleport" + (invalidTeleports.length == 1 ? "" : "s") + " at (" + invalidTeleportsString + ")");
	}
	
	//Start point
	if(challenge.restrictStartPoint)
	{
		restrictions.push("starting from (" + challenge.restrictStartPoint + ")");
	}
	
	//End point
	if(challenge.restrictEndPoint)
	{
		restrictions.push("ending at (" + challenge.restrictEndPoint + ")");
	}
	
	//Here comes the tricky part:  we want to join all the $restriction strings with commas, EXCEPT for the last
	//two, which should be separated by " and ".
	var restrictionCount = restrictions.length;
	if(restrictionCount > 0)
	{
		if(restrictionCount == 1)
		{
			restrictionString = restrictions[0];
		}
		else
		{
			lastRestriction = restrictions[restrictionCount - 1];
			restrictions[restrictionCount - 1] = '';
			restrictionString = restrictions.join(", ") + " and " + lastRestriction;
		}
		
		returnMe += ", " + (addUsingToText ? "using " : "") + restrictionString;
	}
	
	
	returnMe += ".";
	return returnMe;
}


function hideNav() {

}
function showNav() {

}

function showChallengeTiers() {
	$('#dialogBox').html("Choose a tier to play");
	var tmp = "	<div onclick='navShowLevels(0);' style='float:left; margin:20px; border:20px solid white;padding:40px'>";
	tmp += " 	<h2>Easy</h2>";
	tmp += "</div>";
	tmp += "<div onclick='navShowLevels(1);' style='float:left; margin:20px; border:20px solid white;padding:40px'>";
	tmp += "	<h2>Normal</h2>";
	tmp += "</div>";
	tmp += "<div style='float:left; margin:10px; border:10px solid gray;padding:20px'>";
	tmp += "	Hard";
	tmp += "</div>";

	$('#mainDisplay').html(tmp);
}


</script>

<style>

#dialogBox {
	width:96%;
	height:22px;
	background-color:gray;
	color:orange;
	border-radius:10px;
	padding:4px;
	font-size:13pt;
	margin-bottom:10px;
}

</style>

<div id="challengelist_wrapper" class="wrapper" style='overflow: auto;'>
<h3>Challenges</h3>

<div id='backBtn' style='float:left;'><a href='javascript:back();' class='next'>Back</a></div>
<div id='dialogBox'>Greetings tester of test-needed things.</div>


<div id='mainDisplay' style='width:99%;overflow: hidden;'>
	<div title='Start Here' onclick='navShowLevels(0);' style='float:left; margin:20px; border:20px solid white;padding:40px'>
		<h2>Challenges</h2>
	</div>
	<div style='float:left; margin:20px; border:20px solid white;padding:40px'>
		<a href='home'><h2>Daily Maps</h2></a>
	</div>
	<div style='float:left; margin:20px; border:20px solid gray;padding:40px'>
		<h2>Coming Soon</h2>
	</div>
</div>

<div style='clear:both'></div>



</div>
<?
htmlFooter();
exit;

//Check that the user is allowed to do the challenges
if (!$accepted) {
	echo "<center>Please <a href='javascript:showSignin();'>login</a> to do the challenges!</center>";
	echo "<br /><br /></div>";
	htmlFooter();
	return;
}

$userID = $_SESSION['userID'];

if (!hasCompletedTutorial($userID)) {
	echo "<center>Please <a href='tutorial'>complete the tutorial</a> to unlock Challenge mode!</div>";
	htmlFooter();
	return;
}

//TODO: Uncomment
//if (!hasCompletedTutorial($userID)) {
//	echo "<center>Please <a href='tutorial'>complete the tutorial</a> to unlock Challenge mode!</div>";
//	htmlFooter();
//	return;
//}

?>
	<noscript>Sorry, this game requires scripts to run. Please enable javascript and <a href='home'>Reload this site</a>
	<br />This game is best played in <a href='http://www.google.com/chrome'>Google Chrome</a>
	</noscript>
<?

//Display the actual challenge list
$challengeListResultset = loadChallengeListing($userID);
//displayChallengeList($challengeListResultset);
echo getChallengeListHtml($challengeListResultset);

?>

</div>

<?php
htmlFooter();
?>

<?php

function getChallengeListHtml($challengeListResultset) {
	//First gather data to a more useful form.
	while($data = mysql_fetch_array($challengeListResultset)) {
		$tier = $data['challengeTier'];
		$challengeSuborder = $data['challengeSuborder'];
		$ordering = $data['ordering'];
		$challenges[$tier][$challengeSuborder][$ordering] = $data;
	}
	
	$r = '';
	$numCompletedChallenges = 0;
	foreach ($challenges as $tier => $challengeMap) {
		$r .= "<b>Section $tier</b> levels:<div class='challengelist_tier' style='border: 1px solid yellow; overflow: auto;'>";
		foreach ($challengeMap as $challengeSuborder => $challenge) {
			//Hack to get the first element of the array:
			$firstChallenge = $challenge[key($challenge)];
			$challengeMapID = $firstChallenge['challengeMapID'];

			//$mapCode = getMapCode($mapid);
			//$mapCode = $firstChallenge['mapCode'];
			//$map = new map($mapCode);
			//$thumbnail = DisplayMapThumbnail($map);
			
			$r .= "<div class='challengelist_map' onclick='document.location.href=\"challenge?challengeMapID=$challengeMapID\"'>";
			//$r .= "$map->name";
			//$r .= $thumbnail;
			
			$r .= "<div id='innerChallengeMapDspThumb_$challengeMapID'>\n";
			$r .= "</div>\n";
			$r .= "<script>";
			$r .= "	displayMap($challengeMapID, 'innerChallengeMapDspThumb_$challengeMapID', 170, '', '', true, true);";
			$r .= "</script>";

			foreach ($challenge as $ordering => $content) {
				//Each challenge gets its own star
				if($content["dateSolved"] !== NULL)
				{
					$cssClass = "challengelist_complete";
					$numCompletedChallenges++;
				}
				else
				{
					$cssClass = "challengelist_incomplete";
				}
				$r .= "<div class='$cssClass'></div>";
			}
			$r .= "</div>";
			//$r .= "END MAP";
		}
		$r .= "</div>";
	}
	
	$r .= getNextChallengeTierHtml($numCompletedChallenges);
	return $r;
}

function getNextChallengeTierHtml($numCompletedChallenges)
{
	global $tierChallengeRequirements, $userID;
	
	for($nextTier = 0; $nextTier < count($tierChallengeRequirements); $nextTier++)
	{
		$numChallengesForNextTier = numChallengesRemainingForTier($nextTier, $numCompletedChallenges);
		if($numChallengesForNextTier > 0)
			break;
	}
	
	//We've found the tier they're at - verify this matches up with what's in the DB
	//This probably belongs somewhere else, but whatever
	$userCurrentTier = getUserChallengeTier($userID);
	if($userCurrentTier != $nextTier - 1)
	{
		//TODO: Display some sort of "tier XY unlocked" or something
		setUserChallengeTier($userID, $nextTier -1);
	}
	
	//Return the tiers-left html
	if($numChallengesForNextTier == 0)
		return "<div class='challengelist_nexttier>All tiers have been unlocked!</div>";
	
	return "<div class='challengelist_nexttier'>Next tier unlocked in <span class='challengelist_nexttier_requirement'>$numChallengesForNextTier</span>"
		 . "<span class='challengelist_complete'></span></div>";
}

function numChallengesRemainingForTier($tier, $numCompletedChallenges)
{
	global $tierChallengeRequirements;
	
	if($tier >= maxTier())
		return -1;
	if($tierChallengeRequirements[$tier] <= $numCompletedChallenges)
		return 0;
	return ($tierChallengeRequirements[$tier] - $numCompletedChallenges);
}

function maxTier()
{
	global $tierChallengeRequirements;
	
	return (count($tierChallengeRequirements) - 1);
}

// TODO: !! Depreciate
/**
 * Outputs the list of all challenges to the page
 */
function displayChallengeList($challengeListResultset)
{
	echo '<div id="challengelist">';
	$currentTier = -1;
	$currentMap = -1;
	
	while($challenge = mysql_fetch_array($challengeListResultset))
	{
		//Each challenge gets its own header/table
		// echo "<br>L: $currentTier<br>N: ";
		// echo $challenge["challengeTier"];
		// echo "<br>";
		if($challenge["challengeTier"] != $currentTier)
		{
			if($currentTier >= 0)
			{
				echo '</div>';
			}
			$currentTier = $challenge["challengeTier"];
			echo "<div class='challengelist_tier'>Tier $currentTier</div>";
			echo "<div class='challengelist_table'>\n";
		}
		
		//Each map gets it own row
		if($challenge["mapID"] != $currentMap)
		{
			if($currentMap >= 0)
			{
				echo '</div>';
			}
			$currentMap = $challenge["mapID"];
			
			$mapCode = getMapCode($currentMap);
			$map = new map($mapCode);
			$thumbnail = DisplayMapThumbnail($map);
			
			$mapName = $map->name;
			if($mapName == NULL || $mapName == "")
				$mapName = "(unknown)";
			
			echo "<div style='border:1px solid yellow; float:left; padding:5px; background-color: #222;'>
				<div class='challengelist_link' style='cursor:pointer' onclick='document.location.href=\"challenge?mapID=$currentMap\"'>
					
					<a href='challenge?mapID=$currentMap'>$mapName</a>
					$thumbnail
					
				</div>";
			echo "<div class='challengelist_stars'>";
		}
		
		//Each challenge gets its own star
		if($challenge["dateSolved"] !== NULL)
			$cssClass = "challengelist_complete";
		else
			$cssClass = "challengelist_incomplete";
		echo "<div class='$cssClass'></div>";
	}
	echo "</div></div>";
	echo "</div>";
}


?>