Add capability to play HTML5 native formats without bbcode

[profKroy]

Thanks Dan. I agree, incorporating it right into phpBB seems completely logical. I'm a bit of a hacker myself and I'm about to embark on going through the steps of modifying the code, as per the instruction.

Can I clarify with you that the posted modification will enable the MP3 functionality I'm after?

[shortmort37]

It will - however, not on iOS or, apparently, Android. There's an issue with ../download/file.php that I've not yet resolved.

Dan

[profKroy]

Unfortunately I'm getting a fairly complex error when I try to "preview" the mp3 and ogg attachment. I believe this has to do with the fact that I didn't modify the "attachment.html" file in the "prosilver" directory. Instead I modified the "attachment.html" file in a style template (anami) that I have installed. Could this be a problem? What if I need to use a style other than "prosilver?" Much appreciated.

The error is triggered with all attachment extensions. Looks to be related to an incompatibility with the theme Anami. SOLVED. Anami designer made a slight modification to the attachment.html file, and it's working now.

Fatal error: Uncaught exception 'Twig_Error_Syntax' with message 'Unexpected tag name "endfor" (expecting closing tag for the "if" tag defined near line 8) in "attachment.html" at line 140' ...

[shortmort37]

You're a better programmer than I, Dr. Kroy! Don't know nothin' 'bout no stinkin' style templates...

Dan

[profKroy]

You're a better programmer than I, Dr. Kroy! Don't know nothin' 'bout no stinkin' style templates...

Dan

I wish I had that kind of skill. With some digging I may have figured it out. But what may take me a couple of days, others can do in 30 seconds. Had to call in the big guns (Gramziu) on that, over at Anami themes.

It's up and going now. Students happy!

[Leinad4Mind]

I've solved the problem on iOS (Safari)
I've tested on all browsers on windows, androind and MAC, and it seems to work.

Use this code instead of yours:

Code: Select all

// HTML5 Streams
                case ATTACHMENT_CATEGORY_HTML5:

                    $block_array += array(
                        'U_FORUM'        => generate_board_url(),
                        'ATTACH_ID'      => $attachment['attach_id'],
						'P_FNAME'        => $attachment['physical_filename'],
                        'S_HTML5_FILE'        => true,
                    );

                    // Viewed/Heared File ... update the download count
                    $update_count[] = $attachment['attach_id'];
                break; 

and this one too:

Code: Select all

      <!-- ELSEIF _file.S_HTML5_FILE -->
         <!-- IF _file.MIMETYPE == 'audio/mp3' -->
            <audio controls="true" name="media">
               <source src="{_file.U_DOWNLOAD_LINK}" type="{_file.MIMETYPE}">
			   <source src="./files/{_file.P_FNAME}" type="{_file.MIMETYPE}">
            </audio>
         <!-- ELSE -->
            <video controls width='80%' width='80%'>
				<source src="{_file.U_DOWNLOAD_LINK}" type="{_file.MIMETYPE}">
				<source src="./files/{_file.P_FNAME}" type="{_file.MIMETYPE}">
            </video>
         <!-- ENDIF -->

Try it out. You maybe need to give read permissions of /files/ folder. (or delete the htaccess)

Fell free to pay me a beer

[shortmort37]

I've solved the problem on iOS (Safari)
I've tested on all browsers on windows, androind and MAC, and it seems to work.

Use this code instead of yours:

Hmmm... I was quite excited when I read your post. But I'm not finding it to work on Windows Safari, iOS Safari or iOS Chrome. It behaves as before. Might there have been other edits, than the ones you list below?

You didn't reference the source files - I'll do that here, for folks who might want to try themselves. This edit is to <yourboard>/includes/functions_content.php:

Code: Select all

