// ==UserScript==
// @name              GPT to Wechat
// @description       一些避免社死的伪装
// @match             https://chat.openai.com/*
// @copyright         Chuxin Liang
// @version           1.1.0
// @license           http://www.gnu.org/licenses/gpl-3.0.html
// @namespace         https://blog.becomingcelia.com
// @downloadURL none
// ==/UserScript==

// Wechat styles
var style = document.createElement('style');
var customMessage = "天地玄黄，宇宙洪荒";
style.innerText = '.flex.flex-grow.flex-col.gap-3 {background-color: #42b26a!important; color: #09110A!important; margin-left: auto!important;padding: 8px 13px!important; border-radius: 5px!important; } .relative.flex {margin-left:auto!important;} .bg-gray-50 .relative.flex {margin-left:0!important;} .bg-gray-50 .flex.flex-col.relative.items-end{position: relative!important; top: unset!important; left: unset!important; bottom: unset!important; right: unset!important;} .flex.flex-col.relative.items-end{position: absolute!important; right: -51px!important; top: 20px!important;} .bg-gray-50 .flex.flex-grow.flex-col.gap-3 {background-color: #2C2C2C!important; width: auto!important; max-width: 100% !important; margin-right: auto!important; margin-left: 0!important; color: #EAEAEA!important} .markdown.prose.w-full.break-words.dark p, .markdown.prose.w-full.break-words.dark li, .flex.flex-col.items-start.gap-4.whitespace-pre-wrap.break-words {font-size: 14px!important; font-family: system-ui} .text-base.m-auto, .group.w-full.text-gray-800, .h-full, .w-full.h-32.flex-shrink-0 {background: #111111!important;} .group.w-full.text-gray-800 { border: none!important;} .relative.flex.flex-col.gap-1{max-width: 100%!important;} .text-base.gap-4.m-auto{position: relative!important} .absolute.bottom-0.left-0.w-full.border-t.pt-2 {background: #111111!important; border-top: solid 1.5px #1D1D1D!important; width: 617px!important;} .relative.flex.h-full.flex-1.items-stretch {flex-direction: row-reverse!important;} .flex.flex-col.w-full.py-2.flex-grow.relative.border { background: transparent!important; color: #E7E7E7!important; border: 0!important;} textarea.m-0.w-full.resize-none.border-0.bg-transparent.p-0.pr-7.pl-2 {font-size: 14px!important; font-family: system-ui!important;} textarea.m-0.w-full.resize-none.border-0.bg-transparent.p-0.pr-7.pl-2::placeholder {color: transparent!important;} .btn.btn-neutral.border-0 .flex.w-full.items-center.justify-center.gap-2 {font-size: 0!important;} .flex.w-full.items-center svg.h-3.w-3 {  margin-right: -7.5px!important; } .h-full.flex.ml-1.md.justify-center{margin-bottom: -4px!important; height: 54px px !important; } button.btn.relative.btn-neutral.border-0 {border: 0!important; opacity: 0.3!important; background: transparent!important;} .h-full.flex.ml-1.justify-center{margin-top:1px!important;} .px-3.pt-2.pb-3.text-center.text-xs.text-gray-600 span{color: #353435!important;} div.overflow-hidden.w-full.h-full.relative.flex{height: 600px!important; width: 900px!important; margin: 0 auto!important; border: 1px solid !important; border-color: #545454 #414141 #414141 #414141 !important;border-radius: 13px!important; box-shadow:inset 0 1px 0 rgba(255,255,255,.6), 0 22px 70px 4px rgba(0,0,0,0.56), 0 0 0 1px rgba(0, 0, 0, 0.0)!important;} div#__next{display: flex!important; align-items: center!important; background: url(https://images.unsplash.com/photo-1682241229580-e72acdf0eb6d?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=1770&q=80)!important;} .flex-1.overflow-hidden > div.h-full > div{height: 100%; overflow-y: auto; width: 702px!important;} .flex.flex-col.items-center.text-sm { margin: 0 128px 0 14px!important;} form.stretch.mx-2.flex.flex-row.gap-3{margin-bottom: 20px!important;} a.flex.py-3.px-3.items-center.gap-3.relative.rounded-md.group { border-radius: 0!important; background-color: #191919!important; padding: 15px 1rem!important; font-size: 13.5px!important; font-family: system-ui!important;} a.flex.py-3.px-3.items-center.gap-3.relative.rounded-md.group.bg-gray-800 {background-color: #302F30!important; padding-bottom: 34px!important;} a.flex.py-3.px-3.items-center.gap-3.relative.rounded-md.group.bg-gray-900 {padding-bottom: 34px!important;} .from-gray-900, .from-gray-800{display: none!important} a.flex.py-3.px-3.items-center.gap-3.transition-colors.duration-200.text-white.cursor-pointer.text-sm.rounded-md.border.flex-shrink-0 {height: 25px!important; border-radius: 3px!important; margin: 10px 0!important; border: 0!important; background: #202020!important; font-size: 12px!important; color: #646364!important;} a.flex.py-3.px-3.items-center.gap-3.relative.rounded-md.cursor-pointer.break-all.pr-14.group::after, a.flex.py-3.px-3.items-center.gap-3.relative.rounded-md.cursor-pointer.break-all.group::after { content: "' + customMessage + '"; position: absolute; left: 44px; bottom: 10px; color: #636263; font-size: 12px; } .text-base.gap-4.m-auto{padding-top: 1.25rem!important; padding-bottom:1.25rem!important;} .bg-gray-500 .relative.flex span{width: 30px!important;} .flex-1.text-ellipsis.max-h-5.overflow-hidden.break-all.relative {padding-right: 36px!important;}';
var head=document.getElementsByTagName('head')[0]; head.appendChild(style);
head.appendChild(style);

