I'm trying to record video using html5 .getUserMedia and then play it again without upload to the server. I have tried many tutorial and I made it work in Chrome by using canvas to draw the webp image and then convert to the webm by using Whammy.js . But the problem is it did not work on Firefox that unsupported webp. I just want to make it work in Firefox.
Any idea possible to do that?
Thanks
intrestingly firefox supports direct webm recordings, have you tried RecordRTC,
you can check the demo here.
Related
From what I searched for, Chrome has the codecs to play MKV videos.
But, so far, I haven't found anything that allows, using Javascript / HTML5, to select the audio tracks available in the MKV and AVI files.
Can anyone give me a light on how to do this?
My idea was to create a web player to play this type of file, with the possibility to select the audio track and display subtitles.
The audioTracks property allows you to do this. However, as stated in the documentation here https://developer.mozilla.org/en-US/docs/Web/API/HTMLMediaElement/audioTracks
From version 37: this feature is behind the enable-experimental-web-platform-features >preferences (needs to be set to enabled). To change preferences in Chrome, visit >chrome://flags.
I've tried this and it works at least for video elements that have an mkv file as a source.
I am getting on one of android phones error from jwplayer:
Error playing media:
MediaError {
code 4
}
Tried to search what does it mean, but cannot find.
Video works on other android devices, and on desktop computers. Tried chrome and default browser in android.
Update
http://jsfiddle.net/HCH8Q/3/
jwplayer('myElement').setup({
file: 'http://video.oitlabs.com/dogs6_2mb/mr6d_1047.mp4',
// works
// file: 'http://videos-jp.jwpsrv.com/zWLy8Jer/videos/i8oQD9zd-1753142.mp4?77c801d752d5207784c49e7ed80fb953798fae0fcca03ecf79558597ab74bd0b969af6ee1babdc6fac893174bba3c1bbb98ef7c2e4c6b3c59a812b4ed2c9abb29c61117869dbacbbb7caced845a8994ff297cc03a4',
height: 360,
image: '/uploads/example.jpg',
width: 640
});
So video from their site works, but my video does not. But when I run that video not in jw player but directly in the address bar its url, it plays. So it means browser is able to play that video.
This happens btw on LG L7 P710 phone
Update:
Tried now to upload to my server the video from jw site, and it works on that phone.
http://jsfiddle.net/HCH8Q/5/
So this is encoding issue. Then the question comes - how should I solve it? I used Handbrake program to convert videos, it has many of settings but I am not sure what should I set to convert so it would work on every phone which supports mp4 files?
Update:
Finally made it work by this site instructions:
http://www.broken-links.com/2010/07/30/encoding-video-for-android/
The first is cross-platform, using Handbrake. What I did with this was to use the iPhone & iPod Touch preset, check the Web Optimized option, and change the Average bitrate option (in the Quality section) to ~1000kbps (you should then save this as a new preset called Android).
You’ll also need to change the size of the output video in the Picture Settings options — I changed mine to 480 wide (keeping the aspect ratio) and they came out really crisp and sharp. You can see the result of that below (if your browser supports it).
It looks like everything I done same earlier, except that I used much smaller kbps setting and picture size left default. Will later try to experiment which caused to make it work, because still it does not make sense for me how different bitrate or picture size can make it not work. It should be just affecting quality.
Update
Had another problem - when using handbrake and trying to convert many files at once, first file picture width gets converted to what I set, but other files - to the default, maybe some bug or something.
But then I tried another program - Freemake Video converter - it has various params and I tried convert 2 files at once, and were no problems, worked on that phone also.
http://www.freemake.com/free_video_converter/
MediaError { code 4 } is not a JW Player error.
I would recommend taking the video from our site, uploading it to your hosting, and then seeing if it still works. That way you can determine if the issue is encoding based, or a server side issue.
I've made a simple HTML5 noughts and crosses(tic tac toe) game that uses the canvas element and I am trying to use phonegap to get it working on Android. I've test it works fine on firefox, chrome and internet explorer but when I get built using phonegap the apk produced simply renders a white screen.
I've tried using the ripple emulator and it renders and behaves as expected fine. Really confused as to why its not working.
To work on pc instead of phoengap you have to change
document.addEventListener("deviceready",onDeviceReady, false);
to
document.addEventListener("DOMContentLoaded",onDeviceReady, false);
in main.js.
I am using fast-canvas as a plugin, see the config file.
Code is avaliable here as well as assets here: https://github.com/JacobRawling/XandOs
Please help I am very confused and am struggling to find any phonegap tutorials that use
canvas.
Thanks very much
Your solution is jqscribble – A touch enabled canvas drawing tool
http://plugins.jquery.com/jqscribble/
I searched for many solutions to play Youtube videos on iOS.
At the moment i just use a webview to show only the player and then press the play button (only embed the video in the webview).
But I know there is a javascript solution to get an mp4 link for the youtube video.
This is the javascript:
http://userscripts.org/scripts/show/25105
The script searches for the video element and grabs all informations and finally make it possible to download the mp4.
Im not good in javascript, so i dont know if there is an possibility to write that code, that it just works with http://myurl.com/getvideo?id=VIDEOID .
I would try it myself, but i dont know if it is possible to grab all these informations the script uses without the player element.
Maybe you can help me ;)
(im using iOS 5 btw)
My english is not the best, so if u have problems to understand something, just ask.
you can check PSYouTubeExtractor that allows you to retrieve the mp4 version of a YouTube video, it is pretty easy to use.
Im trying to make a HTML5 signature capture in Javascript.
It works already but i got a problem running it on Android.
The function canvas.toDataURL(); does not work on Androids standard browser.
Does someone know an alternative for saving a Canvas to an image(png)? Or making it run on Android?
Take a look at Hans Schmucker's workaround/reimplementation:
http://forum.xda-developers.com/showthread.php?t=1251575