From 8cb615e2916c39068c067fb27817b357cc40ed91 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
+};