Commit graph

104 commits

Author SHA1 Message Date
Bruno Windels
a8b149cfbb cleanup scrollpanel logging 2019-03-20 17:12:49 +01:00
Bruno Windels
460f9a5959 comment typo 2019-03-20 17:10:38 +01:00
Bruno Windels
f164a78eaa reimplement typing notif timeline shrinking prevention
instead of setting a min-height on the whole timeline,
track how much height we need to add to prevent shrinking
and set paddingBottom on the container element of the timeline.
2019-03-20 17:10:30 +01:00
Bruno Windels
1e372aad47 only log when node was found 2019-03-20 11:10:04 +01:00
Bruno Windels
c306181fcd take into account that node might not be in DOM while updating height 2019-03-20 11:00:27 +01:00
Bruno Windels
88f039fe44 keep track of current updateHeight request outside of method
it's only called from one place
2019-03-20 10:59:55 +01:00
Bruno Windels
2bcced72ad take (potentially clipped) content height into account for filling 2019-03-19 16:51:39 +01:00
Bruno Windels
469511aa44 correctly calculate last node in viewport
these variables are now relative to bottom of timeline,
before it was the top
2019-03-19 16:50:55 +01:00
Bruno Windels
71f6b08b26 first impl of new scrolling, still a bit broken 2019-03-19 13:42:22 +01:00
Bruno Windels
d84003ac44 dont break room directory and search 2019-03-18 14:05:56 +01:00
Bruno Windels
891e343df6 create ResizeNotifier to derive which areas of the app resize and emit 2019-03-15 10:16:21 +01:00
Bruno Windels
30d848b86e use AutoHideScrollbar in ScrollPanel 2019-03-15 10:16:21 +01:00
Bruno Windels
10496cd4e8 also remove disconnecting from ResizeObserver 2019-03-11 10:32:30 +01:00
Bruno Windels
98a3f7db0f remove resizeobserver code
seems to cause more harm than good in some cases and we shouldn't need
it if we get our calls to onHeightChanged in order.
2019-03-07 17:22:27 +01:00
Bruno Windels
89b044f5d8 clearer naming in ScrollPanel 2019-03-07 17:02:19 +01:00
Bruno Windels
66b9363466 clear min-height for typing notifs when the timeline viewport changes size 2019-03-05 16:14:38 +01:00
Bruno Windels
37593c117a Revert "remove fix for old chrome bug"
This reverts commit ecb074862e.
2019-03-01 16:08:41 +01:00
Bruno Windels
0c06a702dc pr feedback 2019-02-28 16:05:55 +01:00
Bruno Windels
c920dd2e8a check top of node instead of bottom, since coming in from last
as we're approaching from the last node, if we're scrolled up,
the first node we encounter would be below the bottom of the viewport

change the logic to stop at the first node that has its top
above the viewport bottom.

When completely scrolled up, this was causing nodes way below
the viewport to be selected as the reference for the pixelOffset,
and when pagination came in, it would immediately try to apply
the big negative pixelOffset, scrolling to a negative scrollTop,
thus going to the top again, and triggering another pagination,
entering in an infinite pagination loop until you scrolled down.
2019-02-26 16:26:24 +01:00
Bruno Windels
ba5f16358f fall back to InteractionObserver for detecting timeline resizes
this is not nearly as smooth as using ResizeObserver, as the
callback rate is a lot lower, but seems to be quite a bit better
than what we have right now, without the 7% cpu hog that
the requestAnimationFrame polling fallback has.
2019-02-26 10:49:03 +01:00
Bruno Windels
3823642863 some cleanup 2019-02-26 10:49:03 +01:00
Bruno Windels
41ae618d0e only clear min-height on scroll & adding items (componentDidUpdate)
before we would clear it as soon as you were 1px away from
the bottom of the timeline, which would still create jumping as
the whitespace would around 36px. To play it safe, we only clear it
after moving 200px from the bottom.

