Greasy Fork is available in English.
tab
当前为
此脚本不应直接安装。它是供其他脚本使用的外部库，要使用该库请加入元指令 // @require https://update.greasyfork.icu/scripts/538683/1603230/allie%20test.js
Tabs.AllianceChat = {
tabOrder: 1100,
tabLabel: 'Alliance Chat',
tabDisabled: false,
myDiv: null,
chatTimer: null,
lastTimestamp: 0,
chatArray: [],
maxMessages: 100,
tabId: 'allianceChatTab',
init: function(div){
var t = Tabs.AllianceChat;
t.myDiv = div;
t.createTab();
t.startChatTimer();
},
hide: function(){
var t = Tabs.AllianceChat;
clearTimeout(t.chatTimer);
},
show: function(){
var t = Tabs.AllianceChat;
t.createTab();
t.startChatTimer();
},
startChatTimer: function() {
var t = Tabs.AllianceChat;
t.updateChat();
t.chatTimer = setTimeout(t.startChatTimer, 5000); // Update every 5 seconds
},
createTab: function(){
var t = Tabs.AllianceChat;
var html = '<div class="allianceChatContainer">';
html += '<div class="chatHeader">'+tx('ALLIANCE CHAT')+'</div>';
html += '<div id="allianceChatBox" class="chatBox"></div>';
html += '<div class="chatInputContainer">';
html += '<input id="chatMessage" type="text" placeholder="'+tx('Type your message here...')+'">';
html += '<button id="btnSendChat" class="chatButton">'+tx('Send')+'</button>';
html += '</div>';
html += '<div class="chatControls">';
html += '<button id="btnClearChat" class="chatButton">'+tx('Clear Chat')+'</button>';
html += '<button id="btnToggleTimestamp" class="chatButton">'+tx('Toggle Timestamps')+'</button>';
html += '</div>';
html += '</div>';
t.myDiv.innerHTML = html;
t.addEventListeners();
t.applyStyles();
},
addEventListeners: function() {
var t = Tabs.AllianceChat;
ById('btnSendChat').addEventListener('click', t.sendChat, false);
ById('btnClearChat').addEventListener('click', t.clearChat, false);
ById('btnToggleTimestamp').addEventListener('click', t.toggleTimestamps, false);
ById('chatMessage').addEventListener('keypress', function(e){
if (e.keyCode == 13) t.sendChat();
}, false);
},
applyStyles: function() {
GM_addStyle(`
.allianceChatContainer {
display: flex;
flex-direction: column;
height: 500px;
border: 1px solid #ccc;
border-radius: 5px;
overflow: hidden;
}
.chatHeader {
background-color: #4a69bd;
color: white;
padding: 10px;
font-weight: bold;
text-align: center;
}
.chatBox {
flex-grow: 1;
overflow-y: auto;
padding: 10px;
background-color: #f1f2f6;
}
.chatInputContainer {
display: flex;
padding: 10px;
background-color: #dfe4ea;
}
#chatMessage {
flex-grow: 1;
padding: 5px;
border: 1px solid #a4b0be;
border-radius: 3px;
}
.chatButton {
padding: 5px 10px;
margin-left: 5px;
background-color: #4a69bd;
color: white;
border: none;
border-radius: 3px;
cursor: pointer;
}
.chatButton:hover {
background-color: #3c55a5;
}
.chatControls {
display: flex;
justify-content: space-between;
padding: 10px;
background-color: #dfe4ea;
}
.chatMessage {
margin-bottom: 5px;
padding: 5px;
border-radius: 3px;
background-color: #ffffff;
}
.chatSender {
font-weight: bold;
color: #4a69bd;
}
.chatTimestamp {
font-size: 0.8em;
color: #a4b0be;
}
`);
},
updateChat: function() {
var t = Tabs.AllianceChat;
t.fetchChatFromServer(function(newMessages) {
if (newMessages.length > 0) {
t.chatArray = t.chatArray.concat(newMessages);
if (t.chatArray.length > t.maxMessages) {
t.chatArray = t.chatArray.slice(-t.maxMessages);
}
t.displayChat();
}
});
},
fetchChatFromServer: function(callback) {
// This function should make an API call to the game server to fetch new chat messages
// The implementation will depend on the game's API structure
// Here's a placeholder using jQuery's ajax method:
$.ajax({
url: '/game/alliance_chat.php', // Replace with actual API endpoint
method: 'GET',
data: { lastTimestamp: Tabs.AllianceChat.lastTimestamp },
success: function(response) {
if (response.success) {
Tabs.AllianceChat.lastTimestamp = response.lastTimestamp;
callback(response.messages);
} else {
console.error('Failed to fetch chat:', response.error);
}
},
error: function(xhr, status, error) {
console.error('Error fetching chat:', error);
}
});
},
displayChat: function() {
var t = Tabs.AllianceChat;
var chatBox = ById('allianceChatBox');
var html = '';
for (var i = 0; i < t.chatArray.length; i++) {
var chat = t.chatArray[i];
html += '<div class="chatMessage">';
html += '<span class="chatSender">' + chat.sender + ': </span>';
html += '<span class="chatContent">' + t.escapeHtml(chat.message) + '</span>';
html += '<span class="chatTimestamp"> ' + new Date(chat.timestamp).toLocaleTimeString() + '</span>';
html += '</div>';
}
chatBox.innerHTML = html;
chatBox.scrollTop = chatBox.scrollHeight;
},
sendChat: function() {
var t = Tabs.AllianceChat;
var chatInput = ById('chatMessage');
var message = chatInput.value.trim();
if (message) {
// Send the message to the game server
t.sendChatToServer(message, function(success) {
if (success) {
chatInput.value = '';
t.updateChat(); // Fetch latest messages including the one just sent
} else {
console.error('Failed to send message');
}
});
}
},
sendChatToServer: function(message, callback) {
// This function should make an API call to send the chat message to the game server
// The implementation will depend on the game's API structure
// Here's a placeholder using jQuery's ajax method:
$.ajax({
url: '/game/send_alliance_chat.php', // Replace with actual API endpoint
method: 'POST',
data: { message: message },
success: function(response) {
if (response.success) {
callback(true);
} else {
console.error('Failed to send chat:', response.error);
callback(false);
}
},
error: function(xhr, status, error) {
console.error('Error sending chat:', error);
callback(false);
}
});
},
clearChat: function() {
var t = Tabs.AllianceChat;
t.chatArray = [];
t.displayChat();
},
toggleTimestamps: function() {
var timestamps = ByCl('chatTimestamp');
for (var i = 0; i < timestamps.length; i++) {
timestamps[i].style.display = timestamps[i].style.display === 'none' ? '' : 'none';
}
},
escapeHtml: function(unsafe) {
return unsafe
.replace(/&/g, "&")
.replace(/</g, "<")
.replace(/>/g, ">")
.replace(/"/g, """)
.replace(/'/g, "'");
}
};