UI for max text width/height

src/pyj/read_book/prefs/layout.pyj

@@ -11,11 +11,12 @@ CONTAINER = unique_id('reader-page-layout')
 MARGINS = unique_id('reader-page-margins')
 READ_MODE = unique_id('read-mode')
 COLS = unique_id('cols-per-screen')
+TEXT_AREA = unique_id('text-area')
 
 add_extra_css(def():
     sel = '#' + MARGINS
     style = build_rule(sel, margin_left='2em', margin_top='-1em')
-    style += build_rule(sel + ' td', padding='1ex 1em')
+    style += build_rule('#{} td'.format(CONTAINER), padding='1ex 1em')
     return style
 )
 
@@ -31,29 +32,36 @@ def create_layout_panel(container):
             E.td(labels[which]), E.td(E.input(type='number', min='0', step='1', name=which, value=str(sd.get('margin_'+which))))
         ))
 
-    container.appendChild(E.div(
+    def sec(text):
-        _('Choose the page layout mode. In paged mode, the text is split up into individual pages, as in a paper book. In flow mode'
+        container.appendChild(E.div(text, style='margin: 2ex 1rem; padding-top:2ex; border-top: solid 1px'))
-          ' text is presented as one long scrolling page, as in web browsers.'),
+
-        style='margin: 1ex 1rem; padding-top:1ex; border-top: solid 1px'))
+    sec(_('Choose the page layout mode. In paged mode, the text is split up into individual pages, as in a paper book. In flow mode'
-    container.appendChild(E.div(id=READ_MODE, style='margin: 1ex 1rem; display: flex; justify-content: space-between'))
+            ' text is presented as one long scrolling page, as in web browsers.'))
+    container.appendChild(E.div(id=READ_MODE, style='margin: 1ex 2rem; display: flex;'))
     rm = sd.get('read_mode')
     rm = 'flow' if rm is 'flow' else 'paged'
     def rb(name, text):
         d = container.lastChild
         d.appendChild(E.label(E.input(type='radio', name='page-layout-mode', checked=rm is name), text))
     rb('paged', _('Paged mode'))
+    container.lastChild.appendChild(E.span('\xa0', style='width:3em'))
     rb('flow', _('Flow mode'))
 
-    container.appendChild(E.div(
+    sec(_('In paged mode, control the number of pages per screen. A setting of zero means the number of pages is'
-        _('In paged mode, control the number of pages per screen. A setting of zero means the number of pages is'
+          ' set based on the screen size.'))
-          ' set based on the screen size.'),
-        style='margin: 1ex 1rem; padding-top:1ex; border-top: solid 1px'))
     cps = sd.get('columns_per_screen')
     container.appendChild(E.table(style='margin: 1ex 1rem', id=COLS,
         E.tr(E.td(_('In portrait orientation:')), E.td(E.input(type='number', name='portrait',   min='0', step='1', max='20', value=str(cps.portrait)))),
         E.tr(E.td(_('In landscape orientation:')), E.td(E.input(type='number', name='landscape', min='0', step='1', max='20', value=str(cps.landscape)))),
     ))
 
+    sec(_('Change the maximum screen area used to display text. A value of zero means that all screen area is used.'))
+    container.appendChild(E.table(style='margin: 1ex 1rem', id=TEXT_AREA,
+        E.tr(E.td(_('Max. width:')), E.td(E.input(type='number', name='width',   min='0', step='10', value=str(sd.get('max_text_width'))))),
+        E.tr(E.td(_('Max. height:')), E.td(E.input(type='number', name='height', min='0', step='10', value=str(sd.get('max_text_height'))))),
+    ))
+
+
 develop = create_layout_panel
 
 
@@ -86,6 +94,14 @@ def commit_layout(onchange, container):
             cps[which] = val
             sd.set('columns_per_screen', cps)
             was_changed = True
+    for which in ('width', 'height'):
+        try:
+            val = int(element(TEXT_AREA, 'input[name={}]'.format(which)))
+        except:
+            continue
+        if val is not sd.get('max_text_' + which):
+            was_changed = True
+            sd.set('max_text_' + which, val)
 
     if was_changed:
         onchange()