replace weird sidebar snapping with better ui_opacity

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
This commit is contained in:
Michael Telatynski 2017-05-19 00:20:32 +01:00
parent 3997974f0f
commit 0e7e4d8595
3 changed files with 18 additions and 24 deletions

View file

@ -194,7 +194,7 @@ export default React.createClass({
ConferenceHandler={this.props.ConferenceHandler}
scrollStateMap={this._scrollStateMap}
/>;
if (!this.props.collapse_rhs) right_panel = <RightPanel roomId={this.props.currentRoomId} opacity={this.props.sideOpacity} />;
if (!this.props.collapse_rhs) right_panel = <RightPanel roomId={this.props.currentRoomId} opacity={this.props.rightOpacity} />;
break;
case PageTypes.UserSettings:
@ -206,7 +206,7 @@ export default React.createClass({
referralBaseUrl={this.props.config.referralBaseUrl}
teamToken={this.props.teamToken}
/>;
if (!this.props.collapse_rhs) right_panel = <RightPanel opacity={this.props.sideOpacity}/>;
if (!this.props.collapse_rhs) right_panel = <RightPanel opacity={this.props.rightOpacity}/>;
break;
case PageTypes.CreateRoom:
@ -214,7 +214,7 @@ export default React.createClass({
onRoomCreated={this.props.onRoomCreated}
collapsedRhs={this.props.collapse_rhs}
/>;
if (!this.props.collapse_rhs) right_panel = <RightPanel opacity={this.props.sideOpacity}/>;
if (!this.props.collapse_rhs) right_panel = <RightPanel opacity={this.props.rightOpacity}/>;
break;
case PageTypes.RoomDirectory:
@ -223,7 +223,7 @@ export default React.createClass({
collapsedRhs={this.props.collapse_rhs}
config={this.props.config.roomDirectory}
/>;
if (!this.props.collapse_rhs) right_panel = <RightPanel opacity={this.props.sideOpacity}/>;
if (!this.props.collapse_rhs) right_panel = <RightPanel opacity={this.props.rightOpacity}/>;
break;
case PageTypes.HomePage:
@ -232,12 +232,12 @@ export default React.createClass({
teamServerUrl={this.props.config.teamServerConfig.teamServerURL}
teamToken={this.props.teamToken}
/>
if (!this.props.collapse_rhs) right_panel = <RightPanel opacity={this.props.sideOpacity}/>
if (!this.props.collapse_rhs) right_panel = <RightPanel opacity={this.props.rightOpacity}/>
break;
case PageTypes.UserView:
page_element = null; // deliberately null for now
right_panel = <RightPanel userId={this.props.viewUserId} opacity={this.props.sideOpacity} />;
right_panel = <RightPanel userId={this.props.viewUserId} opacity={this.props.rightOpacity} />;
break;
}
@ -266,7 +266,7 @@ export default React.createClass({
<LeftPanel
selectedRoom={this.props.currentRoomId}
collapsed={this.props.collapse_lhs || false}
opacity={this.props.sideOpacity}
opacity={this.props.leftOpacity}
teamToken={this.props.teamToken}
/>
<main className='mx_MatrixChat_middlePanel'>

View file

@ -119,8 +119,9 @@ module.exports = React.createClass({
collapse_rhs: false,
ready: false,
width: 10000,
sideOpacity: 1.0,
leftOpacity: 1.0,
middleOpacity: 1.0,
rightOpacity: 1.0,
version: null,
newVersion: null,
@ -547,29 +548,23 @@ module.exports = React.createClass({
});
break;
case 'hide_right_panel':
this.was_rhs_collapsed = this.state.collapse_rhs;
this.setState({
collapse_rhs: true,
});
break;
case 'show_right_panel':
this.was_rhs_collapsed = this.state.collapse_rhs;
this.setState({
collapse_rhs: false,
});
break;
// sets the panel to its state before last show/hide event
case 'restore_right_panel':
case 'ui_opacity': {
const sideDefault = payload.sideOpacity >= 0.0 ? payload.sideOpacity : 1.0;
this.setState({
collapse_rhs: this.was_rhs_collapsed,
leftOpacity: payload.leftOpacity >= 0.0 ? payload.leftOpacity : sideDefault,
middleOpacity: payload.middleOpacity || 1.0,
rightOpacity: payload.rightOpacity >= 0.0 ? payload.rightOpacity : sideDefault,
});
break;
case 'ui_opacity':
this.setState({
sideOpacity: payload.sideOpacity,
middleOpacity: payload.middleOpacity,
});
break;
break; }
case 'set_theme':
this._onSetTheme(payload.value);
break;

View file

@ -34,11 +34,11 @@ module.exports = React.createClass({
componentWillMount: function() {
this._unmounted = false;
dis.dispatch({action: 'hide_right_panel'});
dis.dispatch({
action: 'ui_opacity',
sideOpacity: 1.0,
middleOpacity: 0.3,
leftOpacity: 1.0,
rightOpacity: 0.3,
middleOpacity: 0.5,
});
},
@ -50,7 +50,6 @@ module.exports = React.createClass({
componentWillUnmount: function() {
this._unmounted = true;
dis.dispatch({action: 'restore_right_panel'});
dis.dispatch({
action: 'ui_opacity',
sideOpacity: 1.0,