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

Add playsinline prop #12

Merged
merged 2 commits into from
Sep 7, 2022

Conversation

bonomel
Copy link

@bonomel bonomel commented Sep 7, 2022

Hi!

I've been utilizing your component to integrate camera functionality to a Vue3 PWA. In order to obtain a 'native app' look and feel, simple-vue-camera was perfect! Thanks for making it available to the world :)

But, there is an issue (or difference in interpretation of web standards by Safari developers) with the video tag on iOS/Safari where the video will open full screen with an installed video player, like described here:

https://stackoverflow.com/questions/71326733/prevent-video-element-from-going-full-screen-on-iphone

As the SO answer states, this behavior can be simply avoided by adding the playsinline attribute to the <video> tag.

simple-vue-camera currently has no way to add this to the component via props, so I resorted to adding it to the DOM when mounting my own component. It works, but it would be much nicer if simple-vue-camera would be able to take care of this. I've added a prop to do just that. Since we're "abusing" the video tag to function as a camera, and opening another app to play the "video" isn't desirable, I've opted to make it true by default.

While doing this, I noticed the existing autoplay prop was set to false by default, while it was stated in the README.md it is set to true by default. Not a huge issue, but a bug nonetheless, so I've opted to change the default in the component to true since it makes the most sense in this case.

Then lastly, npm install was not able to resolve all package dependencies after fresh cloning the repo. I had to use npm install --legacy-peer-deps to be able to build successfully and run the testing app. I've included the updates it made in the package.json and package-lock.json, as well as bumping the version of vue-simple-camera to 1.1.2.

Summary;

  • Added ability to configure playsinline on the component via a new prop
  • Set default of autoplay to true to reflect the README.md
  • Bump package version

Ok, that's it. Thanks for your consideration and hoping to hear from you :)

~Michel

@BastiaanJansen BastiaanJansen merged commit 3825a60 into BastiaanJansen:main Sep 7, 2022
@BastiaanJansen
Copy link
Owner

Great PR!

@bonomel bonomel deleted the add-playsinline-prop branch September 8, 2022 06:37
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

Successfully merging this pull request may close these issues.

2 participants