The code positions the preview panel at the top (38.2%) left (7%) of the viewport. It then detects which half of the page the user is previewing if some zoom-in scale is applied - left or right side. The preview panel's x coordinate is snapped to align with either the left or right edge of the visible page section, to ensure a suitable position.
The code only takes the single-column and 2-column layout into consideration, which has space to improvement.
See the picture, there are three length retrieved from DOM:
1ph is 1% height of the viewport.
1pgw is 1% width of the focused page.
1pw is 1% width of the viewport.
calculate the position of the typst location as p = (x, y).
If viewport.width >= 90pgw || viewport.width < 50pgw,
scroll to (x - 7pw, y - 38.2ph).
otherwise, viewport.width >= 50pgw && viewport.width < 90pgw,
See blue lines in the picture as the example.
if p is in the left side of page (x < 50pgw), scroll to (-5pw, y - 38.2ph);
if p is in the right side of page (x >= 50pgw), scroll to (50pgw - 5pw, y - 38.2ph).
The code positions the preview panel at the top (38.2%) left (7%) of the viewport. It then detects which half of the page the user is previewing if some zoom-in scale is applied - left or right side. The preview panel's x coordinate is snapped to align with either the left or right edge of the visible page section, to ensure a suitable position.
The code only takes the single-column and 2-column layout into consideration, which has space to improvement.
1ph
is 1% height of the viewport.1pgw
is 1% width of the focused page.1pw
is 1% width of the viewport.p = (x, y)
.viewport.width >= 90pgw || viewport.width < 50pgw
,(x - 7pw, y - 38.2ph)
.viewport.width >= 50pgw && viewport.width < 90pgw
, See blue lines in the picture as the example.p
is in the left side of page (x < 50pgw
), scroll to(-5pw, y - 38.2ph)
;p
is in the right side of page (x >= 50pgw
), scroll to(50pgw - 5pw, y - 38.2ph)
.