// Change Favicon
var link = document.createElement('link'),
     oldLink = document.getElementById('dynamic-favicon');
 link.id = 'dynamic-favicon';
 link.rel = 'shortcut icon';
 link.href = "https://cdn.jsdelivr.net/gh/liangchuxin/blog-imgs2/img/202304271042142.png";
 if (oldLink) {
  document.head.removeChild(oldLink);
 }
 document.head.appendChild(link);

// Change Profile Pic
(() => {
  let oldPushState = history.pushState;
  history.pushState = function pushState() {
    let ret = oldPushState.apply(this, arguments);
    window.dispatchEvent(new Event('pushstate'));
    window.dispatchEvent(new Event('locationchange'));
    return ret;
  };
  let oldReplaceState = history.replaceState;
  history.replaceState = function replaceState() {
    let ret = oldReplaceState.apply(this, arguments);
    window.dispatchEvent(new Event('replacestate'));
    window.dispatchEvent(new Event('locationchange'));
    return ret;
  };
  window.addEventListener('popstate', () => {
    window.dispatchEvent(new Event('locationchange'));
  });
})();



function isGpt4() {
    var divs = document.getElementsByTagName('div');
    var i;

    for (i = 0; i < divs.length; i++) {
        var div = divs[i];
        var styles = window.getComputedStyle(div);
        var backgroundColor = styles.getPropertyValue('background-color');

        if ((backgroundColor === 'rgb(0, 0, 0)' || backgroundColor === '#000' || backgroundColor === 'black') && div.tagName.toLowerCase() === 'div') {
            var children = div.children;

            for (var j = 0; j < children.length; j++) {
                if (children[j].tagName.toLowerCase() === 'svg') {
                    return true;
                }
            }
        }
    }
    return false;
}


function changeAvatar(version) {
    var customAvatar3 = "https://cdn.jsdelivr.net/gh/liangchuxin/blog-imgs2/img/202304272103095.webp";
    var customAvatar4 = "https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcRTkvnkIq8QQXT1fNWhHrND3QZCRFnJl-3OvQ&usqp=CAU";
    var customAvatar;
    //console.log("state: " + isGpt4());
    if (version=="4") {
        customAvatar = customAvatar4;
    } else if (version=="3") {
        customAvatar = customAvatar3;
    }
    var avatars = document.querySelectorAll('.group.w-full.bg-gray-50 .text-base.gap-4 .flex.flex-col.relative.items-end');
    if (avatars.length === 0) {
        return;
    }
   for (var i = 0; i < avatars.length; i++) {
        if (avatars[i].hasChildNodes()) {
            for (var j = avatars[i].childNodes.length - 1; j >= 0; j--) {
                avatars[i].removeChild(avatars[i].childNodes[j]);
            }
        }
        var newAvatar = document.createElement("div");
        newAvatar.innerHTML = '<div class="relative flex"><span style="box-sizing: border-box; display: inline-block; overflow: hidden; width: initial; height: initial; background: none; opacity: 1; border: 0px; margin: 0px; padding: 0px; position: relative; max-width: 100%;"><span style="box-sizing: border-box; display: block; width: initial; height: initial; background: none; opacity: 1; border: 0px; margin: 0px; padding: 0px; max-width: 100%;"><img alt="" aria-hidden="true" src="data:image/svg+xml,%3csvg%20xmlns=%27http://www.w3.org/2000/svg%27%20version=%271.1%27%20width=%2738%27%20height=%2738%27/%3e" style="display: block; max-width: 100%; width: initial; height: initial; background: none; opacity: 1; border: 0px; margin: 0px; padding: 0px;"></span><img alt="Chuxin LIANG" srcset="' + customAvatar + '" src="' + customAvatar + '" decoding="async" data-nimg="intrinsic" class="rounded-sm" style="position: absolute; inset: 0px; box-sizing: border-box; padding: 0px; border: none; margin: auto; display: block; width: 0px; height: 0px; min-width: 100%; max-width: 100%; min-height: 100%;"></span></div>';
        avatars[i].appendChild(newAvatar);
    }

}

// Wait for ChatGPT to generate a new response / refresh / url change
var numHistory = 0;
var avatarSet = false;
var setValue;
var stateSet = true;

window.addEventListener('locationchange', function(){
    stateSet = false;
  console.log("clear data");
    setTimeout(function() {
  setValue = isGpt4()?"4":"3";
        }, 100);
         stateSet = true;
})
window.addEventListener('load', function() {
  console.log("clear data");
        setTimeout(function() {
  setValue = isGpt4()?"4":"3";
    }, 100);
});


setInterval(function() {
    var currentUrl = window.location.href;
var nodes = document.querySelectorAll('.bg-gray-50 .flex.flex-grow.flex-col.gap-3');
var nodesNum = nodes.length;
if(nodesNum == 1) {
    var responseLength = document.querySelectorAll('.bg-gray-50 .flex.flex-grow.flex-col.gap-3 p')[0].innerHTML.length;
    if(responseLength > 1 ){
    numHistory = nodesNum;
    console.log("change avatar!");
    if (avatarSet == false) {
       setValue = isGpt4()?"4":"3";
       avatarSet = true;
    }
    if (stateSet == true) {
    changeAvatar(setValue);
    }
    } else {
        console.log("still typing, no render!");
    }
} else {
if (nodesNum !== numHistory) {
    numHistory = nodesNum;
    console.log("change avatar!");
    if (avatarSet == false) {
       setValue = isGpt4()?"4":"3";
       avatarSet = true;
    }
    if (stateSet == true) {
    changeAvatar(setValue);
    }
    console.log("gpt version: " + isGpt4());
}
}

}, 300); // Check for a new response every 0.5 second