Integrate new tab completion methods

There is now an option to choose which tab completion method to use.
Also, emotes can be tab completed.

www/js/data.js

@@ -123,7 +123,8 @@ var USEROPTS = {
     show_shadowchat      : getOrDefault("show_shadowchat", false),
     emotelist_sort       : getOrDefault("emotelist_sort", true),
     no_emotes            : getOrDefault("no_emotes", false),
-    strip_image          : getOrDefault("strip_image", false)
+    strip_image          : getOrDefault("strip_image", false),
+    chat_tab_method      : getOrDefault("chat_tab_method", "Cycle options")
 };
 
 /* Backwards compatibility check */

www/js/tabcomplete.js

@@ -2,7 +2,7 @@ CyTube.tabCompleteMethods = {};
 
 // Bash-style completion
 // Only completes as far as it is possible to maintain uniqueness of the completion.
-CyTube.tabCompleteMethods['Longest unique prefix'] = function (input, position, options, context) {
+CyTube.tabCompleteMethods['Longest unique match'] = function (input, position, options, context) {
     var lower = input.toLowerCase();
     // First, backtrack to the nearest whitespace to find the
     // incomplete string that should be completed.
@@ -10,12 +10,12 @@ CyTube.tabCompleteMethods['Longest unique prefix'] = function (input, position,
     var incomplete = '';
     for (start = position - 1; start >= 0; start--) {
         if (/\s/.test(lower[start])) {
-            start++;
             break;
         }
 
         incomplete = lower[start] + incomplete;
     }
+    start++;
 
     // Nothing to complete
     if (!incomplete.length) {
@@ -101,12 +101,12 @@ CyTube.tabCompleteMethods['Cycle options'] = function (input, position, options,
     var incomplete = '';
     for (start = position - 1; start >= 0; start--) {
         if (/\s/.test(lower[start])) {
-            start++;
             break;
         }
 
         incomplete = lower[start] + incomplete;
     }
+    start++;
 
     // Nothing to complete
     if (!incomplete.length) {

www/js/ui.js

@@ -111,7 +111,11 @@ $("#guestname").keydown(function (ev) {
     }
 });
 
-function chatTabComplete() {
+
+/**
+ * TODO: Remove this post-deployment
+ */
+function oldChatTabComplete() {
     var words = $("#chatline").val().split(" ");
     var current = words[words.length - 1].toLowerCase();
     if (!current.match(/^[\w-]{1,20}$/)) {
@@ -186,6 +190,54 @@ function chatTabComplete() {
     $("#chatline").val(words.join(" "));
 }
 
+CyTube.chatTabCompleteData = {
+    context: {}
+};
+
+function chatTabComplete() {
+    if (!CyTube.tabCompleteMethods) {
+        oldChatTabComplete();
+        return;
+    }
+    var chatline = document.getElementById("chatline");
+    var currentText = chatline.value;
+    var currentPosition = chatline.selectionEnd;
+    if (typeof currentPosition !== 'number' || !chatline.setSelectionRange) {
+        // Bail, we're on IE8 or something similarly dysfunctional
+        return;
+    }
+    var firstWord = !/\s/.test(currentText.trim());
+    var options = [];
+    var userlistElems = document.getElementById("userlist").children;
+    for (var i = 0; i < userlistElems.length; i++) {
+        var username = userlistElems[i].children[1].textContent;
+        if (firstWord) {
+            username += ':';
+        }
+        options.push(username);
+    }
+
+    CHANNEL.emotes.forEach(function (emote) {
+        options.push(emote.name);
+    });
+
+    var method = USEROPTS.chat_tab_method;
+    if (!CyTube.tabCompleteMethods[method]) {
+        console.error("Unknown chat tab completion method '" + method + "', using default");
+        method = "Cycle options";
+    }
+
+    var result = CyTube.tabCompleteMethods[method](
+            currentText,
+            currentPosition,
+            options,
+            CyTube.chatTabCompleteData.context
+    );
+
+    chatline.value = result.text;
+    chatline.setSelectionRange(result.newPosition, result.newPosition);
+}
+
 $("#chatline").keydown(function(ev) {
     // Enter/return
     if(ev.keyCode == 13) {
@@ -218,7 +270,11 @@ $("#chatline").keydown(function(ev) {
         return;
     }
     else if(ev.keyCode == 9) { // Tab completion
-        chatTabComplete();
+        try {
+            chatTabComplete();
+        } catch (error) {
+            console.error(error);
+        }
         ev.preventDefault();
         return false;
     }

www/js/util.js

@@ -643,6 +643,7 @@ function showUserOptions() {
     $("#us-sendbtn").prop("checked", USEROPTS.chatbtn);
     $("#us-no-emotes").prop("checked", USEROPTS.no_emotes);
     $("#us-strip-image").prop("checked", USEROPTS.strip_image);
+    $("#us-chat-tab-method").val(USEROPTS.chat_tab_method);
 
     $("#us-modflair").prop("checked", USEROPTS.modhat);
     $("#us-shadowchat").prop("checked", USEROPTS.show_shadowchat);
@@ -677,6 +678,7 @@ function saveUserOptions() {
     USEROPTS.chatbtn              = $("#us-sendbtn").prop("checked");
     USEROPTS.no_emotes            = $("#us-no-emotes").prop("checked");
     USEROPTS.strip_image          = $("#us-strip-image").prop("checked");
+    USEROPTS.chat_tab_method      = $("#us-chat-tab-method").val();
 
     if (CLIENT.rank >= 2) {
         USEROPTS.modhat      = $("#us-modflair").prop("checked");