imterah/element-portable
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Move backdrop filter to a canvas based solution

Browse source
This commit is contained in:
Germain Souquet 2021-06-24 17:51:11 +01:00
parent f0ad70f0e7
commit 27ee7c5836
9 changed files with 129 additions and 49 deletions
Download patch file Download diff file Expand all files Collapse all files

19
src/components/structures/LoggedInView.tsx
View file

@ -59,6 +59,10 @@ import {replaceableComponent} from "../../utils/replaceableComponent";
import CallHandler, { CallHandlerEvent } from '../../CallHandler';
import { MatrixCall } from 'matrix-js-sdk/src/webrtc/call';
import AudioFeedArrayForCall from '../views/voip/AudioFeedArrayForCall';
import { OwnProfileStore } from '../../stores/OwnProfileStore';
import { UPDATE_EVENT } from "../../stores/AsyncStore";
import { mediaFromMxc } from "../../customisations/Media";
// We need to fetch each pinned message individually (if we don't already have it)
// so each pinned message may trigger a request. Limit the number per room for sanity.
@ -120,6 +124,7 @@ interface IState {
usageLimitEventTs?: number;
useCompactLayout: boolean;
activeCalls: Array<MatrixCall>;
backgroundImage?: ImageBitmap;
}
/**
@ -198,6 +203,8 @@ class LoggedInView extends React.Component<IProps, IState> {
this.resizer = this._createResizer();
this.resizer.attach();
this._loadResizerPreferences();
OwnProfileStore.instance.on(UPDATE_EVENT, this.refreshBackgroundImage);
}
componentWillUnmount() {
@ -206,10 +213,17 @@ class LoggedInView extends React.Component<IProps, IState> {
this._matrixClient.removeListener("accountData", this.onAccountData);
this._matrixClient.removeListener("sync", this.onSync);
this._matrixClient.removeListener("RoomState.events", this.onRoomStateEvents);
OwnProfileStore.instance.off(UPDATE_EVENT, this.refreshBackgroundImage);
SettingsStore.unwatchSetting(this.compactLayoutWatcherRef);
this.resizer.detach();
}
private refreshBackgroundImage = async (): Promise<void> => {
this.setState({
backgroundImage: await OwnProfileStore.instance.getAvatarBitmap(),
});
}
private onCallsChanged = () => {
this.setState({
activeCalls: CallHandler.sharedInstance().getAllActiveCalls(),
@ -633,10 +647,13 @@ class LoggedInView extends React.Component<IProps, IState> {
>
<ToastContainer />
<div ref={this._resizeContainer} className={bodyClasses}>
{ SettingsStore.getValue("feature_spaces") ? <SpacePanel /> : null }
{ SettingsStore.getValue("feature_spaces")
? <SpacePanel backgroundImage={this.state.backgroundImage} />
: null }
<LeftPanel
isMinimized={this.props.collapseLhs || false}
resizeNotifier={this.props.resizeNotifier}
backgroundImage={this.state.backgroundImage}
/>
<ResizeHandle />
{ pageElement }