I just added a new feature to the FLV Player. On the FLV Player download page you can now select whether you want your FLV Player to automatically start playing your movie or to wait for the user to specifically tell it too do so.
Today I added full-screen functionality to the FLV Player. In the upper right corner of the FLV Player interface I added a button that can toggle the player between
normal size - the FLV Player’s height and width as defined by you
full-screen size - height and width of your screen.
When switching between normal and full-screen player size,the aspect ratio of the movie is maintained and the player’s interface is redrawn to fit the new video dimensions in a natural way.
Check it out for yourself with the FLV Player example on the FLV Player download page.
The FLV Player is usable in any size that you like. Thanks to great functionality in ActionScript 3.0 I was able to make the player adjust it’s interface to the size with which it’s included in your web-page.
You can adjust the HTML that embeds the FLV Player to display in any size that you want. The form on the FLV Player download page gives you the opportunity to generate the HTML and preview for a “160×120″, “320×240″ or a “640×480″ version but it’s a matter of altering the width and height parameters in the HTML code to have it display in any dimension that you like!
The FLV Player user interface has been updated!
There’s now a busy animation that plays when the player is either loading, buffering or seeking.
And there’s finally a download indicator.
Go and check it all out on the FLV Player download page!
Besides the visual update that I just posted about, there’s also a new tool included in the download page that can help you install a FLV Player to your website. Just fill in the publicly accessible location of your Flash video (*.flv) and a piece of HTML code will be generated once you press “Generate HTML”. Just copy and paste that into your HTML page and that page will display your movie through the FLV Player.
Alternatively you can use the download link to download the compiled FLV Player swf and place that too on your own domain. To play your video use a parameter video with the location of your Flash video. Like this; FLVPlayer.swf?video=yourvideo.swf
Have fun with it!
In this update I added a black outline around the interface elements so that they’re visible on very light movie frames as well.
I’m proud to present the first version of FLVPlayer. It has the bare minimum of functionality that you would expect from a video player.
- Play button
- Pause button
- Seek bar
- as indication of how much movie there is and how much of it you’ve already seen
- as a seek control
The player interface is visible when your mouse is hovering over it and otherwise invisible! The movie to play is given as an parameter to the SWF.
How to use FLVPlayer on your website
Here’s the HTML code that you would use to display your flv movie on your website.
<object classid = “clsid:d27cdb6e-ae6d-11cf-96b8-444553540000″ codebase = “http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,0,0″ width = “640″ height = “480″ id = “VideoPlayer” align = “middle”> <param name = “allowScriptAccess” value = “*” /><param name = “allowFullScreen” value = “true” /><param name = “movie” value = “http://www.platipus.nl/flvplayer/download/1.0/FLVPlayer.swf?video=[your_video].flv” /> <param name = “quality” value = “high” /> <param name = “bgcolor” value = “#ffffff” /> <embed src = “http://www.platipus.nl/flvplayer/download/1.0/FLVPlayer.swf?video=[your_video].flv” quality = “high” bgcolor = “#ffffff” width = “640″ height = “480″ name = “VideoPlayer” align = “middle” allowScriptAccess = “*” allowFullScreen = “true” type = “application/x-shockwave-flash” pluginspage = “http://www.macromedia.com/go/getflashplayer” /> </object>
It’s that simple. Just copy and paste this into your HTML page!
What is this blog about?
This blog describes the process of me developing a small, user-friendly, easy installable FLV Player. As I was working on the website of artist Daan Roosegaarde as part of an attempt to make the website more social/shareable/web 2.0 the need arose for having a small piece of HTML code that users could embed into their site to enjoy Studio Roosegaarde movies in their own site. Up to that point we where using the Adobe FLVPlayback component for playing Flash videos (*.flv’s) but that did not go well with our attempt to make our player shareable…
What is FLVPlayer about?
Or why would you need it? The problem is that when you make an swf that plays flv’s using the FLVPlayback component you need a second swf to provide the skin for the player. It’s easy to set up such an arrangement on your own domain, but cross-domain it’s almost impossible to have the player (although on your own server) embedded in another websites HTML page use the skin swf on your domain. Since requiring users to both copy a piece of HTML and copying a skin would not be an user-friendly I decided that we needed a standalone player.
What is so special about this particular FLVPlayer?
Short answer. Nothing special yet. Only that it’s an Flash 9 ActionScript 3.0 implementation.
I started by searching for free FLV Playing components. I found a lot that I liked (like on Lee Brimelows Flash blog and this FLV Player from Advanced Flash Components) and they come in all formats. There are
- Actionscript classes that you can compile for yourself or embed in existing projects,
- Flash components that you can use by dragging and dropping them in your projects without the need of writing a single line of code and
- precompiled SWF’s that take parameters.
Most implementations I found where for buying and some where free.
Somehow all the ones I liked where Flash 8 implementations. Which sucked because for consistency I wanted to use the exact same player in the Studio Roosegaarde main website (Flash 9 with ActionScript 3.0) and in the code snippets intended for sharing.
What can you expect here
I’ve decided to implement my own lightweight FLV player, which I call “FLVPlayer” :). The first version is here and you can check it out for yourself. The player will evolve and I will post about it. I will post instructions on how to use it and your free to do so. Feedback is welcome!