Ahab / Chat hurt eyes

// ==UserScript==
// @name Chat hurt eyes
// @namespace torn.com
// @version 1.3.1
// @author Ahab [1735214]
// @updateURL https://openuserjs.org/meta/Ahab/Chat_hurt_eyes.meta.js
// @require https://jpillora.com/xhook/dist/xhook.js
// @require https://gist.githubusercontent.com/BrockA/2625891/raw/9c97aa67ff9c5d56be34a55ad6c18a314e5eb548/waitForKeyElements.js
// @require https://raw.githubusercontent.com/seballot/spectrum/59bfa41e0dac01d5db8fa1dd63322e9f72561c5e/src/spectrum.js
// @include *torn.com*
// @grant GM_addStyle
// @license MIT
// ==/UserScript==

const sharedStyles = `
[class*="avatar-status-wrapper--online"]{
  background-image: linear-gradient(#c0ff00,#c0ff00)!important;
}
[class*="avatar-status-wrapper--idle"]{
  background-image: linear-gradient(#ff8000,#ff8000)!important;
}
[class*="message__timestamp"]{
  display: none!important
}
[class*="message__avatar"]{
  display: none!important
}
[id="tStamp"]{
  color: #f6f6f6;
  margin-left: 5px;
  font-size: 0.85em;
}
[class*="minimized-chat-box"]>[title^='Faction']{
  background: none!important;
  min-height: 34px;
}
#optionsLabel{
  text-align: center;
}
.optionsRow{
  display: flex;
  justify-content: space-evenly;
}
.optionsRowB{
  display: grid;
  justify-items: center;
}
#chatOptions {
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  padding-bottom: 5px;
}
.h7{
  font-size: 1rem;
  padding-top: 5px;
}
#chatInput{
  width: fit-content;
    align-self: center;
}
[class*="typography___"]>span>a{
  word-break: break-all!important;
}
@media screen and (max-width: 600px){
  [id="tStamp"]{
    color: #f6f6f6;;
    margin-left: 5px;
    font-size: 0.75em;
  }
  .mobileFac{
    align-items: center;
    background: linear-gradient(180deg,#303030,#444 .01%,#363636 55.73%,#2e2e2e 99.99%,#2e2e2e);
    border: none;
    border-radius: 4px 4px 0 0;
    display: flex;
    pointer-events: auto;
    position: relative;
    height: 34px;
  }
  .mobileFac>[class*="minimized-menu-item__"]{
    background: none!important;
  }
  [class^="mobileFac"] [class^="minimized-menu-item__message-count___"]{
    top: -17px;
  }
}
.sp-container{position:absolute;top:0;left:0;display:inline-block;*display:inline;*zoom:1;z-index:9999994;overflow:hidden}.sp-container.sp-flat{position:relative}.sp-container,.sp-container *{-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box}.sp-top{position:relative;width:100%;display:inline-block}.sp-top-inner{position:absolute;top:0;left:0;bottom:0;right:0}.sp-color{position:absolute;top:0;left:0;bottom:0;right:20%}.sp-hue{position:absolute;top:0;right:0;bottom:0;left:84%;height:100%}.sp-clear-enabled .sp-hue{top:33px;height:77.5%}.sp-fill{padding-top:80%}.sp-sat,.sp-val{position:absolute;top:0;left:0;right:0;bottom:0}.sp-alpha-enabled .sp-top{margin-bottom:18px}.sp-alpha-enabled .sp-alpha{display:block}.sp-alpha-handle{position:absolute;top:-4px;bottom:-4px;width:6px;left:50%;cursor:pointer;border:1px solid black;background:white;opacity:.8}.sp-alpha{display:none;position:absolute;bottom:-14px;right:0;left:0;height:8px}.sp-alpha-inner{border:solid 1px #333}.sp-clear{display:none}.sp-clear.sp-clear-display{background-position:center}.sp-clear-enabled .sp-clear{display:block;position:absolute;top:0;right:0;bottom:0;left:84%;height:28px}.sp-container,.sp-replacer,.sp-preview,.sp-dragger,.sp-slider,.sp-alpha,.sp-clear,.sp-alpha-handle,.sp-container.sp-dragging .sp-input,.sp-container button{-webkit-user-select:none;-moz-user-select:-moz-none;-o-user-select:none;user-select:none}.sp-container.sp-input-disabled .sp-input-container{display:none}.sp-container.sp-buttons-disabled .sp-button-container{display:none}.sp-container.sp-palette-buttons-disabled .sp-palette-button-container{display:none}.sp-palette-only .sp-picker-container{display:none}.sp-palette-disabled .sp-palette-container{display:none}.sp-initial-disabled .sp-initial{display:none}.sp-sat{background-image:-webkit-gradient(linear,0 0,100% 0,from(#FFF),to(rgba(204,154,129,0)));background-image:-webkit-linear-gradient(left,#FFF,rgba(204,154,129,0));background-image:-moz-linear-gradient(left,#fff,rgba(204,154,129,0));background-image:-o-linear-gradient(left,#fff,rgba(204,154,129,0));background-image:-ms-linear-gradient(left,#fff,rgba(204,154,129,0));background-image:linear-gradient(to right,#fff,rgba(204,154,129,0));-ms-filter:"progid:DXImageTransform.Microsoft.gradient(GradientType = 1, startColorstr=#FFFFFFFF, endColorstr=#00CC9A81)";filter:progid:DXImageTransform.Microsoft.gradient(GradientType = 1,startColorstr='#FFFFFFFF',endColorstr='#00CC9A81')}.sp-val{background-image:-webkit-gradient(linear,0 100%,0 0,from(#000),to(rgba(204,154,129,0)));background-image:-webkit-linear-gradient(bottom,#000,rgba(204,154,129,0));background-image:-moz-linear-gradient(bottom,#000,rgba(204,154,129,0));background-image:-o-linear-gradient(bottom,#000,rgba(204,154,129,0));background-image:-ms-linear-gradient(bottom,#000,rgba(204,154,129,0));background-image:linear-gradient(to top,#000,rgba(204,154,129,0));-ms-filter:"progid:DXImageTransform.Microsoft.gradient(startColorstr=#00CC9A81, endColorstr=#FF000000)";filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#00CC9A81',endColorstr='#FF000000')}.sp-hue{background:-moz-linear-gradient(top,#f00 0,#ff0 17%,#0f0 33%,#0ff 50%,#00f 67%,#f0f 83%,#f00 100%);background:-ms-linear-gradient(top,#f00 0,#ff0 17%,#0f0 33%,#0ff 50%,#00f 67%,#f0f 83%,#f00 100%);background:-o-linear-gradient(top,#f00 0,#ff0 17%,#0f0 33%,#0ff 50%,#00f 67%,#f0f 83%,#f00 100%);background:-webkit-gradient(linear,left top,left bottom,from(#f00),color-stop(0.17,#ff0),color-stop(0.33,#0f0),color-stop(0.5,#0ff),color-stop(0.67,#00f),color-stop(0.83,#f0f),to(#f00));background:-webkit-linear-gradient(top,#f00 0,#ff0 17%,#0f0 33%,#0ff 50%,#00f 67%,#f0f 83%,#f00 100%);background:linear-gradient(to bottom,#f00 0,#ff0 17%,#0f0 33%,#0ff 50%,#00f 67%,#f0f 83%,#f00 100%)}.sp-1{height:17%;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff0000',endColorstr='#ffff00')}.sp-2{height:16%;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffff00',endColorstr='#00ff00')}.sp-3{height:17%;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#00ff00',endColorstr='#00ffff')}.sp-4{height:17%;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#00ffff',endColorstr='#0000ff')}.sp-5{height:16%;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#0000ff',endColorstr='#ff00ff')}.sp-6{height:17%;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff00ff',endColorstr='#ff0000')}.sp-hidden{display:none !important}.sp-cf:before,.sp-cf:after{content:"";display:table}.sp-cf:after{clear:both}.sp-cf{*zoom:1}@media(max-device-width:480px){.sp-color{right:40%}.sp-hue{left:63%}.sp-fill{padding-top:60%}}.sp-dragger{border-radius:5px;height:5px;width:5px;border:1px solid #fff;background:#000;cursor:pointer;position:absolute;top:0;left:0}.sp-slider{position:absolute;top:0;cursor:pointer;height:3px;left:-1px;right:-1px;border:1px solid #000;background:white;opacity:.8}.sp-container{border-radius:0;background-color:#ececec;border:solid 1px #f0c49b;padding:0}.sp-container,.sp-container button,.sp-container input,.sp-color,.sp-hue,.sp-clear{font:normal 12px "Lucida Grande","Lucida Sans Unicode","Lucida Sans",Geneva,Verdana,sans-serif;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;-ms-box-sizing:border-box;box-sizing:border-box}.sp-top{margin-bottom:3px}.sp-color,.sp-hue,.sp-clear{border:solid 1px #666}.sp-input-container{float:right;width:100px;margin-bottom:4px}.sp-initial-disabled .sp-input-container{width:100%}.sp-input{font-size:12px !important;border:1px inset;padding:4px 5px;margin:0;width:100%;background:transparent;border-radius:3px;color:#222}.sp-input:focus{border:1px solid orange}.sp-input.sp-validation-error{border:1px solid red;background:#fdd}.sp-picker-container,.sp-palette-container{float:left;position:relative;padding:10px;padding-bottom:300px;margin-bottom:-290px}.sp-picker-container{width:172px;border-left:solid 1px #fff}.sp-palette-container{border-right:solid 1px #ccc}.sp-palette-only .sp-palette-container{border:0}.sp-palette .sp-thumb-el{display:block;position:relative;float:left;width:24px;height:15px;margin:3px;cursor:pointer;border:solid 2px transparent}.sp-palette .sp-thumb-el:hover,.sp-palette .sp-thumb-el.sp-thumb-active{border-color:orange}.sp-thumb-el{position:relative}.sp-initial{float:left;border:solid 1px #333}.sp-initial span{width:30px;height:25px;border:0;display:block;float:left;margin:0}.sp-initial .sp-clear-display{background-position:center}.sp-palette-button-container,.sp-button-container{float:right}.sp-replacer{margin:0;overflow:hidden;cursor:pointer;padding:4px;display:inline-block;*zoom:1;*display:inline;border:solid 1px #91765d;background:#eee;color:#333;vertical-align:middle}.sp-replacer:hover,.sp-replacer.sp-active{border-color:#f0c49b;color:#111}.sp-replacer.sp-disabled{cursor:default;border-color:silver;color:silver}.sp-dd{padding:2px 0;height:16px;line-height:16px;float:left;font-size:10px}.sp-preview{position:relative;width:25px;height:20px;border:solid 1px #222;margin-right:5px;float:left;z-index:0}.sp-palette{*width:220px;max-width:220px}.sp-palette .sp-thumb-el{width:16px;height:16px;margin:2px 1px;border:solid 1px #d0d0d0}.sp-container{padding-bottom:0}.sp-container button{background-color:#eee;background-image:-webkit-linear-gradient(top,#eee,#ccc);background-image:-moz-linear-gradient(top,#eee,#ccc);background-image:-ms-linear-gradient(top,#eee,#ccc);background-image:-o-linear-gradient(top,#eee,#ccc);background-image:linear-gradient(to bottom,#eee,#ccc);border:1px solid #ccc;border-bottom:1px solid #bbb;border-radius:3px;color:#333;font-size:14px;line-height:1;padding:5px 4px;text-align:center;text-shadow:0 1px 0 #eee;vertical-align:middle}.sp-container button:hover{background-color:#ddd;background-image:-webkit-linear-gradient(top,#ddd,#bbb);background-image:-moz-linear-gradient(top,#ddd,#bbb);background-image:-ms-linear-gradient(top,#ddd,#bbb);background-image:-o-linear-gradient(top,#ddd,#bbb);background-image:linear-gradient(to bottom,#ddd,#bbb);border:1px solid #bbb;border-bottom:1px solid #999;cursor:pointer;text-shadow:0 1px 0 #ddd}.sp-container button:active{border:1px solid #aaa;border-bottom:1px solid #888;-webkit-box-shadow:inset 0 0 5px 2px #aaa,0 1px 0 0 #eee;-moz-box-shadow:inset 0 0 5px 2px #aaa,0 1px 0 0 #eee;-ms-box-shadow:inset 0 0 5px 2px #aaa,0 1px 0 0 #eee;-o-box-shadow:inset 0 0 5px 2px #aaa,0 1px 0 0 #eee;box-shadow:inset 0 0 5px 2px #aaa,0 1px 0 0 #eee}.sp-cancel{font-size:11px;color:#d93f3f !important;margin:0;padding:2px;margin-right:5px;vertical-align:middle;text-decoration:none}.sp-cancel:hover{color:#d93f3f !important;text-decoration:underline}.sp-palette span:hover,.sp-palette span.sp-thumb-active{border-color:#000}.sp-preview,.sp-alpha,.sp-thumb-el{position:relative;background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAMCAIAAADZF8uwAAAAGUlEQVQYV2M4gwH+YwCGIasIUwhT25BVBADtzYNYrHvv4gAAAABJRU5ErkJggg==)}.sp-preview-inner,.sp-alpha-inner,.sp-thumb-inner{display:block;position:absolute;top:0;left:0;bottom:0;right:0}.sp-palette .sp-thumb-inner{background-position:50% 50%;background-repeat:no-repeat}.sp-palette .sp-thumb-light.sp-thumb-active .sp-thumb-inner{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAASCAYAAABWzo5XAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAIVJREFUeNpiYBhsgJFMffxAXABlN5JruT4Q3wfi/0DsT64h8UD8HmpIPCWG/KemIfOJCUB+Aoacx6EGBZyHBqI+WsDCwuQ9mhxeg2A210Ntfo8klk9sOMijaURm7yc1UP2RNCMbKE9ODK1HM6iegYLkfx8pligC9lCD7KmRof0ZhjQACDAAceovrtpVBRkAAAAASUVORK5CYII=)}.sp-palette .sp-thumb-dark.sp-thumb-active .sp-thumb-inner{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAASCAYAAABWzo5XAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAAadEVYdFNvZnR3YXJlAFBhaW50Lk5FVCB2My41LjEwMPRyoQAAAMdJREFUOE+tkgsNwzAMRMugEAahEAahEAZhEAqlEAZhEAohEAYh81X2dIm8fKpEspLGvudPOsUYpxE2BIJCroJmEW9qJ+MKaBFhEMNabSy9oIcIPwrB+afvAUFoK4H0tMaQ3XtlrggDhOVVMuT4E5MMG0FBbCEYzjYT7OxLEvIHQLY2zWwQ3D+9luyOQTfKDiFD3iUIfPk8VqrKjgAiSfGFPecrg6HN6m/iBcwiDAo7WiBeawa+Kwh7tZoSCGLMqwlSAzVDhoK+6vH4G0P5wdkAAAAASUVORK5CYII=)}.sp-clear-display{background-repeat:no-repeat;background-position:center;background-image:url(data:image/gif;base64,R0lGODlhFAAUAPcAAAAAAJmZmZ2dnZ6enqKioqOjo6SkpKWlpaampqenp6ioqKmpqaqqqqurq/Hx8fLy8vT09PX19ff39/j4+Pn5+fr6+vv7+wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAEAAP8ALAAAAAAUABQAAAihAP9FoPCvoMGDBy08+EdhQAIJCCMybCDAAYUEARBAlFiQQoMABQhKUJBxY0SPICEYHBnggEmDKAuoPMjS5cGYMxHW3IiT478JJA8M/CjTZ0GgLRekNGpwAsYABHIypcAgQMsITDtWJYBR6NSqMico9cqR6tKfY7GeBCuVwlipDNmefAtTrkSzB1RaIAoXodsABiZAEFB06gIBWC1mLVgBa0AAOw==)}
`

