diff --git a/package.json b/package.json index 866d5da6..4417d88e 100755 --- a/package.json +++ b/package.json @@ -1,7 +1,7 @@ { "name": "frankerfacez", "author": "Dan Salvato LLC", - "version": "4.9.5", + "version": "4.9.6", "description": "FrankerFaceZ is a Twitch enhancement suite.", "license": "Apache-2.0", "scripts": { diff --git a/src/modules/chat/components.js b/src/modules/chat/components.js new file mode 100644 index 00000000..19e6ee85 --- /dev/null +++ b/src/modules/chat/components.js @@ -0,0 +1,3 @@ +'use strict'; + +export default require.context('./components', false, /\.vue$/); \ No newline at end of file diff --git a/src/modules/chat/components/chat-rich.vue b/src/modules/chat/components/chat-rich.vue index 1e2648be..d61d9a6e 100644 --- a/src/modules/chat/components/chat-rich.vue +++ b/src/modules/chat/components/chat-rich.vue @@ -2,34 +2,41 @@
-
-
- -
+
+ +
+ -
+
+ {{ t('card.loading', 'Loading...') }} + +
-
+
-
+
Appearance >> Rich Content', title: 'Display rich content embeds for all links.', description: '*Streamers: Please be aware that this is a potential vector for NSFW imagery via thumbnails, so be mindful when capturing chat with this enabled.*', - component: 'setting-check-box' + component: 'setting-check-box', + extra: { + component: 'chat-rich-example', + getChat: () => this + } } }); @@ -672,7 +676,10 @@ export default class Chat extends Module { sort: -1, path: 'Chat > Tooltips >> Links', title: 'Display rich tooltips for links.', - component: 'setting-check-box' + component: 'setting-check-box', + extra: { + component: 'chat-tooltip-example' + } } }); diff --git a/src/modules/chat/tokenizers.jsx b/src/modules/chat/tokenizers.jsx index adeffdec..0f14128a 100644 --- a/src/modules/chat/tokenizers.jsx +++ b/src/modules/chat/tokenizers.jsx @@ -41,7 +41,7 @@ export const Links = { }, tooltip(target, tip) { - if ( ! this.context.get('tooltip.rich-links') ) + if ( ! this.context.get('tooltip.rich-links') && ! target.dataset.forceTooltip ) return ''; if ( target.dataset.isMail === 'true' ) diff --git a/src/modules/main_menu/components/chat-rich-example.vue b/src/modules/main_menu/components/chat-rich-example.vue new file mode 100644 index 00000000..d644c5ec --- /dev/null +++ b/src/modules/main_menu/components/chat-rich-example.vue @@ -0,0 +1,57 @@ + + + \ No newline at end of file diff --git a/src/modules/main_menu/components/chat-tooltip-example.vue b/src/modules/main_menu/components/chat-tooltip-example.vue new file mode 100644 index 00000000..2206bd72 --- /dev/null +++ b/src/modules/main_menu/components/chat-tooltip-example.vue @@ -0,0 +1,38 @@ + + + \ No newline at end of file diff --git a/src/modules/main_menu/components/setting-check-box.vue b/src/modules/main_menu/components/setting-check-box.vue index 4b1aac6c..70c6c4af 100644 --- a/src/modules/main_menu/components/setting-check-box.vue +++ b/src/modules/main_menu/components/setting-check-box.vue @@ -44,6 +44,12 @@ > +
+ +
diff --git a/src/modules/main_menu/components/setting-color-box.vue b/src/modules/main_menu/components/setting-color-box.vue index 52e02063..8fcb50ac 100644 --- a/src/modules/main_menu/components/setting-color-box.vue +++ b/src/modules/main_menu/components/setting-color-box.vue @@ -41,6 +41,9 @@ > +
+ +
diff --git a/src/modules/main_menu/components/setting-combo-box.vue b/src/modules/main_menu/components/setting-combo-box.vue index fb25aba1..d2f67627 100644 --- a/src/modules/main_menu/components/setting-combo-box.vue +++ b/src/modules/main_menu/components/setting-combo-box.vue @@ -60,6 +60,9 @@ > +
+ +
diff --git a/src/modules/main_menu/components/setting-hotkey.vue b/src/modules/main_menu/components/setting-hotkey.vue index fb6469fd..6b505dd1 100644 --- a/src/modules/main_menu/components/setting-hotkey.vue +++ b/src/modules/main_menu/components/setting-hotkey.vue @@ -26,6 +26,9 @@ > +
+ +
diff --git a/src/modules/main_menu/components/setting-radio-buttons.vue b/src/modules/main_menu/components/setting-radio-buttons.vue index 2844d124..21225bed 100644 --- a/src/modules/main_menu/components/setting-radio-buttons.vue +++ b/src/modules/main_menu/components/setting-radio-buttons.vue @@ -10,6 +10,9 @@ > +
+ +
+
+ +
diff --git a/src/modules/main_menu/components/setting-text-box.vue b/src/modules/main_menu/components/setting-text-box.vue index fc53fc33..9bf4de4b 100644 --- a/src/modules/main_menu/components/setting-text-box.vue +++ b/src/modules/main_menu/components/setting-text-box.vue @@ -41,6 +41,9 @@ > +
+ +
diff --git a/src/sites/twitch-twilight/modules/chat/scroller.js b/src/sites/twitch-twilight/modules/chat/scroller.js index d05011a9..c35cfaa4 100644 --- a/src/sites/twitch-twilight/modules/chat/scroller.js +++ b/src/sites/twitch-twilight/modules/chat/scroller.js @@ -36,7 +36,7 @@ export default class Scroller extends Module { this.settings.add('chat.scroller.freeze', { default: 0, ui: { - path: 'Chat > Behavior >> Scrolling @{"description": "Please note that FrankerFaceZ is dependent on Twitch\'s own scrolling code working correctly. There are bugs with Twitch\'s scrolling code that have existed for more than six months. If you are using Firefox, Edge, or other non-Webkit browsers, expect to have issues."}', + path: 'Chat > Behavior >> Scrolling', title: 'Pause Chat Scrolling', description: 'Automatically stop chat from scrolling when moving the mouse over it or holding a key.', component: 'setting-select-box', @@ -87,7 +87,7 @@ export default class Scroller extends Module { ui: { path: 'Chat > Behavior >> Scrolling', title: 'Smooth Scrolling', - description: 'Smoothly slide new chat messages into view. Speed will increase as necessary to keep up with chat.', + description: '**Note:** This setting has been disabled until such time as someone is able to fix major bugs with it.\n\nSmoothly slide new chat messages into view. Speed will increase as necessary to keep up with chat.', component: 'setting-select-box', data: [ {value: 0, title: 'Disabled'}, @@ -145,8 +145,9 @@ export default class Scroller extends Module { inst.ffzMaybeUnpause(); }); - this.smooth_scroll = this.chat.context.get('chat.scroller.smooth-scroll'); + this.smooth_scroll = 0; // this.chat.context.get('chat.scroller.smooth-scroll'); this.chat.context.on('changed:chat.scroller.smooth-scroll', val => { + val = 0; this.smooth_scroll = val; for(const inst of this.ChatScroller.instances) @@ -167,15 +168,11 @@ export default class Scroller extends Module { if ( old_snapshot ) cls.prototype.getSnapshotBeforeUpdate = function() { - let auto_state; - if ( this.state ) { - auto_state = this.state.isAutoScrolling; - this.state.isAutoScrolling = false; - } const out = old_snapshot.call(this); - if ( this.state ) - this.state.isAutoScrolling = auto_state; - this._ffz_snapshot = out; + this._ffz_snapshot = out || (this.lastLine && { + lastLine: this.lastLine, + offsetTop: this.lastLine.offsetTop + }) || null; return out; } @@ -265,16 +262,20 @@ export default class Scroller extends Module { // WIP: Trying to fix the scroll position changing so that we can // smooth scroll from the previous position. if ( inst.ffz_smooth_scroll && ! inst._ffz_one_fast_scroll && inst._ffz_snapshot ) { - const adjustment = inst._ffz_snapshot && inst._ffz_snapshot.lastLine ? inst._ffz_snapshot.offsetTop - inst._ffz_snapshot.lastLine.offsetTop : 0; - if ( inst.scroll && inst.scroll.scrollContent && adjustment > 0 ) - inst.scroll.scrollContent.scrollTop -= adjustment; + const adjustment = inst._ffz_snapshot && inst._ffz_snapshot.lastLine ? inst._ffz_snapshot.lastLine.offsetTop - inst._ffz_snapshot.offsetTop: 0; + if ( inst.scroll && inst.scroll.scrollContent && adjustment != 0 ) + inst.scroll.scrollContent.scrollTop += adjustment; } inst._ffz_snapshot = null; - if ( inst.state.isPaused || inst._ffz_scroll_frame ) - return; - - this._ffz_scroll_frame = requestAnimationFrame(inst.ffz_doScroll); + if ( inst.state.isAutoScrolling && ! inst.state.isPaused ) { + if ( inst.ffz_smooth_scroll && ! inst._ffz_one_fast_scroll ) + inst.smoothScrollBottom(); + else { + inst._ffz_one_fast_scroll = false; + inst.ffz_oldScroll(); + } + } } // New Scroll Event Handling @@ -617,7 +618,7 @@ export default class Scroller extends Module { } else if ( difference > 200 ) { // we are starting to fall behind, speed it up a bit step += step * Math.floor(difference / 200); - } + } const smoothAnimation = () => { if ( this.state.isPaused || ! this.state.isAutoScrolling ) @@ -631,10 +632,11 @@ export default class Scroller extends Module { // we need to move at least one full pixel for scrollTop to do anything in this delta. if ( current_step >= 1 ) { const scroll_top = scroll_content.scrollTop, + next_top = scroll_top + current_step, target_top = scroll_content.scrollHeight - scroll_content.clientHeight; old_time = current_time; - if ( scroll_top < target_top ) { + if ( next_top < target_top ) { scroll_content.scrollTop = scroll_top + current_step; this._ffz_smooth_animation = requestAnimationFrame(smoothAnimation);