An FLV Player and BBcode for Inline FLV Attachments in phpBB3

Upon request, I began looking into how to modify my previous post regarding how to embed MP3 attachments with a Flash player on a phpBB3 forum to also allow the same thing for FLV videos. After following this article, in your phpBB3 forum you’ll be able to use a BBCode to play .flv files as well as upload .flv files and embed them to play with a single click on the “Place Inline” button under the attachment.

The Player

.FLV files, unlike .SWF files, require a player to control them. SWF files can simply be embedded using the default [flash] BBCode. An .flv file would require a player to be called pointing to the .flv file. You can acquire the popular and free (for noncommercial uses) JW FLV Media Player. Visit the Longtail website and download the JW FLV Player by checking the “I agree to the noncommercial license” and hitting the ‘Download Now’ button.

The download is in the form of a .zip file. Extract the files from the zip file to a folder on your desktop and upload those seven (7) files to a folder on your server. Make sure the player.swf file’s permission allow it to be accessed from the web. Note the URL to the player.swf file for later use.

Next, you’ll need to generate the code to embed the player. Here you can easily choose a bunch of different options using Longtail’s JW Player Setup Wizard.

Step 1 should be “flvplayer with a single video” but the rest of the options you can go through and choose for yourself on how you want the player to operate. One of the values I changed was under Embed parameters. For the source, replace player.swf to the URL you noted earlier to the player.swf file on your server. You can also change the height and width to a size you might use more frequently. Under File properties, you should also change the ‘file’ line to ‘{URL}’ like in the screenshot below. The rest of the values I left as the default, but you can freely choose to configure them as you wish. Hit the ‘Update Preview & Code’ button when you’re done.

Scroll down to step 3 and see if you approve the player’s look and behavior. If not, scroll back up to step 2, make any changes, and update the preview again. Once the player is how you want it, scroll down to step 4 and click the use ‘the embed code link’.

This will switch the code to begin with an embed tag. Copy this code and then go on to create the BBCode to be used on your forum.

The BBCode

Log into the Administration Control Panel of your phpbb forum and browse to the Posting tab and the BBCodes selection. Click the ‘Add a new BBCode’ button to create an FLV bbcode.

The BBCode usage field should be filled out with code like this:

[flv]{URL}[/flv]

and the HTML replacement field should have the code you copied from the JW Player Setup Wizard that began with the embed tag.

If you want just the default HTML replacement like I generate, it should be something like this: (Be sure to switch the src= value to the URL of your player.swf file.)

[html]<object classid=”clsid:d27cdb6e-ae6d-11cf-96b8-444553540000″ width=”480″ height=”360″ codebase=”http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,40,0″><param name=”bgcolor” value=”undefined” /><param name=”flashvars” value=”file=URL” /><param name=”src” value=”http://yoursite.com/flvplayer/player.swf” /><param name=”allowfullscreen” value=”true” /><embed type=”application/x-shockwave-flash” width=”480″ height=”360″ src=”http://yoursite.com/flvplayer/player.swf” allowfullscreen=”true” flashvars=”file=URL” bgcolor=”undefined”></embed></object>[/html]

You can optionally choose to have a help line or have the bbcode displayed on the posting screen. The settings should appear like below and then hit the Submit button.

Now people will be able to post to your forum with a URL to an .flv file, surround it with the [flv] bbcode, and have a player appear.

[flv]http://somewebsite.com/viralvideo.flv[/flv]

You could create different BBCodes if you wanted different behaviors like auto-play or different sizes.

Extensions

In order for people to be able to upload an .flv file, the extension permissions will need to be configured to allow this. In the Administration Control Panel again, go under the Posting tab and then click on the ‘Manage extensions’ link. This will bring up the extension management page on the right side. Add flv as an extension and add it to the Downloadable files Extension group. Then hit the ‘Submit’ button. You’ll also need to go into the Manage extension groups page and ensure tha Downloadable Files are allowed.

File Editing

Assuming you’ve already performed the mod to allow inline MP3 attachments, there is only one file to modify now. If you haven’t performed the MP3 attachment mod, you will need to view that article: An MP3 Player for Inline MP3 Attachments in phpBB3 and follow the steps for modifying phpbbRoot/styles/prosilver/template/posting_editor.html

Similar to the MP3 attachment mod, we’ll need to edit the file at phpbbRoot/styles/prosilver/template/editor.js

Make a backup copy of this file before you begin working. Then find this section of the code around line 195:
[java]/**
* Add inline attachment at position
*/
function attach_inline(index, filename)
{
insert_text(‘[attachment=’ + index + ‘]’ + filename + ‘[/attachment]’);
document.forms[form_name].elements[text_name].focus();
}[/java]
Replace it with this code:
[java]function attach_inline(index, filename, attach_id)
{
if (filename.match(“.mp3”))
{
insert_text(‘[mp3]’ +’http://yourserver.com/download/file.php?id=’ + attach_id +'[/mp3]’);
document.forms[form_name].elements[text_name].focus();
}
else if (filename.match(“.flv”))
{
insert_text(‘[flv]’ +’http://yourserver.com/download/file.php?id=’ + attach_id +’.flv[/flv]’);
document.forms[form_name].elements[text_name].focus();
}
else
{
insert_text(‘[attachment=’ + index + ‘]’ + filename + ‘[/attachment]’);
document.forms[form_name].elements[text_name].focus();
}
}[/java]
If you have already performed the MP3 mod, you’ll only need to add the ‘else if’ section to the code.

Save the changes you have made and upload the modified file to replace the original.

Log into the Administration Control Panel of the forum and hit the button to ‘Purge the cache’.

Now, take the mod for a whirl. You should be able to upload an attachment of a file with extension .flv, click the Place Inline button, and have the code appear in the posting box.