fixes #2676

fixes #2683
night · Sep 22, 2017 · 32f4e52 · 32f4e52
1 parent b4120e3
commit 32f4e52
Show file tree

Hide file tree

Showing 6 changed files with 31 additions and 28 deletions.
diff --git a/package.json b/package.json
@@ -1,7 +1,7 @@
 {
   "name": "BetterTTV",
   "author": "Night",
-  "version": "7.0.27",
+  "version": "7.0.28",
   "description": "BetterTTV enhances Twitch with new features, bug fixes, and reduced clutter.",
   "main": "betterttv.js",
   "scripts": {

diff --git a/src/css/betterttv-dark.css b/src/css/betterttv-dark.css
@@ -349,7 +349,7 @@ div#site_header {
     color: #d3d3d3 !important;
 }
 
-#chat_text_input, #chat_text_login, .ember-chat .chat-interface textarea, .vod-chat textarea {
+#chat_text_input, #chat_text_login, .ember-chat .chat-interface textarea, .vod-chat textarea, .video-chat textarea {
     background-color: rgb(20, 20, 20) !important;
     color: #D3D3D3;
     border: solid 1px #333 !important;
@@ -2202,15 +2202,21 @@ span.subscribe-text {
 
 /* Twitch emote menu */
 .emoticon-selector .emoticon-selector-box,
-.emoticon-selector-container .emoticon-selector {
+.emoticon-selector-container .emoticon-selector,
+.emote-picker-and-button .tw-balloon {
     background-color: #191919;
     box-shadow: inset 0 0 0 1px #191919;
 }
 
+.emote-picker__controls-container .border-t {
+    border-color: #282828;
+}
+
 .emoticon-selector .emoticon-selector-box .emoticon-selector__tabs,
 .emoticon-selector .emoticon-selector-box .emotes .emoticon-grid .emote-set,
-.emoticon-selector .emoticon-selector-box .emoticon-grid {
-    background-color: #191919;
+.emoticon-selector .emoticon-selector-box .emoticon-grid,
+.emote-picker__tabs-container {
+    background-color: #191919 !important;
     border-color: #444;
     color: #d3d3d3;
     box-shadow: none;
@@ -2237,14 +2243,14 @@ span.subscribe-text {
     color: #888;
 }
 
-.emoticon-selector .emoticon-selector-box input {
+.emoticon-selector .emoticon-selector-box input, .emote-picker-and-button .tw-input {
     background-color: #282828;
     border-color: #444;
     color: #d3d3d3;
     box-shadow: 0 0 3px 1px #333;
 }
 
-.emoticon-selector .emoticon-selector-box input:focus {
+.emoticon-selector .emoticon-selector-box input:focus, , .emote-picker-and-button .tw-input {
     box-shadow: 0 0 3px 1px #333;
 }
 
@@ -3787,24 +3793,25 @@ button.follow-button, .subscription-modal__right button, .subscription-modal__le
 }
 
 /* vod chat */
-.vod-chat__header {
+.vod-chat__header,.video-chat__header,.video-chat__message-menu .tw-balloon, div[data-a-target="emote-picker-button"] .tw-balloon {
     background: rgb(50, 50, 50);
     box-shadow: none;
 }
 
-.vod-chat {
+.vod-chat,.video-chat {
     background: none;
+    border-left: none;
 }
 
-.vod-chat span {
+.vod-chat,.video-chat span, div[data-test-selector="video-chat-cta"] {
     color: #d3d3d3;
 }
 
 .vod-message.vod-message--focused, .vod-message:hover {
     background-color: transparent;
 }
 
-.vod-chat__message-list-wrapper::-webkit-scrollbar-thumb{
+.vod-chat__message-list-wrapper::-webkit-scrollbar-thumb, .video-chat__message-list-wrapper::-webkit-scrollbar-thumb {
     border-color: #201c2b;
 }
 

diff --git a/src/modules/chat/index.js b/src/modules/chat/index.js
@@ -182,6 +182,7 @@ class ChatModule {
             if (modified) {
                 // TODO: find a better way to do this (this seems most performant tho, only a single mutation vs multiple)
                 const span = document.createElement('span');
+                span.className = 'bttv-parsed';
                 span.innerHTML = parts.join(' ');
                 node.parentNode.replaceChild(span, node);
             }

diff --git a/src/modules/global_css/index.js b/src/modules/global_css/index.js
@@ -4,7 +4,6 @@ const css = require('../../utils/css');
 const settings = require('../../settings');
 const storage = require('../../storage');
 const watcher = require('../../watcher');
-const twitch = require('../../utils/twitch');
 
 function dismissPinnedCheers() {
     $('body').on('click', '.pinned-cheers', e => {
@@ -67,12 +66,6 @@ class GlobalCSSModule {
                 .attr('src', cdn.url('assets/icons/delete.png'))
                 .attr('width', '16')
                 .attr('height', '16');
-
-            // Turn on dark bits emotes
-            const bitsService = twitch.getEmberContainer('service:bits');
-            if (bitsService) {
-                bitsService.set('bitsEmotes.isDarkChat', true);
-            }
         }
     }
 

diff --git a/src/modules/vod_chat/index.js b/src/modules/vod_chat/index.js
@@ -2,10 +2,10 @@ const $ = require('jquery');
 const chat = require('../chat');
 const watcher = require('../../watcher');
 
-const CHAT_MESSAGE_SELECTOR = '.vod-message__message';
-const CHAT_USERNAME_SELECTOR = '.vod-message__author';
-const SCROLL_INDICATOR_SELECTOR = '.vod-chat__sync-button';
-const SCROLL_CONTAINER_SELECTOR = '.vod-chat__scroll-wrapper';
+const CHAT_MESSAGE_SELECTOR = '.vod-message__message,.qa-mod-message span';
+const CHAT_USERNAME_SELECTOR = '.vod-message__author,.video-chat__message-author';
+const SCROLL_INDICATOR_SELECTOR = '.vod-chat__sync-button,.video-chat__sync-button';
+const SCROLL_CONTAINER_SELECTOR = '.vod-chat__scroll-wrapper,.video-chat__message-list-wrapper';
 
 function scrollOnEmoteLoad($el) {
     const indicator = $(SCROLL_INDICATOR_SELECTOR).length > 0;
@@ -24,7 +24,9 @@ class VODChatModule {
     parseMessage($element) {
         const $from = $element.find(CHAT_USERNAME_SELECTOR);
         const mockUser = {name: $from.text()};
-        chat.messageReplacer($element.find(CHAT_MESSAGE_SELECTOR), mockUser);
+        const $message = $element.find(CHAT_MESSAGE_SELECTOR);
+        if ($message.hasClass('bttv-parsed')) return;
+        chat.messageReplacer($message, mockUser);
 
         scrollOnEmoteLoad($element);
     }

diff --git a/src/watcher.js b/src/watcher.js
@@ -287,16 +287,16 @@ class Watcher extends SafeEventEmitter {
                 for (const el of mutation.addedNodes) {
                     const $el = $(el);
 
-                    if ($el.hasClass('vod-message__content')) {
-                        this.emit('vod.message', $el);
-                    } else if ($el.hasClass('vod-message')) {
-                        $el.find('.vod-message__content').each((_, message) => this.emit('vod.message', $(message)));
+                    const $chatContents = $el.find('.vod-message__content,.video-chat__message');
+
+                    for (const chatContent of $chatContents) {
+                        this.emit('vod.message', $(chatContent));
                     }
                 }
             })
         );
 
-        this.on('load.vod', () => observe(vodChatWatcher, $('.vod-chat')[0]));
+        this.on('load.vod', () => observe(vodChatWatcher, $('.video-chat__wrapper,.vod-chat')[0]));
     }
 }