I was wanting to make a webpage that streams my phone's camera to the webpage so that I could add a filter on top while it records. Sort of like Snapchat but on the browser instead of an app.
So far, all I can find is the option to record a video and then have the video display afterwards on the browser. I am however looking for a live stream option.
Is there any way to implement this?
You can use the html5 getUserMedia, heres a tutorial:
https://developer.mozilla.org/en-US/docs/Web/API/MediaDevices/getUserMedia
Related
I want to program a little browser game which needs some audio.
<audio id='my-audio' src='...'></audio>
That works on desktop and mobile but I have one problem: I can control this audio with the system audio controls. So when I press pause/play on my computer keyboard it affects this audio and on my phone's lock screen there appears a huge audio control widget. Is it possible to disable/remove these controls?
I also tried using
new Audio('...')
in Javascript instead of the audio-tag. That did not solve the problem.
I suggest using the Web Audio API. The link is to an example that I think covers a use case similar to what you requested. In addition to running the tutorial, I've also successfully used this API to read raw audio data (PCM array of float values) and play back on demand, which is a bit more involved than what you are asking. In either case, there was no issue with popups of any sort.
I'm just starting with React-Native. do i need to play a song inside one in a webview and be able to control it when the screen is locked by running stop / play?
Does anyone have any ideas / worked on this before?
Yes, this is possible.
We have a React Native app where users can edit their profile via a Webview.
Profiles include a media section with a custom-built audio player which uses Web Audio API (https://developer.mozilla.org/en-US/docs/Web/API/Web_Audio_API). All controllers including play and stop are working as expected.
On the other hand, I don't think you can control the Webview when the screen is locked but this part is totally untested. You will probably need to use a React Native audio player to achieve this.
I'm having an issue which could be an edge case.
The thing is that I'm developing a web site that is acting as a mobile app (something like a mobile first website) and to do this, I found a method to open the camera of the device when the user click on a file input.
Until there every works fine. The problem is that when I open the website on my laptop, when I click the input file, it opens a file selector, instead of open the camera of the device.
Also when I click the input file on some mobile devices, sometimes happens some of the following: 1. select photo from the gallery 2. open the camera
Which aren't accepted in my project, due to it only can accept recent photos(which are taken at that moment).
Anybody knows how to control this?
Really thanks!!!
Okay, I see you are using PHP server-side... If you don't mind uploading the image without checking first, you can build in a check server-side.
With exif_read_data() you can read metadata from an image. See documentation for all details
The FileDateTime will hold the date of when the image was created. Thus you could check if the image is a recent image.
Another possible way is to check which camera was used. It depends on which device was used to take the picture if these values are set.
$exif_ifd0 = exif_read_data($tempImagePath ,'IFD0' , 0);
// $exif_ifd0 will be an array.
The last method is illustrated in this comment at php.net
My question is related to developing HTML5 based apps for TV, using YouTube API to play videos. I've tried to find Google forum to post my question, but they recommend it here. Currently IFrame API is the recommended way. However, I would like to know the extents and proper way to use it for TV. It seems to me that embedding videos on TV will greatly limit possibilities for user. So to concrete questions:
How to avoid "Playback on other websites has been disabled..." error? I'm not playing back from website after all. Meanwhile XBMC/Kodi can playback those videos just fine. Are they using some old deprecated API? I've tried to set origin var in playerVars to https://www.youtube.com/tv, but then the player object is failed to initialize.
How the advertisements are going to be presented/interacted? So far I haven't seen anything with "Skip Ad" button using IFrame API. Only small banner image on left bottom side. But on TV there is no way to click on it. YouTube original TV app is showing "Skip Ad" type ads. Is there some special way for TV apps to present ads in proper way for devices with limited input, like TV?
Similarly the 'i' button appearing on top right side is not useful at all on TV. How to avoid it as well?
So I would like to know the extents I can achieve in my HTML5 based app, presenting YouTube videos, comparing to native YouTube application. Both the legal way and the tricks to achieve best experience for TV users are in interest.
I am trying to integrate a webpage into an iPad application. Something like the Final Hour app where the app is a native app using slideshows. some of the slideshow pages have a small part that is loaded from a website.
The only way I would have known this was when I didn't have internet access the small area where the website loads into said there was no internet connection.
How can I implement something like this? I understand the website aspect but I don't understand what iOS API they use to setup some sort of canvas or frame to hold the website.
Here is an image of the app. The webpage would be loaded into the "blue" box outline.
You are indeed looking for a UIWebView. You need to build the controls yourself if you want your users to navigate in the website. If you just want to show one page, with no Back or Reload button, then you can use it as is.
Note that you should try to make it clear to your users that your app might not work properly if no Internet connection is available.