Progressbar in Mosaic View

[uroybd]

This PR implements a progressbar in Mosaic View.

---

This change is 

[poire-z]

Tested on my Kobo:

• it's a bit too much noise for me, so I really want the old dogear as an alternative (dunno which should be the default, this progress bar or the dogear)
• dunno if it would look better with a thiner border size, the same size as the thumbnail border - with possibly superposition of the bottom and right borders (dunno if it's already finely positionned like or not, or if it's the border thickness difference that makes it feel like its inside the cover. And/or without the rounder corners.

[uroybd]

Tested on my Kobo:

* it's a bit too much noise for me, so I really want the old dogear as an alternative (dunno which should be the default, this progress bar or the dogear)

* dunno if it would look better with a thiner border size, the same size as the thumbnail border - with possibly superposition of the bottom and right borders (dunno if it's already finely positionned like or not, or if it's the border thickness difference that makes it feel like its inside the cover. And/or without the rounder corners.

We can definitely play with styling a little more. Can you please give me some screenshots. Emulators are not entirely faithful to the reality, right?

[poire-z]

You can just copy the single file that you are modifying on your device and see for yourself :)
https://raw.githubusercontent.com/koreader/koreader/3b0684633817752ba50c4793d1acb0ee2b3ad219/plugins/coverbrowser.koplugin/mosaicmenu.lua

This is what I get:

Differences of thickness:

The good thing is that it doesn't overlap with the text at the bottom with our fake covers.

Also, you might need to tweak the position or width depending on the cover size (large but not tall covers could get it distant from the cover bottom edge/border and tall but not large covers could get it overflowing the right edge (I have no such picture on my Kobo to test).

[uroybd]

I have to employ the same logic I used for x position to y position also.

And yes, with no border-radius, same thickness and overlapping border might make this thing look great.

[uroybd]

@poire-z I've incorporated some of your UI feedback. Here's the result:

However, I couldn't set the radius to 0. It makes ProgressWidget look weird. Extra border in left and right and all that. Like this:

[poire-z]

Why comment out this ?

[uroybd]

What happened is, if I try to resize emulator, this part actually throws an error saying free is nil. So, I assumed free is unavailable.

[poire-z]

Oh right :) it seems ProgressWidget doesn't have and need any :free().

[poire-z]

So, you can remove this commented out stuff.

[poire-z]

However, I couldn't set the radius to 0. It makes ProgressWidget look weird.

Yep, dunno. May be you need some inner spacing (which I guess only radius provide), so it's noticable over a black bckground cover.
Try with radius = Size.border.thin (0.5, smallest we can get).

Extra border in left and right and all that. Like this:

Possible margin_h=3 that you could reduce or make 0 or 1 ? There are other tweakable things:

koreader/frontend/ui/widget/progresswidget.lua

Lines 37 to 42 in eb34fbb

	local ProgressWidget = Widget:new{
	width = nil,
	height = nil,
	margin_h = Screen:scaleBySize(3),
	margin_v = Screen:scaleBySize(1),
	radius = Screen:scaleBySize(2),

[uroybd]

margin_h = Screen:scaleBySize(3),

Tweaking margin_h didn't help much. However, the thin radius is much better. Now the corner roundness is almost unnoticable.

[poire-z]

So, you can remove this commented out stuff.

[poire-z]

Looks rather neat.

The little blank space on the left & right feels a bit odd. May be you can add
margin_h = Screen:scaleBySize(1) , same as margin_v, it would give this:

or may be Screen:scaleBySize(1.5) or Screen:scaleBySize(2) as it feels too small on this screenshot once zoomed in :) (might be some optical illusion).

One other case you might want (or not) to solve, or be sure it doesn't overflow too much over the book on the left (which I think it may if you use a really really thin image - if you made the progress bar 2/3, if the right is at 1/2, it may overflow):

Now that it's nearly ok, you may think about a new option in there :)

[ ] Show progress % in mosaic mode (or some better wording?)

And, if enabled, you would not show the dogear (you can keep it being sized/built, just not show it in paintTo).
And you would make these last 2 other options disabled (with enabled_func = function() return true if new setting not enabled end): May be not, they could apply to Detailed list mode if one doesn't use Mosaic mode everywhere.

[uroybd]

@poire-z added the margin as you've suggested, and the settings also.

For progress bar width issue, My current strategy is to take min of 60% of the container and cover image width.

[poire-z]

Looks quite neat.