const full = `
[class*="chat-box-message__box"]{
  padding: 1px 5px 1px 5px!important;
}
`

const alt = `
[class^="chat-box-body___"]{
  padding: 0 0 0 5px!important;
}
[class*="chat-box-message__box"]{
  padding: 1px 5px 1px 0!important;
  background: var(--chat-box-bg)!important;
  display: inline-block!important;
}
[class*="chat-box-message--"]{
  margin-bottom: 2px!important;
}
[class*="chat-box-message--self"]{
  background: var(--chat-box-bg)!important;
  justify-content: flex-start!important;
}
[class*="chat-box-message--self"]>[class*="chat-box-message"]>p{
  color: var(--chat-box-body-message)!important;
}
[class*="chat-box-message__sender"]{
  display: inline!important;
  font-weight: 700!important;
  font-size: .75rem;
  margin-right: 2px!important;
  align-self: baseline;
}
`
var settings = {}
var chatId = {}
var temp = {}
var userid = 0
var customColor = ""
var activeStyle = ""

if(localStorage.chatSettings === undefined){
    localStorage.chatSettings = JSON.stringify({'version':'full'})
    settings = JSON.parse(localStorage.chatSettings)
}else{
    settings = JSON.parse(localStorage.chatSettings);
    if(!('version' in settings)){
        temp = {}
        temp.version = 'full'
        $.extend(true, settings, temp)
        localStorage.chatSettings = JSON.stringify(settings);
    }
}

