[UX] Add home button (#3263)

Tap to go HOME. Hold to set current folder as HOME. When no HOME is set yet tap also asks to set current folder as HOME.

See https://github.com/koreader/koreader/issues/2957#issuecomment-308513062

Closes #3200.

frontend/apps/filemanager/filemanager.lua

@@ -12,14 +12,17 @@ local FileManagerHistory = require("apps/filemanager/filemanagerhistory")
 local FileManagerMenu = require("apps/filemanager/filemanagermenu")
 local Font = require("ui/font")
 local FrameContainer = require("ui/widget/container/framecontainer")
+local IconButton = require("ui/widget/iconbutton")
 local InfoMessage = require("ui/widget/infomessage")
 local InputContainer = require("ui/widget/container/inputcontainer")
 local InputDialog = require("ui/widget/inputdialog")
+local OverlapGroup = require("ui/widget/overlapgroup")
 local PluginLoader = require("pluginloader")
 local ReaderDictionary = require("apps/reader/modules/readerdictionary")
 local ReaderUI = require("apps/reader/readerui")
 local ReaderWikipedia = require("apps/reader/modules/readerwikipedia")
 local Screenshoter = require("ui/widget/screenshoter")
+local Size = require("ui/size")
 local TextWidget = require("ui/widget/textwidget")
 local VerticalGroup = require("ui/widget/verticalgroup")
 local VerticalSpan = require("ui/widget/verticalspan")
@@ -51,6 +54,17 @@ local FileManager = InputContainer:extend{
 function FileManager:init()
     self.show_parent = self.show_parent or self
 
+    local home_button = IconButton:new{
+        icon_file = "resources/icons/appbar.home.png",
+        width = Screen:scaleBySize(35),
+        height = Screen:scaleBySize(35),
+        padding = Size.padding.default,
+        padding_top = Size.padding.small,
+        padding_left = Size.padding.small,
+        callback = function() self:goHome() end,
+        hold_callback = function() self:setHome() end,
+    }
+
     self.path_text = TextWidget:new{
         face = Font:getFace("xx_smallinfofont"),
         text = filemanagerutil.abbreviate(self.root_path),
@@ -60,16 +74,21 @@ function FileManager:init()
         padding = 0,
         bordersize = 0,
         VerticalGroup:new{
-            TextWidget:new{
-                face = Font:getFace("smalltfont"),
-                text = self.title,
+            OverlapGroup:new{
+                home_button,
+                VerticalGroup:new{
+                    TextWidget:new{
+                        face = Font:getFace("smalltfont"),
+                        text = self.title,
+                    },
+                    CenterContainer:new{
+                        dimen = { w = Screen:getWidth(), h = nil },
+                        self.path_text,
+                    },
+                },
             },
-            CenterContainer:new{
-                dimen = { w = Screen:getWidth(), h = nil },
-                self.path_text,
-            },
-            VerticalSpan:new{ width = Screen:scaleBySize(10) }
-        }
+            VerticalSpan:new{ width = Screen:scaleBySize(10) },
+        },
     }
 
     local g_show_hidden = G_reader_settings:readSetting("show_hidden")
@@ -235,7 +254,7 @@ function FileManager:init()
                 {
                     text = _("Set as HOME directory"),
                     callback = function()
-                        G_reader_settings:saveSetting("home_dir", realpath)
+                        self:setHome(realpath)
                         UIManager:close(self.file_dialog)
                     end
                 }
@@ -341,6 +360,29 @@ function FileManager:onRefresh()
     return true
 end
 
+function FileManager:goHome()
+    local home_dir = G_reader_settings:readSetting("home_dir")
+    if home_dir then
+        self:showFiles(home_dir)
+    else
+        self:setHome()
+    end
+    return true
+end
+
+function FileManager:setHome(path)
+    path = path or self.file_chooser.path
+    local ConfirmBox = require("ui/widget/confirmbox")
+    UIManager:show(ConfirmBox:new{
+        text = util.template(_("Set '%1' as HOME directory?"), path),
+        ok_text = _("Set as HOME"),
+        ok_callback = function()
+            G_reader_settings:saveSetting("home_dir", path)
+        end,
+    })
+    return true
+end
+
 function FileManager:copyFile(file)
     self.cutfile = false
     self.clipboard = file

frontend/ui/widget/configdialog.lua

@@ -441,7 +441,9 @@ function MenuBar:init()
     local padding = math.min(math.floor(available_width / #menu_items / 2), Screen:scaleBySize(20)) -- as in TouchMenuBar
     if padding > 0 then
         for c = 1, #menu_items do
-            menu_items[c]:setHorizontalPadding(padding)
+            menu_items[c].padding_left = padding
+            menu_items[c].padding_right = padding
+            menu_items[c]:update()
         end
         available_width = available_width - 2*padding*#menu_items
     end

frontend/ui/widget/iconbutton.lua

@@ -8,6 +8,8 @@ local InputContainer = require("ui/widget/container/inputcontainer")
 local ImageWidget = require("ui/widget/imagewidget")
 local GestureRange = require("ui/gesturerange")
 local UIManager = require("ui/uimanager")
+local VerticalGroup = require("ui/widget/verticalgroup")
+local VerticalSpan = require("ui/widget/verticalspan")
 
 local IconButton = InputContainer:new{
     icon_file = "resources/info-confirm.png",
@@ -17,7 +19,11 @@ local IconButton = InputContainer:new{
     width = nil,
     height = nil,
     scale_for_dpi = true,
-    horizontal_padding = 0,
+    padding = 0,
+    padding_top = nil,
+    padding_right = nil,
+    padding_bottom = nil,
+    padding_left = nil,
     callback = function() end,
 }
 
@@ -31,26 +37,35 @@ function IconButton:init()
 
     self.show_parent = self.show_parent or self
 
-    self.button = HorizontalGroup:new{}
-    table.insert(self.button, HorizontalSpan:new{})
-    table.insert(self.button, self.image)
-    table.insert(self.button, HorizontalSpan:new{})
+    self.horizontal_group = HorizontalGroup:new{}
+    table.insert(self.horizontal_group, HorizontalSpan:new{})
+    table.insert(self.horizontal_group, self.image)
+    table.insert(self.horizontal_group, HorizontalSpan:new{})
+
+    self.button = VerticalGroup:new{}
+    table.insert(self.button, VerticalSpan:new{})
+    table.insert(self.button, self.horizontal_group)
+    table.insert(self.button, VerticalSpan:new{})
 
     self[1] = self.button
     self:update()
 end
 
 function IconButton:update()
-    self.button[1].width = self.horizontal_padding
-    self.button[3].width = self.horizontal_padding
-    self.dimen = self.image:getSize()
-    self.dimen.w = self.dimen.w + 2*self.horizontal_padding
-    self:initGesListener()
-end
+    if not self.padding_top then self.padding_top = self.padding end
+    if not self.padding_right then self.padding_right = self.padding end
+    if not self.padding_bottom then self.padding_bottom = self.padding end
+    if not self.padding_left then self.padding_left = self.padding end
 
-function IconButton:setHorizontalPadding(padding)
-    self.horizontal_padding = padding
-    self:update()
+    self.horizontal_group[1].width = self.padding_left
+    self.horizontal_group[3].width = self.padding_right
+    self.dimen = self.image:getSize()
+    self.dimen.w = self.dimen.w + self.padding_left+self.padding_right
+
+    self.button[1].width = self.padding_top
+    self.button[3].width = self.padding_bottom
+    self.dimen.h = self.dimen.h + self.padding_top+self.padding_bottom
+    self:initGesListener()
 end
 
 function IconButton:initGesListener()

frontend/ui/widget/touchmenu.lua

@@ -192,7 +192,8 @@ function TouchMenuBar:init()
             height = icon_height,
             scale_for_dpi = false,
             callback = nil,
-            horizontal_padding = icon_padding,
+            padding_left = icon_padding,
+            padding_right = icon_padding,
         }
 
         table.insert(self.icon_widgets, ib)