Commit graph

92 commits

Author SHA1 Message Date
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
Luke Barnard
6d9a1f047d Typo 2017-05-04 13:03:04 +01:00
Luke Barnard
bfa3123f9b Combine data-scroll-token and -contained-scroll-tokens
- Instead of using one attribute, use one that might just contain one token
 - Use the first token when tracking a child
 - Mandate that no commas can be in individual tokens
2017-05-04 10:00:13 +01:00
Luke Barnard
4febc63aee Add comment to _scrollToToken 2017-05-02 17:41:09 +01:00
Luke Barnard
fe83a99ab7 Update ScrollPanel docs 2017-05-02 17:36:59 +01:00
Luke Barnard
3f25928380 Fix jumping to an unread event when in MELS
This adds the `data-contained-scroll-tokens` API to elements in `ScrollPanel` which allows arbitrary containers of elements with scroll tokens to declare their contained scroll tokens. When jumping to a scroll token inside a container, the `ScrollPanel` will act as if it is scrolling to the container itself, not the child.

MELS has been modified such that it exposes the scroll tokens of all events that exist within it.This means "Jump to unread message" will work if the unread event is within a MELS (which is any member event, because even individual member events surrounded by other events are put inside a MELS).
2017-05-02 16:34:39 +01:00
Matthew Hodgson
fa033e6116 limit our keyboard shortcut modifiers correctly
fixes https://github.com/vector-im/riot-web/issues/3614
2017-04-23 00:49:14 +01:00
Luke Barnard
d218f90cde Fix infinite pagination/glitches with pagination
I think this was being caused by a bug introduced in 47f29b that meant that `backwards` was actually being used as `forwards`.
2017-04-07 11:34:31 +01:00
Luke Barnard
423babdb17 Remove fairly redundant condition
Making sure that a node is intersected by the bottom of the wrapper is a bit overkill, given that we iterate from the bottom. This also prevents the scenario of having no nodes that are not precisely intersected, but possibly straddling the bottom of the wrapper.
2017-04-05 17:51:07 +01:00
Luke Barnard
47f29b9454 Simplify simulated unfill 2017-04-05 17:48:24 +01:00
Luke Barnard
5737994957 Clarify and simplfiy unpagination logic 2017-04-04 13:28:26 +01:00
Luke Barnard
94fe9999db Reimplement _saveScrollState
The actual fix to https://github.com/vector-im/riot-web/issues/3175 is this change to `_saveScrollState`, which is to pick the trackedScrollToken based on which node is intersected by the bottom of the scroll panel. This is opposed to the previous logic that picked based on which node was the first from the bottom to be above the bottom of the viewport.

In the case where the viewport bottom does not intersect any events, the topmost event is used.
2017-04-04 11:55:53 +01:00
Luke Barnard
d8a30aa848 Double UNPAGINATION_PADDING again 2017-03-13 13:48:15 +00:00