if(settings.version == 'full'){
    activeStyle = GM_addStyle(sharedStyles+full)
}else if(settings.version == 'alt'){
    activeStyle = GM_addStyle(sharedStyles+alt)
}

xhook.after(function(request, response) {
    if(request.url.match(/private/)){
        response.clone().text().then((text) => {
            var data = JSON.parse(text)
            if(data.hasOwnProperty('members')){
                $.each(data['members'], function(i, v){
                    if(data['members'][i]['user_id'] !== $('ul[class^="settings-menu"]').find('.link')[0].children[0].href.split("=")[1] && data['members'][i]['profile_url'].indexOf('profile') !== -1){
                        chatId[data['members'][i]['nickname']] = data['members'][i]['user_id']
                    }
                })
            }
        })
        load()
    }
    if(request.url.match(/show_read_receipt/)){
        response.clone().text().then((text) => {
            var data = JSON.parse(text)
            var time = new Date(data['last_message']['created_at']).toJSON().replace('T', ' ').slice(0, -5)
            if(data['name'] == 'private-chat' && data['last_message'] != null && 'created_at' in data['last_message']){
                $.each(data['members'], function(i, v){
                    if(data['members'][i]['user_id'] !== $('ul[class^="settings-menu"]').find('.link')[0].children[0].href.split("=")[1] && $('p[class*="chat-box-header__name"]').length !== 0){
                        $.each($('p[class*="chat-box-header__name"]'), function(o, t){
                            if($('p[class*="chat-box-header__name"]')[o].innerText == data['members'][i]['nickname'] && $($('p[class*="chat-box-header__name"]')[o].parentElement.parentElement).children('#tStamp').length < 1){
                                $($('p[class*="chat-box-header__name"]')[o].parentElement).after('<p id="tStamp" class="tStamp">Last Message: '+time+'</p>')
                            }
                            else if($('p[class*="chat-box-header__name"]')[o].innerText == data['members'][i]['nickname'] && $($('p[class*="chat-box-header__name"]')[o].parentElement.parentElement).children('#tStamp').length == 1){
                                $($('p[class*="chat-box-header__name"]')[o].parentElement).children('#tStamp').replaceWith('<p id="tStamp" class="tStamp">Last Message: '+time+'</p>')
                            }
                        })
                    }
                })
            }else{
                if($('p[class*="chat-box-header__name"]').length !== 0){
                    $.each($('p[class*="chat-box-header__name"]'), function(o, t){
                        if($('p[class*="chat-box-header__name"]')[o].innerText == data['name'] && $($('p[class*="chat-box-header__name"]')[o].parentElement.parentElement).children('#tStamp').length < 1){
                            $($('p[class*="chat-box-header__name"]')[o].parentElement).after('<p id="tStamp" class="tStamp">Last Message: '+time+'</p>')
                        }
                        else if($('p[class*="chat-box-header__name"]')[o].innerText == data['name'] && $($('p[class*="chat-box-header__name"]')[o].parentElement.parentElement).children('#tStamp').length == 1){
                            $($('p[class*="chat-box-header__name"]')[o].parentElement).children('#tStamp').replaceWith('<p id="tStamp" class="tStamp">Last Message: '+time+'</p>')
                        }
                    })
                }
            }
        })
    }
});

