Multi-line toggle switch & add instruction to resolve sdcv build error.

README.md

@@ -92,6 +92,11 @@ sudo apt-get install gcc-arm-linux-gnueabihf g++-arm-linux-gnueabihf
 sudo apt-get install gcc-mingw-w64-i686 g++-mingw-w64-i686
 ```
 
+Packages pkg-config-arm-linux-gnueabihf and pkg-config-arm-linux-gnueabi may
+block you to build for Kobo or Kindle, remove them if you got ld error,
+`/usr/lib/gcc-cross/arm-linux-gnueabihf/4.8/../../../../arm-linux-gnueabihf/bin/
+ld: cannot find -lglib-2.0`
+
 Mac OSX users may need to install these tools:
 ```
 brew install nasm binutils libtool autoconf automake sdl2

frontend/apps/reader/modules/readercropping.lua

@@ -168,14 +168,20 @@ end
 function ReaderCropping:setCropZoomMode(confirmed)
     if confirmed then
         -- if original zoom mode is not "content", set zoom mode to "contentwidth"
-        self.ui:handleEvent(Event:new("SetZoomMode",
-            self.orig_zoom_mode:find("content") and self.orig_zoom_mode or "contentwidth"))
+        self:setZoomMode(
+            self.orig_zoom_mode:find("content")
+            and self.orig_zoom_mode
+            or "contentwidth")
         self.ui:handleEvent(Event:new("InitScrollPageStates"))
     else
-        self.ui:handleEvent(Event:new("SetZoomMode", self.orig_zoom_mode))
+        self:setZoomMode(self.orig_zoom_mode)
     end
 end
 
+function ReaderCropping:setZoomMode(mode)
+    self.ui:handleEvent(Event:new("SetZoomMode", mode))
+end
+
 function ReaderCropping:onReadSettings(config)
     self.document.bbox = config:readSetting("bbox")
 end

frontend/ui/data/creoptions.lua

@@ -91,7 +91,6 @@ local CreOptions = {
                 event = "ChangeSize",
                 args = {"decrease", "increase"},
                 alternate = false,
-                height = 60,
             }
         }
     },

frontend/ui/data/koptoptions.lua

