clear width of right panel container when collapsed in grid view

This commit is contained in:
Bruno Windels 2019-01-07 15:20:39 +01:00
parent b63bd5ea54
commit 81c48f07c7
4 changed files with 27 additions and 8 deletions

View file

@ -104,7 +104,7 @@ export default class RoomGridView extends React.Component {
}
return (<main className="mx_GroupGridView">
<MainSplit panel={rightPanel}>
<MainSplit panel={rightPanel} disableSizing={this.props.collapsedRhs} >
<div className="mx_GroupGridView_rooms">
{ roomStores.map((roomStore, i) => {
if (roomStore) {

View file

@ -71,14 +71,17 @@ export default class MainSplit extends React.Component {
}
componentDidUpdate(prevProps) {
const wasExpanded = !this.props.collapsedRhs && prevProps.collapsedRhs;
const wasCollapsed = this.props.collapsedRhs && !prevProps.collapsedRhs;
const wasPanelSet = this.props.panel && !prevProps.panel;
const wasPanelCleared = !this.props.panel && prevProps.panel;
const shouldAllowResizing =
!this.props.disableSizing &&
!this.props.collapsedRhs &&
this.props.panel;
if (wasExpanded || wasPanelSet) {
if (shouldAllowResizing && !this.resizer) {
this._createResizer();
} else if (wasCollapsed || wasPanelCleared) {
} else if (!shouldAllowResizing && this.resizer) {
if (this.props.disableSizing) {
this.resizer.clearItemSizes();
}
this.resizer.detach();
this.resizer = null;
}

View file

@ -43,6 +43,14 @@ export class Resizer {
this._onMouseDown = this._onMouseDown.bind(this);
}
clearItemSizes() {
const handles = this._getResizeHandles();
handles.forEach((handle) => {
const {sizer, item} = this._createSizerAndDistributor(handle);
sizer.clearItemSize(item);
});
}
setClassNames(classNames) {
this.classNames = classNames;
}
@ -134,7 +142,7 @@ export class Resizer {
const distributor = new this.distributorCtor(
sizer, item, id, this.distributorCfg,
items, this.container);
return {sizer, distributor};
return {sizer, distributor, item};
}
_getResizableItems() {

View file

@ -82,6 +82,14 @@ class Sizer {
}
}
clearItemSize(item, size) {
if (this.vertical) {
item.style.height = null;
} else {
item.style.width = null;
}
}
/**
@param {MouseEvent} event the mouse event
@return {number} the distance between the cursor and the edge of the container,