diff --git a/pages/channel.html b/pages/channel.html index 97ddacd..9d4490b 100644 --- a/pages/channel.html +++ b/pages/channel.html @@ -21,7 +21,7 @@
- +
diff --git a/pages/homepage.html b/pages/homepage.html index 4456563..dc9fac6 100644 --- a/pages/homepage.html +++ b/pages/homepage.html @@ -16,10 +16,9 @@
- + -
YetAnotherUselessTwitchChat (YAUTC) is not affiliated with Twitch Interactive
diff --git a/src/channel/index.js b/src/channel/index.js index 3944f6f..cd8b638 100644 --- a/src/channel/index.js +++ b/src/channel/index.js @@ -774,6 +774,8 @@ async function handleMessage(userstate, message, channel) { let badges = ''; + console.log(userstate['badges-raw']) + if (userstate['badges-raw'] && Object.keys(userstate['badges-raw']).length > 0) { let rawBadges = userstate['badges-raw']; let badgesSplit = rawBadges.split(','); @@ -788,6 +790,16 @@ async function handleMessage(userstate, message, channel) { if (BitBadge) continue; } + if (badge && badge.id) { + if (badge.id === "moderator_1" && FFZUserBadgeData["mod_badge"]) { + continue; + } + + if (badge.id === "vip_1" && FFZUserBadgeData["vip_badge"]) { + continue; + } + } + if (badge) { badges += ` ${badge.title} @@ -840,6 +852,28 @@ async function handleMessage(userstate, message, channel) { `; } + if (userstate['badges-raw'] && userstate['badges-raw'].includes('moderator/1') && FFZUserBadgeData["mod_badge"]) { + badges += ` + Moderator + `; + } + + if (userstate['badges-raw'] && userstate['badges-raw'].includes('vip/1') && FFZUserBadgeData["vip_badge"]) { + badges += ` + VIP + `; + } + + if (FFZUserBadgeData["user_badges"] && FFZUserBadgeData["user_badges"][userstate.username]) { + const foundBadge = FFZBadgeData.find(badge => badge.url === `https://cdn.frankerfacez.com/badge/${FFZUserBadgeData["user_badges"][userstate.username]}/4`) + + if (foundBadge) { + badges += ` + ${foundBadge.title} + `; + } + } + // 7tv Badges if (foundUser && foundUser.sevenTVData && foundUser.sevenTVData.badge.url) { @@ -1071,6 +1105,30 @@ async function waitForUserData() { }); } +async function pushUserData(userData) { + try { + const sevenTV_id = await get7TVUserID(userData.data[0].id) + let sevenTVUserData = null + + if (sevenTV_id) { + sevenTVUserData = await getUser(sevenTV_id, userData.data[0].id) + } + + let user = { + name: `@${userData.data[0].login}`, + color: await getUserColorFromUserId(userData.data[0].id || 141981764) || getRandomTwitchColor(), + sevenTVId: sevenTV_id, + sevenTVData: sevenTVUserData, + avatar: await getAvatarFromUserId(userData.data[0].id || 141981764), + userId: userData.data[0].id + }; + + TTVUsersData.push(user); + } catch (error) { + console.error(error) + } +} + async function LoadEmotes() { try { client.disconnect(); @@ -1116,6 +1174,8 @@ async function LoadEmotes() { console.log(`Your avatar-url ${userData.data[0]["profile_image_url"].replace("300x300", "600x600")}`); LoadFollowlist(); + + pushUserData(userData); } else { console.log('User not found or no data returned'); } @@ -1504,7 +1564,7 @@ function subscribeToTwitchEvents() { console.log(FgMagenta + 'EventSub ' + FgWhite + 'Stream raid metadata:', message.payload.event); let actualData = message.payload.event; - location.href = `https://fiszh.github.io/YAUTC/#/${actualData.to_broadcaster_user_login}`; + location.href = `${window.location.protocol}//${window.location.host}/YAUTC/#/${actualData.to_broadcaster_user_login}`; } } else if (message.metadata.message_type === 'session_keepalive') { // Handle keepalive message if needed @@ -1601,23 +1661,29 @@ async function update(updateInfo) { avatar = foundUser.sevenTVData.avatar_url } else { if (foundUser && foundUser.avatar) { - avatar = foundUser.avatar.replace("300x300", "600x600") + avatar = foundUser.avatar } else { avatar = await getAvatarFromUserId(channelTwitchID || 141981764) } } + if (avatar) { + avatar.replace("300x300", "600x600") + } + streamTitles[i].innerHTML = `
-
- - avatar - -
- ${streamInfo.username} +
+ + avatar + +
+
+ ${streamInfo.username} +
+
${results}
-
${results}
-
`; +
` const mentions = results.match(/@(\w+)/g) @@ -1629,7 +1695,7 @@ async function update(updateInfo) { const regex = new RegExp(`(?]+>)${element}(?![^<]*>)`, 'g'); if (results.match(regex)) { - const replacement = `${element}`; + const replacement = `${element}`; results = results.replace(regex, replacement); @@ -2416,7 +2482,7 @@ async function loadFFZ() { await fetchFFZGlobalEmotes(); await handleMessage(custom_userstate.FFZ, 'LOADED GLOBAL EMOTES') - await fetchFFZEmotes(); + await fetchFFZUserData(); await getFFZBadges(); @@ -2429,9 +2495,11 @@ async function loadFFZ() { async function fetchFFZGlobalEmotes() { try { const response = await fetch(`https://api.frankerfacez.com/v1/set/global`); + if (!response.ok) { throw new Error(`Failed to fetch FFZ global emotes`); } + const data = await response.json(); FFZGlobalEmoteData = data.sets[data.default_sets[0]].emoticons.map(emote => { @@ -2458,12 +2526,16 @@ async function fetchFFZGlobalEmotes() { } } -async function fetchFFZEmotes() { +let FFZUserBadgeData = []; + +async function fetchFFZUserData() { try { const response = await fetch(`https://api.frankerfacez.com/v1/room/id/${channelTwitchID}`); + if (!response.ok) { - throw new Error(`Failed to fetch FFZ global emotes`); + throw new Error(`Failed to fetch FFZ channel data`); } + const data = await response.json(); FFZEmoteData = data.sets[data.room.set].emoticons.map(emote => { @@ -2483,9 +2555,37 @@ async function fetchFFZEmotes() { }; }); - console.log(FgGreen + 'Success in getting Channel FrankerFaceZ emotes!' + FgWhite); + // BADGES + + if (data.room) { + if (data.room["vip_badge"] && Object.keys(data.room["vip_badge"]).length > 0) { + const maxKey = Math.max(...Object.keys(data.room["vip_badge"]).map(Number)); + const maxUrl = data.room["vip_badge"][maxKey.toString()]; + + FFZUserBadgeData['vip_badge'] = maxUrl + } + if (data.room["mod_urls"] && Object.keys(data.room["mod_urls"]).length > 0) { + const maxKey = Math.max(...Object.keys(data.room["mod_urls"]).map(Number)); + const maxUrl = data.room["mod_urls"][maxKey.toString()]; + + FFZUserBadgeData['mod_badge'] = maxUrl + } + if (data.room["user_badge_ids"] && Object.keys(data.room["user_badge_ids"]).length > 0) { + const transformedBadges = {}; + + Object.entries(data.room["user_badges"]).forEach(([badge, users]) => { + users.forEach(user => { + transformedBadges[user] = badge; + }); + }); + + FFZUserBadgeData['user_badges'] = transformedBadges; + } + } + + console.log(FgGreen + 'Success in getting Channel FrankerFaceZ data!' + FgWhite); } catch (error) { - console.error('Error fetching FFZ user emotes:', error); + console.error('Error fetching FFZ channel data:', error); throw error; } } @@ -2546,9 +2646,17 @@ document.addEventListener('keydown', async function (event) { } if (textContent && textContent !== '' && textContent !== ' ') { + let userPersonal_emotes = []; + + const userData = TTVUsersData.find(user => user.name === `@${tmiUsername}`); + if (userData && userData.sevenTVData && userData.sevenTVData.personal_emotes) { + userPersonal_emotes = userData.sevenTVData.personal_emotes; + } + let tabEmoteData = [ ...allEmoteData, ...TTVEmoteData, + ...userPersonal_emotes, ] if (tabEmoteData.length === 0) { return; } diff --git a/src/followList.js b/src/followList.js index 8d4a70a..b07ed30 100644 --- a/src/followList.js +++ b/src/followList.js @@ -47,7 +47,7 @@ async function getUserFollowedStreams() { username: stream["user_name"], avatar: foundStreamer.profile_image_url.replace("300x300", "600x600") || null, title: stream["title"], - url: `https://fiszh.github.io/YAUTC/#/${stream["user_login"]}`, + url: `${window.location.protocol}//${window.location.host}/YAUTC/#/${stream["user_login"]}`, thumbnail: stream["thumbnail_url"].replace("{width}x{height}", "1280x720"), category: stream["game_name"], viewers: stream["viewer_count"].toLocaleString() diff --git a/src/homepage/homepage.js b/src/homepage/homepage.js index d97ff23..bc5886c 100644 --- a/src/homepage/homepage.js +++ b/src/homepage/homepage.js @@ -34,7 +34,7 @@ async function getLiveFollowedChannels() { const streamData = data.data.map(stream => ({ username: stream["user_name"], - url: `https://fiszh.github.io/YAUTC/#/${stream["user_login"]}`, + url: `${window.location.protocol}//${window.location.host}/YAUTC/#/${stream["user_login"]}`, title: stream["title"], thumbnail: stream["thumbnail_url"].replace("{width}x{height}", "1280x720"), category: stream["game_name"], diff --git a/src/twitchLogin.js b/src/twitchLogin.js index d01373d..39620c5 100644 --- a/src/twitchLogin.js +++ b/src/twitchLogin.js @@ -28,6 +28,11 @@ let accessToken = getCookie('twitch_access_token'); let userToken = `Bearer ${accessToken}` const authButton = document.getElementById('topbar-button0'); +const logoLink = document.getElementById('logo-link'); +if (logoLink) { + logoLink.href = `${window.location.protocol}//${window.location.host}/YAUTC/`; +} + async function loadConfigFile() { if (document.location.href.startsWith('https://fiszh.github.io/YAUTC')) { return; } try { diff --git a/styles/styles.css b/styles/styles.css index 3c13fd8..62e4d2e 100644 --- a/styles/styles.css +++ b/styles/styles.css @@ -47,7 +47,8 @@ body { margin-top: 10px; } -.stream-title { +.stream-title, +.broadcaster-wrapper { margin: 0; font-size: 1em; } @@ -63,6 +64,15 @@ body { color: #a03a3a; } +.details-wrapper { + margin: 10px; +} + +.title-wrapper { + display: flex; + align-items: center; +} + .chat { display: flex; flex-direction: column; @@ -460,10 +470,12 @@ body::-webkit-scrollbar-thumb:hover { } .twemoji { - width: 36px !important; - height: 36px !important; - max-width: 36px; - max-height: 36px; + width: 13px !important; + height: 13px !important; + max-width: 13px; + max-height: 13px; + margin-left: 5px; + margin-right: 5px; } #topbar {