Various minor fixes (#4172)

- css tweaks: use correct CSS "hyphens:" instead of "hyphenate:"
- screenshoter: more logical order of lines (no change in what it does)
- textviewer: make diagonal swipe really trigger a full refresh
- textwidget: more adequate text length to help with centering
- toggleswitch: fix sizing & centering with correct calculations
  (this reduces a bit the size of switches, and may cause a new
  truncation in some translations)

frontend/ui/data/css_tweaks.lua

@@ -106,8 +106,8 @@ sub { font-size: 50% !important; vertical-align: sub !important; }
             title = _("Allow hyphenation on all text"),
             description = _("Allow hyphenation to happen on all text (except headings), in case the publisher has disabled it."),
             css = [[
-* { hyphenate: auto !important; }
+* { hyphens: auto !important; }
-h1, h2, h3, h4, h5, h6 { hyphenate: none !important; }
+h1, h2, h3, h4, h5, h6 { hyphens: none !important; }
             ]],
         },
         {

frontend/ui/widget/screenshoter.lua

@@ -38,8 +38,9 @@ end
 
 function Screenshoter:onScreenshot(filename)
     local screenshot_name = filename or os.date(self.screenshot_fn_fmt)
+    Screen:shot(screenshot_name)
     local widget = ConfirmBox:new{
-        text = T( _("Saving screenshot to %1.\nWould you like to set it as screensaver?"), screenshot_name),
+        text = T( _("Saved screenshot to %1.\nWould you like to set it as screensaver?"), screenshot_name),
         ok_text = _("Yes"),
         ok_callback = function()
             G_reader_settings:saveSetting("screensaver_type", "image_file")
@@ -48,7 +49,6 @@ function Screenshoter:onScreenshot(filename)
         cancel_text = _("No"),
     }
     UIManager:show(widget)
-    Screen:shot(screenshot_name)
     -- trigger full refresh
     UIManager:setDirty(nil, "full")
     return true

frontend/ui/widget/textviewer.lua

@@ -246,8 +246,8 @@ function TextViewer:onSwipe(arg, ges)
             self.scroll_text_w:scrollText(-1)
             return true
         else
-            -- trigger a flashing text refresh
+            -- trigger a full-screen HQ flashing refresh
-            UIManager:setDirty(nil, "flashui", self.frame.dimen)
+            UIManager:setDirty(nil, "full")
             -- a long diagonal swipe may also be used for taking a screenshot,
             -- so let it propagate
             return false

frontend/ui/widget/textwidget.lua

@@ -46,7 +46,11 @@ function TextWidget:updateSize()
     if not tsize then
         self._length = 0
     else
-        self._length = math.ceil(tsize.x)
+        -- As text length includes last glyph pen "advance" (for positionning
+        -- next char), it's best to use math.floor() instead of math.ceil()
+        -- to get rid of a fraction of it in case this text is to be
+        -- horizontally centered
+        self._length = math.floor(tsize.x)
     end
     -- Used to be:
     --   self._height = math.ceil(self.face.size * 1.5)

frontend/ui/widget/toggleswitch.lua

@@ -47,13 +47,12 @@ function ToggleSwitch:init()
     -- Item count per row
     self.n_pos = math.ceil(#self.toggle / self.row_count)
     self.position = nil
-    local border_size = Size.border.thin
 
     self.toggle_frame = FrameContainer:new{
         background = Blitbuffer.COLOR_WHITE,
         color = Blitbuffer.COLOR_GREY,
         radius = Size.radius.window,
-        bordersize = border_size,
+        bordersize = Size.border.thin,
         padding = Size.padding.small,
         dim = not self.enabled,
     }
@@ -63,20 +62,25 @@ function ToggleSwitch:init()
         table.insert(self.toggle_content, HorizontalGroup:new{})
     end
 
+    local item_padding = Size.padding.default -- only used to check if text truncate needed
+    local item_border_size = Size.border.thin
+    local frame_inner_width = self.width - 2*self.toggle_frame.padding - 2* self.toggle_frame.bordersize
+    local item_width = math.ceil(frame_inner_width / self.n_pos - 2*item_border_size)
+    local item_height = self.height / self.row_count
+    -- Note: the height provided by ConfigDialog might be smaller than needed,
+    -- it gets too thin if we account for padding & border
     local center_dimen = Geom:new{
-        w = (self.width - border_size*(2*self.n_pos-2)) / self.n_pos,
+        w = item_width,
-        h = self.height / self.row_count,
+        h = item_height,
     }
-    local button_width = math.floor(self.width / self.n_pos)
     for i = 1, #self.toggle do
         local text = self.toggle[i]
         local face = Font:getFace(self.font_face, self.font_size)
-        local txt_width = RenderText:sizeUtf8Text(0, Screen:getWidth(), face, text, nil, self.bold).x
+        local txt_width = RenderText:sizeUtf8Text(0, Screen:getWidth(), face, text, true, true).x
-        if  button_width - Size.padding.default < txt_width then
+        if  txt_width > item_width - item_padding then
-            text = RenderText:truncateTextByWidth(text, face, button_width - Size.padding.default, nil, self.bold)
+            text = RenderText:truncateTextByWidth(text, face, item_width - item_padding, true, true)
         end
         local label = ToggleLabel:new{
-            align = "center",
             text = text,
             face = face,
         }
@@ -89,7 +93,7 @@ function ToggleSwitch:init()
             color = Blitbuffer.COLOR_GREY,
             margin = 0,
             radius = Size.radius.window,
-            bordersize = border_size,
+            bordersize = item_border_size,
             padding = 0,
             content,
         }