Chat done
This commit is contained in:
@@ -1,36 +1,31 @@
|
||||
let chat =
|
||||
{
|
||||
size: 0,
|
||||
history_limit: 50,
|
||||
container: null,
|
||||
input: null,
|
||||
enabled: false,
|
||||
active: true,
|
||||
historyMsgs: [],
|
||||
currentIndex: 0
|
||||
size: 0,
|
||||
history_limit: 50,
|
||||
container: null,
|
||||
input: null,
|
||||
enabled: false,
|
||||
active: true,
|
||||
historyMsgs: [],
|
||||
currentIndex: 0
|
||||
};
|
||||
|
||||
const MAX_MSG_HISTORY = 12;
|
||||
|
||||
function enableChatInput(enable)
|
||||
{
|
||||
if(chat.active == false
|
||||
&& enable == true)
|
||||
return;
|
||||
|
||||
if (enable != (chat.input != null))
|
||||
{
|
||||
function enableChatInput(enable) {
|
||||
if (chat.active == false
|
||||
&& enable == true)
|
||||
return;
|
||||
|
||||
if (enable != (chat.input != null)) {
|
||||
mp.invoke("focus", enable);
|
||||
|
||||
if (enable)
|
||||
{
|
||||
if (enable) {
|
||||
chat.input = $("#chat").append('<div><input id="chat_msg" type="text" /></div>').children(":last");
|
||||
chat.input.children("input").focus();
|
||||
}
|
||||
else
|
||||
{
|
||||
chat.input.fadeOut('fast', function()
|
||||
{
|
||||
chat.input.children("input").focus();
|
||||
}
|
||||
else {
|
||||
chat.input.fadeOut('fast', function () {
|
||||
chat.input.remove();
|
||||
chat.input = null;
|
||||
});
|
||||
@@ -40,69 +35,76 @@ function enableChatInput(enable)
|
||||
|
||||
var chatAPI =
|
||||
{
|
||||
push: (text) =>
|
||||
{
|
||||
let colorPositions = [];
|
||||
let colors = [];
|
||||
let chatElement = "<li>";
|
||||
push: (text) => {
|
||||
let colorPositions = [];
|
||||
let colors = [];
|
||||
let chatElement = "<li>";
|
||||
|
||||
for (let i = 0; i<text.length; i++) {
|
||||
let colorCheck = `${text[i]}${text[i+ 1]}${text[i + 2]}`;
|
||||
|
||||
if (colorCheck === "!{#") {
|
||||
colorPositions.push(i);
|
||||
}
|
||||
}
|
||||
|
||||
colorPositions.forEach(el => {
|
||||
let sub = text.slice(el, -1);
|
||||
colors.push(sub.slice(3, 9));
|
||||
});
|
||||
|
||||
colorPositions.forEach((el, i) => {
|
||||
let sub = text.slice(colorPositions[i] + 10, colorPositions[i + 1]);
|
||||
chatElement += `<span style='color: ${colors[i]}'>${sub}</span>`;
|
||||
});
|
||||
for (let i = 0; i < text.length; i++) {
|
||||
let colorCheck = `${text[i]}${text[i + 1]}${text[i + 2]}`;
|
||||
|
||||
chatElement += "</li>";
|
||||
if (colorCheck === "!{#") {
|
||||
colorPositions.push(i);
|
||||
}
|
||||
}
|
||||
|
||||
if (chatElement === "<li></li>") {
|
||||
chat.container.prepend("<li>" + text + "</li>");
|
||||
} else {
|
||||
chat.container.prepend(chatElement);
|
||||
}
|
||||
colorPositions.forEach(el => {
|
||||
let sub = text.slice(el, -1);
|
||||
colors.push(sub.slice(3, 9));
|
||||
});
|
||||
|
||||
chat.size++;
|
||||
colorPositions.forEach((el, i) => {
|
||||
let sub = text.slice(colorPositions[i] + 10, colorPositions[i + 1]);
|
||||
chatElement += `<span style='color: ${colors[i]}'>${sub}</span>`;
|
||||
});
|
||||
|
||||
if (chat.size >= chat.history_limit)
|
||||
{
|
||||
chat.container.children(":last").remove();
|
||||
}
|
||||
},
|
||||
|
||||
clear: () =>
|
||||
{
|
||||
chat.container.html("");
|
||||
},
|
||||
|
||||
activate: (toggle) =>
|
||||
{
|
||||
if (toggle == false
|
||||
&& (chat.input != null))
|
||||
enableChatInput(false);
|
||||
|
||||
chat.active = toggle;
|
||||
},
|
||||
|
||||
show: (toggle) =>
|
||||
{
|
||||
if(toggle)
|
||||
$("#chat").show();
|
||||
else
|
||||
$("#chat").hide();
|
||||
|
||||
chat.active = toggle;
|
||||
}
|
||||
var elmnt = document.getElementById("chat_messages");
|
||||
|
||||
chatElement += "</li>";
|
||||
|
||||
var today = new Date();
|
||||
|
||||
|
||||
if (chatElement === "<li></li>") {
|
||||
if (chat.input == null || elmnt.scrollTop == elmnt.scrollHeight - elmnt.clientHeight) {
|
||||
chat.container.append("<li>" + "[" + today.toLocaleTimeString('de-DE') + "] " + text + "</li>");
|
||||
elmnt.scrollTop = elmnt.scrollHeight - elmnt.clientHeight;
|
||||
} else {
|
||||
chat.container.append("<li>" + "[" + today.toLocaleTimeString('de-DE') + "] " + text + "</li>");
|
||||
}
|
||||
} else {
|
||||
chat.container.append(chatElement);
|
||||
}
|
||||
|
||||
chat.size++;
|
||||
|
||||
if (chat.size >= chat.history_limit) {
|
||||
chat.container.children(":last").remove();
|
||||
}
|
||||
},
|
||||
|
||||
clear: () => {
|
||||
chat.container.html("");
|
||||
},
|
||||
|
||||
activate: (toggle) => {
|
||||
if (toggle == false
|
||||
&& (chat.input != null))
|
||||
enableChatInput(false);
|
||||
|
||||
chat.active = toggle;
|
||||
},
|
||||
|
||||
show: (toggle) => {
|
||||
if (toggle)
|
||||
$("#chat").show();
|
||||
else
|
||||
$("#chat").hide();
|
||||
|
||||
chat.active = toggle;
|
||||
}
|
||||
};
|
||||
|
||||
let api = { "chat:push": chatAPI.push, "chat:clear": chatAPI.clear, "chat:activate": chatAPI.activate, "chat:show": chatAPI.show };
|
||||
@@ -111,81 +113,75 @@ for (let fn in api) {
|
||||
mp.events.add(fn, api[fn]);
|
||||
}
|
||||
|
||||
$(document).ready(function()
|
||||
{
|
||||
chat.container = $("#chat ul#chat_messages");
|
||||
|
||||
$(document).ready(function () {
|
||||
chat.container = $("#chat ul#chat_messages");
|
||||
|
||||
$(".ui_element").show();
|
||||
chatAPI.push("Multiplayer started");
|
||||
|
||||
$("body").keyup(function(event)
|
||||
{
|
||||
$("body").keyup(function (event) {
|
||||
if (event.which == 84 && chat.input == null
|
||||
&& chat.active == true)
|
||||
{
|
||||
chat.currentIndex = 0;
|
||||
&& chat.active == true) {
|
||||
chat.currentIndex = 0;
|
||||
enableChatInput(true);
|
||||
event.preventDefault();
|
||||
event.preventDefault();
|
||||
} else if (event.which == 38) {
|
||||
if (chat.historyMsgs.length === 0)
|
||||
return;
|
||||
if (chat.historyMsgs.length === 0)
|
||||
return;
|
||||
|
||||
const previousMessages = chat.historyMsgs;
|
||||
const previousMessages = chat.historyMsgs;
|
||||
|
||||
if (previousMessages.length === chat.currentIndex)
|
||||
return;
|
||||
if (previousMessages.length === chat.currentIndex)
|
||||
return;
|
||||
|
||||
chat.input.children("input").val(previousMessages[chat.currentIndex]);
|
||||
|
||||
chat.input.children("input").val(previousMessages[chat.currentIndex]);
|
||||
|
||||
setTimeout(() => {
|
||||
chat.input.children("input").setSelectionRange(previousMessages[chat.currentIndex].length, previousMessages[chat.currentIndex].length);
|
||||
setTimeout(() => {
|
||||
chat.input.children("input").setSelectionRange(previousMessages[chat.currentIndex].length, previousMessages[chat.currentIndex].length);
|
||||
}, 1);
|
||||
|
||||
chat.currentIndex = chat.currentIndex + 1;
|
||||
} else if (event.which == 40) {
|
||||
if (chat.historyMsgs.length === 0)
|
||||
return;
|
||||
|
||||
|
||||
} else if (event.which == 40) {
|
||||
if (chat.historyMsgs.length === 0)
|
||||
return;
|
||||
const previousMessages = chat.historyMsgs;
|
||||
|
||||
const previousMessages = chat.historyMsgs;
|
||||
if (chat.currentIndex === -1) {
|
||||
chat.input.children("input").val("")
|
||||
return;
|
||||
}
|
||||
|
||||
if (chat.currentIndex === -1) {
|
||||
chat.input.children("input").val("")
|
||||
return;
|
||||
}
|
||||
chat.currentIndex = chat.currentIndex - 1;
|
||||
chat.input.children("input").val(previousMessages[chat.currentIndex]);
|
||||
|
||||
chat.currentIndex = chat.currentIndex - 1;
|
||||
chat.input.children("input").val(previousMessages[chat.currentIndex]);
|
||||
setTimeout(() => {
|
||||
chat.input.children("input").setSelectionRange(previousMessages[chat.currentIndex].length, previousMessages[chat.currentIndex].length);
|
||||
}, 1);
|
||||
}
|
||||
else if (event.which == 13 && chat.input != null) {
|
||||
var value = chat.input.children("input").val();
|
||||
|
||||
setTimeout(() => {
|
||||
chat.input.children("input").setSelectionRange(previousMessages[chat.currentIndex].length, previousMessages[chat.currentIndex].length);
|
||||
}, 1);
|
||||
}
|
||||
else if (event.which == 13 && chat.input != null)
|
||||
{
|
||||
var value = chat.input.children("input").val();
|
||||
if (value.length > 0) {
|
||||
if (chat.historyMsgs.length >= MAX_MSG_HISTORY) {
|
||||
chat.historyMsgs.pop();
|
||||
}
|
||||
|
||||
if (value.length > 0)
|
||||
{
|
||||
if (chat.historyMsgs.length >= MAX_MSG_HISTORY) {
|
||||
chat.historyMsgs.pop();
|
||||
}
|
||||
chat.historyMsgs.unshift(value);
|
||||
chat.currentIndex = 0;
|
||||
var elmnt = document.getElementById("chat_messages");
|
||||
|
||||
chat.historyMsgs.unshift(value);
|
||||
chat.currentIndex = 0;
|
||||
|
||||
if (value[0] == "/")
|
||||
{
|
||||
if (value[0] == "/") {
|
||||
value = value.substr(1);
|
||||
|
||||
if (value.length > 0)
|
||||
mp.invoke("command", value);
|
||||
elmnt.scrollTop = elmnt.scrollHeight - elmnt.clientHeight;
|
||||
}
|
||||
else
|
||||
{
|
||||
else {
|
||||
mp.invoke("chatMessage", value);
|
||||
|
||||
elmnt.scrollTop = elmnt.scrollHeight - elmnt.clientHeight;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user