Easy MP3 Streaming with Attachments in phpBB3

I wanted my forum users to be able to upload mp3's and have a little flash player show up so that other users could stream them directly from the site (see screenshot).



After a few hours of scouring forums and googling, it seemed that nobody had the solution I wanted (just a bunch of less appealing alternatives). So, even though I don't know javascript or php, I managed to put together this little hack and to my surprise it gets the job done! When it's finished, you'll be able to upload an mp3, and when you click the "place inline" button, it will embed mp3's in our flash player BBCode tag.Note: If you are using something other than the default prosilver style, you will need to edit the files that are in those style folders.

Part 1: Install Flash Player
I use the Dewplayer Multi BBCode. If you want to install a different flash player, you just need to make sure you install that one and replace all appropriate references to the BBCode. Get the files and original instructions here.

1. First thing is to download the attachment in the link, unzip it, and upload the contents to your forum root (ie: /home/yourusername/public_html/phpBB3/ on a default install on a linux server running apache).

2. Next go to the Admin Control Panel >> Select "Posting" Tab >> Select "BBCodes" from left menu

3. Select "Add a new BBCode"

4. Enter the following into the boxes:

BBCode Usage
[dewmultimp3]{URL}[/dewmultimp3]

HTML Replacement
<object type="application/x-shockwave-flash" data="dewplayer-multi.swf?mp3={URL}&showtime=1" width="240" height="20"><param name="wmode" value="transparent"><param name="movie" value="dewplayer-multi.swf?mp3={URL}&showtime=1"></object>

Helpline
DEWMULTIMP3: [dewmultimp3]MP3 urls separated with a | [/dewmultimp3]

Then select the box that says "Display on Posting Page" if you want it there for convenience to your forum users.

Part 2: The Coding Hack

There are three files that each need one small edit. I highly recommend making a backup copy of each file, something like filename_backup, in case something goes wrong and your forum becomes dysfunctional.

First file: "forum_root/cache/tpl_prosilver_posting_editor.html.php"

Edit line 121
Change from this:
<?php if ($this->_rootref['S_INLINE_ATTACHMENT_OPTIONS']) { ?><input type="button" value="">_rootref['L_PLACE_INLINE'])) ? $this->_rootref['L_PLACE_INLINE'] : ((isset($user->lang['PLACE_INLINE'])) ? $user->lang['PLACE_INLINE'] : '{ PLACE_INLINE }')); ?>" onclick="attach_inline(<?php echo $_attach_row_val['ASSOC_INDEX']; ?>, '<?php echo $_attach_row_val['A_FILENAME']; ?>');" class="button2" /> <?php } ?>
To this (Ctrl+A to select All):
<?php if ($this->_rootref['S_INLINE_ATTACHMENT_OPTIONS']) { ?><input type="button" value="">_rootref['L_PLACE_INLINE'])) ? $this->_rootref['L_PLACE_INLINE'] : ((isset($user->lang['PLACE_INLINE'])) ? $user->lang['PLACE_INLINE'] : '{ PLACE_INLINE }')); ?>" onclick="attach_inline(<?php echo $_attach_row_val['ASSOC_INDEX']; ?>, '<?php echo $_attach_row_val['A_FILENAME']; ?>', '<?php echo $_attach_row_val['ATTACH_ID']; ?>');" class="button2" /> <?php } ?>

Second file: "forum_root/styles/prosilver/template/posting_editor.html"
Line in file: 168

Replace:
<input type="button" value="{L_PLACE_INLINE}" onclick="attach_inline({attach_row.ASSOC_INDEX}, '{attach_row.A_FILENAME}');" class="button2"> <!-- ENDIF -->

With this:
<input type="button" value="{L_PLACE_INLINE}" onclick="attach_inline({attach_row.ASSOC_INDEX}, '{attach_row.A_FILENAME}', '{attach_row.ATTACH_ID}');" class="button2"> <!-- ENDIF -->

Last file: "forum_root/styles/prosilver/template/editor.js"
Function starting on line: 189

Replace this:
function attach_inline(index, filename){ insert_text('[attachment=' + index + ']' + filename + '[/attachment]'); document.forms[form_name].elements[text_name].focus();}

With this:
function attach_inline(index, filename, attach_id){ if (filename.match(".mp3")) { insert_text('[dewmultimp3]' +'http:/secondbasement.comphpBB3/download/file.php?id=' + attach_id +'[/dewmultimp3]'+' ' + filename); document.forms[form_name].elements[text_name].focus();<br /> } else { insert_text('[attachment=' + index + ']' + filename + '[/attachment]'); document.forms[form_name].elements[text_name].focus(); }}

That should do it, you're all done! Now when you upload an mp3 file and click "Place Inline," it should wrap the appropriate URL in the dewplayer tag. Hope you find this helpful!