/*if($(window).width() < 600){
    $($('button[title*="Faction"]')[0]).detach().insertAfter($('div[class*="group-minimized-chat-box___"]')).wrap('<div class="mobileFac"></div>')
}*/

function load(){
    $.each($('img[alt^="chat-avatar"][class*="avatar--medium"]'), function(i, v){
        var id = $('img[class*="avatar--medium"]')[i].src.split("-")[$('img[alt^="chat-avatar"][class*="avatar--medium"]')[i].src.split("-").length-1].split(".")[0]
        if($('img[class*="avatar--medium"]')[i].src.indexOf('profile') !== -1){
            id = chatId[$('img[class*="avatar--medium"]')[i].parentElement.parentElement.nextSibling.innerText]
        }
        if($('img[alt^="chat-avatar"][class*="avatar--medium"]')[i].parentElement.parentElement.className.indexOf('minimized') !== -1 && $(window).width() >= 600 || $('img[alt^="chat-avatar"][class*="avatar--medium"]')[i].parentElement.parentElement.className.indexOf('minimized') == -1){
            $('img[alt^="chat-avatar"][class*="avatar--medium"]')[i].parentElement.href = "https://www.torn.com/profiles.php?XID="+id
        }
    })
}


var blehTarget = $('div[id^="chatRoot"]')[0];
var blehConfig = { attributes: false, childList: true, characterData: false, subtree: true };
var bleh = new MutationObserver(function(mutations3) {
    var ChatTarget = $('div[class^="group-chat-box"]')[0];
    var ChatConfig = { attributes: false, childList: true, characterData: false, subtree: false };
    var Chat = new MutationObserver(function(mutations2) {
        if(mutations2[0].addedNodes.length == 1 && mutations2[0].addedNodes[0].className.indexOf("unread-message-count") !== -1 && $(mutations2[0].addedNodes)[0].find('[class*="chat-box-header__info-btn___"]').indexOf('btn') !== -1){
            addMini(mutations2)
        }
    })
    Chat.observe(ChatTarget, ChatConfig);

    if($(window).width() >= 600){
        var minChatTarget = $('div[class^="group-minimized-chat-box"]')[0];
        var minChatConfig = { attributes: false, childList: true, characterData: false, subtree: true };
        var minChat = new MutationObserver(function(mutations1) {
            if(mutations1[0].addedNodes.length == 1 && mutations1[0].addedNodes[0].className.indexOf("unread-message-count") !== -1 || mutations1[0].addedNodes.length == 1){
                addMini(mutations1)
            }
        })
        minChat.observe(minChatTarget, minChatConfig);
    }

    var addTarget = $('div[class*="group-chat-box___"]')[0];
    var addConfig = { attributes: false, childList: true, characterData: false, subtree: true };
    var add = new MutationObserver(function(mutations) {
        $('div[class*="chat-box-message___"]').each(function( index ) {
            userid = $(this).find('[class*="hrefLink___"]')[0].href.split('=')[1]
            $($(this).find('[class*="chat-box-message"]')[0]).attr("data-userid", userid)
            if(userid in settings && settings.version == 'full'){
                $('div[data-userid="'+userid+'"]').css("background-color", settings[userid]['bg'])
            }
            else if(userid in settings && settings.version == 'alt'){
                $('div[data-userid="'+userid+'"]').css('cssText', 'background-color:'+settings[userid]['bg']+'!important;')
            }
            if(userid in settings){
                $('div[data-userid="'+userid+'"]').find("p").css('cssText', 'color:'+settings[userid]['fc']+'!important;');
                $('div[data-userid="'+userid+'"]').find("a").css("color", settings[userid]['fc']);
            }
            if(!($('script[uid]').attr("uid") in settings)){
                if(settings.version == 'alt'){
                    $('div[data-userid="'+$('script[uid]').attr("uid")+'"]').find("p").css("cssText", "color:var(--chat-box-body-message)!important; display:inline");
                }
            }
            $('div[class*="chat-box-message__box"] p').css("font-size", settings.fs+"rem");
            $('div[class*="chat-box-message__box"] a').css("font-size", settings.fs+"rem");
            $("[class^=chat-box-body___]" ).each(function(index){
                (this).scrollTop = (this).scrollHeight - (this).clientHeight;
            });
        })
    })
    add.observe(addTarget, addConfig);
    bleh.disconnect();
})
bleh.observe(blehTarget, blehConfig);

