allie test

tab

Tính đến 07-06-2025. Xem phiên bản mới nhất.

Script này sẽ không được không được cài đặt trực tiếp. Nó là một thư viện cho các script khác để bao gồm các chỉ thị meta // @require https://update.greasyfork.ip-ddns.com/scripts/538683/1603235/allie%20test.js

Tabs.AllianceChat = {
  tabOrder: 1100,
  tabLabel: 'Alliance Chat',
  tabDisabled: false,
  myDiv: null,
  chatTimer: null,
  lastTimestamp: 0,
  chatArray: [],
  maxMessages: 100,
  tabId: 'allianceChatTab',
  onlineUsers: [],

  init: function(div){
    var t = Tabs.AllianceChat;
    t.myDiv = div;
    t.createTab();
    t.startChatTimer();
    t.startOnlineUsersTimer();
  },

  hide: function(){
    var t = Tabs.AllianceChat;
    clearTimeout(t.chatTimer);
    clearTimeout(t.onlineUsersTimer);
  },

  show: function(){
    var t = Tabs.AllianceChat;
    t.createTab();
    t.startChatTimer();
    t.startOnlineUsersTimer();
  },

  startChatTimer: function() {
    var t = Tabs.AllianceChat;
    t.updateChat();
    t.chatTimer = setTimeout(t.startChatTimer, 5000); // Update every 5 seconds
  },

  startOnlineUsersTimer: function() {
    var t = Tabs.AllianceChat;
    t.updateOnlineUsers();
    t.onlineUsersTimer = setTimeout(t.startOnlineUsersTimer, 30000); // Update every 30 seconds
  },

  createTab: function(){
    var t = Tabs.AllianceChat;
    var html = '<div class="allianceChatContainer">';
    html += '<div class="chatHeader">'+tx('ALLIANCE CHAT')+'</div>';
    html += '<div class="chatMainArea">';
    html += '<div id="allianceChatBox" class="chatBox"></div>';
    html += '<div id="onlineUsersList" class="onlineUsers"></div>';
    html += '</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;
      }
      .chatMainArea {
        display: flex;
        flex-grow: 1;
      }
      .chatBox {
        flex-grow: 1;
        overflow-y: auto;
        padding: 10px;
        background-color: #f1f2f6;
      }
      .onlineUsers {
        width: 150px;
        overflow-y: auto;
        padding: 10px;
        background-color: #dfe4ea;
        border-left: 1px solid #a4b0be;
      }
      .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;
      }
      .onlineUser {
        margin-bottom: 5px;
        padding: 3px;
        border-radius: 3px;
        background-color: #ffffff;
      }
    `);
  },

  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) {
      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';
    }
  },

  updateOnlineUsers: function() {
    var t = Tabs.AllianceChat;
    t.fetchOnlineUsersFromServer(function(users) {
      t.onlineUsers = users;
      t.displayOnlineUsers();
    });
  },

  fetchOnlineUsersFromServer: function(callback) {
    // This function should make an API call to the game server to fetch online users
    // The implementation will depend on the game's API structure
    // Here's a placeholder using jQuery's ajax method:
    $.ajax({
      url: '/game/alliance_online_users.php', // Replace with actual API endpoint
      method: 'GET',
      success: function(response) {
        if (response.success) {
          callback(response.users);
        } else {
          console.error('Failed to fetch online users:', response.error);
        }
      },
      error: function(xhr, status, error) {
        console.error('Error fetching online users:', error);
      }
    });
  },

  displayOnlineUsers: function() {
    var t = Tabs.AllianceChat;
    var onlineUsersList = ById('onlineUsersList');
    var html = '<div class="onlineUsersHeader">'+tx('Online Users')+'</div>';
    for (var i = 0; i < t.onlineUsers.length; i++) {
      html += '<div class="onlineUser">' + t.escapeHtml(t.onlineUsers[i]) + '</div>';
    }
    onlineUsersList.innerHTML = html;
  },

  escapeHtml: function(unsafe) {
    return unsafe
         .replace(/&/g, "&amp;")
         .replace(/</g, "&lt;")
         .replace(/>/g, "&gt;")
         .replace(/"/g, "&quot;")
         .replace(/'/g, "&#039;");
  }
};