A bug in 1.9.30?

[Jaco]

Hi, everybody,

It is Jaco, a newbie here.

After to install Sigil all was right. But I found a problem. If I include a cover using Tools/to add cover to a epub3, it makes a code that doesn't work with Adobe Digital Editions neither other visors. Cover dissapear or it shows tiny.

I spent 2 days working and asking in Telegram groups of CSS/HTML. Nobody undestood the problem, nobody had a solution. Finally I get the solution here,

https://ebookflightdeck.com/handbook/coverimage

I hope it helps to another people.
Best,

[KevinH]

Using add cover adds an svg wrapped cover image to the epub3, adds the correct cover semantics, add the proper epub3 manifest properties. It passes all epubcheck cover related checks.

My guess is your ADE version is quite old and it probably does not support svg which is a required part of the epub3/html5 spec. Please test with a known epub3 compliant reader such as Thorium.

So no bug. Just an out of date reader that does not properly support svg image scaling.

[elibrarian]

Originally Posted by KevinH

Using add cover adds an svg wrapped cover image to the epub3, adds the correct cover semantics, add the proper epub3 manifest properties. It passes all epubcheck cover related checks.

My guess is your ADE version is quite old and it probably does not support svg which is a required part of the epub3/html5 spec. Please test with a known epub3 compliant reader such as Thorium.

So no bug. Just an out of date reader that does not properly support svg image scaling.

You're right; it's not a bug in Sigil – it's a bug in ADE from – I think – version 4 and up. It renders SVG-covers very small, but I've found that putting

style="height:98vh;"

(the "98" can be any percentage) into the SVG-code forces ADE to render it correctly, and doesn't seem to bother other readers. It only works by putting it directly in the SVG-code.

Sample:

<svg version="1.1" xmlns="http://www.w3.org/2000/svg"
style="height:98vh;" xmlns:xlink="http://www.w3.org/1999/xlink"
width="100%" height="100%" viewBox="0 0 1650 2200"
preserveAspectRatio="xMidYMid meet"> <image width="1650" height="2200"
xlink:href="../Images/hawthorne-det_roede_bogstav.jpg"/>

(the code may not be "state of THE art", just state of MY art )


Regards

Kim

[KevinH]

@elibrarian,

Interesting! Thanks for that info. I will try adding that into the next version of Sigil if there is not a better solution.

I do wonder if changing from 100% to 100vw for width and 100vh for height (or your 98, but without the style) would effectively do the same thing for all chrome based and webkit based engines?

<svg version="1.1" xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink" 
width="100vw" height="100vh" viewBox="0 0 1650 2200" 
preserveAspectRatio="xMidYMid meet"> <image width="1650" height="2200" 
xlink:href="../Images/hawthorne-det_roede_bogstav.jpg"/>

[KevinH]

If so, then ade 1 and 2 differ from ade 4 and up! So your svg style may be the only way to create a solution that works generally.

Thanks!

[Tex2002ans]

Originally Posted by Jaco

It is Jaco, a newbie here.

Hey, welcome to MobileRead!

Originally Posted by Jaco

After to install Sigil all was right. But I found a problem. If I include a cover using Tools/to add cover [...] Finally I get the solution here,

https://ebookflightdeck.com/handbook/coverimage

No. The pure HTML width/height solution will not keep the proper ratios, so the cover can easily get cut off or distorted when trying to "fill the screen".

See my post from:

• 2018: "SVG images - why?"

I even included many images showing the different possibilities.

Originally Posted by elibrarian

You're right; it's not a bug in Sigil – it's a bug in ADE from – I think – version 4 and up. It renders SVG-covers very small, [...]

Interesting. First I'm hearing of it. Must be a very recent regression which should be reported to Adobe.

I haven't upgraded my ADE in a while, so I'm on:

• 4.5.11.187303

which is from around February 2021... and the SVG wrapper code works perfectly fine as it always has.

[KevinH]

Hmm ... perhaps the ADE bug is platform specific?

[elibrarian]

Originally Posted by KevinH

Hmm ... perhaps the ADE bug is platform specific?

Maybe. I'm on Windows 11, but it was there in Windows 10 too.

It's been a long time since I tried out Linux for some years and my last skirmish with Apple/ Mac was in prehistoric times (Apple II or something).

I seem to remember that other people has reported the problem to Adobe, but nothing happens.

Regards, Kim

[JSWolf]

Originally Posted by Jaco

Hi, everybody,

It is Jaco, a newbie here.

After to install Sigil all was right. But I found a problem. If I include a cover using Tools/to add cover to a epub3, it makes a code that doesn't work with Adobe Digital Editions neither other visors. Cover dissapear or it shows tiny.

I spent 2 days working and asking in Telegram groups of CSS/HTML. Nobody undestood the problem, nobody had a solution. Finally I get the solution here,

https://ebookflightdeck.com/handbook/coverimage

I hope it helps to another people.
Best,

