Hi Froad. Did you supply the Ogg and WebM videos as well to the macro?
I must admit I did not test this with the rich text editor, also I think the macro properties are text and not media pickers, so can you try just typing in the URLs to the media item for now, so we can double check this is just working OK as it should be.
@warren... i am wondering if there are issues using the swf hosted on the cdn??? with the site being on one server, the swf on a second and possibly the video being on a third??? does that make any sense?
@Froad glad you fixed it. I would recommend you provide Ogg & WebM formats to ensure it works in as many browsers as possible.
@Bob No the SWF shouldnt be a problem, however for it to work with the MP4 file as the fallback it will need to use the full URL to the videos as just passing /media/234/myvideo.mp4 the FlowPlayer won't know where that file is.
I suppose if its a real problem. Then I could update the package to include the FlowPlayer SWF locally on the Umbraco install then you should be able to use relative URLs.
If it's important to you add an issue on codeplex and then I will get round to doing it.
It's a slightly different scenario, but when building a jquery plugin using videojs there were a few problems in IE that could only be solved by moving the flowplayer swf locally.
Something to keep an eye on if you see problems appearing.
Hiya Dan, The XSLT is based on the embed builder on VideoJS site and thus uses the CDN version of FlowPlayer hence why it has been used, but if everyone is having lots of problems with this then I will work on an update to include FlowPlayer in the actual Umbraco site.
I really want to use this player but we want mulitple videos to play on the same page, kind of like a jQuery slide show would with the thumbs showing the next video. When the thumb nail is selected then the first video would stop and the next video would show up in its spot and play.
We just use Vimeo for our streaming now. We looked at this but Vimeo does all of the formatting, detecting of devices, browsers, etc. and a video player wraps it all.
Ken, I don't think MP4 can play in most versions of IE. Anything below IE9 any ways. Safari is hit and miss on the mp4 format. Depends on how you converted it. I notices Safari likes M4V better. I just wish one format would come out the victor and everything can get along.
Also for a multiple video player we used a jQuery slide plugin Orbit by ZURB www.ZURB.com/playground. Really useful. We hacked it a bit to play iFrames since that is what Vimeo does for their video player. Then we hooked up Vimeo's moogaloop.js to control the video stopping when the next arrow is hit or the bullets are hit.
As Carlos is saying you could consider using Vimeo for streaming for instance.
However there are some things to be aware about when dealing with HTML5 video.
As Warren is mentioning in a previous post you'll need to also supply the video in ogv and webm format. I can recommend that you read this article about the state of HTML5 video - http://diveintohtml5.info/video.html
Apart from that you also need to make sure that the server knows the mime-type so it can serve the content to the browser.
If you're running IIS 7 or higher you should add the below in the <system.Webserver></system.Webserver> element, right before the closing </system.Webserver>
When using videojs the script will make sure that there is a flash fallback for browsers like IE (it uses the .mp4 file if no .flv file is supplied)
When serving video to devices like phones you should also be aware that if your video is in greater resolution than 640x480 they won't play it. For instance iPhone 3GS can't play a video that has a resolution of 960x640 for instance.
I personally hope that all browser and device vendors some day will settle on webm.
Thanks for the swift responses. I have already set all the mime types in the config exactly where you mention, and supply all 3 video formats. I must just be missing the flv file. Should have thought of that, really.
Try the flv file in there. The issue we ran into with this solution was the inherent need to provide 3 formats for every single video we put on our website. Which was not an option. Hosted solutions like Vimeo or YouTube or other services do the conversions for you on the fly through their services. Until cross browser acceptance of a single or down to at least 2 formats. We will let the hosted services do the conversions from HTML5 or Flash player.
This plugin is great if you only have a few videos. If you want to learn the HTML5 video attributes it is really fun and very useful.
But if you want to save time, a hosted solution is just easier.
I've been playing around with this plugin trying to get it to work so far I have:
- Uploaded ogg, webm and mp4 types for the video. - Added the lines in the above post to the web.config
It works ok in firefox (3.6/19.0.2) but not in IE or Safari.
It doesn't display an error in IE, just a black box with the play button in center, nothing happens when it is clicked, whereas in Safari when you click the play button the buffering animation starts but doesn't stop and no video begins.
200 Stream not Found
Ive uploaded the example movie to my media section and used this link to play the movie:
/media/1643/big_buck_bunny.mp4
When I use that I get 200 Stream not found in the player.
I tried to use the full url but the editor strips out the first part.
Am I doing something wrong?
Hi Froad.
Did you supply the Ogg and WebM videos as well to the macro?
I must admit I did not test this with the rich text editor, also I think the macro properties are text and not media pickers, so can you try just typing in the URLs to the media item for now, so we can double check this is just working OK as it should be.
Cheers,
Warren
Nope, no Ogg and WebM.
I solved it by appending the domain in the xslt-file. That worked fine :)
Im going to adjust the macro to use a media picker instead of text.
Thx for a super package and fast support!
@warren... i am wondering if there are issues using the swf hosted on the cdn??? with the site being on one server, the swf on a second and possibly the video being on a third??? does that make any sense?
@Froad glad you fixed it. I would recommend you provide Ogg & WebM formats to ensure it works in as many browsers as possible.
@Bob No the SWF shouldnt be a problem, however for it to work with the MP4 file as the fallback it will need to use the full URL to the videos as just passing /media/234/myvideo.mp4 the FlowPlayer won't know where that file is.
I suppose if its a real problem. Then I could update the package to include the FlowPlayer SWF locally on the Umbraco install then you should be able to use relative URLs.
If it's important to you add an issue on codeplex and then I will get round to doing it.
Cheers,
Warren :)
It's a slightly different scenario, but when building a jquery plugin using videojs there were a few problems in IE that could only be solved by moving the flowplayer swf locally.
Something to keep an eye on if you see problems appearing.
Dan
Hiya Dan,
The XSLT is based on the embed builder on VideoJS site and thus uses the CDN version of FlowPlayer hence why it has been used, but if everyone is having lots of problems with this then I will work on an update to include FlowPlayer in the actual Umbraco site.
Warren :)
Is there any update on this package as i have the same problem only with IE
I really want to use this player but we want mulitple videos to play on the same page, kind of like a jQuery slide show would with the thumbs showing the next video. When the thumb nail is selected then the first video would stop and the next video would show up in its spot and play.
Any suggestions?
Hi,
I've just started playing with Umbraco and came across this exact problem. Was it ever fixed?
Videos are working as intended in Chrome & FF, but not in IE or Safari. Getting the same error:
200, Stream not found, NetStream.Play.StreamNotFound, clip: '[Clip] '/media/384/big_buck_bunny.mp4''
Thanks for the help.
Ken
We just use Vimeo for our streaming now. We looked at this but Vimeo does all of the formatting, detecting of devices, browsers, etc. and a video player wraps it all.
Ken, I don't think MP4 can play in most versions of IE. Anything below IE9 any ways. Safari is hit and miss on the mp4 format. Depends on how you converted it. I notices Safari likes M4V better. I just wish one format would come out the victor and everything can get along.
Also for a multiple video player we used a jQuery slide plugin Orbit by ZURB www.ZURB.com/playground.
Really useful. We hacked it a bit to play iFrames since that is what Vimeo does for their video player.
Then we hooked up Vimeo's moogaloop.js to control the video stopping when the next arrow is hit or the bullets are hit.
Example of multiple videos is here:
http://www.dmns.org/science/museum-scientists/chip-colwell-chanthaphonh ;
Click on the videos tab to see.
Hi Ken
As Carlos is saying you could consider using Vimeo for streaming for instance.
However there are some things to be aware about when dealing with HTML5 video.
As Warren is mentioning in a previous post you'll need to also supply the video in ogv and webm format. I can recommend that you read this article about the state of HTML5 video - http://diveintohtml5.info/video.html
Apart from that you also need to make sure that the server knows the mime-type so it can serve the content to the browser.
If you're running IIS 7 or higher you should add the below in the <system.Webserver></system.Webserver> element, right before the closing </system.Webserver>
<staticContent>
<!-- HTML5 Audio/Video mime types-->
<remove fileExtension=".mp3" />
<mimeMap fileExtension=".mp3" mimeType="audio/mpeg" />
<remove fileExtension=".mp4" />
<mimeMap fileExtension=".mp4" mimeType="video/mp4" />
<remove fileExtension=".ogg" />
<mimeMap fileExtension=".ogg" mimeType="audio/ogg" />
<remove fileExtension=".ogv" />
<mimeMap fileExtension=".ogv" mimeType="video/ogg" />
<remove fileExtension=".webm" />
<mimeMap fileExtension=".webm" mimeType="video/webm" />
<!-- Flash Video mime types-->
<remove fileExtension=".flv" />
<mimeMap fileExtension=".flv" mimeType="video/x-flv" />
<remove fileExtension=".f4v" />
<mimeMap fileExtension=".f4v" mimeType="video/mp4" />
</staticContent>
When using videojs the script will make sure that there is a flash fallback for browsers like IE (it uses the .mp4 file if no .flv file is supplied)
When serving video to devices like phones you should also be aware that if your video is in greater resolution than 640x480 they won't play it. For instance iPhone 3GS can't play a video that has a resolution of 960x640 for instance.
I personally hope that all browser and device vendors some day will settle on webm.
Hope this helps at bit.
/Jan
Hi guys,
Thanks for the swift responses. I have already set all the mime types in the config exactly where you mention, and supply all 3 video formats. I must just be missing the flv file. Should have thought of that, really.
I'll take a look at Vimeo, as well.
Cheers.
Try the flv file in there. The issue we ran into with this solution was the inherent need to provide 3 formats for every single video we put on our website. Which was not an option. Hosted solutions like Vimeo or YouTube or other services do the conversions for you on the fly through their services. Until cross browser acceptance of a single or down to at least 2 formats. We will let the hosted services do the conversions from HTML5 or Flash player.
This plugin is great if you only have a few videos. If you want to learn the HTML5 video attributes it is really fun and very useful.
But if you want to save time, a hosted solution is just easier.
I've been playing around with this plugin trying to get it to work so far I have:
- Uploaded ogg, webm and mp4 types for the video.
- Added the lines in the above post to the web.config
It works ok in firefox (3.6/19.0.2) but not in IE or Safari.
It doesn't display an error in IE, just a black box with the play button in center, nothing happens when it is clicked, whereas in Safari when you click the play button the buffering animation starts but doesn't stop and no video begins.
Thanks
Peter
@Pete, do you have an uploaded version of the page you are using to render the videos?
More or less, do you have an example online we can see?
Got it working, looks like the Ogg / Webm files were corrupted.
@Pete. Awesome. Glad it works.
is working on a reply...