Added a border around the currently selected map

2 files changed, 23 insertions, 15 deletions

diff --git a/css/stats.css b/css/stats.css
index 282f58a..e63be80 100644
--- a/css/stats.css
+++ b/css/stats.css
@@ -111,7 +111,7 @@
 	display:inline-block;
 	padding: 8px;
 	background-color:#334;
-	margin: 3px;
+	margin: 4px;
 	border-radius:10px;
 	cursor:pointer;
 	padding-top: 0px;
@@ -120,23 +120,28 @@
 	background-color:#445;
 }
 
-.mapThumbnail.current {
+.mapThumbnail.selectedMap {
+    border-color: #CC3333;
+    border-style: solid;
+	/* Make sure border-width + margin == .mapThumbnail margin */
+    border-width: 3px;
+	margin: 1px;
+}
+.mapThumbnail.currentlyRunning {
 	background-color: #373737;
     color: #CCCCCC;
 }
-.mapThumbnail.current:hover {
+.mapThumbnail.currentlyRunning:hover {
 	background-color:#474747;
 }
-#currentMapMessage
-{
+#currentlyRunningMessage {
     color: #FF2818;
     display: none;
     text-align: center;
 	padding-bottom: 12px;
 }
 
-#currentMapMessage span
-{
+#currentlyRunningMessage span {
     background-color: #1A1A1A;
     border-radius: 8px 8px 8px 8px;
     padding: 3px 10px;
diff --git a/pages/scores.php b/pages/scores.php
index 9b645c2..90c87bb 100644
--- a/pages/scores.php
+++ b/pages/scores.php
@@ -90,12 +90,16 @@ function displayMapScores(mapID) {
 		$('#scoreDisplay').empty();

 		newDiv.prependTo('#scoreDisplay');

 	}

+

+	//Set the 'selectedMap' class

+	$('.selectedMap').removeClass('selectedMap');

+	var currentMapDiv = $('#thumb_'+mapID).children();

+	currentMapDiv.addClass('selectedMap');

 	

 	//Hack: display the "current map" div for currently running maps

 	//Relies on the fact that the #thumb_<mapId> div has a single child with the 'current' class..

-	var showCurrentMapMessage = $('#thumb_'+mapID).children().hasClass('current');

-	$('#currentMapMessage').toggle(showCurrentMapMessage);

-		

+	var showCurrentMapMessage = currentMapDiv.hasClass('currentlyRunning');

+	$('#currentlyRunningMessage').toggle(showCurrentMapMessage);

 	

 	$("#mapDisplay").fadeOut('fast');

 	displayMap(mapID, "mapDisplay", 682);

@@ -103,7 +107,6 @@ function displayMapScores(mapID) {
 	//console.log(pointerPage, mapID);

 }

 

-

 function updateHash() {

 	var tmp = document.location + '';

 	tmp = tmp.split("#");

@@ -247,10 +250,10 @@ function formatMapThumbForNav(json) {
 	var mapClass = '';

 	var toolTip = 'Inactive map';

 

-	var isActive = mapDate.getTime() > serverToday.getTime();

+	var isCurrentlyRunning = mapDate.getTime() > serverToday.getTime();

 	

-	if (isActive) {

-		mapClass = ' current';

+	if (isCurrentlyRunning) {

+		mapClass = ' currentlyRunning';

 		toolTip = 'This map can still be played.';

 	}

 

@@ -289,7 +292,7 @@ topbar($Links);
 			<div id='mapNavigation'></div>

 		</div>

 	</div>

-	<div id="currentMapMessage"><span>This map is currently running, so points/solutions are not available</span></div>

+	<div id="currentlyRunningMessage"><span>This map hasn't completed yet, so points/solutions are not available</span></div>

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

 	<div>

 		<div class='scoreCol' id='scoreDisplay'></div>