Replies, Display and Autocompletion

1. Replies now show twemojis and third party emotes
2. Stream info no longer has a huge margin
3. Autocompletion no longer does R) if the last character is " ",
4. Chat input now scrolls with the autocompletion
6. Redeems with . in their names should no longer display as a link
7. Dark reader no longer works

src/channel/index.js

@@ -549,7 +549,12 @@ async function replaceWithEmotes(inputString, TTVMessageEmoteData, userstate, ch
                         </span>`;
                 } else if (lastEmoteWrapper && lastEmote && foundEmote.flags && foundEmote.flags === 256) {
                     willReturn = false;
+
                     emoteStyle = `style="height: ${desiredHeight}px; position: absolute;"`;
+
+                    const currentTooltipName = lastEmoteWrapper.getAttribute('tooltip-name') || '';
+                    lastEmoteWrapper.setAttribute('tooltip-name', `${currentTooltipName}, ${foundEmote.name}`.trim());
+
                     const aTag = lastEmoteWrapper.querySelector('a');
                     aTag.innerHTML += `<img src="${foundEmote.url}" alt="${foundEmote.name}" class="emote" ${emoteStyle}>`;
 
@@ -596,12 +601,16 @@ async function replaceWithEmotes(inputString, TTVMessageEmoteData, userstate, ch
 
                 lastEmote = false;
 
-                const twemojiHTML = twemoji.parse(part, {
-                    base: 'https://cdn.jsdelivr.net/gh/twitter/[email protected]/assets/',
-                    folder: 'svg',
-                    ext: '.svg',
-                    className: 'twemoji'
-                });
+                let twemojiHTML = part
+
+                if (part) {
+                    twemojiHTML = twemoji.parse(part, {
+                        base: 'https://cdn.jsdelivr.net/gh/twitter/[email protected]/assets/',
+                        folder: 'svg',
+                        ext: '.svg',
+                        className: 'twemoji'
+                    });
+                }
 
                 replacedParts.push(twemojiHTML);
             }
@@ -2883,7 +2892,7 @@ document.addEventListener('keydown', async function (event) {
                 textContent = textContent.trimEnd();
             }
 
-            if (textContent && textContent !== '' && textContent !== ' ') {
+            if (textContent && textContent !== '' && textContent !== ' ' && !textContent.endsWith(" ")) {
                 let userPersonal_emotes = [];
 
                 const userData = TTVUsersData.find(user => user.name === `@${tmiUsername}`);
@@ -2944,6 +2953,9 @@ document.addEventListener('keydown', async function (event) {
                     chatInput.value = modifiedText + " "
                     EmoteI += 1
                 }
+
+                chatInput.selectionStart = chatInput.selectionEnd = chatInput.value.length;
+                chatInput.scrollLeft = chatInput.scrollWidth;
             } else {
                 EmoteI = 0
                 TabEmotes = [];
@@ -3175,6 +3187,8 @@ client.on("redeem", (channel, userstate, message) => {
     }
 
     if (message !== 'highlighted-message') {
+        userstate["no-link"] = true;
+
         handleMessage(userstate, message, channel)
     } else {
         TTVUserRedeems[`${username}`] = '#00dbdb';

src/events.js

@@ -9,14 +9,14 @@ if (document.querySelector('#followed')) {
         document.querySelector('.chat').style.transition = 'width 0.3s ease';
         document.querySelector('#twitch-embed').style.transition = 'height 0.3s ease';
         document.querySelector('.chat').style.width = '31.7%';
-        document.querySelector('#twitch-embed').style.height = '79.8%';
+        document.querySelector('#twitch-embed').style.height = '86%';
     });
 
     document.querySelector('#followed').addEventListener('mouseout', () => {
         document.querySelector('.chat').style.transition = 'width 0.3s ease';
         document.querySelector('#twitch-embed').style.transition = 'height 0.3s ease';
         document.querySelector('.chat').style.width = '30%';
-        document.querySelector('#twitch-embed').style.height = '85.8%';
+        document.querySelector('#twitch-embed').style.height = '91%';
     });
 }
 

src/landingPage.js

@@ -66,6 +66,10 @@ async function loadAndReplaceHTML(url) {
         const bodyElements = Array.from(doc.body.children);
         await loadBodyElements(bodyElements);
 
+        const metaTag = document.createElement('meta');
+        metaTag.name = 'darkreader-lock';
+        document.head.appendChild(metaTag);
+
         console.log("HTML loaded and replaced successfully.");
     } catch (error) {
         console.error('Error loading HTML:', error);
@@ -175,7 +179,7 @@ function initializeTwitchPlayer(retryCount = 3, delay = 1000) {
         });
     } catch (error) {
         console.error("Error initializing Twitch Player:", error);
-        
+
         const twitchEmbed = document.getElementById('twitch-embed');
 
         twitchEmbed.innerHTML = "Refresh if you don't see the player."

src/settings.js

@@ -32,6 +32,12 @@ const configuration = {
         value: true,
         param: 'paintShadows'
     },
+    follower_list: {
+        name: 'Always display followed channels (not working)',
+        type: 'boolean',
+        value: false,
+        param: 'channelFollow'
+    },
     section_1: {
         name: "Chat",
         type: 'section'
@@ -166,6 +172,10 @@ function displaySettings() {
             const checkbox = document.getElementById(`toggle-${i}`);
 
             checkbox.addEventListener('change', function () {
+                if (param === "channelFollow") {
+                    displayFollowlist(checkbox.checked)
+                }
+
                 userSettings[param] = checkbox.checked;
                 saveSettings();
             });

styles/styles.css

@@ -32,7 +32,7 @@ body {
 
 #twitch-embed {
     width: 100%;
-    height: 85.8%;
+    height: 91%;
     transition: transform 0.3s ease;
 }
 
@@ -42,9 +42,9 @@ body {
     align-items: flex-start;
     width: 100%;
     color: #fff;
-    padding: 10px;
+    padding: 3px;
     box-sizing: border-box;
-    margin-top: 10px;
+    margin-top: 1px;
 }
 
 .stream-title,