$(document).ready(function(){ //add buttons $('.chatLog').append(`<div class="btn btn-success btn-toggle-chat-events">Game Events</div>`); $('.chatLog').eq(0).css('max-height', '200px'); $('.chatLog').eq(1).css('max-height', '600px'); var events = []; $('.chatLog tr').each(function(){ var isLog; if ($(this).find('td').eq(1).find('span').length){ isLog = $(this).find('td').eq(1).find('span').html() ? false : true; }else{ isLog = $(this).find('td').eq(1).html() ? false : true; } var t = $(this).find('td').eq(0).html().split(':'); var time = (+t[0]) * 60 + (+t[1]); $(this).attr({ 'data-line': $(this).index() + 1, 'data-log': isLog, 'data-time': time }); if (isLog){ var text = $(this).find('td').eq(3).text(); if (text[0] == "["){ var _o = 0; var _c = 0; var _n = ""; for(i = 0; i < text.length; i++){ _o += text[i] == "[" ? 1 : 0; _c += text[i] == "]" ? 1 : 0; _n += text[i]; if (_o == _c){ break; } } text = text.replace(_n, ""); var found = $.grep(events, (e) => { return (text == e.text && time < e.time + 2) ? true : false; }) if(found.length){ $(this).remove(); }else{ $(this).find('td').eq(3).text(text); events.push({ text: text, time: time }); } } } }) $('.btn-toggle-chat-events').on('click', function(){ $(this).toggleClass('off'); $(this).closest('.chatLog').find('tr[data-log="true"]').toggle(); });})
.chatLog{ position: relative;}.btn-toggle-chat-events{ position: sticky; bottom: 10px; left: calc(100% - 100px); font-size: 10px; word-break: break-word; width: 75px; background: #471; color: #000; padding: 6px 6px; border-radius: 3px; box-shadow: inset 0px 0px 0px 1px #FFF2; text-align: center; text-transform: uppercase; cursor: pointer;}.btn-toggle-chat-events:after{ content: "ON"; color: #FFF; font-size: 14px; font-weight: bold; display: inline-block; width: 100%;}.btn-toggle-chat-events.off{ background: #900;}.btn-toggle-chat-events.off:after{ content: "OFF"}.btn-toggle-chat-events:active{ transform: scale(0.96);}
Chat Toggle to select what users to see chat for. Ex: when you want to fast see the conversation of only 2 players. You simply hide all the other messages.