diff --git a/frontend/ui/widget/sortwidget.lua b/frontend/ui/widget/sortwidget.lua index 0d00b1cf4..30288e524 100644 --- a/frontend/ui/widget/sortwidget.lua +++ b/frontend/ui/widget/sortwidget.lua @@ -28,13 +28,12 @@ local SortTitleWidget = VerticalGroup:new{ title = "", tface = Font:getFace("tfont"), align = "left", - use_top_page_count = false, } function SortTitleWidget:init() self.close_button = CloseButton:new{ window = self } local btn_width = self.close_button:getSize().w - -- title and close button + -- title, close button, separation line table.insert(self, OverlapGroup:new{ dimen = { w = self.width }, TextWidget:new{ @@ -44,7 +43,6 @@ function SortTitleWidget:init() }, self.close_button, }) - -- page count and separation line self.title_bottom = OverlapGroup:new{ dimen = { w = self.width, h = Size.line.thick }, LineWidget:new{ @@ -53,43 +51,15 @@ function SortTitleWidget:init() style = "solid", }, } - if self.use_top_page_count then - self.page_cnt = FrameContainer:new{ - padding = Size.padding.default, - margin = 0, - bordersize = 0, - background = Blitbuffer.COLOR_WHITE, - -- overlap offset x will be updated in setPageCount method - overlap_offset = {0, -15}, - TextWidget:new{ - text = "", -- page count - fgcolor = Blitbuffer.COLOR_DARK_GRAY, - face = Font:getFace("smallffont"), - }, - } - table.insert(self.title_bottom, self.page_cnt) - end table.insert(self, self.title_bottom) table.insert(self, VerticalSpan:new{ width = Size.span.vertical_large }) end -function SortTitleWidget:setPageCount(curr, total) - if total == 1 then - -- remove page count if there is only one page - table.remove(self.title_bottom, 2) - return - end - self.page_cnt[1]:setText(curr .. "/" .. total) - self.page_cnt.overlap_offset[1] = (self.width - self.page_cnt:getSize().w - 10) - self.title_bottom[2] = self.page_cnt -end - function SortTitleWidget:onClose() self.sort_page:onClose() return true end - local SortItemWidget = InputContainer:new{ item = nil, face = Font:getFace("smallinfofont"), @@ -129,7 +99,7 @@ function SortItemWidget:init() checked = true, } - local text_max_width = self.width - 2*Size.padding.default - checked_widget:getSize().w + local text_max_width = self.width - 2 * Size.padding.default - checked_widget:getSize().w self[1] = FrameContainer:new{ padding = 0, @@ -178,15 +148,13 @@ local SortWidget = InputContainer:new{ height = nil, -- index for the first item to show show_page = 1, - use_top_page_count = false, -- table of items to sort item_table = {}, callback = nil, } function SortWidget:init() - -- no item is selected on start - self.marked = 0 + self.marked = 0 -- no item is selected on start self.dimen = Geom:new{ w = self.width or Screen:getWidth(), h = self.height or Screen:getHeight(), @@ -209,40 +177,37 @@ function SortWidget:init() local padding = Size.padding.large self.width_widget = self.dimen.w - 2 * padding self.item_width = self.dimen.w - 2 * padding + self.footer_center_width = math.floor(self.width_widget * 22 / 100) + self.footer_button_width = math.floor(self.width_widget * 12 / 100) self.item_height = Size.item.height_big - -- group for footer - local footer_left_text = "◀" - local footer_right_text = "▶" - local footer_first_up_text = "◀◀" - local footer_last_down_text = "▶▶" + local chevron_left = "chevron.left" + local chevron_right = "chevron.right" + local chevron_first = "chevron.first" + local chevron_last = "chevron.last" if BD.mirroredUILayout() then - footer_left_text, footer_right_text = footer_right_text, footer_left_text - footer_first_up_text, footer_last_down_text = footer_last_down_text, footer_first_up_text + chevron_left, chevron_right = chevron_right, chevron_left + chevron_first, chevron_last = chevron_last, chevron_first end self.footer_left = Button:new{ - text = footer_left_text, - width = self.width_widget * 13 / 100, + icon = chevron_left, + width = self.footer_button_width, callback = function() self:prevPage() end, - text_font_size = 28, bordersize = 0, - padding = 0, radius = 0, show_parent = self, } self.footer_right = Button:new{ - text = footer_right_text, - width = self.width_widget * 13 / 100, + icon = chevron_right, + width = self.footer_button_width, callback = function() self:nextPage() end, - text_font_size = 28, bordersize = 0, - padding = 0, radius = 0, show_parent = self, } self.footer_first_up = Button:new{ - text = footer_first_up_text, - width = self.width_widget * 13 / 100, + icon = chevron_first, + width = self.footer_button_width, callback = function() if self.marked > 0 then self:moveItem(-1) @@ -250,15 +215,13 @@ function SortWidget:init() self:goToPage(1) end end, - text_font_size = 28, bordersize = 0, - padding = 0, radius = 0, show_parent = self, } self.footer_last_down = Button:new{ - text = footer_last_down_text, - width = self.width_widget * 13 / 100, + icon = chevron_last, + width = self.footer_button_width, callback = function() if self.marked > 0 then self:moveItem(1) @@ -266,42 +229,35 @@ function SortWidget:init() self:goToPage(self.pages) end end, - text_font_size = 28, bordersize = 0, - padding = 0, radius = 0, show_parent = self, } self.footer_cancel = Button:new{ - text = "✘", - width = self.width_widget * 13 / 100, + icon = "cancel", + width = self.footer_button_width, callback = function() self:onClose() end, bordersize = 0, - text_font_size = 28, - padding = 0, radius = 0, show_parent = self, } - self.footer_ok = Button:new{ - text= "✓", - width = self.width_widget * 13 / 100, + icon = "check", + width = self.footer_button_width, callback = function() self:onReturn() end, bordersize = 0, - padding = 0, radius = 0, - text_font_size = 28, show_parent = self, } - self.footer_page = Button:new{ text = "", hold_input = { title = _("Enter page number"), - type = "number", hint_func = function() return "(" .. "1 - " .. self.pages .. ")" end, + type = "number", + deny_blank_input = true, callback = function(input) local page = tonumber(input) if page and page >= 1 and page <= self.pages then @@ -315,27 +271,16 @@ function SortWidget:init() margin = 0, text_font_face = "pgfont", text_font_bold = false, - width = self.width_widget * 22 / 100, + width = self.footer_center_width, show_parent = self, } - local button_vertical_line = LineWidget:new{ - dimen = Geom:new{ w = Size.line.thick, h = math.floor(self.item_height * 1.25) }, - background = Blitbuffer.COLOR_DARK_GRAY, - style = "solid", - } self.page_info = HorizontalGroup:new{ self.footer_cancel, - button_vertical_line, self.footer_first_up, - button_vertical_line, self.footer_left, - button_vertical_line, self.footer_page, - button_vertical_line, self.footer_right, - button_vertical_line, self.footer_last_down, - button_vertical_line, self.footer_ok, } local bottom_line = LineWidget:new{ @@ -345,7 +290,7 @@ function SortWidget:init() } local vertical_footer = VerticalGroup:new{ bottom_line, - self.page_info + self.page_info, } local footer = BottomContainer:new{ dimen = self.dimen:copy(), @@ -356,11 +301,10 @@ function SortWidget:init() title = self.title, width = self.item_width, height = self.item_height, - use_top_page_count = self.use_top_page_count, sort_page = self, } -- setup main content - self.item_margin = self.item_height / 8 + self.item_margin = math.floor(self.item_height / 8) local line_height = self.item_height + self.item_margin local content_height = self.dimen.h - self.title_bar:getSize().h - vertical_footer:getSize().h - padding self.items_per_page = math.floor(content_height / line_height) @@ -426,7 +370,7 @@ function SortWidget:moveItem(diff) local move_to = self.marked + diff if move_to > 0 and move_to <= #self.item_table then table.insert(self.item_table, move_to, table.remove(self.item_table, self.marked)) - self.show_page = math.ceil(move_to/self.items_per_page) + self.show_page = math.ceil(move_to / self.items_per_page) self.marked = move_to self:_populateItems() end @@ -442,7 +386,6 @@ function SortWidget:_populateItems() else page_last = #self.item_table end - for idx = idx_offset + 1, page_last do table.insert(self.main_content, VerticalSpan:new{ width = self.item_margin }) local invert_status = false @@ -461,25 +404,31 @@ function SortWidget:_populateItems() } ) end - - self.footer_page:setText(T(_("%1 / %2"), self.show_page, self.pages), self.width_widget * 22 / 100) - local footer_first_up_text = "◀◀" - local footer_last_down_text = "▶▶" + self.footer_page:setText(T(_("Page %1 of %2"), self.show_page, self.pages), self.footer_center_width) + if self.pages > 1 then + self.footer_page:enable() + else + self.footer_page:disableWithoutDimming() + end + local chevron_first = "chevron.first" + local chevron_last = "chevron.last" + local move_up = "move.up" + local move_down = "move.down" if BD.mirroredUILayout() then - footer_first_up_text, footer_last_down_text = footer_last_down_text, footer_first_up_text + chevron_first, chevron_last = chevron_last, chevron_first + move_up, move_down = move_down, move_up end if self.marked > 0 then - self.footer_first_up:setText("▲", self.width_widget * 13 / 100) - self.footer_last_down:setText("▼", self.width_widget * 13 / 100) + self.footer_first_up:setIcon(move_up, self.footer_button_width) + self.footer_last_down:setIcon(move_down, self.footer_button_width) else - self.footer_first_up:setText(footer_first_up_text, self.width_widget * 13 / 100) - self.footer_last_down:setText(footer_last_down_text, self.width_widget * 13 / 100) + self.footer_first_up:setIcon(chevron_first, self.footer_button_width) + self.footer_last_down:setIcon(chevron_last, self.footer_button_width) end self.footer_left:enableDisable(self.show_page > 1) self.footer_right:enableDisable(self.show_page < self.pages) - self.footer_first_up:enableDisable(self.show_page > 1 or self.marked > 0) + self.footer_first_up:enableDisable(self.show_page > 1 or (self.marked > 0 and self.marked > 1)) self.footer_last_down:enableDisable(self.show_page < self.pages or (self.marked > 0 and self.marked < #self.item_table)) - UIManager:setDirty(self, function() return "ui", self.dimen end) diff --git a/resources/icons/mdlight/cancel.svg b/resources/icons/mdlight/cancel.svg new file mode 100644 index 000000000..e35a0ddaa --- /dev/null +++ b/resources/icons/mdlight/cancel.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/resources/icons/mdlight/check.svg b/resources/icons/mdlight/check.svg new file mode 100644 index 000000000..f329bdff2 --- /dev/null +++ b/resources/icons/mdlight/check.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/resources/icons/mdlight/move.down.svg b/resources/icons/mdlight/move.down.svg new file mode 100644 index 000000000..adefb0e58 --- /dev/null +++ b/resources/icons/mdlight/move.down.svg @@ -0,0 +1,55 @@ + +image/svg+xml + + diff --git a/resources/icons/mdlight/move.up.svg b/resources/icons/mdlight/move.up.svg new file mode 100644 index 000000000..9de725165 --- /dev/null +++ b/resources/icons/mdlight/move.up.svg @@ -0,0 +1,55 @@ + +image/svg+xml + +