ReadAlongs / Studio-Web

Suite of web packages for creating interactive ReadAlongs (this repo was formerly called Web-Component)
https://readalong-studio.mothertongues.org/
Other
10 stars 9 forks source link

Adding an image by taking a picture does not work on iPad #215

Open joanise opened 1 year ago

joanise commented 1 year ago

Steps to reproduce: iPadOS 16.5.1 create a readalong in step 2, click on Choose a file to add a picture choose Take Photo take a photo click Use Photo

Result: the space looks like it's occupied by a blank photo, the photo taken does not show, you just see blank and the red garbage bin to delete it.

joanise commented 1 year ago

Tested the same on my Android phone, and it works fine. It is indeed an iPad problem.

joanise commented 1 year ago

Tested on the iPad with Chrome, Firefox and Edge, in all cases the image does not actually make it into the readalong produced. It's always just blank. There's clearly an "image" there because the text is shoved to the side, but the image is not visible.

dhdaines commented 1 year ago

This looks like either the image is being captured in some format that Safari doesn't actually support, or there is something preventing it from displaying an image from a data URL... unfortunately my iPad is too old to run Studio. But it may be possible to simulate one in XCode: https://developer.apple.com/forums/thread/650901

joanise commented 1 year ago

I created a readalong on my PC and got it to the tablet. When I finally figured out I could open it in Edge, the image is there and properly visible. So the gap from from the camera or file to the Studio-Web, rather than from the .html to Edge.

Also, while you're in edit mode, you can see that the image is "there" but just blank already, so the problem occurs even before you download to .html.

dhdaines commented 1 year ago

From our discussion it seems that it might be a HEIF file:

https://alexcorvi.github.io/heic2any/

joanise commented 1 year ago

Just tested changing the camera to default to JPEG, and I see get the same problem on the table... :(

joanise commented 1 year ago

But, one bit of good news: with the format set to jpeg, if I e-mail the file to my computer and open it there, it works.

Except that it gets trapped in the tall file bug #190. Urgh.

joanise commented 1 year ago

My recommended solution:

joanise commented 1 year ago

Partially fixed by #217 - works for jpeg pictures. HEIF/HEIC pictures no handled yet.