diff --git a/client/css/style.css b/client/css/style.css
index af9b5605..9f731c39 100644
--- a/client/css/style.css
+++ b/client/css/style.css
@@ -1533,6 +1533,10 @@ kbd {
display: inline-block;
}
+.textcomplete-item .irc-bg {
+ display: block;
+}
+
/**
* Tooltips v0.5.3
* See http://primercss.io/tooltips/
diff --git a/client/js/constants.js b/client/js/constants.js
index e1990158..5c5811fd 100644
--- a/client/js/constants.js
+++ b/client/js/constants.js
@@ -1,5 +1,24 @@
"use strict";
+const colorCodeMap = [
+ ["00", "White"],
+ ["01", "Black"],
+ ["02", "Blue"],
+ ["03", "Green"],
+ ["04", "Red"],
+ ["05", "Brown"],
+ ["06", "Magenta"],
+ ["07", "Orange"],
+ ["08", "Yellow"],
+ ["09", "Light Green"],
+ ["10", "Cyan"],
+ ["11", "Light Cyan"],
+ ["12", "Light Blue"],
+ ["13", "Pink"],
+ ["14", "Grey"],
+ ["15", "Light Grey"],
+];
+
const commands = [
"/away",
"/back",
@@ -36,5 +55,6 @@ const commands = [
];
module.exports = {
+ colorCodeMap: colorCodeMap,
commands: commands
};
diff --git a/client/js/lounge.js b/client/js/lounge.js
index abac9904..fcf9f46a 100644
--- a/client/js/lounge.js
+++ b/client/js/lounge.js
@@ -111,6 +111,45 @@ $(function() {
index: 1
};
+ const foregroundColorStrategy = {
+ id: "foreground-colors",
+ match: /\x03(\d{0,2}|[A-Za-z ]{0,10})$/,
+ search(term, callback) {
+ term = term.toLowerCase();
+ const matchingColorCodes = constants.colorCodeMap
+ .filter(i => i[0].startsWith(term) || i[1].toLowerCase().startsWith(term));
+
+ callback(matchingColorCodes);
+ },
+ template(value) {
+ return `${value[1]}`;
+ },
+ replace(value) {
+ return "\x03" + value[0];
+ },
+ index: 1
+ };
+
+ const backgroundColorStrategy = {
+ id: "background-colors",
+ match: /\x03(\d{2}),(\d{0,2}|[A-Za-z ]{0,10})$/,
+ search(term, callback, match) {
+ term = term.toLowerCase();
+ const matchingColorCodes = constants.colorCodeMap
+ .filter(i => i[0].startsWith(term) || i[1].toLowerCase().startsWith(term))
+ .map(pair => pair.concat(match[1])); // Needed to pass fg color to `template`...
+
+ callback(matchingColorCodes);
+ },
+ template(value) {
+ return `${value[1]}`;
+ },
+ replace(value) {
+ return "\x03$1," + value[0];
+ },
+ index: 2
+ };
+
socket.on("auth", function(data) {
var login = $("#sign-in");
var token;
@@ -724,7 +763,10 @@ $(function() {
chat.find(".chan.active .chat").trigger("msg.sticky"); // fix growing
})
.tab(completeNicks, {hint: false})
- .textcomplete([emojiStrategy, nicksStrategy, chanStrategy, commandStrategy], {
+ .textcomplete([
+ emojiStrategy, nicksStrategy, chanStrategy, commandStrategy,
+ foregroundColorStrategy, backgroundColorStrategy
+ ], {
dropdownClassName: "textcomplete-menu",
placement: "top"
}).on({