From 478fb115c4cb8dd4cad83cacb41afed50c21ef50 Mon Sep 17 00:00:00 2001
From: Mark Riedesel <mriedesel@gmail.com>
Date: Tue, 27 Sep 2011 04:02:02 +0800
Subject: [PATCH] Added scrollback option to webchat. New configuration option
 "scrollback". false or 0 to disable, any numeric >0 value to enable/set the
 maximum scrollback length.

Doesn't show chat messages prior to the user loading the map page,
but at least it allows users to scroll back and view messages they
may have missed while not paying full attention ot the map.
---
 src/main/resources/configuration.txt |  1 +
 web/css/dynmap_style.css             |  9 ++++++
 web/js/chatbox.js                    | 41 ++++++++++++++++++++--------
 3 files changed, 39 insertions(+), 12 deletions(-)

diff --git a/src/main/resources/configuration.txt b/src/main/resources/configuration.txt
index 7a53d38f..4d47c4e7 100644
--- a/src/main/resources/configuration.txt
+++ b/src/main/resources/configuration.txt
@@ -63,6 +63,7 @@ components:
     type: chatbox
     showplayerfaces: true
     messagettl: 5
+    scrollback: 100
   - class: org.dynmap.ClientComponent
     type: playermarkers
     showplayerfaces: true
diff --git a/web/css/dynmap_style.css b/web/css/dynmap_style.css
index 31de199f..768ca9b6 100644
--- a/web/css/dynmap_style.css
+++ b/web/css/dynmap_style.css
@@ -717,6 +717,15 @@
 	padding: 1px;
 }
 
+.scrollback {
+    max-height:6em !important;
+}
+
+.scrollback:hover {
+	overflow-y: auto !important;
+}
+
+
 .messagerow {
 	position: relative;
 	max-height: 200px;
diff --git a/web/js/chatbox.js b/web/js/chatbox.js
index 7d032533..2dac8769 100644
--- a/web/js/chatbox.js
+++ b/web/js/chatbox.js
@@ -6,7 +6,12 @@ componentconstructors['chatbox'] = function(dynmap, configuration) {
 	var messagelist = $('<div/>')
 		.addClass('messagelist')
 		.appendTo(chat);
-	
+
+	if (dynmap.options.scrollback) {
+		messagelist.addClass('scrollback')
+			.click( function() { $(this).hide(); } );		 
+	}
+
 	if (dynmap.options.allowwebchat) {
 		var chatinput = $('<input/>')
 			.addClass('chatinput')
@@ -25,10 +30,22 @@ componentconstructors['chatbox'] = function(dynmap, configuration) {
 				}
 			})
 			.appendTo(chat);
+
+		if (dynmap.options.scrollback) {
+			chatinput.click(function(){ 
+				var m = $('.messagelist');
+				m.show().scrollTop(m.scrollHeight());
+			});
+		}
 	}
 	
 	var addrow = function(row) {
-		setTimeout(function() { row.remove(); }, (configuration.messagettl * 1000));
+		if (dynmap.options.scrollback) {
+			var c = messagelist.children();
+			c.slice(0, Math.max(0, c.length-dynmap.options.scrollback)).each(function(index, elem){ $(elem).remove(); });
+		} else {
+			setTimeout(function() { row.remove(); }, (configuration.messagettl * 1000));
+		}
 		messagelist.append(row);
 		messagelist.show();
 		messagelist.scrollTop(messagelist.scrollHeight());
@@ -50,7 +67,7 @@ componentconstructors['chatbox'] = function(dynmap, configuration) {
 	
 	$(dynmap).bind('chat', function(event, message) {
 		var playerName = message.name;
-        var playerAccount = message.account;
+		var playerAccount = message.account;
 		var messageRow = $('<div/>')
 			.addClass('messagerow');
 
@@ -58,7 +75,7 @@ componentconstructors['chatbox'] = function(dynmap, configuration) {
 			.addClass('messageicon');
 
 		if (message.source === 'player' && configuration.showplayerfaces &&
-            playerAccount) {
+			playerAccount) {
 			getMinecraftHead(playerAccount, 16, function(head) {
 				messageRow.icon = $(head)
 					.addClass('playerIcon')
@@ -66,13 +83,13 @@ componentconstructors['chatbox'] = function(dynmap, configuration) {
 			});
 		}
 
-        var playerChannelContainer = '';
-        if (message.channel) {
-            playerChannelContainer = $('<span/>').addClass('messagetext')
-            .text('[' + message.channel + '] ')
-            .appendTo(messageRow);
-        }
-            
+		var playerChannelContainer = '';
+		if (message.channel) {
+			playerChannelContainer = $('<span/>').addClass('messagetext')
+			.text('[' + message.channel + '] ')
+			.appendTo(messageRow);
+		}
+			
 		if (message.source === 'player' && configuration.showworld) {
 			var playerWorldContainer = $('<span/>')
 			 .addClass('messagetext')
@@ -91,4 +108,4 @@ componentconstructors['chatbox'] = function(dynmap, configuration) {
 		messageRow.append(playerIconContainer,playerChannelContainer,playerNameContainer,playerMessageContainer);
 		addrow(messageRow);
 	});
-};
\ No newline at end of file
+};