search

readium / readium-js-viewer

👁 ReadiumJS viewer: default web app for Readium.js library
BSD 3-Clause "New" or "Revised" License
551 stars 186 forks source link

Image is not resizing in vertical mode When we are opening TOC Panel for EPUB3 #745

Open 575755 opened 3 years ago

575755 commented 3 years ago

Hi, Issue: Image is not resizing in vertical mode When we are opening TOC Panel for EPUB3

When we are enabling scroll mode for epub3 content and clicking on the Table of Contents panel then the content is hiding to the right side and not resizing. Note: However, in reflowable layout it is resizing properly.

Is there anyway we can make it resize in scroll mode.

vertical-mode
danielweck commented 3 years ago

"resize detection" works fine in the official build of the web/cloud reader: https://readium.firebaseapp.com

...BUT only with reflowable EPUB documents, not fixed-layout ones (in this latter case, CTRL-R / reloading the web page corrects the aspect ratio, so I presume a "resize event listener" is not wired properly in the FXL view component).

So this is indeed a bug.

danielweck commented 3 years ago

Code references:

https://github.com/readium/readium-shared-js/blob/8faaca00f1a6d991bab77140426c81b43769749a/js/views/reader_view.js#L1282-L1286

https://github.com/readium/readium-shared-js/blob/906a45cd9c2d584debd0877734f478e048bfb482/js/views/scroll_view.js#L478-L483

The bridge to the individual "one page views" seems to be missing. See for example how "fixed view" forwards the resize event:

https://github.com/readium/readium-shared-js/blob/8faaca00f1a6d991bab77140426c81b43769749a/js/views/fixed_view.js#L274-L294

https://github.com/readium/readium-shared-js/blob/8faaca00f1a6d991bab77140426c81b43769749a/js/views/fixed_view.js#L320-L420

... which is then automatically captured by individual "one page views" (scale transform and re-positioning).

I think the reason why this works with reflowable documents is that the host iframes are automatically scaled / positioned via CSS, whereas fixed-layout iframes need to be laid out programmatically due to the scale/positioning viewport calculations.