From afd190b7cc1924a360ab1aa50c41807a5c7eda6b Mon Sep 17 00:00:00 2001
From: mappu <mappu04@gmail.com>
Date: Sun, 5 Feb 2017 17:48:25 +1300
Subject: [PATCH] client: chat scrollback with ctrl+up / ctrl+down

---
 client/dcwebui.js | 48 ++++++++++++++++++++++++++++++++++++++++++++---
 1 file changed, 45 insertions(+), 3 deletions(-)

diff --git a/client/dcwebui.js b/client/dcwebui.js
index 041f3b8..ef9fdf0 100644
--- a/client/dcwebui.js
+++ b/client/dcwebui.js
@@ -4,6 +4,7 @@
 "use strict";
 
 var SENTINEL_PASSWORD = "************";
+var CHAT_SCROLLBACK_LIMIT = 50; // Once over 2x $limit, the first $limit will be trimmed off the list
 
 var $ = (document.querySelectorAll ? 
 	function(s) {
@@ -69,6 +70,15 @@ var textContent = function($el) {
 	return "";
 };
 
+var negmod = function(l, r) {
+	var ret = l % r;
+	if (l < 0) {
+		return ret + r;
+	} else {
+		return ret;
+	}
+};
+
 // @ref https://developer.mozilla.org/en/docs/Web/API/WindowBase64/Base64_encoding_and_decoding
 var b64 = function(str) {
     return btoa(encodeURIComponent(str).replace(/%([0-9A-F]{2})/g, function(match, p1) {
@@ -323,6 +333,12 @@ var submit = function() {
 			sock.emit('pub', {'message' : str});
 		}
 		
+		chat_scrollback.push( str );
+		chat_scrollback_index = -1;
+		if (chat_scrollback.length > (2*CHAT_SCROLLBACK_LIMIT)) {
+			chat_scrollback = chat_scrollback.slice(CHAT_SCROLLBACK_LIMIT);
+		}
+		
 	} else {
 		write("tab-main").system("Invalid internal state.");
 	}
@@ -673,6 +689,23 @@ var STATE_READY_FOR_LOGIN = 0;
 var STATE_CONNECTING      = 1;
 var STATE_ACTIVE          = 2;
 
+var chat_scrollback = [];
+var chat_scrollback_index = -1;
+
+var scrollback_move = function(delta) {
+	if (chat_scrollback.length === 0) {
+		return; // no effect
+	}
+	
+	if (chat_scrollback_index === -1) {
+		chat_scrollback_index = (delta === 1) ? 0 : chat_scrollback.length - 1;
+	} else {
+		chat_scrollback_index = negmod(chat_scrollback_index + delta, chat_scrollback.length);
+	}
+	
+	$("#chatbox").value = chat_scrollback[chat_scrollback_index];
+};
+
 /* */
 
 var persistence_set = function(key, value) {
@@ -708,7 +741,6 @@ var transition = function(new_state) {
 		
 		case STATE_CONNECTING: {
 			$("#chatbox").disabled = true;
-			
 		} break;
 		
 		case STATE_ACTIVE: {
@@ -736,14 +768,24 @@ window.onload = function() {
 	};
 	
 	$("#chatbox").onkeydown = function(ev) {
-		if (ev.keyCode === 9) {
-			// tab
+		if (ev.keyCode === 9 /* Tab */) {
 			tabcompletion_start();
 			ev.preventDefault();
 			return false;
+				
+		} else if (ev.keyCode == 38 /* ArrowUp */ && ev.ctrlKey) {
+			scrollback_move(-1);
+			ev.preventDefault();
+			return false;
+			
+		} else if (ev.keyCode == 40 /* ArrowDown */ && ev.ctrlKey) {
+			scrollback_move(1);
+			ev.preventDefault();
+			return false;
 			
 		} else {
 			tabcompletion_inactive();
+			chat_scrollback_index = -1; // clear
 		}
 	};