Adds repeated message squashing to chat. (#33605)

* Adds repeated message squashing to chat.

* Forgot to actually use the pref

* Drops some unnecessary css

* No trimming same thing three times

* Increases size of repeats up to 24px, fixes scrolling

code/modules/goonchat/browserassets/css/browserOutput.css

@@ -38,6 +38,19 @@ img.icon {
 	vertical-align: bottom;
 }
 
+
+.r:before { /* "repeated" badge class for combined messages */
+	content: 'x';
+}
+.r {
+		display: inline;
+		padding: .2em .6em .3em;
+		font-size: 75%;
+		font-weight: 700;
+		line-height: 1;
+		color: #f00;
+}
+
 a {color: #0000ff;}
 a.visited {color: #ff00ff;}
 a:visited {color: #ff00ff;}

code/modules/goonchat/browserassets/html/browserOutput.html

@@ -39,6 +39,7 @@
 			<a href="#" class="subCell togglePing" id="togglePing"><span>Toggle ping display</span> <i class="icon-circle"></i></a>
 			<a href="#" class="subCell highlightTerm" id="highlightTerm"><span>Highlight string</span> <i class="icon-tag"></i></a>
 			<a href="#" class="subCell saveLog" id="saveLog"><span>Save chat log</span> <i class="icon-save"></i></a>
+			<a href="#" class="subCell toggleCombine" id="toggleCombine"><span>Toggle line combining</span> <i class="icon-filter"></i></a>
 			<a href="#" class="subCell clearMessages" id="clearMessages"><span>Clear all messages</span> <i class="icon-eraser"></i></a>
 		</div>
 		<div class="sub" id="subAudio">

code/modules/goonchat/browserassets/js/browserOutput.js

@@ -22,7 +22,7 @@ window.onerror = function(msg, url, line, col, error) {
 
 //Globals
 window.status = 'Output';
-var $messages, $subOptions, $subAudio, $selectedSub, $contextMenu, $filterMessages;
+var $messages, $subOptions, $subAudio, $selectedSub, $contextMenu, $filterMessages, $last_message;
 var opts = {
 	//General
 	'messageCount': 0, //A count...of messages...
@@ -68,6 +68,8 @@ var opts = {
 	
 	'defaultMusicVolume': 25,
 
+	'messageCombining': true,
+
 };
 
 function clamp(val, min, max) {
@@ -294,27 +296,54 @@ function output(message, flag) {
 		opts.messageCount--; //I guess the count should only ever equal the limit
 	}
 
-	//Actually append the message
-	var entry = document.createElement('div');
-	entry.className = 'entry';
-
-	if (filteredOut) {
-		entry.className += ' hidden';
-		entry.setAttribute('data-filter', filteredOut);
+	var handled = false;
+	var trimmed_message = message.trim()
+	var lastmessages = $messages.children('div.entry:last-child');
+	if (opts.messageCombining && lastmessages.length && $last_message)
+	{
+		if($last_message == trimmed_message)
+		{
+			if(lastmessages.children('span.r').length)
+			{
+				var current_value = parseInt(lastmessages.children('span.r').text())
+				lastmessages.children('span.r').text(current_value+1)
+			}
+			else
+			{
+				lastmessages.append($('<span/>', { 'class': 'r', 'text': 2}));
+			}
+			if(parseInt(lastmessages.css("font-size")) < 24) //Completely arbitrary max size
+				lastmessages.css("font-size","+=2")
+			opts.messageCount--;
+			handled = true;
+		}
+	}
+
+	if(!handled)
+	{
+		//Actually append the message
+		var entry = document.createElement('div');
+		entry.className = 'entry';
+
+		if (filteredOut) {
+			entry.className += ' hidden';
+			entry.setAttribute('data-filter', filteredOut);
+		}
+
+		$last_message = trimmed_message;
+		entry.innerHTML = trimmed_message;
+		$messages[0].appendChild(entry);
+		$(entry).find("img.icon").error(iconError);
+		//Actually do the snap
+		//Stuff we can do after the message shows can go here, in the interests of responsiveness
+		if (opts.highlightTerms && opts.highlightTerms.length > 0) {
+			highlightTerms(entry);
+		}
 	}
 
-	entry.innerHTML = message.trim();
-	$messages[0].appendChild(entry);
-	$(entry).find("img.icon").error(iconError);
-	//Actually do the snap
 	if (!filteredOut && atBottom) {
 		$('body,html').scrollTop($messages.outerHeight());
 	}
-
-	//Stuff we can do after the message shows can go here, in the interests of responsiveness
-	if (opts.highlightTerms && opts.highlightTerms.length > 0) {
-		highlightTerms(entry);
-	}
 }
 
 function internalOutput(message, flag)
@@ -568,6 +597,7 @@ $(function() {
 		'shighlightTerms': getCookie('highlightterms'),
 		'shighlightColor': getCookie('highlightcolor'),
 		'smusicVolume': getCookie('musicVolume'),
+		'smessagecombining': getCookie('messagecombining'),
 	};
 
 	if (savedConfig.sfontSize) {
@@ -606,7 +636,15 @@ $(function() {
 		opts.updatedVolume = newVolume;
 		sendVolumeUpdate();
 		internalOutput('<span class="internal boldnshit">Loaded music volume of: '+savedConfig.smusicVolume+'</span>', 'internal');
-	} else {
+	} 
+	if (savedConfig.smessagecombining) {
+		if (savedConfig.smessagecombining == 'false') {
+			opts.messageCombining = false;
+		} else {
+			opts.messageCombining = true;
+		}
+	}
+	else {
 		$('#adminMusic').prop('volume', opts.defaultMusicVolume / 100);
 	}
 
@@ -922,6 +960,11 @@ $(function() {
 		}
 	});
 
+	$('#toggleCombine').click(function(e) {
+		opts.messageCombining = !opts.messageCombining;
+		setCookie('messagecombining', (opts.messageCombining ? 'true' : 'false'), 365);
+	});
+
 	$('img.icon').error(iconError);