Made clock configurable and split clocks from map.

configuration.txt

@@ -38,6 +38,10 @@ web:
     showplayerfacesinmenu: true
     focuschatballoons: false
     
+    # The clock that is shown alongside the map.
+    clock: timeofday
+    #clock: digital
+    
     # The name of the map shown when opening Dynmap's page (must be in menu).
     defaultmap: defaultmap
     

web/clock.digital.js

@@ -0,0 +1,42 @@
+function MinecraftDigitalClock(element) {
+	this.create(element);
+}
+MinecraftDigitalClock.prototype = {
+	element: null,
+	timeout: null,
+	time: null,
+	create: function(element) {
+		this.element = element;
+		$(element).addClass('clock');
+	},
+	setTime: function(time) {
+		if (this.timeout != null) {
+			window.clearTimeout(this.timeout);
+			this.timeout = null;
+		}
+		this.time = getMinecraftTime(time);
+		this.element
+			.addClass(this.time.day ? 'day' : 'night')
+			.removeClass(this.time.night ? 'day' : 'night')
+			.text(this.formatTime(this.time));
+		
+		if (this.timeout == null) {
+			var me = this;
+			this.timeout = window.setTimeout(function() {
+				me.timeout = null;
+				me.setTime(me.time.servertime+(1000/60));
+			}, 700);
+		}
+	},
+	formatTime: function(time) {
+		var formatDigits = function(n, digits) {
+			var s = n.toString();
+			while (s.length < digits) {
+				s = '0' + s;
+			}
+			return s;
+		}
+		return formatDigits(time.hours, 2) + ':' + formatDigits(time.minutes, 2);
+	}
+};
+clocks.digital = function(element) { return new MinecraftDigitalClock(element); };

web/clock.timeofday.js

@@ -0,0 +1,59 @@
+function MinecraftTimeOfDay(element,elementsun,elementmoon) {
+	this.create(element, elementsun, elementmoon);
+}
+MinecraftTimeOfDay.prototype = {
+	element: null,
+	elementsun: null,
+	elementmoon: null,
+	create: function(element,elementsun,elementmoon) {
+		if (!element) element = $('<div/>');
+		this.element = element;
+		
+		if (!elementsun) elementsun = $('<div/>');
+		this.elementsun = elementsun;
+		this.elementsun.appendTo(this.element);
+		if (!elementmoon) elementmoon = $('<div/>');
+		this.elementmoon = elementmoon;
+		this.elementmoon.appendTo(this.elementsun);
+		this.element.height(60);
+		this.element.addClass('timeofday');
+		this.elementsun.height(60);
+		this.elementsun.addClass('timeofday');
+		this.elementsun.addClass('sun');
+		this.elementmoon.height(60);
+		this.elementmoon.addClass('timeofday');
+		this.elementmoon.addClass('moon');
+		this.elementmoon.html("&nbsp;&rlm;&nbsp;");
+		this.elementsun.css("background-position", (-120) + "px " + (-120) + "px");
+		this.elementmoon.css("background-position", (-120) + "px " + (-120) + "px");
+		
+		return element;
+	},
+	setTime: function(time) {
+		var sunangle;
+		
+		if(time > 23100 || time < 12900)
+		{
+			//day mode
+			var movedtime = time + 900;
+			movedtime = (movedtime >= 24000) ? movedtime - 24000 : movedtime;
+			//Now we have 0 -> 13800 for the day period
+			//Devide by 13800*2=27600 instead of 24000 to compress day
+		    sunangle = ((movedtime)/27600 * 2 * Math.PI);
+		}
+		else
+		{
+			//night mode
+			var movedtime = time - 12900;
+			//Now we have 0 -> 10200 for the night period
+			//Devide by 10200*2=20400 instead of 24000 to expand night
+		    sunangle = Math.PI + ((movedtime)/20400 * 2 * Math.PI);
+		}
+		
+		var moonangle = sunangle + Math.PI;
+		
+		this.elementsun.css("background-position", (-50 * Math.cos(sunangle)) + "px " + (-50 * Math.sin(sunangle)) + "px");
+		this.elementmoon.css("background-position", (-50 * Math.cos(moonangle)) + "px " + (-50 * Math.sin(moonangle)) + "px");
+	}
+};
+clocks.timeofday = function(element) { return new MinecraftTimeOfDay(element); };

web/index.html

@@ -17,7 +17,9 @@
 	<script type="text/javascript" src="custommarker.js"></script>
 	<script type="text/javascript" src="minecraft.js"></script>
 	<script type="text/javascript" src="map.js"></script>
