From bc0c9c1fcc8780442c5ed23348c298f3de35c573 Mon Sep 17 00:00:00 2001
From: Kovid Goyal <kovid@kovidgoyal.net>
Date: Sun, 10 Nov 2019 23:28:50 +0530
Subject: [PATCH] Viewer: Fix viewer flickering when scrollbar is enabled and
 the header/footer is too wide for the screen.

---
 src/pyj/read_book/scrollbar.pyj | 11 +++++++++--
 src/pyj/read_book/view.pyj      |  5 +++--
 2 files changed, 12 insertions(+), 4 deletions(-)

diff --git a/src/pyj/read_book/scrollbar.pyj b/src/pyj/read_book/scrollbar.pyj
index e1530d3aed..cd7d89e835 100644
--- a/src/pyj/read_book/scrollbar.pyj
+++ b/src/pyj/read_book/scrollbar.pyj
@@ -9,6 +9,9 @@ from book_list.theme import cached_color_to_rgba
 from dom import unique_id
 
 
+SIZE = 10
+
+
 class BookScrollbar:
 
     def __init__(self, view):
@@ -27,10 +30,10 @@ class BookScrollbar:
         self.on_bob_mouseup = self.on_bob_mouse_event.bind(None, 'up')
         return E.div(
             id=self.container_id,
-            style='height: 100vh; background-color: #aaa; width: 10px; border-radius: 5px',
+            style=f'height: 100vh; background-color: #aaa; width: {SIZE}px; border-radius: 5px',
             onclick=self.bar_clicked,
             E.div(
-                style='position: relative; width: 100%; height: 22px; background-color: #444; border-radius: 5px',
+                style=f'position: relative; width: 100%; height: {int(2.2*SIZE)}px; background-color: #444; border-radius: 5px',
                 onmousedown=self.on_bob_mousedown,
             ),
             E.div(
@@ -82,6 +85,10 @@ class BookScrollbar:
         sd = get_session_data()
         self.container.style.display = 'block' if sd.get('book_scrollbar') else 'none'
 
+    @property
+    def effective_width(self):
+        return SIZE if self.container.style.display is 'block' else 0
+
     def set_position(self, frac):
         c = self.container
         frac = max(0, min(frac, 1))
diff --git a/src/pyj/read_book/view.pyj b/src/pyj/read_book/view.pyj
index 601911afeb..d0ed9dc085 100644
--- a/src/pyj/read_book/view.pyj
+++ b/src/pyj/read_book/view.pyj
@@ -507,8 +507,9 @@ class View:
             if which is 'left':
                 # Explicitly set the width of the central panel. This is needed
                 # on small screens with chrome, without it sometimes the right
-                # margin goes off the screen.
-                m.nextSibling.style.maxWidth = 'calc(100vw - {}px)'.format(margin_left + margin_right)
+                # margin/scrollbar goes off the screen.
+                m.nextSibling.style.maxWidth = 'calc(100vw - {}px)'.format(
+                    margin_left + margin_right + self.book_scrollbar.effective_width)
             set_css(m, width=val + 'px')
             val = min(val, 25)
             m.firstChild.style.width = val + 'px'