E-book viewer: Add an option to control the maximum text height in full screen. Note that it only owrks if the viewer is in paged mode (which is the default mode).

This commit is contained in:
Kovid Goyal 2014-03-09 09:23:58 +05:30
parent 158c33481e
commit ea6b203b37
6 changed files with 71 additions and 22 deletions

Binary file not shown.

View File

@ -25,9 +25,10 @@ class FullScreen
this.initial_left_margin = bs.marginLeft this.initial_left_margin = bs.marginLeft
this.initial_right_margin = bs.marginRight this.initial_right_margin = bs.marginRight
on: (max_text_width, in_paged_mode) -> on: (max_text_width, max_text_height, in_paged_mode) ->
if in_paged_mode if in_paged_mode
window.paged_display.max_col_width = max_text_width window.paged_display.max_col_width = max_text_width
window.paged_display.max_col_height = max_text_height
else else
s = document.body.style s = document.body.style
s.maxWidth = max_text_width + 'px' s.maxWidth = max_text_width + 'px'

View File

@ -26,6 +26,7 @@ class PagedDisplay
this.current_margin_side = 0 this.current_margin_side = 0
this.is_full_screen_layout = false this.is_full_screen_layout = false
this.max_col_width = -1 this.max_col_width = -1
this.max_col_height = - 1
this.current_page_height = null this.current_page_height = null
this.document_margins = null this.document_margins = null
this.use_document_margins = false this.use_document_margins = false
@ -71,10 +72,14 @@ class PagedDisplay
this.margin_top = this.document_margins.top or margin_top this.margin_top = this.document_margins.top or margin_top
this.margin_bottom = this.document_margins.bottom or margin_bottom this.margin_bottom = this.document_margins.bottom or margin_bottom
this.margin_side = this.document_margins.left or this.document_margins.right or margin_side this.margin_side = this.document_margins.left or this.document_margins.right or margin_side
this.effective_margin_top = this.margin_top
this.effective_margin_bottom = this.margin_bottom
else else
this.margin_top = margin_top this.margin_top = margin_top
this.margin_side = margin_side this.margin_side = margin_side
this.margin_bottom = margin_bottom this.margin_bottom = margin_bottom
this.effective_margin_top = this.margin_top
this.effective_margin_bottom = this.margin_bottom
handle_rtl_body: (body_style) -> handle_rtl_body: (body_style) ->
if body_style.direction == "rtl" if body_style.direction == "rtl"
@ -118,7 +123,6 @@ class PagedDisplay
this.col_width = col_width this.col_width = col_width
this.page_width = col_width + 2*sm this.page_width = col_width + 2*sm
this.screen_width = this.page_width * this.cols_per_screen this.screen_width = this.page_width * this.cols_per_screen
this.current_page_height = window.innerHeight - this.margin_top - this.margin_bottom
fgcolor = body_style.getPropertyValue('color') fgcolor = body_style.getPropertyValue('color')
@ -142,12 +146,20 @@ class PagedDisplay
if c?.nodeType == 1 if c?.nodeType == 1
c.style.setProperty('-webkit-margin-before', '0') c.style.setProperty('-webkit-margin-before', '0')
this.effective_margin_top = this.margin_top
this.effective_margin_bottom = this.margin_bottom
this.current_page_height = window.innerHeight - this.margin_top - this.margin_bottom
if this.max_col_height > 0 and this.current_page_height > this.max_col_height
eh = Math.ceil((this.current_page_height - this.max_col_height) / 2)
this.effective_margin_top += eh
this.effective_margin_bottom += eh
this.current_page_height -= 2 * eh
bs.setProperty('overflow', 'visible') bs.setProperty('overflow', 'visible')
bs.setProperty('height', (window.innerHeight - this.margin_top - this.margin_bottom) + 'px') bs.setProperty('height', this.current_page_height + 'px')
bs.setProperty('width', (window.innerWidth - 2*sm)+'px') bs.setProperty('width', (window.innerWidth - 2*sm)+'px')
bs.setProperty('margin-top', this.margin_top + 'px') bs.setProperty('margin-top', this.effective_margin_top + 'px')
bs.setProperty('margin-bottom', this.margin_bottom+'px') bs.setProperty('margin-bottom', this.effective_margin_bottom+'px')
bs.setProperty('margin-left', sm+'px') bs.setProperty('margin-left', sm+'px')
bs.setProperty('margin-right', sm+'px') bs.setProperty('margin-right', sm+'px')
for edge in ['left', 'right', 'top', 'bottom'] for edge in ['left', 'right', 'top', 'bottom']
@ -193,12 +205,12 @@ class PagedDisplay
create_header_footer: (uuid) -> create_header_footer: (uuid) ->
if this.header_template != null if this.header_template != null
this.header = document.createElement('div') this.header = document.createElement('div')
this.header.setAttribute('style', "overflow:hidden; display:block; position:absolute; left:#{ this.side_margin }px; top: 0px; height: #{ this.margin_top }px; width: #{ this.col_width }px; margin: 0; padding: 0") this.header.setAttribute('style', "overflow:hidden; display:block; position:absolute; left:#{ this.side_margin }px; top: 0px; height: #{ this.effective_margin_top }px; width: #{ this.col_width }px; margin: 0; padding: 0")
this.header.setAttribute('id', 'pdf_page_header_'+uuid) this.header.setAttribute('id', 'pdf_page_header_'+uuid)
document.body.appendChild(this.header) document.body.appendChild(this.header)
if this.footer_template != null if this.footer_template != null
this.footer = document.createElement('div') this.footer = document.createElement('div')
this.footer.setAttribute('style', "overflow:hidden; display:block; position:absolute; left:#{ this.side_margin }px; top: #{ window.innerHeight - this.margin_bottom }px; height: #{ this.margin_bottom }px; width: #{ this.col_width }px; margin: 0; padding: 0") this.footer.setAttribute('style', "overflow:hidden; display:block; position:absolute; left:#{ this.side_margin }px; top: #{ window.innerHeight - this.effective_margin_bottom }px; height: #{ this.effective_margin_bottom }px; width: #{ this.col_width }px; margin: 0; padding: 0")
this.footer.setAttribute('id', 'pdf_page_footer_'+uuid) this.footer.setAttribute('id', 'pdf_page_footer_'+uuid)
document.body.appendChild(this.footer) document.body.appendChild(this.footer)
if this.header != null or this.footer != null if this.header != null or this.footer != null
@ -501,8 +513,8 @@ class PagedDisplay
continue continue
deltax = Math.floor(this.page_width/25) deltax = Math.floor(this.page_width/25)
deltay = Math.floor(window.innerHeight/25) deltay = Math.floor(window.innerHeight/25)
cury = this.margin_top cury = this.effective_margin_top
until cury >= (window.innerHeight - this.margin_bottom) until cury >= (window.innerHeight - this.effective_margin_bottom)
curx = left + this.current_margin_side curx = left + this.current_margin_side
until curx >= (right - this.current_margin_side) until curx >= (right - this.current_margin_side)
cfi = window.cfi.at_point(curx-window.pageXOffset, cury-window.pageYOffset) cfi = window.cfi.at_point(curx-window.pageXOffset, cury-window.pageYOffset)

