4.22.9

* Fixed: Detect if the player controls are disabled (such as a squad stream that isn't focused) and disable certain UI elements accordingly.
* Fixed: Try to avoid un-muting unfocused streams on squad stream pages.
* Fixed: Clicking "Chat Identity" in the settings menu doing nothing.
* Fixed: The FFZ Control Center button not appearing on the streaming dashboard.
* Fixed: A bug with the link tester in `Debugging > Data Sources` when opening the page with no history state.
* Changed: Load a list of sample links from the link info servers when opening the link tester in `Debugging > Data Sources`.

package.json

@@ -1,7 +1,7 @@
 {
   "name": "frankerfacez",
   "author": "Dan Salvato LLC",
-  "version": "4.22.8",
+  "version": "4.22.9",
   "description": "FrankerFaceZ is a Twitch enhancement suite.",
   "private": true,
   "license": "Apache-2.0",

src/modules/main_menu/components/link-tester.vue

@@ -235,9 +235,9 @@ export default {
 			raw_loading: false,
 			raw_data: null,
 
-			force_media: state.ffz_lt_media ?? true,
+			force_media: state?.ffz_lt_media ?? true,
-			force_unsafe: state.ffz_lt_unsafe ?? false,
+			force_unsafe: state?.ffz_lt_unsafe ?? false,
-			force_tooltip: state.ffz_lt_tip ?? false,
+			force_tooltip: state?.ffz_lt_tip ?? false,
 
 			events: {
 				on: (...args) => this.item.getChat().on(...args),
@@ -389,7 +389,6 @@ export default {
 		},
 
 		async updateExamples() {
-			console.log('update-examples', this.examples_loading);
 			if ( this.examples_loading )
 				return;
 
@@ -404,6 +403,14 @@ export default {
 				}
 			}
 
+			if ( ! examples ) {
+				try {
+					examples = (await timeout(fetch('https://api-test.frankerfacez.com/v2/link/examples'), 15000).then(resp => resp.ok ? resp.json() : null)).examples;
+				} catch(err) {
+					console.error(err);
+				}
+			}
+
 			if ( ! examples )
 				examples = [];
 

src/sites/shared/player.jsx

@@ -7,7 +7,7 @@
 import Module from 'utilities/module';
 
 import {createElement, on, off} from 'utilities/dom';
-import {isValidShortcut, debounce} from 'utilities/object';
+import {isValidShortcut, debounce, has} from 'utilities/object';
 import { IS_FIREFOX } from 'src/utilities/constants';
 
 const STYLE_VALIDATOR = createElement('span');
@@ -1120,12 +1120,30 @@ export default class PlayerBase extends Module {
 		this.emit(':update-gui', inst);
 	}
 
+	areControlsDisabled(inst) {
+		if ( ! inst._ffz_control_state )
+			this.findControlState(inst);
+
+		if ( inst._ffz_control_state )
+			return inst._ffz_control_state.props.disableControls;
+
+		return false;
+	}
+
+	findControlState(inst) {
+		if ( ! inst._ffz_control_state )
+			inst._ffz_control_state = this.fine.searchTree(inst, n => n.props && has(n.props, 'disableControls'), 200);
+	}
+
 	addGainSlider(inst, visible_only, tries = 0) {
 		const outer = inst.props.containerRef || this.fine.getChildNode(inst),
 			video = inst.props.mediaPlayerInstance?.mediaSinkManager?.video || inst.props.mediaPlayerInstance?.core?.mediaSinkManager?.video,
 			container = outer && outer.querySelector('.player-controls__left-control-group');
 		let gain = video != null && video._ffz_compressed && video._ffz_gain;
 
+		if ( this.areControlsDisabled(inst) )
+			gain = null;
+
 		if ( ! container ) {
 			if ( video && ! gain )
 				return;
@@ -1167,7 +1185,7 @@ export default class PlayerBase extends Module {
 				const player = inst.props.mediaPlayerInstance,
 					core = player.core || player;
 
-				if ( value > 0 && this.settings.get('player.gain.no-volume') && core?.isMuted?.() ) {
+				if ( ! this.areControlsDisabled(inst) && value > 0 && this.settings.get('player.gain.no-volume') && core?.isMuted?.() ) {
 					core.setMuted(false);
 					localStorage.setItem('video-muted', JSON.stringify({default: false}));
 				}
@@ -1265,7 +1283,7 @@ export default class PlayerBase extends Module {
 		}
 
 		let icon, tip, extra, ff_el, btn, cont = container.querySelector('.ffz--player-comp');
-		if ( ! has_comp ) {
+		if ( ! has_comp || this.areControlsDisabled(inst) ) {
 			if ( cont )
 				cont.remove();
 			return;

src/sites/twitch-twilight/modules/chat/settings_menu.jsx

@@ -118,7 +118,7 @@ export default class SettingsMenu extends Module {
 			}
 
 			cls.prototype.ffzRenderIdentity = function() {
-				if ( ! this.state || ! this.props || this.state.moderatorMode || this.state.chatAppearance || this.state.chatPause || this.state.followerMode || this.state.recentRaids || this.state.repliesAppearance || this.state.slowMode || this.props.isShowingChatFilterSettings || this.props.isShowingDeletedMessageDisplaySettings || ! this.props.isLoggedIn || ! this.props.onClickEditAppearance )
+				if ( ! this.state || ! this.props || this.state.moderatorMode || this.state.chatAppearance || this.state.chatPause || this.state.followerMode || this.state.recentRaids || this.state.repliesAppearance || this.state.slowMode || this.props.isShowingChatFilterSettings || this.props.isShowingDeletedMessageDisplaySettings || ! this.props.isLoggedIn )
 					return null;
 
 				if ( ! t.chat.context.get('chat.input.hide-identity') )
@@ -139,6 +139,12 @@ export default class SettingsMenu extends Module {
 						badges[badge.setID] = badge.version;
 				}
 
+				if ( ! this._ffzIdentityClick )
+					this._ffzIdentityClick = () => {
+						document.querySelector('button[data-a-target="chat-badge-carousel-badge-icon"]').click();
+						this.props.onCloseSettings();
+					}
+
 				return (<div class="ffz-identity">
 					<div class="tw-mg-y-05 tw-pd-x-05">
 						<p class="tw-c-text-alt-2 tw-font-size-6 tw-strong tw-upcase">
@@ -148,7 +154,7 @@ export default class SettingsMenu extends Module {
 					<div class="tw-full-width tw-relative">
 						<button
 							class="tw-block tw-border-radius-medium tw-full-width ffz-interactable ffz-interactable--hover-enabled ffz-interactable--default tw-interactive"
-							onClick={this.props.onClickEditAppearance}
+							onClick={this._ffzIdentityClick}
 						>
 							<div class="tw-align-items-center tw-flex tw-pd-05 tw-relative">
 								<div class="tw-flex-grow-1">

src/sites/twitch-twilight/modules/css_tweaks/styles/hide-chat-identity.scss

@@ -1,7 +1,13 @@
-.chat-input__badge-carousel {
+.chat-input__badge-carousel button[data-a-target="chat-badge-carousel-badge-icon"] {
 	display: none !important;
 }
 
+.chat-input__badge-carousel div[class^="Attached-sc"] {
+	inset: unset;
+	bottom: calc(100% + 1rem);
+	left: 0;
+}
+
 .chat-input__textarea .tw-textarea {
 	padding-left: 1rem !important;
 }

src/sites/twitch-twilight/modules/menu_button.jsx

@@ -56,7 +56,7 @@ export default class MenuButton extends SiteModule {
 		);*/
 
 		this.SunlightNav = this.elemental.define(
-			'sunlight-nav', '.sunlight-top-nav > .tw-flex > .tw-flex > .tw-justify-content-end > .tw-flex',
+			'sunlight-nav', '.sunlight-top-nav > div > div > div:nth-last-child(2) > div',
 			Twilight.SUNLIGHT_ROUTES,
 			{attributes: true}, 1
 		);