search

BoostIO / BoostNote-Legacy

This repository is outdated and new Boost Note app is available! We've launched a new Boost Note app which supports real-time collaborative writing. https://github.com/BoostIO/BoostNote-App
Other
17.07k stars 1.47k forks source link

Scrolling not sync between Editor and Preview #1811

Open brucelinker opened 6 years ago

brucelinker commented 6 years ago

Current behavior

I have been experiencing cases where preview does not sync its scroll position to where the editor view is. It seems to act up when I use several small code block mixed with regular text and markdown.

Love the editor, thanks!

Expected behavior

I expect the preview to always show where you are typing in the editor.

Steps to reproduce

  1. Write a lot of text mixed in with code block samples now and then
  2. After a while, you will find that where you are typing in the editor is not in view in the preview.

Environment

nagledb commented 6 years ago

This was bugging me today so I spent some time investigating. It looks like syncing is not content-aware. Instead, it simply syncs up the two windows based on where you are in terms of pixel distance in the rendered version of the scrolled window.

So for example, let's say your markdown window's content has a total rendered height of 10,000 pixels and your preview window's content has a total rendered height of 12,000 pixels. You scroll your markdown window so that the top of the window is at pixel height 2,500. That means the top of your markdown window is now 0.25 (25%) of the way through the document. The rendered window then gets scrolled so that its top is also at 0.25 (pixel height 3,000).

This doesn't necessarily work well because the rendered height of a given markdown element can vary considerably. Some examples: Some lines of markdown don't get rendered at all. Headings are much taller than paragraph text. Word-wrapping can cause the number of lines to change.

As a real-world example for how bad that can be: I'm currently editing a markdown document that has 418 lines of content. I scrolled my markdown pane so that lines 271 to 297 were in view; the preview window showed me the content for lines 334 to 351. Those ranges don't even overlap.

A better solution might be to sync the windows based on the content. For example, look at the line number for what's at the top and then scroll the other window so that the same line number is at the top. I spent a bit of time trying to implement that today but couldn't get it to work right.

IssueHuntBot commented 6 years ago

@adlersantos funded this issue with $10. See it on IssueHunt

ytee commented 5 years ago

It would be good to disable / enable scroll sync with a button