Merge pull request #2286 from thelounge/xpaw/input-history

Reimplement input history

client/js/keybinds.js

@@ -4,6 +4,7 @@ const $ = require("jquery");
 const Mousetrap = require("mousetrap");
 const wrapCursor = require("undate").wrapCursor;
 const utils = require("./utils");
+const form = $("#form");
 const input = $("#input");
 const sidebar = $("#sidebar");
 const windows = $("#windows");
@@ -103,6 +104,60 @@ Mousetrap.bind([
 });
 
 const inputTrap = Mousetrap(input.get(0));
+
+function enableHistory() {
+	const history = [""];
+	let position = 0;
+
+	input.on("input", () => {
+		position = 0;
+	});
+
+	inputTrap.bind("enter", function() {
+		position = 0;
+
+		const text = input.val();
+
+		if (text.length === 0) {
+			return false;
+		}
+
+		// Submit the form when pressing enter instead of inserting a new line
+		form.trigger("submit");
+
+		// Store new message in history if last message isn't already equal
+		if (history[1] !== text) {
+			history.splice(1, 0, text);
+		}
+
+		return false;
+	});
+
+	inputTrap.bind(["up", "down"], function(e, key) {
+		if (e.target.selectionStart !== e.target.selectionEnd || input.data("autocompleting")) {
+			return;
+		}
+
+		if (position === 0) {
+			history[position] = input.val();
+		}
+
+		if (key === "up") {
+			if (position < history.length - 1) {
+				position++;
+			}
+		} else if (position > 0) {
+			position--;
+		}
+
+		input.val(history[position]);
+
+		return false;
+	});
+}
+
+enableHistory();
+
 const colorsHotkeys = {
 	k: "\x03",
 	b: "\x02",

client/js/libs/jquery/inputhistory.js

@@ -1,91 +0,0 @@
-import jQuery from "jquery";
-
-/*!
- * inputhistory
- * https://github.com/erming/inputhistory
- * v0.3.1
- */
-(function($) {
-	$.inputhistory = {};
-	$.inputhistory.defaultOptions = {
-		history: [],
-		preventSubmit: false
-	};
-	
-	$.fn.history = // Alias
-	$.fn.inputhistory = function(options) {
-		options = $.extend(
-			$.inputhistory.defaultOptions,
-			options
-		);
-		
-		var self = this;
-		if (self.length > 1) {
-			return self.each(function() {
-				$(this).history(options);
-			});
-		}
-		
-		var history = options.history;
-		history.push("");
-		
-		var i = 0;
-		self.on("keydown", function(e) {
-			var key = e.which;
-			switch (key) {
-			case 13: // Enter
-				if (e.shiftKey || self.data("autocompleting")) {
-					return; // multiline input
-				}
-				
-				if (self.val() != "") {
-					i = history.length;
-					history[i - 1] = self.val();
-					history.push("");
-					if (history[i - 1] == history[i - 2]) {
-						history.splice(-2, 1);
-						i--;
-					}
-				}
-				if (!options.preventSubmit) {
-					self.parents("form").eq(0).submit();
-				}
-				self.val("");
-				break;
-			
-			case 38: // Up
-			case 40: // Down
-				// NOTICE: This is specific to The Lounge.
-				if (e.ctrlKey || e.altKey || e.metaKey || self.data("autocompleting")) {
-					break;
-				}
-				
-				if (
-					this.value.indexOf("\n") >= 0
-					&&
-					(key === 38 && this.selectionStart > 0)
-					||
-					(key === 40 && this.selectionStart < this.value.length))
-				{
-					return; // don't prevent default
-				}
-
-				history[i] = self.val();
-				if (key == 38 && i != 0) {
-					i--;
-				} else if (key == 40 && i < history.length - 1) {
-					i++;
-				}
-				self.val(history[i]);
-				break;
-			
-			default:
-				return;
-			}
-			
-			e.preventDefault();
-		});
-		
-		return this;
-	}
-})(jQuery);

client/js/lounge.js

@@ -7,7 +7,6 @@ const moment = require("moment");
 const URI = require("urijs");
 
 // our libraries
-require("./libs/jquery/inputhistory");
 require("./libs/jquery/stickyscroll");
 const slideoutMenu = require("./slideout");
 const templates = require("../views");
@@ -212,7 +211,6 @@ $(function() {
 	}
 
 	const input = $("#input")
-		.history()
 		.on("input", function() {
 			const style = window.getComputedStyle(this);