// HTML5 Streams
                case ATTACHMENT_CATEGORY_HTML5:

                    $block_array += array(
                        'U_FORUM'        => generate_board_url(),
                        'ATTACH_ID'      => $attachment['attach_id'],
						'P_FNAME'        => $attachment['physical_filename'],
                        'S_HTML5_FILE'        => true,
                    );

                    // Viewed/Heared File ... update the download count
                    $update_count[] = $attachment['attach_id'];
                break; 

This edit is to <yourboard>/styles/prosilver/template/attachment.html. Nice catch on controls="true" in the audio tag - the default is false, I missed it:

Code: Select all

      <!-- ELSEIF _file.S_HTML5_FILE -->
         <!-- IF _file.MIMETYPE == 'audio/mp3' -->
            <audio controls="true" name="media">
               <source src="{_file.U_DOWNLOAD_LINK}" type="{_file.MIMETYPE}">
			   <source src="./files/{_file.P_FNAME}" type="{_file.MIMETYPE}">
            </audio>
         <!-- ELSE -->
            <video controls width='80%' width='80%'>
				<source src="{_file.U_DOWNLOAD_LINK}" type="{_file.MIMETYPE}">
				<source src="./files/{_file.P_FNAME}" type="{_file.MIMETYPE}">
            </video>
         <!-- ENDIF -->

Try it out. You maybe need to give read permissions of /files/ folder. (or delete the htaccess)

Fell free to pay me a beer

Let's get it to work, mate, and I'll gladly buy you that brewski!

Dan

[Leinad4Mind]

When I test it I had a little different I had preload loop autoload on the html file. I know that safari is very sensible with those configuration.
And as far as I know many problems can occur on a bad server configuration. If the mime type is correct it should grab the video.

I'll take a better look soon. I don't own any Mac or iOS. So I need some time to get some of them so I can test it.

And this code and even your initial code worked on mac chrome.

For test purposes remove the 1st source line and test it again.

[shortmort37]

For test purposes remove the 1st source line and test it again.

You mean, this one?

Code: Select all

// HTML5 Streams

I didn't enter it - I only made the changes indicated by comparing your code to mine.

[Leinad4Mind]

<source src="{_file.U_DOWNLOAD_LINK}" type="{_file.MIMETYPE}">

I'm on a phone so. Difficult to write xD

[shortmort37]

Oh, got it. Yes, my first attempt at repeating what you did was to substitute this:

Code: Select all

            <source src="./files/{_file.P_FNAME}" type="{_file.MIMETYPE}">

for this:

Code: Select all

            <source src="{_file.U_DOWNLOAD_LINK}" type="{_file.MIMETYPE}">

It didn't change the behavior in any browser, in either OS; what worked continued to work, and what didn't work stayed broke. In desperation, I put both lines in. No difference.

Dan

[Leinad4Mind]

Tell me which os version are you using, Captain or other?

[shortmort37]

Tell me which os version are you using, Captain or other?

I take it you mean El Capitan, a version of Mac OS X.

I don't have a Mac. All of my testing has been with Windows HTML 5 browsers:

IE11 (works), Chrome (works), Firefox (works), Safari (doesn't work);

or, iOS browsers:

Safari (doesn't work), Chrome (doesn't work).

The common denominator appears to be that it is an Apple product, or browser running on an Apple product.

[shortmort37]

You sent me a link to a website where you had posted a video, using an update to my mod. I went to it using my iPad:



Exactly the behavior I'm seeing: You see the "start" icon, but clicking it does nothing. No first frame of the video displayed, either.

No brewskis for you, my friend.

[shortmort37]

Hold the bus! What is this a reference to?

<source src="{_file.U_DOWNLOAD_LINK}" type="{_file.MIMETYPE}">
<source src="./files/{_file.P_FNAME}" type="{_file.MIMETYPE}">

If meant to reference <yourboard>/download/file, it's not even the right directory name.

Also, this code exists in <yourboard>/styles/prosilver/template/attachment.html. I don't know enough about PHP - but, where are we when it is encountered? In the directory hierarchy, the physical filename would be found in ../../../download/file.

Confused.