Add switch between layout classes

This commit is contained in:
Jorik Schellekens 2020-04-29 15:06:38 +01:00
parent a38d5eb224
commit e0c89f6180

View file

@ -117,6 +117,7 @@ export default class MessagePanel extends React.Component {
// display 'ghost' read markers that are animating away // display 'ghost' read markers that are animating away
ghostReadMarkers: [], ghostReadMarkers: [],
showTypingNotifications: SettingsStore.getValue("showTypingNotifications"), showTypingNotifications: SettingsStore.getValue("showTypingNotifications"),
useIRCLayout: SettingsStore.getValue("useIRCLayout"),
}; };
// opaque readreceipt info for each userId; used by ReadReceiptMarker // opaque readreceipt info for each userId; used by ReadReceiptMarker
@ -169,6 +170,8 @@ export default class MessagePanel extends React.Component {
this._showTypingNotificationsWatcherRef = this._showTypingNotificationsWatcherRef =
SettingsStore.watchSetting("showTypingNotifications", null, this.onShowTypingNotificationsChange); SettingsStore.watchSetting("showTypingNotifications", null, this.onShowTypingNotificationsChange);
this._layoutWatcherRef = SettingsStore.watchSetting("useIRCLayout", null, this.onLayoutChange);
} }
componentDidMount() { componentDidMount() {
@ -178,6 +181,7 @@ export default class MessagePanel extends React.Component {
componentWillUnmount() { componentWillUnmount() {
this._isMounted = false; this._isMounted = false;
SettingsStore.unwatchSetting(this._showTypingNotificationsWatcherRef); SettingsStore.unwatchSetting(this._showTypingNotificationsWatcherRef);
SettingsStore.unwatchSetting(this._layoutWatcherRef);
} }
componentDidUpdate(prevProps, prevState) { componentDidUpdate(prevProps, prevState) {
@ -196,6 +200,12 @@ export default class MessagePanel extends React.Component {
}); });
}; };
onLayoutChange = () => {
this.setState({
useIRCLayout: SettingsStore.getValue("useIRCLayout"),
});
}
/* get the DOM node representing the given event */ /* get the DOM node representing the given event */
getNodeForEventId(eventId) { getNodeForEventId(eventId) {
if (!this.eventNodes) { if (!this.eventNodes) {
@ -779,6 +789,8 @@ export default class MessagePanel extends React.Component {
this.props.className, this.props.className,
{ {
"mx_MessagePanel_alwaysShowTimestamps": this.props.alwaysShowTimestamps, "mx_MessagePanel_alwaysShowTimestamps": this.props.alwaysShowTimestamps,
"mx_IRCLayout": this.state.useIRCLayout,
"mx_GroupLayout": !this.state.useIRCLayout,
}, },
); );