From 5bddf62d54064e20db06cd26bfaa73b0ddf1d0e2 Mon Sep 17 00:00:00 2001 From: Bruno Windels Date: Wed, 23 Jan 2019 18:30:51 +0100 Subject: [PATCH 01/15] WIP to port prototype code --- src/resizer/distributors/roomsublist2.js | 280 +++++++++++++++++++++++ 1 file changed, 280 insertions(+) create mode 100644 src/resizer/distributors/roomsublist2.js diff --git a/src/resizer/distributors/roomsublist2.js b/src/resizer/distributors/roomsublist2.js new file mode 100644 index 0000000000..c720152962 --- /dev/null +++ b/src/resizer/distributors/roomsublist2.js @@ -0,0 +1,280 @@ +/* +Copyright 2019 New Vector Ltd + +Licensed under the Apache License, Version 2.0 (the "License"); +you may not use this file except in compliance with the License. +You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + +Unless required by applicable law or agreed to in writing, software +distributed under the License is distributed on an "AS IS" BASIS, +WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +See the License for the specific language governing permissions and +limitations under the License. +*/ + +const allowWhitespace = true; +const blendOverflow = false; +const handleHeight = 1; + +function log(...params) { + // console.log.apply(console, params); +} + +function clamp(height, min, max) { + //log(`clamping ${height} between ${min} and ${max}`); + if (height > max) return max; + if (height < min) return min; + return height; +} + +export class Layout { + constructor(applyHeight, initialSizes, collapsedState) { + this._applyHeight = applyHeight; + this._sections = []; + this._collapsedState = collapsedState || {}; + this._availableHeight = 0; + // need to store heights by id so it doesn't get + // assigned to wrong section when a section gets added? + this._sectionHeights = initialSizes || {}; + this._originalHeights = []; + this._heights = []; + } + + setAvailableHeight(newSize) { + this._availableHeight = newSize; + // needs more work + this._applyNewSize(); + } + + setCollapsed(id, collapsed) { + this._collapsedState[id] = collapsed; + this._applyNewSize(); + } + // [{id, count}] + setSections(sections) { + this._sections = sections; + this._applyNewSize(); + } + + openHandle(id) { + return new Handle(this, this._getSectionIndex(id)); + } + + _getAvailableHeight() { + const nonCollapsedSectionCount = this._sections.reduce((count, section) => { + const collapsed = this._collapsedState[section.id]; + return count + (collapsed ? 0 : 1); + }); + return this._availableHeight - ((nonCollapsedSectionCount - 1) * handleHeight); + } + + _applyNewSize() { + const height = this._getAvailableHeight(); + const sectionHeights = this._sections.map((section) => { + return this._sectionHeight[section.id] || (height / this._sections.length); + }); + const totalRequestedHeight = sectionHeights.reduce((sum, h) => h + sum, 0); + const ratios = sectionHeights.map((h) => h / totalRequestedHeight); + this._originalHeights = ratios.map((r) => r * height); + this._heights = this._originalHeights.slice(0); + this._relayout(); + } + + _getSectionIndex(id) { + return this._sections.findIndex((s) => s.id === id); + } + + _getMaxHeight(i) { + const section = this._sections[i]; + const collapsed = this._collapsedState[section.id]; + + if (collapsed) { + return this._sectionHeight(0); + } else { + return this._sectionHeight(section.count); + } + } + + _sectionHeight(count) { + return 36 + (count === 0 ? 0 : 4 + (count * 34)); + } + + _getMinHeight(i) { + const section = this._sections[i]; + return this._sectionHeight(Math.min(section.count, 1)); + } + + _applyOverflow(overflow, sections) { + //log("applyOverflow", overflow, sections); + // take the given overflow amount, and applies it to the given sections. + // calls itself recursively until it has distributed all the overflow + // or run out of unclamped sections. + + let unclampedSections = []; + + let overflowPerSection = blendOverflow ? (overflow / sections.length) : overflow; + for (const i of sections) { + newHeight = clamp(this._heights[i] - overflow, this._getMinHeight(i), this._getMaxHeight(i)); + if (newHeight == this._heights[i] - overflow) { + unclampedSections.push(i); + } + overflow -= this._heights[i] - newHeight; + log(`heights[${i}] (${this._heights[i]}) - newHeight (${newHeight}) = ${this._heights[i] - newHeight}`); + + // log(`changing ${this._heights[i]} to ${newHeight}`); + this._heights[i] = newHeight; + + //log(`for section ${i} overflow is ${overflow}`); + + if (!blendOverflow) { + overflowPerSection = overflow; + if (Math.abs(overflow) < 1.0) break; + } + } + + if (Math.abs(overflow) > 1.0 && unclampedSections.length > 0) { + // we weren't able to distribute all the overflow so recurse and try again + log("recursing with", overflow, unclampedSections); + overflow = this._applyOverflow(overflow, unclampedSections); + } + + return overflow; + } + + _rebalanceAbove(overflowAbove) { + if (Math.abs(overflowAbove) > 1.0) { + log(`trying to rebalance upstream with ${overflowAbove}`); + let sections = []; + for (let i = anchor - 1; i >= 1; i--) { + sections.push(i); + } + overflowAbove = this._applyOverflow(overflowAbove, sections); + } + return overflowAbove; + } + + _rebalanceBelow(overflowBelow) { + if (Math.abs(overflowBelow) > 1.0) { + log(`trying to rebalance downstream with ${overflowBelow}`); + let sections = []; + for (let i = anchor + 1; i <= this._sections.length; i++) { + sections.push(i); + } + overflowBelow = this._applyOverflow(overflowBelow, sections); + //log(`rebalanced downstream with ${overflowBelow}`); + } + return overflowBelow; + } + + // @param offset the amount the anchor is moved from what is stored in _originalHeights, positive if downwards + // if we're clamped, return the offset we should be clamped at. + _relayout(anchor = 0, offset = 0, clamped = false) { + this._heights = this._originalHeights.slice(0); + // are these the amounts the items above/below shrank/grew and need to be relayouted? + let overflowAbove; + let overflowBelow; + const maxHeight = this._getMaxHeight(anchor); + const minHeight = this._getMinHeight(anchor); + // new height > max ? + if (this._heights[anchor] + offset > maxHeight) { + // we're pulling downwards and clamped + // overflowAbove = minus how much are we above max height? + overflowAbove = (maxHeight - this._heights[anchor]) - offset; + overflowBelow = offset; + log(`pulling downwards clamped at max: ${overflowAbove} ${overflowBelow}`); + } + // new height < min? + else if (this._heights[anchor] + offset < minHeight) { + // we're pulling upwards and clamped + // overflowAbove = ??? (offset is negative here, so - offset will add) + overflowAbove = (minHeight - this._heights[anchor]) - offset; + overflowBelow = offset; + log(`pulling upwards clamped at min: ${overflowAbove} ${overflowBelow}`); + } + else { + overflowAbove = 0; + overflowBelow = offset; + log(`resizing the anchor: ${overflowAbove} ${overflowBelow}`); + } + this._heights[anchor] = clamp(this._heights[anchor] + offset, minHeight, maxHeight); + + // these are reassigned the amount of overflow that could not be rebalanced + // meaning we dragged the handle too far and it can't follow the cursor anymore + overflowAbove = this._rebalanceAbove(overflowAbove); + overflowBelow = this._rebalanceBelow(overflowBelow); + + if (!clamped) { // to avoid risk of infinite recursion + // clamp to avoid overflowing or underflowing the page + if (Math.abs(overflowAbove) > 1.0) { + log(`clamping with overflowAbove ${overflowAbove}`); + // here we do the layout again with offset - the amount of space we took too much + this._relayout(anchor, offset + overflowAbove, true); + return offset + overflowAbove; + } + + if (Math.abs(overflowBelow) > 1.0) { + // here we do the layout again with offset - the amount of space we took too much + log(`clamping with overflowBelow ${overflowBelow}`); + this._relayout(anchor, offset - overflowBelow, true); + return offset - overflowBelow; + } + } + + // apply the heights + for (let i = 0; i < this._sections.length; i++) { + const section = this._sections[i]; + this._applyHeight(section.id, this._heights[i]); + // const roomSubList = document.getElementById(`roomSubList${i}`); + // roomSubList.style.height = `${heights[i]}px`; + } + + return undefined; + } + + _commitHeights() { + this._originalHeights = this._heights; + } +} + +class Handle { + constructor(layout, anchor) { + this._layout = layout; + this._anchor = anchor; + } + + setOffset(offset) { + this._layout._relayout(this._anchor, offset); + } + + finish() { + this._layout._commitHeights(); + } +} + +export class Distributor { + constructor(item, cfg) { + this._item = item; + this._layout = cfg.layout; + this._initialTop; + } + + start() { + this._handle = this._layout.openHandle(this._item.id); + this._initialTop = this._item.getOffset(); + } + + finish() { + this._handle.finish(); + } + + resize() { + // not supported + } + + resizeFromContainerOffset(containerOffset) { + const offset = containerOffset - this._initialTop; + this._handle.setOffset(offset); + } +} From 1092244bbf7f85c3df32b5a736db1c005a3fdcca Mon Sep 17 00:00:00 2001 From: Bruno Windels Date: Thu, 24 Jan 2019 15:43:23 +0100 Subject: [PATCH 02/15] more fixes for updates/resizing --- src/resizer/distributors/roomsublist2.js | 105 ++++++++++++----------- 1 file changed, 57 insertions(+), 48 deletions(-) diff --git a/src/resizer/distributors/roomsublist2.js b/src/resizer/distributors/roomsublist2.js index c720152962..2a815cf3b0 100644 --- a/src/resizer/distributors/roomsublist2.js +++ b/src/resizer/distributors/roomsublist2.js @@ -14,12 +14,14 @@ See the License for the specific language governing permissions and limitations under the License. */ -const allowWhitespace = true; +import FixedDistributor from "./fixed"; + +// const allowWhitespace = true; const blendOverflow = false; const handleHeight = 1; function log(...params) { - // console.log.apply(console, params); + console.log.apply(console, params); } function clamp(height, min, max) { @@ -53,31 +55,46 @@ export class Layout { this._applyNewSize(); } // [{id, count}] - setSections(sections) { + update(sections, availableHeight) { + if (Number.isFinite(availableHeight)) { + this._availableHeight = availableHeight; + } + + this._sections.forEach((section, i) => { + this._sectionHeights[section.id] = this._originalHeights[i]; + }); + this._sections = sections; this._applyNewSize(); } openHandle(id) { - return new Handle(this, this._getSectionIndex(id)); + const index = this._getSectionIndex(id); + //log(`openHandle resolved ${id} to ${index}`); + return new Handle(this, index); } _getAvailableHeight() { const nonCollapsedSectionCount = this._sections.reduce((count, section) => { const collapsed = this._collapsedState[section.id]; return count + (collapsed ? 0 : 1); - }); + }, 0); return this._availableHeight - ((nonCollapsedSectionCount - 1) * handleHeight); } _applyNewSize() { const height = this._getAvailableHeight(); const sectionHeights = this._sections.map((section) => { - return this._sectionHeight[section.id] || (height / this._sections.length); + return this._sectionHeights[section.id] || (height / this._sections.length); }); const totalRequestedHeight = sectionHeights.reduce((sum, h) => h + sum, 0); const ratios = sectionHeights.map((h) => h / totalRequestedHeight); this._originalHeights = ratios.map((r) => r * height); + // re-assign adjusted heights + this._sections.forEach((section, i) => { + this._sectionHeights[section.id] = this._originalHeights[i]; + }); + log("_applyNewSize", height, this._sections, sectionHeights, ratios, this._originalHeights); this._heights = this._originalHeights.slice(0); this._relayout(); } @@ -87,6 +104,8 @@ export class Layout { } _getMaxHeight(i) { + return 100000; + /* const section = this._sections[i]; const collapsed = this._collapsedState[section.id]; @@ -95,6 +114,7 @@ export class Layout { } else { return this._sectionHeight(section.count); } + */ } _sectionHeight(count) { @@ -103,6 +123,7 @@ export class Layout { _getMinHeight(i) { const section = this._sections[i]; + log("_getMinHeight", i, section); return this._sectionHeight(Math.min(section.count, 1)); } @@ -112,11 +133,11 @@ export class Layout { // calls itself recursively until it has distributed all the overflow // or run out of unclamped sections. - let unclampedSections = []; + const unclampedSections = []; - let overflowPerSection = blendOverflow ? (overflow / sections.length) : overflow; + // let overflowPerSection = blendOverflow ? (overflow / sections.length) : overflow; for (const i of sections) { - newHeight = clamp(this._heights[i] - overflow, this._getMinHeight(i), this._getMaxHeight(i)); + const newHeight = clamp(this._heights[i] - overflow, this._getMinHeight(i), this._getMaxHeight(i)); if (newHeight == this._heights[i] - overflow) { unclampedSections.push(i); } @@ -129,7 +150,7 @@ export class Layout { //log(`for section ${i} overflow is ${overflow}`); if (!blendOverflow) { - overflowPerSection = overflow; + // overflowPerSection = overflow; if (Math.abs(overflow) < 1.0) break; } } @@ -143,11 +164,11 @@ export class Layout { return overflow; } - _rebalanceAbove(overflowAbove) { + _rebalanceAbove(anchor, overflowAbove) { if (Math.abs(overflowAbove) > 1.0) { - log(`trying to rebalance upstream with ${overflowAbove}`); - let sections = []; - for (let i = anchor - 1; i >= 1; i--) { + // log(`trying to rebalance upstream with ${overflowAbove}`); + const sections = []; + for (let i = anchor - 1; i >= 0; i--) { sections.push(i); } overflowAbove = this._applyOverflow(overflowAbove, sections); @@ -155,11 +176,11 @@ export class Layout { return overflowAbove; } - _rebalanceBelow(overflowBelow) { + _rebalanceBelow(anchor, overflowBelow) { if (Math.abs(overflowBelow) > 1.0) { - log(`trying to rebalance downstream with ${overflowBelow}`); - let sections = []; - for (let i = anchor + 1; i <= this._sections.length; i++) { + // log(`trying to rebalance downstream with ${overflowBelow}`); + const sections = []; + for (let i = anchor + 1; i < this._sections.length; i++) { sections.push(i); } overflowBelow = this._applyOverflow(overflowBelow, sections); @@ -183,32 +204,29 @@ export class Layout { // overflowAbove = minus how much are we above max height? overflowAbove = (maxHeight - this._heights[anchor]) - offset; overflowBelow = offset; - log(`pulling downwards clamped at max: ${overflowAbove} ${overflowBelow}`); - } - // new height < min? - else if (this._heights[anchor] + offset < minHeight) { + // log(`pulling downwards clamped at max: ${overflowAbove} ${overflowBelow}`); + } else if (this._heights[anchor] + offset < minHeight) { // new height < min? // we're pulling upwards and clamped // overflowAbove = ??? (offset is negative here, so - offset will add) overflowAbove = (minHeight - this._heights[anchor]) - offset; overflowBelow = offset; - log(`pulling upwards clamped at min: ${overflowAbove} ${overflowBelow}`); - } - else { + // log(`pulling upwards clamped at min: ${overflowAbove} ${overflowBelow}`); + } else { overflowAbove = 0; overflowBelow = offset; - log(`resizing the anchor: ${overflowAbove} ${overflowBelow}`); + // log(`resizing the anchor: ${overflowAbove} ${overflowBelow}`); } this._heights[anchor] = clamp(this._heights[anchor] + offset, minHeight, maxHeight); // these are reassigned the amount of overflow that could not be rebalanced // meaning we dragged the handle too far and it can't follow the cursor anymore - overflowAbove = this._rebalanceAbove(overflowAbove); - overflowBelow = this._rebalanceBelow(overflowBelow); + overflowAbove = this._rebalanceAbove(anchor, overflowAbove); + overflowBelow = this._rebalanceBelow(anchor, overflowBelow); if (!clamped) { // to avoid risk of infinite recursion // clamp to avoid overflowing or underflowing the page if (Math.abs(overflowAbove) > 1.0) { - log(`clamping with overflowAbove ${overflowAbove}`); + // log(`clamping with overflowAbove ${overflowAbove}`); // here we do the layout again with offset - the amount of space we took too much this._relayout(anchor, offset + overflowAbove, true); return offset + overflowAbove; @@ -216,25 +234,26 @@ export class Layout { if (Math.abs(overflowBelow) > 1.0) { // here we do the layout again with offset - the amount of space we took too much - log(`clamping with overflowBelow ${overflowBelow}`); + // log(`clamping with overflowBelow ${overflowBelow}`); this._relayout(anchor, offset - overflowBelow, true); return offset - overflowBelow; } } + log("updating layout, heights are now", this._heights); // apply the heights for (let i = 0; i < this._sections.length; i++) { const section = this._sections[i]; this._applyHeight(section.id, this._heights[i]); - // const roomSubList = document.getElementById(`roomSubList${i}`); - // roomSubList.style.height = `${heights[i]}px`; } return undefined; } _commitHeights() { - this._originalHeights = this._heights; + const heights = this._heights.slice(0); + log("committing heights:", heights); + this._originalHeights = heights; } } @@ -253,28 +272,18 @@ class Handle { } } -export class Distributor { +export class Distributor extends FixedDistributor { constructor(item, cfg) { - this._item = item; - this._layout = cfg.layout; - this._initialTop; - } - - start() { - this._handle = this._layout.openHandle(this._item.id); - this._initialTop = this._item.getOffset(); + super(item); + const layout = cfg.layout; + this._handle = layout.openHandle(item.id); } finish() { this._handle.finish(); } - resize() { - // not supported - } - - resizeFromContainerOffset(containerOffset) { - const offset = containerOffset - this._initialTop; + resize(offset) { this._handle.setOffset(offset); } } From 067a861f807ecc7f160e3fa867fc1d83878cb298 Mon Sep 17 00:00:00 2001 From: Bruno Windels Date: Thu, 24 Jan 2019 15:43:49 +0100 Subject: [PATCH 03/15] integrate layout/distributor with RoomList --- src/components/structures/RoomSubList.js | 12 +++++-- src/components/views/rooms/RoomList.js | 46 +++++++++++++++++------- 2 files changed, 43 insertions(+), 15 deletions(-) diff --git a/src/components/structures/RoomSubList.js b/src/components/structures/RoomSubList.js index cda1c9967e..852dddd063 100644 --- a/src/components/structures/RoomSubList.js +++ b/src/components/structures/RoomSubList.js @@ -313,6 +313,12 @@ const RoomSubList = React.createClass({ } }, + setHeight: function(height) { + if (this.refs.subList) { + this.refs.subList.style.height = `${height}px`; + } + }, + render: function() { const len = this.props.list.length + this.props.extraTiles.length; if (len) { @@ -322,13 +328,13 @@ const RoomSubList = React.createClass({ "mx_RoomSubList_nonEmpty": len && !this.state.hidden, }); if (this.state.hidden) { - return
+ return
{this._getHeaderJsx()}
; } else { const tiles = this.makeRoomTiles(); tiles.push(...this.props.extraTiles); - return
+ return
{this._getHeaderJsx()} { tiles } @@ -343,7 +349,7 @@ const RoomSubList = React.createClass({ } return ( -
+
{ this._getHeaderJsx() } { content }
diff --git a/src/components/views/rooms/RoomList.js b/src/components/views/rooms/RoomList.js index 1a714e3a84..647e755456 100644 --- a/src/components/views/rooms/RoomList.js +++ b/src/components/views/rooms/RoomList.js @@ -36,7 +36,8 @@ import GroupStore from '../../../stores/GroupStore'; import RoomSubList from '../../structures/RoomSubList'; import ResizeHandle from '../elements/ResizeHandle'; -import {Resizer, RoomSubListDistributor} from '../../../resizer' +import {Resizer} from '../../../resizer' +import {Layout, Distributor} from '../../../resizer/distributors/roomsublist2'; const HIDE_CONFERENCE_CHANS = true; const STANDARD_TAGS_REGEX = /^(m\.(favourite|lowpriority|server_notice)|im\.vector\.fake\.(invite|recent|direct|archived))$/; @@ -79,6 +80,20 @@ module.exports = React.createClass({ const collapsedJson = window.localStorage.getItem("mx_roomlist_collapsed"); this.subListSizes = sizesJson ? JSON.parse(sizesJson) : {}; this.collapsedState = collapsedJson ? JSON.parse(collapsedJson) : {}; + this._layoutSections = []; + + this._layout = new Layout((key, size) => { + const subList = this._subListRefs[key]; + if (subList) { + subList.setHeight(size); + } + this.subListSizes[key] = size; + window.localStorage.setItem("mx_roomlist_sizes", + JSON.stringify(this.subListSizes)); + // update overflow indicators + this._checkSubListsOverflow(); + }, this.subListSizes, this.collapsedState); + return { isLoadingLeftRooms: false, totalRoomCount: null, @@ -166,19 +181,18 @@ module.exports = React.createClass({ componentDidMount: function() { this.dispatcherRef = dis.register(this.onAction); const cfg = { - onResized: this._onSubListResize, + layout: this._layout, }; - this.resizer = new Resizer(this.resizeContainer, RoomSubListDistributor, cfg); + this.resizer = new Resizer(this.resizeContainer, Distributor, cfg); this.resizer.setClassNames({ handle: "mx_ResizeHandle", vertical: "mx_ResizeHandle_vertical", reverse: "mx_ResizeHandle_reverse" }); - - // load stored sizes - Object.keys(this.subListSizes).forEach((key) => { - this._restoreSubListSize(key); - }); + this._layout.update( + this._layoutSections, + this.resizeContainer && this.resizeContainer.clientHeight, + ); this._checkSubListsOverflow(); this.resizer.attach(); @@ -194,6 +208,11 @@ module.exports = React.createClass({ }); this._checkSubListsOverflow(); } + this._layout.update( + this._layoutSections, + this.resizeContainer && this.resizeContainer.clientHeight, + ); + // TODO: call layout.setAvailableHeight, window height was changed when bannerShown prop was changed }, onAction: function(payload) { @@ -551,9 +570,7 @@ module.exports = React.createClass({ this.collapsedState[key] = collapsed; window.localStorage.setItem("mx_roomlist_collapsed", JSON.stringify(this.collapsedState)); // load the persisted size configuration of the expanded sub list - if (!collapsed) { - this._restoreSubListSize(key); - } + this._layout.setCollapsed(key, collapsed); // check overflow, as sub lists sizes have changed // important this happens after calling resize above this._checkSubListsOverflow(); @@ -581,6 +598,7 @@ module.exports = React.createClass({ }, _mapSubListProps: function(subListsProps) { + this._layoutSections = []; const defaultProps = { collapsed: this.props.collapsed, isFiltered: !!this.props.searchFilter, @@ -599,6 +617,7 @@ module.exports = React.createClass({ return subListsProps.reduce((components, props, i) => { props = Object.assign({}, defaultProps, props); const isLast = i === subListsProps.length - 1; + const len = props.list.length + (props.extraTiles ? props.extraTiles.length : 0); const {key, label, onHeaderClick, ... otherProps} = props; const chosenKey = key || label; const onSubListHeaderClick = (collapsed) => { @@ -608,7 +627,10 @@ module.exports = React.createClass({ } }; const startAsHidden = props.startAsHidden || this.collapsedState[chosenKey]; - + this._layoutSections.push({ + id: chosenKey, + count: len, + }); let subList = ( Date: Thu, 24 Jan 2019 15:44:16 +0100 Subject: [PATCH 04/15] remove flexbox layout --- res/css/structures/_RoomSubList.scss | 25 ++----------------------- res/css/views/rooms/_RoomList.scss | 9 +++++---- 2 files changed, 7 insertions(+), 27 deletions(-) diff --git a/res/css/structures/_RoomSubList.scss b/res/css/structures/_RoomSubList.scss index faaf1cf462..e403057cd3 100644 --- a/res/css/structures/_RoomSubList.scss +++ b/res/css/structures/_RoomSubList.scss @@ -32,34 +32,13 @@ limitations under the License. */ .mx_RoomSubList { - min-height: 31px; - flex: 0 10000 auto; display: flex; flex-direction: column; } -.mx_RoomSubList.resized-sized { - /* - flex-basis to 0 so sublists - are not shrinking/growing relative - to their content (as would be the case with auto), - as this intervenes with sizing an item exactly - when not available space is available - in the flex container - */ - flex: 1 1 0; -} -.mx_RoomSubList_nonEmpty { - min-height: 74px; - - .mx_AutoHideScrollbar_offset { - padding-bottom: 4px; - } -} - -.mx_RoomSubList_hidden { - flex: none !important; +.mx_RoomSubList_nonEmpty .mx_AutoHideScrollbar_offset { + padding-bottom: 4px; } .mx_RoomSubList_labelContainer { diff --git a/res/css/views/rooms/_RoomList.scss b/res/css/views/rooms/_RoomList.scss index 8f78e3bb7a..360966a952 100644 --- a/res/css/views/rooms/_RoomList.scss +++ b/res/css/views/rooms/_RoomList.scss @@ -17,13 +17,14 @@ limitations under the License. .mx_RoomList { /* take up remaining space below TopLeftMenu */ - flex: 1 1 auto; - /* use flexbox to layout sublists */ - display: flex; - flex-direction: column; + flex: 1; min-height: 0; } +.mx_RoomList .mx_ResizeHandle { + position: relative; +} + .mx_SearchBox { flex: none; } From b230e65e74da43e179b4fd571d2abc903bdbada0 Mon Sep 17 00:00:00 2001 From: Bruno Windels Date: Thu, 24 Jan 2019 16:44:36 +0100 Subject: [PATCH 05/15] prevent height doubling when resizing caused by mixing up absolute height with incremental height --- src/resizer/distributors/roomsublist2.js | 13 +++++++------ 1 file changed, 7 insertions(+), 6 deletions(-) diff --git a/src/resizer/distributors/roomsublist2.js b/src/resizer/distributors/roomsublist2.js index 2a815cf3b0..2db4db9b80 100644 --- a/src/resizer/distributors/roomsublist2.js +++ b/src/resizer/distributors/roomsublist2.js @@ -71,7 +71,7 @@ export class Layout { openHandle(id) { const index = this._getSectionIndex(id); //log(`openHandle resolved ${id} to ${index}`); - return new Handle(this, index); + return new Handle(this, index, this._originalHeights[index]); } _getAvailableHeight() { @@ -258,13 +258,14 @@ export class Layout { } class Handle { - constructor(layout, anchor) { + constructor(layout, anchor, height) { this._layout = layout; this._anchor = anchor; + this._initialHeight = height; } - setOffset(offset) { - this._layout._relayout(this._anchor, offset); + setHeight(height) { + this._layout._relayout(this._anchor, height - this._initialHeight); } finish() { @@ -283,7 +284,7 @@ export class Distributor extends FixedDistributor { this._handle.finish(); } - resize(offset) { - this._handle.setOffset(offset); + resize(height) { + this._handle.setHeight(height); } } From 636955daef3c27b67b73b6b20add81528abe4ce1 Mon Sep 17 00:00:00 2001 From: Bruno Windels Date: Thu, 24 Jan 2019 16:45:26 +0100 Subject: [PATCH 06/15] use offsetHeight for consistency with sizer --- src/components/views/rooms/RoomList.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/views/rooms/RoomList.js b/src/components/views/rooms/RoomList.js index 647e755456..0c910f6808 100644 --- a/src/components/views/rooms/RoomList.js +++ b/src/components/views/rooms/RoomList.js @@ -191,7 +191,7 @@ module.exports = React.createClass({ }); this._layout.update( this._layoutSections, - this.resizeContainer && this.resizeContainer.clientHeight, + this.resizeContainer && this.resizeContainer.offsetHeight, ); this._checkSubListsOverflow(); From 4eb2555fc1c6933360c1e66b27751a89f748e2a1 Mon Sep 17 00:00:00 2001 From: Bruno Windels Date: Thu, 24 Jan 2019 18:18:10 +0100 Subject: [PATCH 07/15] initial support for collapsing --- src/resizer/distributors/roomsublist2.js | 26 +++++++++++++++--------- 1 file changed, 16 insertions(+), 10 deletions(-) diff --git a/src/resizer/distributors/roomsublist2.js b/src/resizer/distributors/roomsublist2.js index 2db4db9b80..099d533166 100644 --- a/src/resizer/distributors/roomsublist2.js +++ b/src/resizer/distributors/roomsublist2.js @@ -84,19 +84,25 @@ export class Layout { _applyNewSize() { const height = this._getAvailableHeight(); - const sectionHeights = this._sections.map((section) => { + // we should only scale the section here between min and max size + const requestedHeights = this._sections.map((section) => { return this._sectionHeights[section.id] || (height / this._sections.length); }); - const totalRequestedHeight = sectionHeights.reduce((sum, h) => h + sum, 0); - const ratios = sectionHeights.map((h) => h / totalRequestedHeight); - this._originalHeights = ratios.map((r) => r * height); + const totalRequestedHeight = requestedHeights.reduce((sum, h) => h + sum, 0); + const ratios = requestedHeights.map((h) => h / totalRequestedHeight); + this._originalHeights = ratios.map((r, i) => clamp(r * height, this._getMinHeight(i), this._getMaxHeight(i))); + const totalRequestedHeight2 = requestedHeights.reduce((sum, h) => h + sum, 0); + const overflow = height - totalRequestedHeight2; // re-assign adjusted heights this._sections.forEach((section, i) => { this._sectionHeights[section.id] = this._originalHeights[i]; }); - log("_applyNewSize", height, this._sections, sectionHeights, ratios, this._originalHeights); + log("_applyNewSize", height, this._sections, requestedHeights, ratios, this._originalHeights); this._heights = this._originalHeights.slice(0); this._relayout(); + if (overflow) { + this._applyOverflow(overflow, this._sections.map((_, i) => i)); + } } _getSectionIndex(id) { @@ -104,17 +110,15 @@ export class Layout { } _getMaxHeight(i) { - return 100000; - /* const section = this._sections[i]; const collapsed = this._collapsedState[section.id]; if (collapsed) { return this._sectionHeight(0); } else { + // return 100000; return this._sectionHeight(section.count); } - */ } _sectionHeight(count) { @@ -123,8 +127,10 @@ export class Layout { _getMinHeight(i) { const section = this._sections[i]; - log("_getMinHeight", i, section); - return this._sectionHeight(Math.min(section.count, 1)); + const collapsed = this._collapsedState[section.id]; + const maxItems = collapsed ? 0 : 1; + // log("_getMinHeight", i, section); + return this._sectionHeight(Math.min(section.count, maxItems)); } _applyOverflow(overflow, sections) { From 8ffeee6a9852a81f4f3ee00de84d3312d798774c Mon Sep 17 00:00:00 2001 From: Bruno Windels Date: Fri, 25 Jan 2019 18:47:34 +0100 Subject: [PATCH 08/15] add matthews new resize algo --- src/resizer/distributors/roomsublist2.js | 79 ++++++++++++------------ 1 file changed, 41 insertions(+), 38 deletions(-) diff --git a/src/resizer/distributors/roomsublist2.js b/src/resizer/distributors/roomsublist2.js index 099d533166..36c140887b 100644 --- a/src/resizer/distributors/roomsublist2.js +++ b/src/resizer/distributors/roomsublist2.js @@ -17,7 +17,6 @@ limitations under the License. import FixedDistributor from "./fixed"; // const allowWhitespace = true; -const blendOverflow = false; const handleHeight = 1; function log(...params) { @@ -59,11 +58,16 @@ export class Layout { if (Number.isFinite(availableHeight)) { this._availableHeight = availableHeight; } - + const totalHeight = this._getAvailableHeight(); this._sections.forEach((section, i) => { - this._sectionHeights[section.id] = this._originalHeights[i]; + this._originalHeights[i] = + this._sectionHeights[section.id] || + clamp( + totalHeight / this._sections.length, + this._getMinHeight(i), + this._getMaxHeight(i), + ); }); - this._sections = sections; this._applyNewSize(); } @@ -83,26 +87,21 @@ export class Layout { } _applyNewSize() { - const height = this._getAvailableHeight(); - // we should only scale the section here between min and max size - const requestedHeights = this._sections.map((section) => { - return this._sectionHeights[section.id] || (height / this._sections.length); - }); - const totalRequestedHeight = requestedHeights.reduce((sum, h) => h + sum, 0); - const ratios = requestedHeights.map((h) => h / totalRequestedHeight); - this._originalHeights = ratios.map((r, i) => clamp(r * height, this._getMinHeight(i), this._getMaxHeight(i))); - const totalRequestedHeight2 = requestedHeights.reduce((sum, h) => h + sum, 0); - const overflow = height - totalRequestedHeight2; - // re-assign adjusted heights + const newHeight = this._getAvailableHeight(); + let currHeight = 0; + const sections = []; + for (let i = 0; i < this._sections.length; i++) { + currHeight += this._originalHeights[i]; + sections.push(i); + } + const offset = newHeight - currHeight; + this._heights = this._originalHeights.slice(0); + this._applyOverflow(-offset, sections, true); + this._applyHeights(); + this._originalHeights = this._heights; this._sections.forEach((section, i) => { this._sectionHeights[section.id] = this._originalHeights[i]; }); - log("_applyNewSize", height, this._sections, requestedHeights, ratios, this._originalHeights); - this._heights = this._originalHeights.slice(0); - this._relayout(); - if (overflow) { - this._applyOverflow(overflow, this._sections.map((_, i) => i)); - } } _getSectionIndex(id) { @@ -116,8 +115,8 @@ export class Layout { if (collapsed) { return this._sectionHeight(0); } else { - // return 100000; - return this._sectionHeight(section.count); + return 100000; + // return this._sectionHeight(section.count); } } @@ -133,7 +132,7 @@ export class Layout { return this._sectionHeight(Math.min(section.count, maxItems)); } - _applyOverflow(overflow, sections) { + _applyOverflow(overflow, sections, blend) { //log("applyOverflow", overflow, sections); // take the given overflow amount, and applies it to the given sections. // calls itself recursively until it has distributed all the overflow @@ -141,22 +140,23 @@ export class Layout { const unclampedSections = []; - // let overflowPerSection = blendOverflow ? (overflow / sections.length) : overflow; + let overflowPerSection = blend ? (overflow / sections.length) : overflow; for (const i of sections) { - const newHeight = clamp(this._heights[i] - overflow, this._getMinHeight(i), this._getMaxHeight(i)); - if (newHeight == this._heights[i] - overflow) { + const newHeight = clamp(this._heights[i] - overflowPerSection, this._getMinHeight(i), this._getMaxHeight(i)); + if (newHeight == this._heights[i] - overflowPerSection) { unclampedSections.push(i); } + // when section is growing, overflow increases? + // 100 -= 200 - 300 + // 100 -= -100 + // 200 overflow -= this._heights[i] - newHeight; - log(`heights[${i}] (${this._heights[i]}) - newHeight (${newHeight}) = ${this._heights[i] - newHeight}`); - - // log(`changing ${this._heights[i]} to ${newHeight}`); + // console.log(`this._heights[${i}] (${this._heights[i]}) - newHeight (${newHeight}) = ${this._heights[i] - newHeight}`); + // console.log(`changing ${this._heights[i]} to ${newHeight}`); this._heights[i] = newHeight; - - //log(`for section ${i} overflow is ${overflow}`); - - if (!blendOverflow) { - // overflowPerSection = overflow; + // console.log(`for section ${i} overflow is ${overflow}`); + if (!blend) { + overflowPerSection = overflow; if (Math.abs(overflow) < 1.0) break; } } @@ -164,7 +164,7 @@ export class Layout { if (Math.abs(overflow) > 1.0 && unclampedSections.length > 0) { // we weren't able to distribute all the overflow so recurse and try again log("recursing with", overflow, unclampedSections); - overflow = this._applyOverflow(overflow, unclampedSections); + overflow = this._applyOverflow(overflow, unclampedSections, blend); } return overflow; @@ -246,14 +246,17 @@ export class Layout { } } + this._applyHeights(); + return undefined; + } + + _applyHeights() { log("updating layout, heights are now", this._heights); // apply the heights for (let i = 0; i < this._sections.length; i++) { const section = this._sections[i]; this._applyHeight(section.id, this._heights[i]); } - - return undefined; } _commitHeights() { From cb9ebf8b8b426b88273e469e5562b51bac07d849 Mon Sep 17 00:00:00 2001 From: Bruno Windels Date: Fri, 25 Jan 2019 18:47:57 +0100 Subject: [PATCH 09/15] rerender roomlist when banner gets shown/hidden, to update the layout --- src/components/structures/LeftPanel.js | 1 + src/components/structures/LoggedInView.js | 1 + 2 files changed, 2 insertions(+) diff --git a/src/components/structures/LeftPanel.js b/src/components/structures/LeftPanel.js index ba0e97366e..a2d08f35c8 100644 --- a/src/components/structures/LeftPanel.js +++ b/src/components/structures/LeftPanel.js @@ -212,6 +212,7 @@ const LeftPanel = React.createClass({ diff --git a/src/components/structures/LoggedInView.js b/src/components/structures/LoggedInView.js index 409988842f..e57e42e0cf 100644 --- a/src/components/structures/LoggedInView.js +++ b/src/components/structures/LoggedInView.js @@ -553,6 +553,7 @@ const LoggedInView = React.createClass({
From 2d2f9712b5682086c109170fab1331229bb3a06a Mon Sep 17 00:00:00 2001 From: Bruno Windels Date: Fri, 25 Jan 2019 18:48:25 +0100 Subject: [PATCH 10/15] update layout on window resize --- src/components/views/rooms/RoomList.js | 13 +++++++++++++ 1 file changed, 13 insertions(+) diff --git a/src/components/views/rooms/RoomList.js b/src/components/views/rooms/RoomList.js index 0c910f6808..3cbd8b0a4b 100644 --- a/src/components/views/rooms/RoomList.js +++ b/src/components/views/rooms/RoomList.js @@ -196,6 +196,7 @@ module.exports = React.createClass({ this._checkSubListsOverflow(); this.resizer.attach(); + window.addEventListener("resize", this.onWindowResize); this.mounted = true; }, @@ -241,6 +242,7 @@ module.exports = React.createClass({ componentWillUnmount: function() { this.mounted = false; + window.removeEventListener("resize", this.onWindowResize); dis.unregister(this.dispatcherRef); if (MatrixClientPeg.get()) { MatrixClientPeg.get().removeListener("Room", this.onRoom); @@ -270,6 +272,17 @@ module.exports = React.createClass({ this._delayedRefreshRoomList.cancelPendingCall(); }, + onWindowResize: function() { + if (this.mounted && this._layout && this.resizeContainer && + Array.isArray(this._layoutSections) + ) { + this._layout.update( + this._layoutSections, + this.resizeContainer.offsetHeight + ); + } + }, + onRoom: function(room) { this.updateVisibleRooms(); }, From 0a5e8e6cfe5535ca66c4098db834a45f51a71ec1 Mon Sep 17 00:00:00 2001 From: Bruno Windels Date: Mon, 28 Jan 2019 14:35:04 +0100 Subject: [PATCH 11/15] WIP on persisting height across collapse/expand --- src/components/views/rooms/RoomList.js | 50 +++++++----------------- src/resizer/distributors/roomsublist2.js | 21 +++++++--- 2 files changed, 29 insertions(+), 42 deletions(-) diff --git a/src/components/views/rooms/RoomList.js b/src/components/views/rooms/RoomList.js index 3cbd8b0a4b..f79ca64869 100644 --- a/src/components/views/rooms/RoomList.js +++ b/src/components/views/rooms/RoomList.js @@ -87,11 +87,14 @@ module.exports = React.createClass({ if (subList) { subList.setHeight(size); } - this.subListSizes[key] = size; - window.localStorage.setItem("mx_roomlist_sizes", - JSON.stringify(this.subListSizes)); // update overflow indicators this._checkSubListsOverflow(); + // don't store height for collapsed sublists + if(!this.collapsedState[key]) { + this.subListSizes[key] = size; + window.localStorage.setItem("mx_roomlist_sizes", + JSON.stringify(this.subListSizes)); + } }, this.subListSizes, this.collapsedState); return { @@ -161,23 +164,6 @@ module.exports = React.createClass({ this._delayedRefreshRoomListLoopCount = 0; }, - _onSubListResize: function(newSize, id) { - if (!id) { - return; - } - if (typeof newSize === "string") { - newSize = Number.MAX_SAFE_INTEGER; - } - if (newSize === null) { - delete this.subListSizes[id]; - } else { - this.subListSizes[id] = newSize; - } - window.localStorage.setItem("mx_roomlist_sizes", JSON.stringify(this.subListSizes)); - // update overflow indicators - this._checkSubListsOverflow(); - }, - componentDidMount: function() { this.dispatcherRef = dis.register(this.onAction); const cfg = { @@ -202,13 +188,9 @@ module.exports = React.createClass({ componentDidUpdate: function(prevProps) { this._repositionIncomingCallBox(undefined, false); - if (this.props.searchFilter !== prevProps.searchFilter) { - // restore sizes - Object.keys(this.subListSizes).forEach((key) => { - this._restoreSubListSize(key); - }); - this._checkSubListsOverflow(); - } + // if (this.props.searchFilter !== prevProps.searchFilter) { + // this._checkSubListsOverflow(); + // } this._layout.update( this._layoutSections, this.resizeContainer && this.resizeContainer.clientHeight, @@ -583,20 +565,16 @@ module.exports = React.createClass({ this.collapsedState[key] = collapsed; window.localStorage.setItem("mx_roomlist_collapsed", JSON.stringify(this.collapsedState)); // load the persisted size configuration of the expanded sub list - this._layout.setCollapsed(key, collapsed); + if (collapsed) { + this._layout.collapseSection(key); + } else { + this._layout.expandSection(key, this.subListSizes[key]); + } // check overflow, as sub lists sizes have changed // important this happens after calling resize above this._checkSubListsOverflow(); }, - _restoreSubListSize(key) { - const size = this.subListSizes[key]; - const handle = this.resizer.forHandleWithId(key); - if (handle) { - handle.resize(size); - } - }, - // check overflow for scroll indicator gradient _checkSubListsOverflow() { Object.values(this._subListRefs).forEach(l => l.checkOverflow()); diff --git a/src/resizer/distributors/roomsublist2.js b/src/resizer/distributors/roomsublist2.js index 36c140887b..bd4c37df84 100644 --- a/src/resizer/distributors/roomsublist2.js +++ b/src/resizer/distributors/roomsublist2.js @@ -34,11 +34,11 @@ export class Layout { constructor(applyHeight, initialSizes, collapsedState) { this._applyHeight = applyHeight; this._sections = []; - this._collapsedState = collapsedState || {}; + this._collapsedState = Object.assign({}, collapsedState); this._availableHeight = 0; // need to store heights by id so it doesn't get // assigned to wrong section when a section gets added? - this._sectionHeights = initialSizes || {}; + this._sectionHeights = Object.assign({}, initialSizes); this._originalHeights = []; this._heights = []; } @@ -49,10 +49,17 @@ export class Layout { this._applyNewSize(); } - setCollapsed(id, collapsed) { - this._collapsedState[id] = collapsed; + expandSection(id, height) { + this._collapsedState[id] = false; + this._applyNewSize(); + this.openHandle(id).setHeight(height).finish(); + } + + collapseSection(id) { + this._collapsedState[id] = true; this._applyNewSize(); } + // [{id, count}] update(sections, availableHeight) { if (Number.isFinite(availableHeight)) { @@ -98,7 +105,7 @@ export class Layout { this._heights = this._originalHeights.slice(0); this._applyOverflow(-offset, sections, true); this._applyHeights(); - this._originalHeights = this._heights; + this._commitHeights(); this._sections.forEach((section, i) => { this._sectionHeights[section.id] = this._originalHeights[i]; }); @@ -163,7 +170,7 @@ export class Layout { if (Math.abs(overflow) > 1.0 && unclampedSections.length > 0) { // we weren't able to distribute all the overflow so recurse and try again - log("recursing with", overflow, unclampedSections); + // log("recursing with", overflow, unclampedSections); overflow = this._applyOverflow(overflow, unclampedSections, blend); } @@ -275,10 +282,12 @@ class Handle { setHeight(height) { this._layout._relayout(this._anchor, height - this._initialHeight); + return this; } finish() { this._layout._commitHeights(); + return this; } } From bfb1031a6bac7b43696d70f55d34366a0178b21d Mon Sep 17 00:00:00 2001 From: Bruno Windels Date: Mon, 28 Jan 2019 14:52:40 +0100 Subject: [PATCH 12/15] unify heights stored by id and index, to avoid them getting out of sync effectively get rid of _originalHeights and calculate the array from the dictionary when needed --- src/resizer/distributors/roomsublist2.js | 38 ++++++++++-------------- 1 file changed, 16 insertions(+), 22 deletions(-) diff --git a/src/resizer/distributors/roomsublist2.js b/src/resizer/distributors/roomsublist2.js index bd4c37df84..aede4938fa 100644 --- a/src/resizer/distributors/roomsublist2.js +++ b/src/resizer/distributors/roomsublist2.js @@ -36,10 +36,9 @@ export class Layout { this._sections = []; this._collapsedState = Object.assign({}, collapsedState); this._availableHeight = 0; - // need to store heights by id so it doesn't get - // assigned to wrong section when a section gets added? + // heights stored by section section id this._sectionHeights = Object.assign({}, initialSizes); - this._originalHeights = []; + // in-progress heights, while dragging. Committed on mouse-up. this._heights = []; } @@ -67,13 +66,13 @@ export class Layout { } const totalHeight = this._getAvailableHeight(); this._sections.forEach((section, i) => { - this._originalHeights[i] = - this._sectionHeights[section.id] || - clamp( + if (!this._sectionHeights.hasOwnProperty(section.id)) { + this._sectionHeights[section.id] = clamp( totalHeight / this._sections.length, this._getMinHeight(i), this._getMaxHeight(i), ); + }; }); this._sections = sections; this._applyNewSize(); @@ -82,7 +81,7 @@ export class Layout { openHandle(id) { const index = this._getSectionIndex(id); //log(`openHandle resolved ${id} to ${index}`); - return new Handle(this, index, this._originalHeights[index]); + return new Handle(this, index, this._sectionHeights[id]); } _getAvailableHeight() { @@ -95,20 +94,15 @@ export class Layout { _applyNewSize() { const newHeight = this._getAvailableHeight(); - let currHeight = 0; - const sections = []; - for (let i = 0; i < this._sections.length; i++) { - currHeight += this._originalHeights[i]; - sections.push(i); - } + const currHeight = this._sections.reduce((sum, section) => { + return sum + this._sectionHeights[section.id]; + }, 0); const offset = newHeight - currHeight; - this._heights = this._originalHeights.slice(0); + this._heights = this._sections.map((section) => this._sectionHeights[section.id]); + const sections = this._sections.map((_, i) => i); this._applyOverflow(-offset, sections, true); this._applyHeights(); this._commitHeights(); - this._sections.forEach((section, i) => { - this._sectionHeights[section.id] = this._originalHeights[i]; - }); } _getSectionIndex(id) { @@ -202,10 +196,10 @@ export class Layout { return overflowBelow; } - // @param offset the amount the anchor is moved from what is stored in _originalHeights, positive if downwards + // @param offset the amount the anchor is moved from what is stored in _sectionHeights, positive if downwards // if we're clamped, return the offset we should be clamped at. _relayout(anchor = 0, offset = 0, clamped = false) { - this._heights = this._originalHeights.slice(0); + this._heights = this._sections.map((section) => this._sectionHeights[section.id]); // are these the amounts the items above/below shrank/grew and need to be relayouted? let overflowAbove; let overflowBelow; @@ -267,9 +261,9 @@ export class Layout { } _commitHeights() { - const heights = this._heights.slice(0); - log("committing heights:", heights); - this._originalHeights = heights; + this._sections.forEach((section, i) => { + this._sectionHeights[section.id] = this._heights[i]; + }); } } From d08216e8570dd6d6c27257345b99d793008cfeb6 Mon Sep 17 00:00:00 2001 From: Bruno Windels Date: Mon, 28 Jan 2019 14:56:14 +0100 Subject: [PATCH 13/15] fix lint --- src/resizer/distributors/roomsublist2.js | 8 ++++++-- 1 file changed, 6 insertions(+), 2 deletions(-) diff --git a/src/resizer/distributors/roomsublist2.js b/src/resizer/distributors/roomsublist2.js index aede4938fa..e3559c54f3 100644 --- a/src/resizer/distributors/roomsublist2.js +++ b/src/resizer/distributors/roomsublist2.js @@ -72,7 +72,7 @@ export class Layout { this._getMinHeight(i), this._getMaxHeight(i), ); - }; + } }); this._sections = sections; this._applyNewSize(); @@ -143,7 +143,11 @@ export class Layout { let overflowPerSection = blend ? (overflow / sections.length) : overflow; for (const i of sections) { - const newHeight = clamp(this._heights[i] - overflowPerSection, this._getMinHeight(i), this._getMaxHeight(i)); + const newHeight = clamp( + this._heights[i] - overflowPerSection, + this._getMinHeight(i), + this._getMaxHeight(i), + ); if (newHeight == this._heights[i] - overflowPerSection) { unclampedSections.push(i); } From f103e60d1d14f408fbef248aae18075fa4c68365 Mon Sep 17 00:00:00 2001 From: Bruno Windels Date: Mon, 28 Jan 2019 15:22:05 +0100 Subject: [PATCH 14/15] fix lint - bis --- src/resizer/distributors/roomsublist2.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/resizer/distributors/roomsublist2.js b/src/resizer/distributors/roomsublist2.js index e3559c54f3..ca440370c2 100644 --- a/src/resizer/distributors/roomsublist2.js +++ b/src/resizer/distributors/roomsublist2.js @@ -19,8 +19,8 @@ import FixedDistributor from "./fixed"; // const allowWhitespace = true; const handleHeight = 1; -function log(...params) { - console.log.apply(console, params); +function log() { + // console.log.apply(console, ["LAYOUT: "].concat(params)); } function clamp(height, min, max) { From eaf212dd89baa8e267189716ea9ff86902649322 Mon Sep 17 00:00:00 2001 From: Bruno Windels Date: Mon, 28 Jan 2019 15:28:56 +0100 Subject: [PATCH 15/15] fix lint - bis bis --- src/resizer/distributors/roomsublist2.js | 1 - 1 file changed, 1 deletion(-) diff --git a/src/resizer/distributors/roomsublist2.js b/src/resizer/distributors/roomsublist2.js index ca440370c2..5d291e1516 100644 --- a/src/resizer/distributors/roomsublist2.js +++ b/src/resizer/distributors/roomsublist2.js @@ -20,7 +20,6 @@ import FixedDistributor from "./fixed"; const handleHeight = 1; function log() { - // console.log.apply(console, ["LAYOUT: "].concat(params)); } function clamp(height, min, max) {