@@ -144,7 +144,6 @@ local KoptOptions = {
                 event = "FineTuningFontSize",
                 args = {-0.05, 0.05},
                 alternate = false,
-                height = 60,
                 enabled_func = function(configurable)
                     return enable_if_equals(configurable, "text_wrap", 1)
                 end,

frontend/ui/widget/configdialog.lua

@@ -353,9 +353,14 @@ function ConfigOption:init()
 
             if self.options[c].toggle then
                 local max_toggle_width = Screen:getWidth() / 2
-                local toggle_width = Screen:scaleBySize(self.options[c].width or 216)
+                local toggle_width = Screen:scaleBySize(self.options[c].width
+                                                        or 216)
+                local row_count = self.options[c].row_count or 1
+                local toggle_height = Screen:scaleBySize(self.options[c].height
+                                                         or 30 * row_count)
                 local switch = ToggleSwitch:new{
                     width = math.min(max_toggle_width, toggle_width),
+                    height = toggle_height,
                     font_face = item_font_face,
                     font_size = item_font_size,
                     name = self.options[c].name,
@@ -368,6 +373,7 @@ function ConfigOption:init()
                     events = self.options[c].events,
                     config = self.config,
                     enabled = enabled,
+                    row_count = row_count,
                 }
                 local position = current_item
                 switch:setPosition(position)

frontend/ui/widget/toggleswitch.lua

@@ -3,6 +3,7 @@ local InputContainer = require("ui/widget/container/inputcontainer")
 local FrameContainer = require("ui/widget/container/framecontainer")
 local CenterContainer = require("ui/widget/container/centercontainer")
 local HorizontalGroup = require("ui/widget/horizontalgroup")
+local VerticalGroup = require("ui/widget/verticalgroup")
 local Font = require("ui/font")
 local Geom = require("ui/geometry")
 local RenderText = require("ui/rendertext")
@@ -31,10 +32,12 @@ local ToggleSwitch = InputContainer:new{
     font_face = "cfont",
     font_size = 16,
     enabled = true,
+    row_count = 1,
 }
 
 function ToggleSwitch:init()
-    self.n_pos = #self.toggle
+    -- Item count per row
+    self.n_pos = math.ceil(#self.toggle / self.row_count)
     self.position = nil
 
     self.toggle_frame = FrameContainer:new{
@@ -45,16 +48,24 @@ function ToggleSwitch:init()
         padding = 2,
         dim = not self.enabled,
     }
-    self.toggle_content = HorizontalGroup:new{}
 
-    for i=1,#self.toggle do
+    self.toggle_content = VerticalGroup:new{}
+    for i = 1, self.row_count do
+        table.insert(self.toggle_content, HorizontalGroup:new{})
+    end
+
+    local center_dimen = Geom:new{
+        w = self.width / self.n_pos,
+        h = self.height / self.row_count,
+    }
+    for i = 1, #self.toggle do
         local label = ToggleLabel:new{
             align = "center",
             text = self.toggle[i],
             face = Font:getFace(self.font_face, self.font_size),
         }
         local content = CenterContainer:new{
-            dimen = Geom:new{w = self.width/self.n_pos, h = self.height},
+            dimen = center_dimen,
             label,
         }
         local button = FrameContainer:new{
@@ -66,7 +77,7 @@ function ToggleSwitch:init()
             padding = 0,
             content,
         }
-        table.insert(self.toggle_content, button)
+        table.insert(self.toggle_content[math.ceil(i / self.n_pos)], button)
     end
 
     self.toggle_frame[1] = self.toggle_content
@@ -94,15 +105,19 @@ end
 
 function ToggleSwitch:update()
     local pos = self.position
-    for i=1,#self.toggle_content do
-        if pos == i then
-            self.toggle_content[i].color = self.fgcolor
-            self.toggle_content[i].background = self.fgcolor
-            self.toggle_content[i][1][1].fgcolor = Blitbuffer.COLOR_WHITE
-        else
-            self.toggle_content[i].color = self.bgcolor
-            self.toggle_content[i].background = self.bgcolor
-            self.toggle_content[i][1][1].fgcolor = Blitbuffer.COLOR_BLACK
+    for i = 1, #self.toggle_content do
+        local row = self.toggle_content[i]
+        for j = 1, #row do
+            local cell = row[j]
+            if pos == (i - 1) * self.n_pos + j then
+                cell.color = self.fgcolor
+                cell.background = self.fgcolor
+                cell[1][1].fgcolor = Blitbuffer.COLOR_WHITE
+            else
+                cell.color = self.bgcolor
+                cell.background = self.bgcolor
+                cell[1][1].fgcolor = Blitbuffer.COLOR_BLACK
+            end
         end
     end
 end
@@ -124,11 +139,15 @@ function ToggleSwitch:togglePosition(position)
     self:update()
 end
 
+function ToggleSwitch:calculatePosition(gev)
+    local x = (gev.pos.x - self.dimen.x) / self.dimen.w * self.n_pos
+    local y = (gev.pos.y - self.dimen.y) / self.dimen.h * self.row_count
+    return math.ceil(x) + math.floor(y) * self.n_pos
+end
+
 function ToggleSwitch:onTapSelect(arg, gev)
     if not self.enabled then return true end
-    local position = math.ceil(
-        (gev.pos.x - self.dimen.x) / self.dimen.w * self.n_pos
-    )
+    local position = self:calculatePosition(gev)
     self:togglePosition(position)
     --[[
     if self.values then
@@ -152,9 +171,7 @@ function ToggleSwitch:onTapSelect(arg, gev)
 end
 
 function ToggleSwitch:onHoldSelect(arg, gev)
-    local position = math.ceil(
-        (gev.pos.x - self.dimen.x) / self.dimen.w * self.n_pos
-    )
+    local position = self:calculatePosition(gev)
     self.config:onMakeDefault(self.name, self.name_text,
                     self.values or self.args, self.toggle, position)
     return true