View File

@ -35,6 +35,10 @@ def config(defaults=None):
help=_("Set the maximum width that the book's text and pictures will take" help=_("Set the maximum width that the book's text and pictures will take"
" when in fullscreen mode. This allows you to read the book text" " when in fullscreen mode. This allows you to read the book text"
" without it becoming too wide.")) " without it becoming too wide."))
c.add_opt('max_fs_height', default=-1,
help=_("Set the maximum height that the book's text and pictures will take"
" when in fullscreen mode. This allows you to read the book text"
" without it becoming too tall. Note that this setting only takes effect in paged mode (which is the default mode)."))
c.add_opt('fit_images', default=True, c.add_opt('fit_images', default=True,
help=_('Resize images larger than the viewer window to fit inside it')) help=_('Resize images larger than the viewer window to fit inside it'))
c.add_opt('hyphenate', default=False, help=_('Hyphenate text')) c.add_opt('hyphenate', default=False, help=_('Hyphenate text'))
@ -211,6 +215,7 @@ class ConfigDialog(QDialog, Ui_Dialog):
{'serif':0, 'sans':1, 'mono':2}[opts.standard_font]) {'serif':0, 'sans':1, 'mono':2}[opts.standard_font])
self.css.setPlainText(opts.user_css) self.css.setPlainText(opts.user_css)
self.max_fs_width.setValue(opts.max_fs_width) self.max_fs_width.setValue(opts.max_fs_width)
self.max_fs_height.setValue(opts.max_fs_height)
pats, names = self.hyphenate_pats, self.hyphenate_names pats, names = self.hyphenate_pats, self.hyphenate_names
try: try:
idx = pats.index(opts.hyphenate_default_lang) idx = pats.index(opts.hyphenate_default_lang)
@ -287,6 +292,10 @@ class ConfigDialog(QDialog, Ui_Dialog):
c.set('remember_window_size', self.opt_remember_window_size.isChecked()) c.set('remember_window_size', self.opt_remember_window_size.isChecked())
c.set('fit_images', self.opt_fit_images.isChecked()) c.set('fit_images', self.opt_fit_images.isChecked())
c.set('max_fs_width', int(self.max_fs_width.value())) c.set('max_fs_width', int(self.max_fs_width.value()))
max_fs_height = self.max_fs_height.value()
if max_fs_height <= self.max_fs_height.minimum():
max_fs_height = -1
c.set('max_fs_height', max_fs_height)
c.set('hyphenate', self.hyphenate.isChecked()) c.set('hyphenate', self.hyphenate.isChecked())
c.set('remember_current_page', self.opt_remember_current_page.isChecked()) c.set('remember_current_page', self.opt_remember_current_page.isChecked())
c.set('wheel_flips_pages', self.opt_wheel_flips_pages.isChecked()) c.set('wheel_flips_pages', self.opt_wheel_flips_pages.isChecked())