function saveId(uid, type, color){
    temp = {}
    temp[uid] = {[type]:color}
    $.extend(true, settings, temp)
    localStorage.chatSettings = JSON.stringify(settings);
}

function removeId(uid, type){
    $('style[id*="'+type+$('script[uid]').attr("uid")+'"]').remove()
    if(settings[uid]){
        delete settings[uid][type]
        if(Object.keys(settings[uid]).length == 0){
            delete settings[uid]
        }
        localStorage.chatSettings = JSON.stringify(settings)
    }
}

function addMini(mutations){
    if($(mutations)[0].target.className.indexOf('minimized') !== -1 && $(window).width() >= 600 || $(mutations)[0].target.className.indexOf('minimized') == -1 && $(window).width() < 600){
        var id = $(mutations[0].addedNodes[0]).find('img[alt^="chat-avatar"]')[0].src.split("-")[$(mutations[0].addedNodes[0]).find('img[alt^="chat-avatar"]')[0].src.split("-").length-1].split(".")[0]
        if($(mutations[0].addedNodes[0]).find('img[alt^="chat-avatar"]')[0].src.indexOf('profile') !== -1){
            id = chatId[$(mutations)[0].addedNodes[0].children[0].children[1].children[0].innerText]
        }
        $(mutations[0].addedNodes[0]).find('img[alt^="chat-avatar"]')[0].parentElement.href = "https://www.torn.com/profiles.php?XID="+id
    }
}

