sam_oneal/fx_cast
1
0
Fork 0
mirror of https://github.com/hensm/fx_cast.git synced 2026-06-13 02:49:58 +00:00
Code Issues Packages Projects Releases Wiki Activity

Hide mirroring options in receiver selector when feature is disabled

Browse Source
This commit is contained in:
hensm
2020-09-04 13:30:12 +01:00
parent dadba7c0bc
commit 2838a99393
1 changed files with 39 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files

56
ext/src/ui/popup/index.tsx
View File

@@ -5,6 +5,7 @@ import React, { Component } from "react";
import ReactDOM from "react-dom"; import ReactDOM from "react-dom";
import knownApps from "../../lib/knownApps"; import knownApps from "../../lib/knownApps";
import options from "../../lib/options";
import { Message } from "../../messaging"; import { Message } from "../../messaging";
import { getNextEllipsis } from "../../lib/utils"; import { getNextEllipsis } from "../../lib/utils";
@@ -35,6 +36,8 @@ interface PopupAppState {
filePath?: string; filePath?: string;
requestedAppId?: string; requestedAppId?: string;
mirroringEnabled: boolean;
} }
class PopupApp extends Component<{}, PopupAppState> { class PopupApp extends Component<{}, PopupAppState> {
@@ -50,6 +53,7 @@ class PopupApp extends Component<{}, PopupAppState> {
, mediaType: ReceiverSelectorMediaType.App , mediaType: ReceiverSelectorMediaType.App
, availableMediaTypes: ReceiverSelectorMediaType.App , availableMediaTypes: ReceiverSelectorMediaType.App
, isLoading: false , isLoading: false
, mirroringEnabled: false
}; };
// Store window ref // Store window ref
@@ -62,7 +66,7 @@ class PopupApp extends Component<{}, PopupAppState> {
this.onStop = this.onStop.bind(this); this.onStop = this.onStop.bind(this);
} }
public componentDidMount () { public async componentDidMount () {
this.port = browser.runtime.connect({ this.port = browser.runtime.connect({
name: "popup" name: "popup"
}); });
@@ -102,6 +106,10 @@ class PopupApp extends Component<{}, PopupAppState> {
} }
} }
}); });
this.setState({
mirroringEnabled: await options.get("mirroringEnabled")
});
} }
public componentDidUpdate () { public componentDidUpdate () {
@@ -132,9 +140,15 @@ class PopupApp extends Component<{}, PopupAppState> {
: fileName; : fileName;
} }
const isAppMediaTypeSelected =
this.state.mediaType === ReceiverSelectorMediaType.App;
const isTabMediaTypeSelected =
this.state.mediaType === ReceiverSelectorMediaType.Tab;
const isScreenMediaTypeSelected =
this.state.mediaType === ReceiverSelectorMediaType.Screen;
const canCast = !!(this.state.availableMediaTypes const isSelectedMediaTypeAvailable =
&& this.state.availableMediaTypes & this.state.mediaType); !!(this.state.availableMediaTypes & this.state.mediaType)
return ( return (
<div> <div>
@@ -143,25 +157,33 @@ class PopupApp extends Component<{}, PopupAppState> {
{ _("popupMediaSelectCastLabel") } { _("popupMediaSelectCastLabel") }
</div> </div>
<div className="select-wrapper"> <div className="select-wrapper">
<select value={ this.state.mediaType } <select onChange={ this.onSelectChange }
onChange={ this.onSelectChange } className="media-select__dropdown"
className="media-select__dropdown"> disabled={ this.state.availableMediaTypes === 0 }>
<option value={ ReceiverSelectorMediaType.App } <option value={ ReceiverSelectorMediaType.App }
selected={ isAppMediaTypeSelected }
disabled={ !(this.state.availableMediaTypes disabled={ !(this.state.availableMediaTypes
& ReceiverSelectorMediaType.App) }> & ReceiverSelectorMediaType.App) }>
{ (this.state.requestedAppId && knownApps[this.state.requestedAppId]?.name) { (this.state.requestedAppId && knownApps[this.state.requestedAppId]?.name)
?? _("popupMediaTypeApp") } ?? _("popupMediaTypeApp") }
</option> </option>
<option value={ ReceiverSelectorMediaType.Tab }
disabled={ !(this.state.availableMediaTypes { this.state.mirroringEnabled &&
& ReceiverSelectorMediaType.Tab) }> <>
{ _("popupMediaTypeTab") } <option value={ ReceiverSelectorMediaType.Tab }
</option> selected={ isTabMediaTypeSelected }
<option value={ ReceiverSelectorMediaType.Screen } disabled={ !(this.state.availableMediaTypes
disabled={ !(this.state.availableMediaTypes & ReceiverSelectorMediaType.Tab) }>
& ReceiverSelectorMediaType.Screen) }> { _("popupMediaTypeTab") }
{ _("popupMediaTypeScreen") } </option>
</option> <option value={ ReceiverSelectorMediaType.Screen }
selected={ isScreenMediaTypeSelected }
disabled={ !(this.state.availableMediaTypes
& ReceiverSelectorMediaType.Screen) }>
{ _("popupMediaTypeScreen") }
</option>
</> }
</select> </select>
</div> </div>
<div className="media-select__label-to"> <div className="media-select__label-to">
@@ -175,7 +197,7 @@ class PopupApp extends Component<{}, PopupAppState> {
onCast={ this.onCast } onCast={ this.onCast }
onStop={ this.onStop } onStop={ this.onStop }
isLoading={ this.state.isLoading } isLoading={ this.state.isLoading }
canCast={ canCast } canCast={ isSelectedMediaTypeAvailable }
key={ i } /> )) key={ i } /> ))
: ( : (
<div className="receivers__not-found"> <div className="receivers__not-found">