View File

@ -60,7 +60,7 @@ QToolBox::tab:hover {
}</string> }</string>
</property> </property>
<property name="currentIndex"> <property name="currentIndex">
<number>0</number> <number>2</number>
</property> </property>
<widget class="QWidget" name="page"> <widget class="QWidget" name="page">
<property name="geometry"> <property name="geometry">
@ -404,41 +404,67 @@ QToolBox::tab:hover {
</property> </property>
</widget> </widget>
</item> </item>
<item row="1" column="0"> <item row="6" column="0" colspan="2">
<widget class="QCheckBox" name="opt_fullscreen_clock">
<property name="text">
<string>Show &amp;clock in full screen mode</string>
</property>
</widget>
</item>
<item row="5" column="0" colspan="2">
<widget class="QCheckBox" name="opt_fullscreen_pos"> <widget class="QCheckBox" name="opt_fullscreen_pos">
<property name="text"> <property name="text">
<string>Show reading &amp;position in full screen mode</string> <string>Show reading &amp;position in full screen mode</string>
</property> </property>
</widget> </widget>
</item> </item>
<item row="4" column="0" colspan="2"> <item row="5" column="0" colspan="2">
<widget class="QCheckBox" name="opt_fullscreen_scrollbar"> <widget class="QCheckBox" name="opt_fullscreen_scrollbar">
<property name="text"> <property name="text">
<string>Show &amp;scrollbar in full screen mode</string> <string>Show &amp;scrollbar in full screen mode</string>
</property> </property>
</widget> </widget>
</item> </item>
<item row="3" column="0" colspan="2"> <item row="4" column="0" colspan="2">
<widget class="QCheckBox" name="opt_start_in_fullscreen"> <widget class="QCheckBox" name="opt_start_in_fullscreen">
<property name="text"> <property name="text">
<string>&amp;Start viewer in full screen mode</string> <string>&amp;Start viewer in full screen mode</string>
</property> </property>
</widget> </widget>
</item> </item>
<item row="2" column="0" colspan="2"> <item row="3" column="0" colspan="2">
<widget class="QCheckBox" name="opt_show_fullscreen_help"> <widget class="QCheckBox" name="opt_show_fullscreen_help">
<property name="text"> <property name="text">
<string>Show &amp;help message when starting full screen mode</string> <string>Show &amp;help message when starting full screen mode</string>
</property> </property>
</widget> </widget>
</item> </item>
<item row="1" column="0">
<widget class="QLabel" name="label_24">
<property name="text">
<string>Maximum text height in fullscreen (paged mode):</string>
</property>
</widget>
</item>
<item row="2" column="0" colspan="2">
<widget class="QCheckBox" name="opt_fullscreen_clock">
<property name="text">
<string>Show &amp;clock in full screen mode</string>
</property>
</widget>
</item>
<item row="1" column="1">
<widget class="QSpinBox" name="max_fs_height">
<property name="specialValueText">
<string>Disabled</string>
</property>
<property name="suffix">
<string> px</string>
</property>
<property name="minimum">
<number>100</number>
</property>
<property name="maximum">
<number>10000</number>
</property>
<property name="singleStep">
<number>25</number>
</property>
</widget>
</item>
</layout> </layout>
</widget> </widget>
<widget class="QWidget" name="page_6"> <widget class="QWidget" name="page_6">

View File

@ -160,6 +160,7 @@ class Document(QWebPage): # {{{
screen_width = QApplication.desktop().screenGeometry().width() screen_width = QApplication.desktop().screenGeometry().width()
# Leave some space for the scrollbar and some border # Leave some space for the scrollbar and some border
self.max_fs_width = min(opts.max_fs_width, screen_width-50) self.max_fs_width = min(opts.max_fs_width, screen_width-50)
self.max_fs_height = opts.max_fs_height
self.fullscreen_clock = opts.fullscreen_clock self.fullscreen_clock = opts.fullscreen_clock
self.fullscreen_scrollbar = opts.fullscreen_scrollbar self.fullscreen_scrollbar = opts.fullscreen_scrollbar
self.fullscreen_pos = opts.fullscreen_pos self.fullscreen_pos = opts.fullscreen_pos
@ -310,7 +311,7 @@ class Document(QWebPage): # {{{
def switch_to_fullscreen_mode(self): def switch_to_fullscreen_mode(self):
self.in_fullscreen_mode = True self.in_fullscreen_mode = True
self.javascript('full_screen.on(%d, %s)'%(self.max_fs_width, self.javascript('full_screen.on(%d, %d, %s)'%(self.max_fs_width, self.max_fs_height,
'true' if self.in_paged_mode else 'false')) 'true' if self.in_paged_mode else 'false'))
def switch_to_window_mode(self): def switch_to_window_mode(self):