-	<script type="text/javascript" src="kzedmaps.js"></script> 
+	<script type="text/javascript" src="kzedmaps.js"></script>
+	<script type="text/javascript" src="clock.timeofday.js"></script>
+	<script type="text/javascript" src="clock.digital.js"></script> 
 	<script type="text/javascript" src="config.js"></script>
 	<script type="text/javascript">
 	$(document).ready(function() {

web/map.js

@@ -1,6 +1,7 @@
 //if (!console) console = { log: function() {} }; 
 
 var maptypes = {};
+var clocks = {};
 
 function splitArgs(s) {
 	var r = s.split(' ');
@@ -28,107 +29,6 @@ DynMapType.prototype = {
 	}
 };
 
-function MinecraftClock(element) {
-	this.create(element);
-}
-MinecraftClock.prototype = {
-	element: null,
-	timeout: null,
-	time: null,
-	create: function(element) {
-		this.element = element;
-		$(element).addClass('clock');
-	},
-	setTime: function(time) {
-		if (this.timeout != null) {
-			window.clearTimeout(this.timeout);
-			this.timeout = null;
-		}
-		this.time = getMinecraftTime(time);
-		this.element
-			.addClass(this.time.day ? 'day' : 'night')
-			.removeClass(this.time.night ? 'day' : 'night')
-			.text(this.formatTime(this.time));
-		
-		if (this.timeout == null) {
-			var me = this;
-			this.timeout = window.setTimeout(function() {
-				me.timeout = null;
-				me.setTime(me.time.servertime+(1000/60));
-			}, 700);
-		}
-	},
-	formatTime: function(time) {
-		var formatDigits = function(n, digits) {
-			var s = n.toString();
-			while (s.length < digits) {
-				s = '0' + s;
-			}
-			return s;
-		}
-		return formatDigits(time.hours, 2) + ':' + formatDigits(time.minutes, 2);
-	}
-};
-
-function MinecraftTimeOfDay(element,elementsun,elementmoon) {
-	this.create(element, elementsun, elementmoon);
-}
-MinecraftTimeOfDay.prototype = {
-	element: null,
-	elementsun: null,
-	elementmoon: null,
-	create: function(element,elementsun,elementmoon) {
-		if (!element) element = $('<div/>');
-		this.element = element;
-		
-		if (!elementsun) elementsun = $('<div/>');
-		this.elementsun = elementsun;
-		this.elementsun.appendTo(this.element);
-		if (!elementmoon) elementmoon = $('<div/>');
-		this.elementmoon = elementmoon;
-		this.elementmoon.appendTo(this.elementsun);
-		this.element.height(60);
-		this.element.addClass('timeofday');
-		this.elementsun.height(60);
-		this.elementsun.addClass('timeofday');
-		this.elementsun.addClass('sun');
-		this.elementmoon.height(60);
-		this.elementmoon.addClass('timeofday');
-		this.elementmoon.addClass('moon');
-		this.elementmoon.html("&nbsp;&rlm;&nbsp;");
-		this.elementsun.css("background-position", (-120) + "px " + (-120) + "px");
-		this.elementmoon.css("background-position", (-120) + "px " + (-120) + "px");
-		
-		return element;
-	},
-	setTime: function(time) {
-		var sunangle;
-		
-		if(time > 23100 || time < 12900)
-		{
-			//day mode
-			var movedtime = time + 900;
-			movedtime = (movedtime >= 24000) ? movedtime - 24000 : movedtime;
-			//Now we have 0 -> 13800 for the day period
-			//Devide by 13800*2=27600 instead of 24000 to compress day
-		    sunangle = ((movedtime)/27600 * 2 * Math.PI);
-		}
-		else
-		{
-			//night mode
-			var movedtime = time - 12900;
-			//Now we have 0 -> 10200 for the night period
-			//Devide by 10200*2=20400 instead of 24000 to expand night
-		    sunangle = Math.PI + ((movedtime)/20400 * 2 * Math.PI);
-		}
-		
-		var moonangle = sunangle + Math.PI;
-		
-		this.elementsun.css("background-position", (-50 * Math.cos(sunangle)) + "px " + (-50 * Math.sin(sunangle)) + "px");
-		this.elementmoon.css("background-position", (-50 * Math.cos(moonangle)) + "px " + (-50 * Math.sin(moonangle)) + "px");
-	}
-};
-
 function MinecraftCompass(element) { this.element = element; }
 MinecraftCompass.prototype = {
 	element: null,
@@ -284,7 +184,7 @@ DynMap.prototype = {
 			.appendTo(sidebar);
 		
 		// The clock
-		var clock = me.clock = new MinecraftTimeOfDay(
+		var clock = me.clock = clocks[me.options.clock](
 				$('<div/>')
 					.appendTo(sidebar)
 		);