Also include "local echo" scroll events, caused by setting scrollTop
2019-02-26 10:49:03 +01:00
Bruno Windels
03784e586c replace getBoundingClientRect() with offset/scrollTop & clientHeight
as they are an order of magnitude faster in most browsers,
getBoundingClientRect() tends to cause relayout.
2019-02-26 10:49:03 +01:00
Bruno Windels
ecb074862e remove fix for old chrome bug 2019-02-26 10:49:03 +01:00
Bruno Windels
b3e6cbfddd restore scroll state when timeline resizes using ResizeObserver
(only where supported, polyfill doesn't give good results)
2019-02-26 10:49:03 +01:00
Bruno Windels
9e260ad96b make sure we're at the bottom, although that seems to always be the case in this branch? 2019-02-14 16:19:58 +01:00
Bruno Windels
790e752b7a clear min-height on scroll 2019-02-14 16:11:38 +01:00
Bruno Windels
3d393b654b clear min-height on ScrollPanel::componentDidUpdate to catch all cases 2019-02-04 18:27:22 +00:00
Bruno Windels
5d45d5dfac formatting 2019-01-22 11:37:09 +01:00
Bruno Windels
018f3d2a5c use box-sizing: border-box to make clientHeight === actual height 2019-01-21 17:30:02 +01:00
Bruno Windels
c9d5c4903b set min-height of messagelist to current height when showing typing bar
this ensures the timeline never shrinks, and avoids jumpiness when
typing bar disappears again.
2019-01-18 18:53:54 +01:00
Luke Barnard
39e9d52c04 Make sure to proxy special prop ref 2018-03-27 13:04:26 +01:00
Luke Barnard
b80568b1c5 Wrap GeminiScrollbar in a component, enabled forceGemini
Fixes https://github.com/vector-im/riot-web/issues/6294
2018-03-27 13:04:26 +01:00
Aidan Gauland
35780f5ae0 Remove use of deprecated React.PropTypes
Replace all uses of React.PropTypes with PropTypes and importing PropTypes from
'prop-types'.
2017-12-26 14:03:18 +13:00
Luke Barnard
ddd0e161c0 Fix broken imports 2017-12-01 10:41:56 +00:00
Luke Barnard
dad797d4a2 Run linting --fix 2017-11-16 13:19:36 +00:00
Luke Barnard
77418f535e Modify GroupView UI
- Remove featured users/rooms
 - Add "Rooms" section to show all rooms in the group in a room-directory-esque list. This has a "+" button in "edit" mode.
 - Make the group view body scrollable
2017-10-13 16:46:33 +01:00
Luke Barnard
d3f9a3aeb5 Run eslint --fix
Fixing 1000s of lint issues. Some rules cannot be `--fix`ed but this goes some way to linting the entire codebase.
2017-10-11 17:56:17 +01:00
David Baker
78a2e49705 Don't always paginate when mounting a ScrollPanel
Calling just checkFill on DidMount did not initially set the
scrollTop which meant that one back pagination request is always
performed regardless. This meant we would end up rending the
first batch of events, then paginating and re-rendering again
after the pagination got another batch, causing unnecessary render
churn.
2017-09-08 15:41:19 +01:00
David Baker
609d61d53c Revert "Implement sticky date separators" 2017-09-06 17:40:58 +01:00
Luke Barnard
c9c0771355 Spelling 2017-08-31 16:29:45 +01:00
Luke Barnard
cdb28f956e Add comment for StickyContainer extension 2017-08-31 16:29:31 +01:00
Luke Barnard
d516906b36 Implement sticky date separators
Use `react-sticky` to implement sticky date separators. This will pin a date separator to the top of the timeline panel when the separator scrolls out of the top of the view.

A known issue of this is that the spinner, which is in line with event tiles in the timeline, will appear to push the stuck date separator down. In reality the first date separator after the spinner is in line with event tiles and is not stuck because the spinner forces the timeline to be scrolled slightly further down than it would be otherwise. But also, date separators in the timeline (not "stuck") have a greater height.

Ideally the date separator would be suppressed whilst back paginating, but this will cause the stuck separator to flicker on and off. This is why the suppression has been removed.
2017-08-30 13:52:46 +01:00
Richard van der Hoff
33f330d434 Manual fixup for remaining q incantaions
* don't try to use `finally` as a static method
* work around absence of `allSettled`
2017-07-12 18:05:40 +01:00
Richard van der Hoff
0254d2b3a2 q(...) -> Promise.resolve
```
find src test -name '*.js' | xargs perl -i -pe 's/\b[qQ]\(/Promise.resolve(/'
```
2017-07-12 18:05:08 +01:00
Richard van der Hoff
a06bd84213 replace imports of q with bluebird
update `package.json`

```
find src test -name '*.js' |
   xargs perl -i -pe 'if (/require\(.[qQ].\)/) { $_ = "import Promise from '\''bluebird'\'';\n"; }'

find src test -name '*.js' |
   xargs perl -i -pe 'if (/import [qQ]/) { $_ = "import Promise from '\''bluebird'\'';\n"; }'
```
2017-07-12 18:05:08 +01:00
Luke Barnard
57f01b83be Revert "Save scroll state immediately before updating"
This reverts commit 4124a8dcff from PR https://github.com/matrix-org/matrix-react-sdk/pull/1076
2017-06-19 13:19:17 +01:00
Luke Barnard
513a585a3e Merge pull request #1076 from ollieh/issues/reduce-save-restore-window
Reduce save-restore window in ScrollPanel to reduce scrolling jumps
2017-06-19 11:23:10 +01:00
Oliver Hunt
4124a8dcff Save scroll state immediately before updating
Signed-off-by: Oliver Hunt <oliver@hunt.bz>
2017-06-12 06:19:12 +01:00
Oliver Hunt
3d59d72aaa Fixed pagination infinite loop caused by long messages
Signed-off-by: Oliver Hunt <oliver@hunt.bz>
2017-06-07 04:49:41 +01:00