Add-On Releases - XEON Series - vbFLV Streaming Video Player

XEON series ? The vbFLV Video Player


[ Click Here to see the DEMO ]

If you use this modification please click INSTALL - it shows your appreciation and I can notify you of updates, when they become available!

Release Date: 2006-11-13
Revision: 1.1 (see change log in this post). If UPGRADING from Revision 1.0 DO NOT overwrite any files, apart from the main player.swf
vBulletin versions compatible: Works on ANY - uses no MySQL

Features:

• XML Based FLV Player
• Single playlist population
• Fade in/out over thumbnails
• Auto-detect Normal or Widescreen video formats
• Auto-detect Scroll-bar on if more than 5 videos in XML file
• Optimized for vBulletin using a single ?conditional?
• Optimized picture clarity/quality
• Slide Scroll bar to view other movies
• Uses javascript object embed for all known browser compatibility issues

Watermarked version details: *See second post below*

As many members requested, here at vbulletin.org, I designed this video player. It is XML driven, and the full vBulletin integrated version will be a commercial product, with many added features.
To compliment the XEON vbMp3 Player I brought you, the XEON series vbFLV Video Player, is another feature packed add-on. This is currently designed as a popup.

The vbFLV Video Player allows you to add unlimited video footage from various sources. There are no limits on FLV streaming, but you may wish to think about bandwidth consumption, if you intend to have very long movie clips. Note: most FLV clips are between 1-2Mb?s each, due to compression used. I would suggest you read these instructions carefully for no problems to occur, installation is fairly straight forward but setup will take longer.

Broadcast streaming video directly from your vBulletin forum.
You can encode your own movie files into the FLV format.
Use websites like www.keepvid.com to download any video from Google, YouTube, iFilm, and numerous other video websites. Visit www.keepvid.com for a full list.

Bandwith Consumption:
Due to design of this player and you will rarely find flv files around websites, the player is restricted to local flv files only. This was done by request, since most people that requested this modification wanted to play videos on their own websites, not on a global basis. If you have a large forum and huge video files, and only a small bandwidth limit I would not recommend you install this version.

Why FLV?
FLV is a widely used format for video/audio - and uses can be even interactive. No other video format comes close to these specifications - and the compression ratio will surpass anything around. In this tutorial you will be able to find the best compression ratio to use (the demo uses a 512k stream, which these days is quite adaquate for most users). Most video formats can be converted to the FLV format, I have listed a few places below where you can get free converters from.

What is FLV?
FLV is video format used by Flash, it is possible to take a 50Mb mpeg file and convert it to a 512k FLV stream, reducing the file size to around 10Mb. Giving you a high compression ratio of 5:1 in most cases. Is it more common on Google, YouTube, myspace, and many other video hosting websites.


Editing the XML file:
You can change all titles, descriptions, thumbnails and flv titles in the XML file. To edit it just right-click and select open with either Notepad, Wordpad or TextEdit (if you?re using a Apple).

Adding more videos:
Each video in the XML file is setup like this:

<item>
<date>13 November 2006</date>
<descr><b>Example 3</b></descr>
<video>example3.flv</video>
<image>example3.jpg</image>
</item>

So, we have Date, Description, video_name.flv and video_name.jpg ? each videos detail is enclosed between < item > tags.

Thumbnails & Descriptions

Thumbnails:
These small images must be created in any graphics program (The player will work without these thumbnails). If you do wish to create these images then they should be of a maximum size (width=70 and height=50), making them all the same size does look better, if they don't show up make sure you have named them the same as the details in the XML file. Note they must be non-progressive jpg images.

Creating the Thumbnail Images:
You can easily create the images by playing the video you want the image for, pause it at the point where you would like the screenshot. Now Hold down the ALT key and Press PRT SCR ? this will take a screenshot of just the player, open any image program and select Paste. Crop the image and resize until it is no larger than 70x50 pixels, save as a jpg.

