mirror of
https://github.com/kovidgoyal/calibre.git
synced 2025-07-09 03:04:10 -04:00
Better solution to avoid flash of unstyled text
Simply hide the iframe while loading
This commit is contained in:
parent
d9284fe6ab
commit
a1171d71fb
@ -262,15 +262,15 @@ class IframeBoss:
|
|||||||
self.do_layout(self.is_titlepage)
|
self.do_layout(self.is_titlepage)
|
||||||
if self.mathjax:
|
if self.mathjax:
|
||||||
return apply_mathjax(self.mathjax, self.book.manifest.link_uid, self.content_loaded_stage2)
|
return apply_mathjax(self.mathjax, self.book.manifest.link_uid, self.content_loaded_stage2)
|
||||||
|
# window.setTimeout(self.content_loaded_stage2, 1000)
|
||||||
self.content_loaded_stage2()
|
self.content_loaded_stage2()
|
||||||
|
|
||||||
def content_loaded_stage2(self):
|
def content_loaded_stage2(self):
|
||||||
self.connect_links()
|
self.connect_links()
|
||||||
self.content_ready = True
|
self.content_ready = True
|
||||||
# this is the loading styles used to suppress scrollbars during load
|
# this is the loading styles used to suppress scrollbars during load
|
||||||
# added in unserialize_html and the overlay to hide flash of unstyled
|
# added in unserialize_html
|
||||||
# text
|
document.head.removeChild(document.head.firstChild)
|
||||||
document.body.removeChild(document.body.firstChild)
|
|
||||||
|
|
||||||
csi = current_spine_item()
|
csi = current_spine_item()
|
||||||
if csi.initial_position:
|
if csi.initial_position:
|
||||||
|
@ -236,13 +236,11 @@ def unserialize_html(serialized_data, proceed, postprocess_dom):
|
|||||||
head, body = tree[1], tree[2] # noqa: unused-local
|
head, body = tree[1], tree[2] # noqa: unused-local
|
||||||
clear(document.head, document.body)
|
clear(document.head, document.body)
|
||||||
remove_all_attributes(document.head, document.body)
|
remove_all_attributes(document.head, document.body)
|
||||||
# prevent flash of unstyled text during loading, showing
|
# hide browser scrollbars while loading since they will anyway be hidden
|
||||||
# a blank background instead
|
# after loading and this prevents extra layouts
|
||||||
document.body.appendChild(E.div(
|
document.head.appendChild(
|
||||||
'\xa0',
|
|
||||||
style=f'position: absolute; z-index: 2147483647; width: 10000vw; height: 10000vh; background-color: {opts.color_scheme.background}',
|
|
||||||
E.style(type='text/css', 'html::-webkit-scrollbar, body::-webkit-scrollbar { display: none !important }')
|
E.style(type='text/css', 'html::-webkit-scrollbar, body::-webkit-scrollbar { display: none !important }')
|
||||||
))
|
)
|
||||||
# Default stylesheet
|
# Default stylesheet
|
||||||
if not runtime.is_standalone_viewer:
|
if not runtime.is_standalone_viewer:
|
||||||
# for the standalone viewer the default font family is set
|
# for the standalone viewer the default font family is set
|
||||||
|
@ -499,27 +499,28 @@ class View:
|
|||||||
s.color = ans.foreground
|
s.color = ans.foreground
|
||||||
s.backgroundColor = ans.background
|
s.backgroundColor = ans.background
|
||||||
sd = get_session_data()
|
sd = get_session_data()
|
||||||
self.iframe.style.backgroundColor = ans.background or 'white'
|
iframe = self.iframe
|
||||||
|
iframe.style.backgroundColor = ans.background or 'white'
|
||||||
bg_image = sd.get('background_image')
|
bg_image = sd.get('background_image')
|
||||||
if bg_image:
|
if bg_image:
|
||||||
self.iframe.style.backgroundImage = f'url({READER_BACKGROUND_URL}?{Date().getTime()})' if runtime.is_standalone_viewer else f'url({bg_image})'
|
iframe.style.backgroundImage = f'url({READER_BACKGROUND_URL}?{Date().getTime()})' if runtime.is_standalone_viewer else f'url({bg_image})'
|
||||||
else:
|
else:
|
||||||
self.iframe.style.backgroundImage = 'none'
|
iframe.style.backgroundImage = 'none'
|
||||||
if sd.get('background_image_style') is 'scaled':
|
if sd.get('background_image_style') is 'scaled':
|
||||||
self.iframe.style.backgroundSize = '100% 100%'
|
iframe.style.backgroundSize = '100% 100%'
|
||||||
self.iframe.style.backgroundRepeat = 'no-repeat'
|
iframe.style.backgroundRepeat = 'no-repeat'
|
||||||
self.iframe.style.backgroundAttachment = 'scroll'
|
iframe.style.backgroundAttachment = 'scroll'
|
||||||
self.iframe.style.backgroundPosition = 'center'
|
iframe.style.backgroundPosition = 'center'
|
||||||
else:
|
else:
|
||||||
self.iframe.style.backgroundSize = 'auto'
|
iframe.style.backgroundSize = 'auto'
|
||||||
self.iframe.style.backgroundRepeat = 'repeat'
|
iframe.style.backgroundRepeat = 'repeat'
|
||||||
self.iframe.style.backgroundAttachment = 'scroll'
|
iframe.style.backgroundAttachment = 'scroll'
|
||||||
self.iframe.style.backgroundPosition = '0 0'
|
iframe.style.backgroundPosition = '0 0'
|
||||||
|
|
||||||
m.parentNode.style.backgroundColor = ans.background # this is needed on iOS where the bottom margin has its own margin, so we dont want the body background color to bleed through
|
iframe.parentNode.style.backgroundColor = ans.background # this is needed on iOS where the bottom margin has its own margin, so we dont want the body background color to bleed through
|
||||||
self.content_popup_overlay.apply_color_scheme(ans.background, ans.foreground)
|
self.content_popup_overlay.apply_color_scheme(ans.background, ans.foreground)
|
||||||
self.book_scrollbar.apply_color_scheme(ans)
|
self.book_scrollbar.apply_color_scheme(ans)
|
||||||
self.iframe.parentNode.parentNode.style.backgroundColor = ans.background
|
iframe.parentNode.parentNode.style.backgroundColor = ans.background
|
||||||
return ans
|
return ans
|
||||||
|
|
||||||
def on_resize(self):
|
def on_resize(self):
|
||||||
@ -541,7 +542,9 @@ class View:
|
|||||||
if self.show_loading_callback_timer is not None:
|
if self.show_loading_callback_timer is not None:
|
||||||
clearTimeout(self.show_loading_callback_timer)
|
clearTimeout(self.show_loading_callback_timer)
|
||||||
self.show_loading_callback_timer = None
|
self.show_loading_callback_timer = None
|
||||||
|
self.iframe.style.visibility = 'visible'
|
||||||
self.overlay.hide_loading_message()
|
self.overlay.hide_loading_message()
|
||||||
|
self.focus_iframe()
|
||||||
|
|
||||||
def parse_cfi(self, encoded_cfi, book):
|
def parse_cfi(self, encoded_cfi, book):
|
||||||
name = cfi = None
|
name = cfi = None
|
||||||
@ -881,6 +884,7 @@ class View:
|
|||||||
# We cannot encrypt this message because the resource data contains
|
# We cannot encrypt this message because the resource data contains
|
||||||
# Blob objects which do not survive encryption
|
# Blob objects which do not survive encryption
|
||||||
self.processing_spine_item_display = True
|
self.processing_spine_item_display = True
|
||||||
|
self.iframe.style.visibility = 'hidden'
|
||||||
self.iframe_wrapper.send_unencrypted_message('display',
|
self.iframe_wrapper.send_unencrypted_message('display',
|
||||||
resource_data=resource_data, book=self.book, name=self.currently_showing.name,
|
resource_data=resource_data, book=self.book, name=self.currently_showing.name,
|
||||||
initial_position=self.currently_showing.initial_position,
|
initial_position=self.currently_showing.initial_position,
|
||||||
|
Loading…
x
Reference in New Issue
Block a user