Improve message completion

CHANGELOG.md

@@ -1,3 +1,8 @@
+Unreleased
+==========
+
+* Improve message completion
+
 0.51.2 / 2015-09-18
 ==================
 

client/index.html

@@ -258,6 +258,15 @@ <h2>Notifications</h2>
 									<button id="play">Play sound</button>
 								</div>
 							</div>
+							<div class="col-sm-12">
+								<h2>Other</h2>
+							</div>
+							<div class="col-sm-12">
+								<div class="form-group">
+									<label for="afterComplete" style="padding-right: 10px">Text to append after username completion</label>
+									<input type="text" name="afterComplete" id="afterComplete" size="5">
+								</div>
+							</div>
 							<div class="col-sm-12">
 								<h2>About Shout</h2>
 							</div>
@@ -278,7 +287,7 @@ <h2>About Shout</h2>
 					</button>
 					<div class="input">
 						<label for="input" id="nick"></label>
-						<input id="input" class="mousetrap">
+						<input id="input" class="mousetrap" autocomplete="off">
 					</div>
 				</div>
 			</form>

client/js/shout.js

@@ -347,6 +347,7 @@ $(function() {
 		part: true,
 		thumbnails: true,
 		quit: true,
+		afterComplete: "",
 	}, $.cookie("settings"));
 
 	for (var i in options) {
@@ -358,7 +359,11 @@ $(function() {
 	settings.on("change", "input", function() {
 		var self = $(this);
 		var name = self.attr("name");
-		options[name] = self.prop("checked");
+		if (self.is(":checkbox")) {
+			options[name] = self.prop("checked");
+		} else {
+			options[name] = self.val();
+		}
 		$.cookie(
 			"settings",
 			options, {
@@ -378,6 +383,9 @@ $(function() {
 		if (name === "colors") {
 			chat.toggleClass("no-colors", !self.prop("checked"));
 		}
+		if (name === "afterComplete") {
+			initTabCompletion();
+		}
 	}).find("input")
 		.trigger("change");
 
@@ -404,8 +412,14 @@ $(function() {
 	});
 
 	var input = $("#input")
-		.history()
-		.tab(complete, {hint: false});
+		.history();
+
+	initTabCompletion();
+
+	function initTabCompletion() {
+		var settings = $.cookie("settings") || {};
+		$("#input").tab(complete, {hint: false, after: settings.afterComplete});
+	}
 
 	var form = $("#form");