What version of Adobe Digital Editions are you using?

[JSWolf]

Originally Posted by elibrarian

You're right; it's not a bug in Sigil – it's a bug in ADE from – I think – version 4 and up. It renders SVG-covers very small, but I've found that putting

style="height:98vh;"

(the "98" can be any percentage) into the SVG-code forces ADE to render it correctly, and doesn't seem to bother other readers. It only works by putting it directly in the SVG-code.

Sample:

<svg version="1.1" xmlns="http://www.w3.org/2000/svg"
style="height:98vh;" xmlns:xlink="http://www.w3.org/1999/xlink"
width="100%" height="100%" viewBox="0 0 1650 2200"
preserveAspectRatio="xMidYMid meet"> <image width="1650" height="2200"
xlink:href="../Images/hawthorne-det_roede_bogstav.jpg"/>

(the code may not be "state of THE art", just state of MY art )


Regards

Kim

Height should be 100% in order to fill the screen. There is no reason to use hv as % keeps backwards compatibility better. vh won't work either. % is what will work.

RMSDK as used by Kobo is too old to woth with hv or vw. Only % is going to work. So a change to 100% is what's needed tow work properly.

[Turtle91]

Not necessarily.

I had issues with full screen images ‘bleeding’ into a 2nd page when I used 100%. When I switched to vw/vh it cleared it right up.

As with anything, check your target device(s) and see which one you want to use.

[KevinH]

Originally Posted by JSWolf

Height should be 100% in order to fill the screen. There is no reason to use hv as % keeps backwards compatibility better. vh won't work either. % is what will work.

RMSDK as used by Kobo is too old to woth with hv or vw. Only % is going to work. So a change to 100% is what's needed tow work properly.

Huh? Did you actually read the op? Sigil already uses 100% but it is failing on some current ADE versions. Your reply makes no sense.

[KevinH]

If anyone has Adobe Digital Editions versions on their machines could they please test the use of "100%" for width and height in an svg cover versus "100vw" for width and "100vh" for height (or 98 or 95 or ...). And report back.

Also please test elibrarian's inline style workaround if you find a version of ADE that has the bug and report that back also.

That way we can make a more informed decision on how best to workaround this ADE bug for use in the next version of Sigil.

Thanks

KevinH

From my own machine:

ADE Version 4.5.11.187606 for Mac OS
- does NOT exhibit this bug.

It works just fine with either "100%"
for svg width/height or "100vw" and "100vh" for width and height respectively.

But this is the only version of ADE I was able to find directly from Adobe for download to my Mac.

[Doitsu]

Originally Posted by KevinH

If anyone has Adobe Digital Editions versions on their machines could they please test the use of "100%" for width and height in an svg cover versus "100vw" for width and "100vh" for height (or 98 or 95 or ...). And report back.

Both ADE 2.0.1.78765 and ADE 4.5.11.187303 for Windows render covers in EPUB2 books with the default SVG cover code fine.
(I used this MR book for the test.)
Cover code:

Spoiler:

        <div>
            <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="100%" height="100%" viewBox="0 0 563 751" preserveAspectRatio="none">
                <image width="563" height="751" xlink:href="cover.jpeg"/>
            </svg>
        </div>

However, the cover of this epub3 MR book was not correctly rendered in ADE 4.5.11. (It was rendered fine in ADE 2.0.1.)
Cover code:

Spoiler:

  <div style="text-align: center; padding: 0pt; margin: 0pt;">
    <svg xmlns="http://www.w3.org/2000/svg" height="100%" width="100%" version="1.1" preserveAspectRatio="xMidYMid meet" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 1080 1430"><image width="1080" xlink:href="../Images/cover.jpg" height="1430"/></svg>
  </div>

After implementing the change recommended by elibrarian, the cover was correctly rendered.
(I used height:100vh; instead of height:98vh;)

Spoiler:

  <div style="height:100vh; text-align: center; padding: 0pt; margin: 0pt;">
    <svg xmlns="http://www.w3.org/2000/svg" height="100%" width="100%" version="1.1" preserveAspectRatio="xMidYMid meet" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 1080 1430"><image width="1080" xlink:href="../Images/cover.jpg" height="1430"/></svg>
  </div>

[KevinH]

@Doitsu,

So the exact same version of ADE 4.5.11.187303 on Windows works fine for epub2 with 100% but not for epub3? Or did I misread and you tested with a slightly different build number?

  <div style="height:100vh; text-align: center; padding: 0pt; margin: 0pt;">
    <svg xmlns="http://www.w3.org/2000/svg" height="100%" width="100%" version="1.1" preserveAspectRatio="xMidYMid meet" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 1080 1430"><image width="1080" xlink:href="../Images/cover.jpg" height="1430"/></svg>
  </div>

And your version of the workaround of setting the height on the parent div really makes sense as its svg child should use 100% of that height.

Sigil does have epub version specific code for the cover so adding that workaround to the epub3 version is easily doable.