Description:
You can add short titles and dates to your videos (as shown in the screenshot and demo, this data is entered in the XML file.


Transcoding your movies to FLV format
[high]Free FLV Encoders:[/high]
http://rivavx.com/index.php?encoder&L=3 - Riva FLV Encoder
Transcodes AVI, MPEG, Quicktime, WMV and more codecs.

[high]Commercial FLV Encoders:[/high]
http://www.yaodownload.com/video-des...dersconverter/

[high]More FLV Encoders can be found here:[/high]
http://www.brothersoft.com/downloads/flv-encoder.html


Installation:
Upload the entire contents of the Upload folder into your forum ?root?. There are index.html files within the video and images folders, these are just directory protection files, so people cannot just browse your folders and download.

Note: If you have installed any previous releases by me, then you may receive an alert about overwriting the flashobject.js file ? this file hasn?t been changed at all, so you can skip or overwrite. DO NOT rename any files or folders; the player does have dedicated paths compiled which cannot be altered.

XML Setup:
Make sure you enter no paths, just the file names. The player has defaults set for images and video directories.

Template edit:
AdminCP -> Styles & Templates -> Navigation / Breadcrumb Templates -> navbar

Find:

<td class="vbmenu_control"><a href="calendar.php$session[sessionurl_q]">$vbphrase[calendar]</a></td>

Add after:

<!-- vbFLV Player Start -->
<if condition="$show['member']">
<script type="text/javascript">
<!--

function Openvbflv(){
vbflv = window.open('vbflv.html','vbflv','directories=no,height=400,width=580,location=no,menubar=no,resizable=no,status=no,toolbar=no')

return false;
}

-->
</script>
<td class="vbmenu_control"><a href="#" onclick="return Openvbflv()">FLV Player</a></td>
</if>
<!-- vbFLV Player End -->

KNOWN ISSUES: none

Change Log:
15/11/2006 - Player screen resize fixed
13/11/2006 - Initial Release

Future Improvements:
Limited, due to being a XML version. All major features will be incorporated in the commercial fully integrated vBulletin version, available soon, with plugins.


This modification is fully supported, and keep your eyes open for other flash-based modifications I release. More ?XEON series? based projects are planned, but probably will not be released until early next year!

Screenshots below show current version.

[4number8]

Thanks alot syrus, much appreciated and I look foward to the commercial version release.

[COBRAws]

Originally Posted by syrus.xl

Skin changing is not an option with the XEON series - it is basically a hard-coded, designed player. The only option I offer on this player is brand-free, but at a cost, since all details and urls are removed.

As for a price, this hasn't been decided upon yet, since the commercial version will be 'modular' based - so you will be able to purchase addons/plugins for expanding the modification further.

oh well, its a shame the player design cant be changed
ill uninstall. Sorry

[Snake]

I love you! Haha thanks for the hack.

[nexus851]

Can we somehow WATERMARK the uploaded videos too? if not, will it be hard to add in a watermark for us???

[syrus.xl]

Originally Posted by nexus851

Can we somehow WATERMARK the uploaded videos too? if not, will it be hard to add in a watermark for us???

There is a way of doing this, and altering META data held in a FLV file.

I'll post the details later

[haytham]

No words can even come close to what this mod is...installed and I am crazy about it..Thanks a million

[nexus851]

Originally Posted by syrus.xl

There is a way of doing this, and altering META data held in a FLV file.

I'll post the details later

Please inform if you can at least add the auto watermark version on the public or commercial release. Ill definitely buy one right now if this can be done or an idea of when it can be done by you... appreciate it

J

[syrus.xl]

Originally Posted by nexus851

Please inform if you can at least add the auto watermark version on the public or commercial release. Ill definitely buy one right now if this can be done or an idea of when it can be done by you... appreciate it

J

There is 2 ways of doing this, but one is slightly tricky.

1. A permenent way would be adding the watermark data to the FLV's Meta data, this currently has to be done by an injection method on the FLV file. I only know of one program that can do this, which is Captionate (commercial) - capable of watermarking and subtitling any FLV file.

2. The other method is adding a dynamic field to the player, but this doesn't actually watermark the FLV files, it simply places your logo/text as an 'overlay' when any FLV is streamed through the player. Obviously, not permenent since it is not altering any data in the FLV.

If a watermarking system was incorporated, it would probably use the 2nd method, since this would be easier to add. The first method would require extensive knowledge, and if possible to run such a script from server-side.

[MissKalunji]

Originally Posted by syrus.xl

There is 2 ways of doing this, but one is slightly tricky.

1. A permenent way would be adding the watermark data to the FLV's Meta data, this currently has to be done by an injection method on the FLV file. I only know of one program that can do this, which is Captionate (commercial) - capable of watermarking and subtitling any FLV file.

2. The other method is adding a dynamic field to the player, but this doesn't actually watermark the FLV files, it simply places your logo/text as an 'overlay' when any FLV is streamed through the player. Obviously, not permenent since it is not altering any data in the FLV.

If a watermarking system was incorporated, it would probably use the 2nd method, since this would be easier to add. The first method would require extensive knowledge, and if possible to run such a script from server-side.

Number two i was talking about Like Myspace,youtube) some of them just adds it to the swf player design....so when the video plays it shows on it

[syrus.xl]

Originally Posted by MissKalunji

Number two i was talking about Like Myspace,youtube) some of them just adds it to the swf player design....so when the video plays it shows on it

Dynamic 'watermarking' in flash is pretty easy to add, but with flash the PNG format works better. Transparency can also be utilized.

I'll look at both options available using dynamic 'watermarking' - typically these can be a PNG image or just text (text requires the font being embedded if its a non-standard font).