function options(){
    var bgy = getComputedStyle(document.documentElement).getPropertyValue('--chat-box-body-message-box-self')
    var fcy = ""
    if(settings.version == 'full'){
        fcy = "#f6f6f6"
    }else{
        fcy = "var(--chat-box-body-message)"
    }
    var bgt = getComputedStyle(document.documentElement).getPropertyValue('--chat-box-body-message-box')
    var fct = getComputedStyle(document.documentElement).getPropertyValue('--chat-box-body-message')
    var fs = '0.75'
    if($('script[uid]').attr("uid") in settings){
        if('bg' in settings[$('script[uid]').attr("uid")]){
            bgy = settings[$('script[uid]').attr("uid")]['bg']
        }
        if('fc' in settings[$('script[uid]').attr("uid")]){
            fcy = settings[$('script[uid]').attr("uid")]['fc']
        }
    }
    if($('div[class^="chat-box-options___"]').length != 0){
        if($($('div[class^="chat-box-options___"]')[0].parentElement).find('[class^="avatar__avatar-status-wrapper"]')[0].href.split("=")[1] in settings){
            if('bg' in settings[$($('div[class^="chat-box-options___"]')[0].parentElement).find('[class^="avatar__avatar-status-wrapper"]')[0].href.split("=")[1]]){
                bgt = settings[$($('div[class^="chat-box-options___"]')[0].parentElement).find('[class^="avatar__avatar-status-wrapper"]')[0].href.split("=")[1]]['bg']
            }
            if('fc' in settings[$($('div[class^="chat-box-options___"]')[0].parentElement).find('[class^="avatar__avatar-status-wrapper"]')[0].href.split("=")[1]]){
                fct = settings[$($('div[class^="chat-box-options___"]')[0].parentElement).find('[class^="avatar__avatar-status-wrapper"]')[0].href.split("=")[1]]['fc']
            }
        }
    }
    if('fs' in settings){
        fs = settings['fs']
    }
    if($('div[class^="chat-box-options___"]').length == 1 && $('div[class^="chat-box-options___"] [id^="chatOptions"]').length == 0){
        $('div[class^="chat-box-options___"]').children().append('<hr class="delimiter-999 m-top10 m-bottom10"><div id="chatOptions"><div id="optionsLabel" class="h6">Options</div><div class="optionsRowB"><input type="range" min="0.1" max="1.5" value="'+fs+'" step="0.01" class="slider" id="myRange"><p class="typography___Dc5WV body4 color-#333333">Font Size</p></div><div id="optionsLabel" class="h7">You</div><div class="optionsRow"><div><input id="custom" data-color="'+bgy+'" class="bgpickerYou" style="display: none;"><p class="typography___Dc5WV body4 color-#333333">Background</p></div><div><input id="custom" data-color="'+fcy+'" class="fcpickerYou" style="display: none;"><p class="typography___Dc5WV body4 color-#333333 chat-box-options__label___QSXin">Font</p></div></div><div id="optionsLabel" class="h7">Them</div><div class="optionsRow"><div><input id="custom" data-color="'+bgt+'" class="bgpickerThem" style="display: none;"><p class="typography___Dc5WV body4 color-#333333">Background</p></div><div><input id="custom" data-color="'+fct+'" class="fcpickerThem" style="display: none;"><p class="typography___Dc5WV body4 color-#333333 chat-box-options__label___QSXin">Font</p></div></div></div>')
    }
    if($('div[class^="settings-panel___"]').length == 1 && $('div[class^="settings-panel___"] [id^="chatOptions"]').length == 0){
        $('<hr class="delimiter-999 m-top10 m-bottom10"><div id="chatOptions"><div id="optionsLabel" class="h6">Chat Options</div><div class="optionsRowC" style="display: flex; justify-content: space-evenly;"><div style="display: flex; align-items: center;"><input type="checkbox" id="full" style="margin-right: 5px;"><p>Full Chat</p></div><div style="display: flex; align-items: center;"><input type="checkbox" id="alt" style="margin-right: 5px;"><p>Alt Chat</p></div></div><div class="optionsRowB"><input type="range" min="0.1" max="1.5" value="'+fs+'" step="0.01" class="slider" id="myRange"><p class="typography___Dc5WV body4 color-#333333">Font Size</p></div><div id="optionsLabel" class="h7">You</div><div class="optionsRow"><div><input id="custom" data-color="'+bgy+'" class="bgpickerYou" style="display: none;"><p class="typography___Dc5WV body4 color-#333333">Background</p></div><div><input id="custom" data-color="'+fcy+'" class="fcpickerYou" style="display: none;"><p class="typography___Dc5WV body4 color-#333333 chat-box-options__label___QSXin">Font</p></div></div><div id="optionsLabel" class="h7">Them</div><input id="chatInput" type="text" placeholder="Player ID here"/><div class="optionsRow"><div><input id="custom" data-color="'+getComputedStyle(document.documentElement).getPropertyValue('--chat-box-body-message-box')+'" class="bgpickerThem" style="display: none;"><p class="typography___Dc5WV body4 color-#333333">Background</p></div><div><input id="custom" data-color="'+getComputedStyle(document.documentElement).getPropertyValue('--chat-box-body-message')+'" class="fcpickerThem" style="display: none;"><p class="typography___Dc5WV body4 color-#333333 chat-box-options__label___QSXin">Font</p></div></div></div>').appendTo($('div[class*="settings-panel__section___"]')[0])
        $('#' + settings.version).prop({'checked':true,'disabled':true})
        $('div[class*="settings-panel__section___"] input[type*="checkbox"]').on('click', function(event) {
            $(this).prop('disabled', true);
            check(event.target.id)
            location.reload()
        })
    }
     $("#custom, #custom1").spectrum({
        type: "color",
        showPalette: false,
        showInput: true,
        showAlpha: true,
        allowEmpty: true,
        clickoutFiresChange: true,
        closeOnClickout: true,
        showInitial: true,
        showButtons: false,
        cancelText: "cancel",
        chooseText: "choose",
        preferredFormat: "rgb",
    });

    $(".bgpickerYou").on('move.spectrum', function(e, tinycolor){
        $('style[id*="bg'+$('script[uid]').attr("uid")+'"]').remove()
        if(e.target.value !== ""){
            customColor = tinycolor.toRgbString()
            if(settings.version == 'full'){
                $('div[class*="chat-box-message__box--self"]').css("background-color", customColor);
            }else{
                $('div[class*="chat-box-message__box--self"]').css('cssText', 'background-color:'+customColor+'!important;');
            }
        }else{
            $('div[class*="chat-box-message__box--self"]').css('background-color', "")
        }
    });
    $(".bgpickerYou").on('change.spectrum', function(e, tinycolor){
        if(e.target.value !== ""){
            customColor = tinycolor.toRgbString()
            $('<style id="bg'+$('script[uid]').attr("uid")+'">div[class*="chat-box-body__message-box--self___"] { background:none!important; } div[class*="chat-box-body__message-box--self___"] { background-color:'+customColor+'!important; } </style>' ).appendTo( "head" )
            saveId($('script[uid]').attr("uid"), 'bg', customColor)
        }else{
            removeId($('script[uid]').attr("uid"), 'bg')
        }
    });

    $(".bgpickerThem").on('move.spectrum', function(e, tinycolor){
        if(e.currentTarget.parentElement.parentElement.parentElement.parentElement.parentElement.className.indexOf('chat-box-options') != -1){
            if($(e.target.parentElement.offsetParent.offsetParent).find($('[class^="chat-box-body__message-box___"]:not([class*="chat-box-message__box--self"]')).length != 0){
                userid = $(e.target.parentElement.offsetParent.offsetParent).find($('[class^="chat-box-body__message-box___"]:not([class*="chat-box-message__box--self"]'))[0].getAttribute("data-userid")
            }else{
                userid = $(e.target.parentElement.offsetParent.offsetParent).find($('[class^="avatar__avatar-status-wrapper"]'))[0].href.split('=')[1]
            }
        }else{
            userid = $('input[id^="chatInput"]')[0].value
        }
        $('style[id*="bg'+userid+'"]').remove()
        if(e.target.value !== ""){
            customColor = tinycolor.toRgbString()
            if(settings.version == 'full'){
                $('div[data-userid="'+userid+'"]').css("background-color", customColor);
            }else{
                $('div[data-userid="'+userid+'"]').css('cssText', 'background-color:'+customColor+'!important;');
            }
        }else{
            $('div[data-userid="'+userid+'"]').css("background-color", "");
        }
    });
    $(".bgpickerThem").on('change.spectrum', function(e, tinycolor){
        if(e.currentTarget.parentElement.parentElement.parentElement.parentElement.parentElement.className.indexOf('chat-box-options') !== -1){
            if($(e.target.parentElement.offsetParent.offsetParent).find($('[class^="chat-box-body__message-box___"]:not([class*="chat-box-message__box--self"]')).length != 0){
                userid = $(e.target.parentElement.offsetParent.offsetParent).find($('[class^="chat-box-body__message-box___"]:not([class*="chat-box-message__box--self"]'))[0].getAttribute("data-userid")
            }else{
                userid = $(e.target.parentElement.offsetParent.offsetParent).find($('[class^="avatar__avatar-status-wrapper"]'))[0].href.split('=')[1]
            }
        }else{
            userid = $('input[id^="chatInput"]')[0].value
        }
        if(e.target.value !== "" && userid !== ""){
            customColor = tinycolor.toRgbString()
            $('<style id="bg'+userid+'">div[data-userid="'+userid+'"] { background-color:'+customColor+'!important; }</style>' ).appendTo( "head" )
            saveId(userid, 'bg', customColor)
        }else{
            removeId(userid, 'bg')
        }
    });

    $(".fcpickerYou").on('move.spectrum', function(e, tinycolor){
        $('style[id*="fc'+$('script[uid]').attr("uid")+'"]').remove()
        if(settings.version == 'full'){
            if(e.target.value !== ""){
                customColor = tinycolor.toRgbString()
                $('div[class*="chat-box-message__box--self___"]').find("p").css("color", customColor)
                $('div[class*="chat-box-message__box--self___"]').find("a").css("color", customColor)
            }else{
                $('div[class*="chat-box-message__box--self___"]').find("p").css("color", "")
                $('div[class*="chat-box-message__box--self___"]').find("a").css("color", "")
            }
        }else{
            if(e.target.value !== ""){
                customColor = tinycolor.toRgbString()
                $('div[class*="chat-box-message__box--self___"]').find("p").css('cssText', 'color:'+customColor+'!important;')
                $('div[class*="chat-box-message__box--self___"]').find("a").css('cssText', 'color:'+customColor+'!important;')
            }else{
                $('div[class*="chat-box-message__box--self___"]').find("p").css("cssText", "color:var(--chat-box-body-message)!important");
                $('div[class*="chat-box-message__box--self___"]').find("a").css("color", "")
            }
        }
    });
    $(".fcpickerYou").on('change.spectrum', function(e, tinycolor){
        if(e.target.value !== ""){
            customColor = tinycolor.toRgbString()
            $('<style id="fc'+$('script[uid]').attr("uid")+'">div[class*="chat-box-body__message-box--self___"] p { color:'+customColor+'!important; }</style>' ).appendTo( "head" )
            $('<style id="fc'+$('script[uid]').attr("uid")+'">div[class*="chat-box-body__message-box--self___"] a { color:'+customColor+'!important; }</style>' ).appendTo( "head" )
            saveId($('script[uid]').attr("uid"), 'fc', customColor)
        }else{
            removeId($('script[uid]').attr("uid"), 'fc')
        }
    });

    $(".fcpickerThem").on('move.spectrum', function(e, tinycolor){
        if(e.currentTarget.parentElement.parentElement.parentElement.parentElement.parentElement.className.indexOf('chat-box-options') != -1){
            if($(e.target.parentElement.offsetParent.offsetParent).find($('[class^="chat-box-body__message-box___"]:not([class*="chat-box-body__message-box--self"]')).length != 0){
                userid = $(e.target.parentElement.offsetParent.offsetParent).find($('[class^="chat-box-body__message-box___"]:not([class*="chat-box-body__message-box--self"]'))[0].getAttribute("data-userid")
            }else{
                userid = $(e.target.parentElement.offsetParent.offsetParent).find($('[class^="avatar__avatar-status-wrapper"]'))[0].href.split('=')[1]
            }
        }else{
            userid = $('input[id^="chatInput"]')[0].value
        }
        $('style[id*="fc'+userid+'"]').remove()
        if(e.target.value !== ""){
            customColor = tinycolor.toRgbString()
            $('div[data-userid="'+userid+'"]').find("p").css("color", customColor);
            $('div[data-userid="'+userid+'"]').find("a").css("color", customColor);
        }else{
            $('div[data-userid="'+userid+'"]').find("p").css("color", "");
            $('div[data-userid="'+userid+'"]').find("a").css("color", "");
        }
    });
    $(".fcpickerThem").on('change.spectrum', function(e, tinycolor){
        if(e.currentTarget.parentElement.parentElement.parentElement.parentElement.parentElement.className.indexOf('chat-box-options') != -1){
            if($(e.target.parentElement.offsetParent.offsetParent).find($('[class^="chat-box-body__message-box___"]:not([class*="chat-box-body__message-box--self"]')).length != 0){
                userid = $(e.target.parentElement.offsetParent.offsetParent).find($('[class^="chat-box-body__message-box___"]:not([class*="chat-box-body__message-box--self"]'))[0].getAttribute("data-userid")
            }else{
                userid = $(e.target.parentElement.offsetParent.offsetParent).find($('[class^="avatar__avatar-status-wrapper"]'))[0].href.split('=')[1]
            }
        }else{
            userid = $('input[id^="chatInput"]')[0].value
        }
        if(e.target.value !== "" && userid !== ""){
            customColor = tinycolor.toRgbString()
            $('<style id="fc'+userid+'">div[data-userid="'+userid+'"] p { color:'+customColor+'!important; }</style>' ).appendTo( "head" )
            $('<style id="fc'+userid+'">div[data-userid="'+userid+'"] a { color:'+customColor+'!important; }</style>' ).appendTo( "head" )
            saveId(userid, 'fc', customColor)
        }else{
            removeId(userid, 'fc')
        }
    });

    $("#myRange").on('input', function(e){
        $('style[id*="fs"]').remove()
        $('div[class*="chat-box-message__box"] p').css("font-size", e.target.value+"rem");
        $('div[class*="chat-box-message__box"] a').css("font-size", e.target.value+"rem");
        $('<style id="fs">div[class*="chat-box-message__box"] p, div[class*="chat-box-message__box"] a { font-size:'+e.target.value+"rem!important; }</style>").appendTo('head')
        $("[class^=chat-box-body___]" ).each(function(index){
            (this).scrollTop = (this).scrollHeight - (this).clientHeight;
        });
        temp = {}
        temp['fs'] = [e.target.value]
        $.extend(true, settings, temp)
        localStorage.chatSettings = JSON.stringify(settings);
    });

    $('button[class*="chat-box-options__button"]').on('click', function(e){
        $('div[id*="chatOptions"]').hide()
    });
    $('button[class*="chat-box-options__confirmation-button___"]').on('click', function(e){
        $('div[id*="chatOptions"]').show()
    });

    $('input[id*="custom"]').on('show.spectrum', function(e){
        $('.sp-replacer').addClass('sp-disabled');
        $('.sp-replacer').prop('disabled', true);
    })
    $('input[id*="custom"]').on('hide.spectrum', function(e){
        $('.sp-replacer').removeClass('sp-disabled');
        $('.sp-replacer').prop('disabled', false);;
    })
}

function check(checkbox){
    var uncheck = checkbox === 'full' ? 'alt' : 'full';
    $('#' + uncheck).prop({'checked':false,'disabled':false});
    if($("input[id="+ checkbox +"]:checked").length != 0){
        settings.version = checkbox
        localStorage.chatSettings = JSON.stringify(settings)
    }
}

waitForKeyElements('div[class^="chat-box-options___"]', options)
waitForKeyElements('div[class*="settings-panel___"]', options)