Challengesss Challenges... DB Updates. Challenges

1 files changed, 72 insertions, 16 deletions

diff --git a/pages/challengelist.php b/pages/challengelist.php
index d460ef5..db5608e 100644
--- a/pages/challengelist.php
+++ b/pages/challengelist.php
@@ -33,8 +33,10 @@ function challengeGo() {}
 //Temporary hack..
 isChallenge = true;
 
-function navShowChallengeTiers() {
+var viewTier;
+var viewDepth;
 
+function navShowChallengeTiers() {
 }
 
 function navShowLevels(tier) {
@@ -45,6 +47,7 @@ function navShowLevels(tier) {
 	
 	var urlString = 'ajax/challenges.ajax.php?getChallengeIDs=true';
 	urlString += "&userID="+userObj.ID;
+	urlString += "&tier="+tier;
 	$.ajax({
 		type: "GET",  
 		url: urlString,
@@ -52,25 +55,34 @@ function navShowLevels(tier) {
 		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", key, challengeObj);
+		console.log("tests", speedDelay, key, challengeObj);
 		//$("#thumb_"+mapID).html(formatMapThumbForNav(data.responseText)).show();
-		$("#mainDisplay").append(formatChallengeThumbnail(challengeObj.mapObject)).show();
-		mapdata[key] = challengeObj.mapObject;
+		
+		//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();
-	$("#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();
+	//$("#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 onclick="displayChallengeMap('+map.ID+')"';
+	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;
@@ -94,6 +106,7 @@ function displayChallengeMap(challengeMapID) {
 	});
 	$("#mainDisplay").append(challengeNextBtn(challengeMapID));
 	$("#mainDisplay").append(challengePrevBtn(challengeMapID));
+	viewDepth = 2;
 }
 
 function challengeNextBtn(challengeMapID) {
@@ -106,6 +119,11 @@ function challengePrevBtn(challengeMapID) {
 }
 
 
+function back() {
+	if (viewDepth == 2) navShowLevels(viewTier);
+	if (viewDepth == 1) showChallengeTiers();
+}
+
 function challengesHTML(response, challengeMapID) {
 	
 	var json = decryptJSON(response);
@@ -118,8 +136,16 @@ function challengesHTML(response, challengeMapID) {
 	var cssClass;
 	$.each(json, function(key, challenge) {
 		console.log('d', key, challenge);
-		if (challenge.dateSolved) cssClass = 'challenge_complete';
-		else cssClass = 'challenge_incomplete';
+		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>";
@@ -227,20 +253,50 @@ 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 - I'z working on this stuff.</h3>
 
-<div id='backBtn'><a href='' class='next'>Back Btn</a></div>
+<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 onclick='navShowLevels(1);' style='float:left; margin:20px; border:20px solid white;padding:40px'>
+	<div onclick='navShowLevels(0);' style='float:left; margin:20px; border:20px solid white;padding:40px'>
 		<h2>Easy</h2>
 	</div>
-	<div style='float:left; margin:10px; border:10px solid gray;padding:20px'>
-		Normal
+	<div onclick='navShowLevels(1);' style='float:left; margin:20px; border:20px solid white;padding:40px'>
+		<h2>Normal</h2>
 	</div>
 	<div style='float:left; margin:10px; border:10px solid gray;padding:20px'>
 		Hard