mirror of
https://github.com/hedgedoc/hedgedoc.git
synced 2025-04-22 11:19:28 +00:00
Fix render pane scrolling (#613)
This commit is contained in:
parent
01a68b1efe
commit
5381f8ed90
1 changed files with 8 additions and 4 deletions
|
@ -97,11 +97,15 @@ export const DocumentRenderPane: React.FC<DocumentRenderPaneProps & ScrollProps>
|
|||
.reduce((prevLineMark, currentLineMark) =>
|
||||
prevLineMark.line < currentLineMark.line ? prevLineMark : currentLineMark)
|
||||
|
||||
const blockHeight = afterLineMark.position - beforeLineMark.position
|
||||
const componentHeight = afterLineMark.position - beforeLineMark.position
|
||||
const distanceToBefore = scrollTop - beforeLineMark.position
|
||||
const percentageRaw = (distanceToBefore / blockHeight)
|
||||
const percentage = Math.floor(percentageRaw * 100)
|
||||
const newScrollState: ScrollState = { firstLineInView: beforeLineMark.line, scrolledPercentage: percentage }
|
||||
const percentageRaw = (distanceToBefore / componentHeight)
|
||||
const lineCount = afterLineMark.line - beforeLineMark.line
|
||||
const line = Math.floor(lineCount * percentageRaw + beforeLineMark.line)
|
||||
const lineHeight = componentHeight / lineCount
|
||||
const innerScrolling = Math.floor((distanceToBefore % lineHeight) / lineHeight * 100)
|
||||
|
||||
const newScrollState: ScrollState = { firstLineInView: line, scrolledPercentage: innerScrolling }
|
||||
onScroll(newScrollState)
|
||||
}, [lineMarks, onScroll])
|
||||
|
||||
|
|
Loading…
Add table
Reference in a new issue