[html5] html5 code for ipad video display
Jody Gugelhupf
knueffle at yahoo.com
Mon Sep 12 09:44:57 PDT 2011
Hi all :)
My system:I run ubuntu natty, and have an old analog TV card, the winTV-go +FM. and vlc 1.1.9., apache2What I want to achieve:take the output of my old tv card, stream it with vlc and have the stream embedded on a local site to be displayed with html5, so i can watch the stream on my ipad 1 or 2Current situation:I have managed to get streaming with vlc working (i don't use the gui) with different containters and codecs. I have 3 working stream-commands that include:
1: vlc -vvv v4l2:///dev/video0:width=640:height=480 :input-slave=alsa://hw:1,1 --sout '#transcode{vcodec=mp4v,acodec=mp3,vb=8000,ab=128,channels=1,samplerate=44100}:standard{access=http,mux=ts,dst=192.168.1.10:9090}'
2: vlc -vvv v4l2:///dev/video0:width=640:height=480 :input-slave=alsa://hw:1,1 --sout '#transcode{vcodec=theo,acodec=mp3,vb=8000,ab=128,channels=1,samplerate=44100}:standard{access=http,mux=ogg,dst=192.168.1.10:9080/test.ogv}'
3: vlc -v v4l2:///dev/video0:width=640:height=480 :input-slave=alsa://hw:1,1 --sout '#transcode{vcodec=h264,vb=1024,acodec=mp3,channels=1,ab=128,samplerate=44100}:standard{access=http,mux=ts,dst=192.168.1.10:9080/test.mp4}'
I can open all 3 streams on a different computer and play them in vlc, Note on the side: the *.ogv stream i can also just enter as an url (http://192.168.1.10:9080/test.ogv) in chrome and it displays it there as a video, the other 2 streams it tries to download as a file.
So far so good, now I come to my html5 code:
<html>
<head>
<script src="video.js" type="text/javascript" charset="utf-8"></script>
<link rel="stylesheet" href="video-js.css" type="text/css" media="screen" title="Video JS" charset="utf-8">
</head>
<body>
<script type="text/javascript" charset="utf-8">
VideoJS.setupAllWhenReady();
</script>
<div class="video-js-box">
<video class="video-js" width="640" height="480" controls preload poster="http://192.168.1.10/TV_new/jen.jpg">
<source src=http://192.168.1.10:9080/test.ogv type=video/ogg; codecs="theora, vorbis"'>
<!-- Image Fallback. -->
<img src="http://192.168.1.10/TV_new/jen.jpg" width="640" height="264" alt="Poster Image" title="No video playback capabilities." /> </object> </video> </p> </div> </body></html>
this works perfectly in chrome, but because it is ogv it will of course not work on the ipad, so i need to use h.264/mp4 as that is supported/built in with safari, but when using the stream command 1 or 3 then i get no video displayed on ipad or chrome.When not using stream-command 2 (the ogv command) I adjust the html5 code to one of the following (I have tried all 3):
<source src=http://192.168.1.10:9080/test.mp4 type=video/mp4; codecs="avc1.4D401E, mp3"'>
or
<source src=http://192.168.1.10:9080/test.mp4 type=video/mp4'>
or
<source src=http://192.168.1.10:9080/test.mp4'>
none of these work.
I have also added mime types to my /etc/mime.types video/mp4 mp4
video/quicktime qt mov
video/mp4v-es
video/ogg ogv
video/webm webm
video/x-matroska mpv mkv
application/x-mpegURL m3u8
video/MP2T ts
application/x-mpegURL .m3u8
how do I have to specify the html5 code for it to be properly displayed on my ipad? anyone got a clue?btw I have also tried http apple live stream using ffmpeg and segmenter and i get that working as well, but due to the fact that TV is a continuous stream of data it does not work well with the playlist, so i stops after a while and you need to restart etc, not very handy and i want the above working, would appreciate the help, thanks in advance :)
jody
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.whatwg.org/pipermail/help-whatwg.org/attachments/20110912/4fe820ec/attachment-0001.htm>
More information about the Help
mailing list