<!doctype html>
<html>
<head>
<title>multiple pseudo scenes</title>
<script src="//cdnjs.cloudflare.com/ajax/libs/aframe/0.5.0/aframe.js">
</script>
</head>
<body>
<a-scene>
<a-assets>
<video id="video-src" autoplay="false" src="https://www.youtube.com/watch?
v=Uz12cLvkVYY"></video>
</a-assets>
<a-video id="video-screen" src="#video-src" position="1.591 2.206 -11"
width="30" height="13">
</a-video>
</a-scene>
</body>
</html>
This is my code. I want to load youtube video in a scene using a-frame. But it does not show anything. How to load a youtube video using a-frame?
It'd be very convenient if you could just drop a youtube URL into a <video> tag, but that's unfortunately not how it works. To embed a youtube video in your page you need to follow one of the methods in the youtube API, which ends up one way or another inserting an iframe in your page containing the video.
And iframes can't be used inside a-frame:
There is no way for the browser to display <iframe>s within WebGL. While it is possible to overlay an <iframe> on top of the canvas, the <iframe> will not display in VR nor can it integrate with the scene.
Further on in the a-frame docs, youtube is specifically mentioned:
Can I render YouTube videos as a texture? No. You could proxy YouTube videos as a texture or download them locally to serve, but that is against their terms of service.
...which suggests that video is possible, but youtube is not (for legal, rather than technical, reasons). If you need to do this you'll need a non-youtube video source.
I read youtube views does not count if autoplay is on with youtube embed player.
Html5 video player Selz/plyr actually allows you to embed youtube video into their player. I wonder if this plugin accumulates youtube views at all. Can anyone confirm it?
<div class="plyrWrapper">
<div data-type="youtube" data-video-id="AbcdEFghIJ"></div>
</video>
// plyr
window.plyr = plyr;
plyr.setup({
//options
});
In short, they do count.
Source: https://github.com/Selz/plyr/issues/556
I am creating a website which play live videos of any event.The Only
way i know is the VLC, is there any way to implement faster and smooth
streaming???
To generate FLV streaming from VLC reffer this
link
Now to play FLV streaming using Flow flash player reffer this link
Now below is the code for playing video in browser
<html><head>
<script type="text/javascript" src="flowplayer-3.2.12.min.js"></script>
</head><body>
<a
href="http://10.100.200.123:11443"
style="display:block;width:520px;height:330px"
id="player">
</a>
<script>
flowplayer("player", "flowplayer-3.2.16.swf");
</script>
</body></html>
The default oflaDemo application in Red5 uses JWplayer to play flv/mp4 videos. The code (as in the index.html file) is :
<center>
<b>RTMP</b>
<div id='mediaspace'>This text will be replaced</div>
<script type='text/javascript'>
jwplayer('mediaspace').setup({
'flashplayer': 'player.swf',
'file': 'hobbit_vp6.mp4',
'streamer': 'rtmp://localhost/oflaDemo',
'controlbar': 'bottom',
'width': '848',
'height': '360'
});
</script>
<br />
<div>
However, this page in the JW Player website states that it is possible to use the HTML5 video tag instead of flash to stream the videos. But then, from what I know, the video tag does not support RTMP streaming. How do I incorporate the video tag into the above code in the oflaDemo index.html page?
I had been using the flash based JWPlayer 4 with the playlist option. Recently I upgraded to JWPlayer 5 which is claims HTML5 support. The player by itself degrades nicely on mobile devices that support HTML5 but not flash, however it breaks with the playlist option enabled.
So can someone tell me either what I'm doing wrong with JWPlayer 5 and how to get it to work with the playlist option for mobile devices, or perhaps just teach me a better way to set up a video and a playlist with HTML5?
Resources
JW Player and playlist configuration example page
Example of the JWPlayer and Playlist layout:
This is not JW Player specific answer.
Browser's native HTML video tag behaves weird if you replace tags. Instead you should set single src attribute directly in tag. By that way you can change that attribute in DOM. Before changing it, try to pause the playing video first.
I use mediaelementjs.com. It works pretty well.
It doesn't come with built-in playlist feature but you can easily build one by yourself. After all, playlist is just a list of videos that when you click on one, you go change the source of the video.
Media element has setSrc() function that supports both HTML5 and flash fallback. It works from me.
Voila un bout de script pour jwplayer 6.7 et playlist youtube
<script>
jwplayer("myElement").setup({
width: "100%",
height: "400",
playlist: "http://gdata.youtube.com/feeds/api/playlists/PLMIePZMXPqnYlsvE_PFwe-_e336HlJF7g?max-results=50&alt=rss",
stretching: "exactfit",
primary: "flash",
sharing: {link: "http://www.centraltv.fr/egypte-television/rotana-masriya"},
autostart: "true",
listbar: {
position: "right",
size: "220"
}
});
</script>
This isn't answer to your main question. It's just some general tips.
Upgrade. I had some trouble with 5.6 not playing on mobile devices, and upgrading to 5.8 fixed it.
Avoid autoplay at the moment. I've had some issues with the player not loading. It might be due to a timing issue on loading large media files, and javascript trying to begin playing. Also, for linux users with a slower connection (like me at 3mb dsl), when the playhead catches up, and the buffer is empty, the player stops functioning.
Maybe override the mode. For my media, html5 seems to play a little better.
modes: [
{ type: "html5" },
{ type: "flash", src: "/media/player.swf" }
]
Try to use the same height/width as your media.
If you are playing audio only- it can be hard to find the (centered) play button if your width is a large value.
I'm not using the playlist. I have a list of recordings on the page, and a button to load a popup/dialog.
These links might be helpful:
HTML 5 video or audio playlist
PagePlayer
JW Player 5
Generate a Playlist for HTML5 Video
If you are just using YouTube videos, they offer a (beta) HTML5 video player: http://code.google.com/intl/en/apis/youtube/iframe_api_reference.html
I use the HTML5 video player on this site: http://www2.highpoint.edu
And older versions of IE cannot use that player (very well), so I still use Flash embed tags for those browsers instead which are done via the YouTube js api: http://code.google.com/intl/en/apis/youtube/js_api_reference.html
Here is an example page: http://www2.highpoint.edu/youtube.php?id=ht1PrQkE3WU
I highly recommend mediaelementjs if you need to roll-your-own video player. All videos on our site are hosted by YouTube, but we still use it as an audio player, as seen here: http://www2.highpoint.edu/president.php?mp3=http%3A%2F%2Fwww2.highpoint.edu%2Fmp3%2FNQ_LI013107.mp3
JWPlayer's last version supports HTML5 playback as well. Now it can also be used in mobile devices that do not support flash.
Another HTML5 video player with flash fallback is videoJS ( http://videojs.com/ )
swf is not supported by mobile device
i think this is useful but need two type file
<video width="320" height="240" controls="controls">
<source src="movie.mp4" type="video/mp4" /> <!-- for iPad :) -->
<source src="movie.ogg" type="video/ogg" /> <!--for windows -->
Your browser does not support the video tag.
</video>
and i try javascript to change movie and it worked in both
you must be use this because i have an ipad and i cant open the swf based video player's video