Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

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

Open
joanise opened this issue Jun 28, 2023 · 9 comments
Open

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

joanise opened this issue Jun 28, 2023 · 9 comments

Comments

@joanise
Copy link
Member

joanise commented Jun 28, 2023

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
Copy link
Member Author

joanise commented Jun 28, 2023

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

@joanise
Copy link
Member Author

joanise commented Jun 28, 2023

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
Copy link
Collaborator

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
Copy link
Member Author

joanise commented Jun 28, 2023

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
Copy link
Collaborator

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

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

@joanise
Copy link
Member Author

joanise commented Jun 28, 2023

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

@joanise
Copy link
Member Author

joanise commented Jun 28, 2023

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
Copy link
Member Author

joanise commented Jun 29, 2023

My recommended solution:

  • use heic2any (see link DHD posted above)
  • use the canvas trick to shrink the image at the same time

@joanise
Copy link
Member Author

joanise commented Jul 5, 2023

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

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants