Added compass and TimeOfDay

web/map.js

@@ -69,6 +69,44 @@ MinecraftClock.prototype = {
 	}
 };
 
+function MinecraftTimeOfDay(element) { this.element = element; }
+MinecraftTimeOfDay.prototype = {
+	element: null,
+	create: function(element) {
+		if (!element) element = $('<div/>');
+		this.element = element;
+		return element;
+	},
+	setTime: function(time) {
+		this.element
+			.removeClass('time1')
+			.removeClass('time2')
+			.removeClass('time3')
+			.removeClass('time4')
+			.removeClass('time5')
+			.removeClass('time6')
+			.removeClass('time7')
+			.removeClass('time8')
+			.addClass('time' + time.day)
+			.html("&nbsp;&rlm;&nbsp;")
+			.height(60);
+	}
+};
+
+function MinecraftCompass(element) { this.element = element; }
+MinecraftCompass.prototype = {
+	element: null,
+	create: function(element) {
+		if (!element) element = $('<div/>');
+		this.element = element;
+		return element;
+	},
+	initialize: function() {
+		this.element.html("&nbsp;&rlm;&nbsp;");
+		this.element.height(120);
+	}
+};
+
 function DynMap(options) {
 	var me = this;
 	me.options = options;
@@ -178,6 +216,21 @@ DynMap.prototype = {
 					.appendTo(sidebar)
 		);
 		
+		// The TimeOfDay
+		var timeofday = me.timeofday = new MinecraftTimeOfDay(
+				$('<div/>')
+					.addClass('timeofday')
+					.appendTo(sidebar)
+		);
+		
+		// The Compass
+		var compass = me.compass = new MinecraftCompass(
+				$('<div/>')
+					.addClass('compass')
+					.appendTo(sidebar)
+		);
+		compass.initialize();
+		
 		// TODO: Enable hash-links.
 		/*
 		var link;
@@ -204,6 +257,7 @@ DynMap.prototype = {
 			
 				me.lasttimestamp = update.timestamp;
 				me.clock.setTime(getMinecraftTime(update.servertime));
+				me.timeofday.setTime(me.clock.time);
 
 				var typeVisibleMap = {};
 				var newmarkers = {};

web/minecraft.js

@@ -80,17 +80,37 @@ function getMinecraftHead(player,size,completed) {
 
 function getMinecraftTime(servertime) {
 	servertime = parseInt(servertime);
-	var day = servertime >= 0 && servertime < 13700;
+	var hours = (parseInt(servertime / 1000)+8) % 24;
+	var minutes = parseInt(((servertime / 1000) % 1) * 60);
+	var seconds = parseInt(((((servertime / 1000) % 1) * 60) % 1) * 60);
+	
+	var daytime = 0;
+	if(hours >= 6 && hours <= 7)
+	daytime =  1;
+	if(hours >= 8 && hours <= 9)
+	daytime =  2;
+	if(hours >= 10 && hours <= 17)
+	daytime =  3;
+	if(hours >= 18 && hours <= 19)
+	daytime =  4;
+	if(hours >= 20 && hours <= 21)
+	daytime =  5;
+	if(hours >= 22 && hours <= 23)
+	daytime =  6;
+	if(hours >= 0 && hours <= 3)
+	daytime =  7;
+	if(hours >= 4 && hours <= 5)
+	daytime =  8;
+	
 	return {
 		servertime: servertime,
 		days: parseInt((servertime+8000) / 24000),
 		
 		// Assuming it is day at 8:00
-		hours: (parseInt(servertime / 1000)+8) % 24,
-		minutes: parseInt(((servertime / 1000) % 1) * 60),
-		seconds: parseInt(((((servertime / 1000) % 1) * 60) % 1) * 60),
+		hours: hours,
+		minutes: minutes,
+		seconds: seconds,
 		
-		day: day,
-		night: !day
+		day: daytime,
 	};
 }

web/style.css

@@ -77,6 +77,21 @@ a, a:visited, label {
 .clock.night { background-image: url(clock_night.png); }
 .clock.day { background-image: url(clock_day.png); }
 
+.compass { 
+	background-repeat: no-repeat;
+	background-image: url(compass.png);
+}
+
+.timeofday { background-repeat: no-repeat; }
+.timeofday.time1 { background-image: url(time1.png); }
+.timeofday.time2 { background-image: url(time2.png); }
+.timeofday.time3 { background-image: url(time3.png); }
+.timeofday.time4 { background-image: url(time4.png); }
+.timeofday.time5 { background-image: url(time5.png); }
+.timeofday.time6 { background-image: url(time6.png); }
+.timeofday.time7 { background-image: url(time7.png); }
+.timeofday.time8 { background-image: url(time8.png); }
+
 .alertbox {
 	padding: 5px;
 	position: fixed;