matrix/matrix-react-sdk
1
0
Fork 0
mirror of https://github.com/matrix-org/matrix-react-sdk.git synced 2025-11-20 16:22:28 +03:00
Code Activity

unbreak history scrolling for pills & emoji

Browse Source
This commit is contained in:
Matthew Hodgson
2018-05-13 00:54:01 +01:00
parent 33eaa84bdf
commit 877a6195ae
1 changed files with 9 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
src/components/views/rooms/MessageComposerInput.js
View File

@@ -912,12 +912,17 @@ export default class MessageComposerInput extends React.Component {
const editorNode = ReactDOM.findDOMNode(this.refs.editor); const editorNode = ReactDOM.findDOMNode(this.refs.editor);
const editorRect = editorNode.getBoundingClientRect(); const editorRect = editorNode.getBoundingClientRect();
// heuristic to handle tall emoji, pills, etc pushing the cursor away from the top
// or bottom of the page.
// XXX: is this going to break on large inline images or top-to-bottom scripts?
const EDGE_THRESHOLD = 8;
let navigateHistory = false; let navigateHistory = false;
if (up) { if (up) {
const scrollCorrection = editorNode.scrollTop; const scrollCorrection = editorNode.scrollTop;
const distanceFromTop = cursorRect.top - editorRect.top + scrollCorrection; const distanceFromTop = cursorRect.top - editorRect.top + scrollCorrection;
//console.log(`Cursor distance from editor top is ${distanceFromTop}`); console.log(`Cursor distance from editor top is ${distanceFromTop}`);
if (distanceFromTop == 0) { if (distanceFromTop < EDGE_THRESHOLD) {
navigateHistory = true; navigateHistory = true;
} }
} }
@@ -925,8 +930,8 @@ export default class MessageComposerInput extends React.Component {
const scrollCorrection = const scrollCorrection =
editorNode.scrollHeight - editorNode.clientHeight - editorNode.scrollTop; editorNode.scrollHeight - editorNode.clientHeight - editorNode.scrollTop;
const distanceFromBottom = cursorRect.bottom - editorRect.bottom + scrollCorrection; const distanceFromBottom = cursorRect.bottom - editorRect.bottom + scrollCorrection;
//console.log(`Cursor distance from editor bottom is ${distanceFromBottom}`); console.log(`Cursor distance from editor bottom is ${distanceFromBottom}`);
if (distanceFromBottom == 0) { if (distanceFromBottom < EDGE_THRESHOLD) {
navigateHistory = true; navigateHistory = true;
} }
} }