zomo/browser-scripts
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

changed observer callback

Browse Source 
update names based on the element from the mutation event rather than checking the chatbox for unchecked messages each mutation
This commit is contained in:
zomo
2026-04-19 19:01:01 -05:00
parent 3b8c402873
commit 6218d6bad1
9 changed files with 272 additions and 165 deletions
Download Patch File Download Diff File Expand all files Collapse all files
dist/ttv-obfuscated-names.user.js
Vendored
+105 -62
View File
@@ -4,6 +4,7 @@
// @match https://www.twitch.tv/*
// @version 0.1
// @runat document-end
// @grant unsafeWindow
// @downloadURL https://git.zomo.dev/zomo/browser-scripts/raw/branch/main/dist/ttv-obfuscated-names.user.js
// @supportURL https://git.zomo.dev/zomo/browser-scripts/issues
// @homepageURL https://git.zomo.dev/zomo/browser-scripts
@@ -31,6 +32,8 @@ var nameList = [
// image: 'personimage1',
// },
]
var usernameExtraSuffix = nameConfig =>
nameConfig.nameCount > 0 ? `${nameConfig.nameCount + 1}` : ''
var { storedUsers, nameListUsed, nameListCount } = loadStoredUserData()
function getStoredUser(name) {
@@ -81,6 +84,16 @@ function loadStoredUserData() {
}
}
}
function clearStoredUsers() {
localStorage.removeItem('obf-data')
storedUsers = {}
nameListUsed = {}
nameListCount = 0
}
unsafeWindow.obfClear = () => {
clearStoredUsers()
location.reload()
}
function getRandomName() {
const startingIndex = Math.round(Math.random() * (nameList.length - 1))
let foundName = false
@@ -127,6 +140,7 @@ function obfuscator(chatMessage) {
if (ignoreMod && chatMessage.isMod) {
return null
}
console.log(`[OBFUSCATOR] Updating Username: ${chatMessage.username}`)
chatMessage.username = chatMessage.username.toLowerCase()
const userData = getStoredUser(chatMessage.username)
if (userData !== null) {
@@ -141,19 +155,17 @@ function innermostElement(elem) {
if (elem.children.length === 0) {
return elem
}
return innermostElement(elem.children[0])
let child = elem.children[0]
return innermostElement(child)
}
function usernameTemplateSuffix(newChatMessage) {
if (newChatMessage.nameCount === 0) {
return ''
function elementTreeFind(elem, fn) {
if (fn(elem)) {
return elem
}
return `${newChatMessage.nameCount}`
}
function usernameImageTemplateSuffix(newChatMessage) {
if (newChatMessage.nameCount === 0) {
return ''
if (!elem.parentElement) {
return null
}
return `${newChatMessage.nameCount}`
return elementTreeFind(elem.parentElement, fn)
}
function loadChatMessage(chatboxMessage) {
@@ -166,15 +178,14 @@ function loadChatMessage(chatboxMessage) {
const chatboxBadgeContainer = chatboxMessage.querySelector(
'.chat-line__message--badges'
)
if (!chatboxBadgeContainer) {
console.error("found message, couldn't find badges")
return
}
const chatboxUser = chatboxMessage.querySelector('.chat-line__username')
if (!chatboxUser) {
console.error("found message, couldn't find user")
return
}
if (chatboxUser.querySelector('.obf-name')) {
return
}
const chatboxUserInner = chatboxUser.querySelector(
'.chat-author__display-name'
)
@@ -182,19 +193,17 @@ function loadChatMessage(chatboxMessage) {
console.error("found message, couldn't find userInner")
return
}
chatboxMessage.classList.add('obf-loaded')
if (chatboxUser.classList.contains('seventv-paint')) {
chatboxUser.classList.remove('seventv-paint')
}
let isMod = false
for (const badge of chatboxBadgeContainer.children) {
if (
badge.hasAttribute('data-badge') &&
(badge.getAttribute('data-badge') === 'moderator' ||
badge.getAttribute('data-badge') === 'broadcaster')
) {
isMod = true
chatboxMessage.classList.add('ismod')
if (chatboxBadgeContainer) {
for (const badge of chatboxBadgeContainer.children) {
if (
badge.hasAttribute('data-badge') &&
(badge.getAttribute('data-badge') === 'moderator' ||
badge.getAttribute('data-badge') === 'broadcaster')
) {
isMod = true
chatboxMessage.classList.add('ismod')
}
}
}
const chatMessage = {
@@ -203,7 +212,7 @@ function loadChatMessage(chatboxMessage) {
}
const newChatMessage = obfuscator(chatMessage)
if (newChatMessage !== null) {
setUsernameDetails(newChatMessage, chatboxUserInner, chatboxUser)
setUsernameDetails(newChatMessage, chatboxUserInner, true)
}
loadReplyLine(chatboxMessage)
loadMessageMentions(chatboxMessage)
@@ -214,24 +223,30 @@ function loadReplyLine(chatboxMessage) {
if (!replyUsername) {
return
}
if (replyUsername.querySelector('.obf-name')) {
return
}
const chatMessage = {
username: replyUsername.textContent.replace(/^@/, ''),
isMod: false,
}
const newChatMessage = obfuscator(chatMessage)
if (newChatMessage !== null) {
setUsernameDetails(newChatMessage, replyUsername, void 0, '@')
setUsernameDetails(newChatMessage, replyUsername, false, '@')
}
}
function loadMessageMentions(chatboxMessage) {
function eachMention(messageMention) {
if (messageMention.querySelector('.obf-name')) {
return
}
const chatMessage = {
username: messageMention.textContent.replace(/^@/, ''),
isMod: false,
}
const newChatMessage = obfuscator(chatMessage)
if (newChatMessage !== null) {
setUsernameDetails(newChatMessage, messageMention, void 0, '@')
setUsernameDetails(newChatMessage, messageMention, false, '@')
}
}
const messageMentions = chatboxMessage.querySelectorAll(
@@ -244,8 +259,10 @@ function loadMessageMentions(chatboxMessage) {
function loadAdditionalUserNames(chatboxMessage) {
const chatterNames = chatboxMessage.querySelectorAll('.chatter-name')
for (const chatterName of chatterNames) {
chatboxMessage.classList.add('obf-loaded')
const chatterNameBox = innermostElement(chatterName)
if (chatterNameBox.querySelector('.obf-name')) {
continue
}
const username = chatterNameBox.textContent
if (!username) {
continue
@@ -260,53 +277,72 @@ function loadAdditionalUserNames(chatboxMessage) {
}
}
}
function setUsernameDetails(newChatMessage, textbox, colorbox, prefixStr = '') {
const username = `${newChatMessage.username}${usernameTemplateSuffix(newChatMessage)}`
function setUsernameDetails(
newChatMessage,
usernamebox,
doColor = false,
prefix = ''
) {
const suffix = usernameExtraSuffix(newChatMessage)
const username = `${newChatMessage.username}${suffix}`
const container = document.createElement('span')
container.classList.add('obf-name')
const imageName = newChatMessage.image
if (imageName) {
const image = nameImages[imageName]
const img = document.createElement('img')
img.classList.add('obf-image', 'ffz--pointer-events', 'ffz-tooltip')
img.setAttribute('data-tooltip-type', 'html')
img.setAttribute('data-title', username)
img.setAttribute('alt', username)
img.setAttribute('src', image)
const prefix = document.createElement('span')
prefix.textContent = prefixStr
const suffix = document.createElement('span')
suffix.textContent = usernameImageTemplateSuffix(newChatMessage)
textbox.replaceChildren(prefix, img, suffix)
const imgElem = document.createElement('img')
imgElem.classList.add('obf-image', 'ffz--pointer-events', 'ffz-tooltip')
imgElem.setAttribute('data-tooltip-type', 'html')
imgElem.setAttribute('data-title', username)
imgElem.setAttribute('alt', username)
imgElem.setAttribute('src', image)
const prefixElem = document.createElement('span')
prefixElem.textContent = prefix
const suffixElem = document.createElement('span')
suffixElem.textContent = suffix
container.replaceChildren(prefixElem, imgElem, suffixElem)
} else {
textbox.textContent = `${prefixStr}${username}`
container.textContent = `${prefix}${username}`
}
if (colorbox) {
colorbox.style.color = newChatMessage.color
if (doColor) {
container.style.color = newChatMessage.color
}
usernamebox.replaceChildren(container)
}
function eachMutation(record) {
const target = record.target
if (target.classList.contains('chat-scrollable-area__message-container')) {
for (const target2 of record.addedNodes) {
eachMutationTarget(record, target2)
}
} else {
eachMutationTarget(record, record.target)
}
}
var OBSERVER_RATE_LIMIT = 1
var observerLastRun = 0
function observerCallback() {
if (Date.now() - observerLastRun < OBSERVER_RATE_LIMIT) {
return
}
observerLastRun = Date.now()
const chatbox = document.querySelector(
'.chat-scrollable-area__message-container'
function eachMutationTarget(record, target) {
const chatboxMessage = elementTreeFind(
target,
elem =>
elem.parentElement?.classList.contains(
'chat-scrollable-area__message-container'
) || false
)
const chatboxMessages = Array.from(chatbox?.children ?? [])
for (const chatboxMessage of chatboxMessages) {
if (chatboxMessage.classList.contains('obf-loaded')) {
continue
}
if (chatboxMessage) {
console.warn('[OBFUSCATOR] mutated message', chatboxMessage, record)
loadChatMessage(chatboxMessage)
loadAdditionalUserNames(chatboxMessage)
}
}
var observer = new MutationObserver(observerCallback)
var observer = new MutationObserver(mutationRecords => {
for (const record of mutationRecords) {
eachMutation(record)
}
})
observer.observe(document, { attributes: true, childList: true, subtree: true })
var styleAddition = document.createElement('style')
styleAddition.innerHTML = `
/* hide badges, except broadcaster and moderator */
.chat-line__message--badges {
display: none;
}
@@ -321,10 +357,17 @@ styleAddition.innerHTML = `
display: inline-block;
}
/* disable 7tv paint colors */
.seventv-paint {
background-image: none !important;
}
/* disable username translations */
.chat-author__intl-login {
display: none;
}
/* style image when used as name */
img.obf-image {
vertical-align: middle;
margin: -0.5rem 0;