View Full Version : Image wrap test


Jellby
04-22-2011, 07:08 AM
I would appreciate it if some users could test the attached files in different readers and tell me if it looks OK. The first text line saying "this is Test 1" should be displayed next to the word "TOM!" in the picture, the rest of the text should be on the right of the picture until it finishes, and then take the whole width. I expect some troubles when the picture height does not fit the screen (as when the screen is in landscape orientation). Try, if possible, to change some things (font size, margins, orientation, etc.) and see if it behaves properly.

Thanks!

EDIT: file updated. Now there are 3 test, which say "Test 1", "Test 2" and "Test 3" in their first lines. Test 2 has the image wrap disabled.

EDIT: file updated again with a 4th test. This is a test for SVG rotation support.

Billi
04-22-2011, 08:20 AM
Jellby, I tested your file on my Pocketbook 902 although I'm afraid that you rather have a 6" device in mind.
In the zip file you will find screenshots of all three installed ePub readers (Adobe, Coolreader, FBReader). Only the Adobe Reader is able to float the text but he doesn't display it correctly, too.

Jellby
04-23-2011, 05:25 AM
Jellby, I tested your file on my Pocketbook 902 although I'm afraid that you rather have a 6" device in mind.

Screen size should not matter, as long as the image fits in the screen when scaled to 100% width.

In the zip file you will find screenshots of all three installed ePub readers (Adobe, Coolreader, FBReader). Only the Adobe Reader is able to float the text but he doesn't display it correctly, too.

It seems FBReader and Coolreader have very simple engines, with only a limited support for the ePUB CSS. Could you try toggling the comments of the two @import lines in OEBPS/css/style.css? If not, I'll add another test page without the wrap, anyway...

The Adobe problem is the same I have noticed in my Cybook (and I assume it will be the same with other readers using Adobe), I'd call it a bug, since the top part of the image is 100% wide, and still Adobe is trying to put text to its right. I'll try something a bit different.

Jellby
04-23-2011, 06:49 AM
I've updated the file, I hope Test 3 works better with Adobe, while Test 2 should be nicer for readers that don't support floats.

roger64
04-23-2011, 04:54 PM
Hi Jellby

No photos but a simple report. Everything done on Linux UB Maverick.

Text wrap 1 and 3 works nicely with Lucidor Linux and Calibre 0.7.57 ebook viewer
The lower part of the picture for test 1 and 3 is fully mixed with text using Firefox 4 and plugin EpubReader

I could not judge with my old Sigil because he does not display jpegs but I suspect it could be working because of the shape of the text.

I remarked that many times, Lucidor seems to be the cleverest viewer around.

BTW: I solved this true small-cap display problem on ADE. Later on it.

Billi
04-23-2011, 05:13 PM
Jellby, no improvement with FBReader and Coolreader and no difference between 1, 2, 3.
On Adobe Reader: test 1 worked the same like before, test 2 started the text at a new page, but with test 3 you are well on your way! :thumbsup:

Jellby
04-25-2011, 08:28 AM
The lower part of the picture for test 1 and 3 is fully mixed with text using Firefox 4 and plugin EpubReader

Do you mean that text is overlaps the picture, in other words, that it is wrong? If that's the case, could you try unzipping the .epub and opening in Firefox 4 the .xhtml chapters?

I could not judge with my old Sigil because he does not display jpegs but I suspect it could be working because of the shape of the text.

Jellby, no improvement with FBReader and Coolreader and no difference between 1, 2, 3.

In Tests 1 and 3 there could be some additional blank space between the image and the text, which should not appear in Test 2. Also, in Tests 1 and 3 the word "Tom!" that is included in the image should not appear in the text, while in Test 2 it is repeated again in the text. All this is done with "display: none", does it mean that FBReader and Coolreader do not obey "display: none" (blank space, always "Tom!" in the text)?

Can anyone try with Stanza or iBooks?

Billi
04-25-2011, 01:04 PM
No, there was absolutely no difference between Test 2 and the other two.

But: with the latest version of Coolreader for Pocketbook (released yesterday) Coolreader now behaves like Adobe Reader in the above files test2_1 and test2_2 - it begins with the text on top of the next page. I think for a software that can't float text around images this could be the best you can achieve.

Jellby
04-25-2011, 02:54 PM
I think for a software that can't float text around images this could be the best you can achieve.

Yes, and it can be achieved by commenting/uncommenting a single line in the .css file. But the user has to modify the file, I don't know (I don't think it's possible) how to code it so that it behaves like Test 3 in readers supporting floating and like Test 2 in others. I could do it to have Test 3 in ADE and Test 2 elsewere (thanks to ADE conditional stylesheets), but that's not it.

Anyway, it works in ADE, it works in my Cybook (which uses ADE), it should work in stardard-compliant readers, and it's at least readable in other devices, so I'm happy for the moment.

Billi
04-25-2011, 05:26 PM
Sorry, I've been not precise: in the new Coolreader every of the three tests gave the same result, all three looked like test2 of the previous zip file.
But anyway, you're right to be happy - great work! Looks good!

Jellby
05-02-2011, 02:31 PM
I've added a 4th test to the file in the first post. Here I've tried to code with SVG a feature found in the printed book, where two lines are slightly rotated... The attachment in this post shows how it should look (it's a snapshot of the text rendered by Opera).

I'd appreciate some feedback on how it work (or doesn't) in different readers.

Iznogood
05-03-2011, 07:21 PM
Here comes screenshots from stanza. From your description, it looks like test 4 did not come out so well, but test 1 and 3 looks great. For test 2, the text begins below the image, and not on the side of it. The results from iBooks will follow shortly in a separate post

Iznogood
05-03-2011, 07:26 PM
And here comes the results from iBooks. iBooks doesn't always handle svg-images in a good way, which could explain why the images are gone in test 1 and 3. In test 2, there is the image on the first page. The text begins on the second page.

Test 4 is more successful in iBooks than in Stanza, but with big font size, the illusion disappears (not unexpected).

roger64
05-04-2011, 04:42 AM
Hi Jellby

Here are some screenshots of your four tests taken with
- Epub Reader (add-on for Firefox 4 on Linux)
- Lucidor (Linux)
- Sigil (0.4 beta Windows seen on Linux with Wine)

One unrelated information that could be interesting for you. After all, it's Latin language.
http://www.mobileread.com/forums/showpost.php?p=1514890&postcount=98
(followed by explanations in French on post 99)

Cheers

Roger

Jellby
05-04-2011, 05:57 AM
And here comes the results from iBooks. iBooks doesn't always handle svg-images in a good way, which could explain why the images are gone in test 1 and 3.

I doubt it, those tests have no SVG at all. The illustration is simply placed in a 0-height box, maybe iBooks is forcing overflow:hidden or something...

Thank you all for your tests.

Iznogood
05-04-2011, 03:30 PM
I doubt it, those tests have no SVG at all. The illustration is simply placed in a 0-height box, maybe iBooks is forcing overflow:hidden or something...

Thank you all for your tests.

Ah, interresting to know. I didn't unzip the book, just assumed that since the illustration didn't show up, the image had to be svg since svg images never is shown in iBooks