Updated bbcode_video template with available HTML5 Players

[BirdOPrey5]

Brought to you by BirdOPrey5
http://www.birdoprey5.com/ (http://www.birdoprey5.com/mods/)

NEW- April 5, 2013- Updated Facebook to HTML5, flash player stopped working!

The template bbcode_video is the one that decides what embed code is used for the built in video embedding sites.

This template relies mostly on Flash- only YouTube was ever updated to HTML5 in the stock bbcode_video template of VB 4.2.0.

This new edit has HTML5 Players available for Vimeo and Dailymotion as well. It also has the code there that was to help IE6 compatibility removed as 4.2.0 officially dropped support for IE6 anyway.

I have also made some of the video screens larger where appropriate.

The benefits of HTML5 players is they will work on iPads, iPhones, and all current Android/mobile devices. Flash does not.

To use this simply copy the code below and paste it into your template bbcode_video, deleting what used to be there.

If you have any trouble simply "revert" the template back to the original.

Repeat the above for each style you have.

New bbcode_video template (Tested on 4.2.0):


<vb:if condition="$provider == 'hulu'">

<object width="512" height="288">
<param name="movie" value="http://www.hulu.com/embed/{vb:raw code}"></param>
<param name="allowFullScreen" value="true"></param>
<embed src="http://www.hulu.com/embed/{vb:raw code}" type="application/x-shockwave-flash" width="512" height="288" allowFullScreen="true"></embed>
</object>

<vb:elseif condition="$provider == 'youtube'" />

<iframe class="restrain" title="YouTube video player" width="640" height="390" src="//www.youtube.com/embed/{vb:raw code}?wmode={vb:raw wmode}" frameborder="0" allowfullscreen></iframe>

<vb:elseif condition="$provider == 'youtube_share'" />
<iframe class="restrain" title="YouTube video player" width="640" height="390" src="//www.youtube.com/embed/{vb:raw code}?wmode={vb:raw wmode}" frameborder="0"></iframe>

<vb:elseif condition="$provider == 'vimeo'" />

<iframe src="http://player.vimeo.com/video/{vb:raw code}?portrait=0" width="640" height="360" frameborder="0" webkitAllowFullScreen mozallowfullscreen allowFullScreen></iframe>

<vb:elseif condition="$provider == 'dailymotion'" />

<iframe frameborder="0" width="640" height="390" src="http://www.dailymotion.com/embed/video/{vb:raw code}"></iframe>

<vb:elseif condition="$provider == 'metacafe'" />

<object class="restrain" type="application/x-shockwave-flash" width="640" height="380" data="http://www.metacafe.com/fplayer/{vb:raw code}.swf">
<param name="movie" value="http://www.metacafe.com/fplayer/{vb:raw code}.swf" />
<param name="wmode" value="{vb:raw wmode}" />
</object>

<vb:elseif condition="$provider == 'google'" />

<object class="restrain" type="application/x-shockwave-flash" width="400" height="326" data="http://video.google.com/googleplayer.swf?docid={vb:raw code}">
<param name="movie" value="http://video.google.com/googleplayer.swf?docid={vb:raw code}" />
<param name="wmode" value="{vb:raw wmode}" />
</object>

<vb:elseif condition="$provider == 'facebook'" />

<iframe src="https://www.facebook.com/video/embed?video_id={vb:raw code}" width="720" height="450" frameborder="0"></iframe>

</vb:if>


The above has all known/available HTML5 players, but Flash players where HTML5 is not yet available.

------------------------------------------------------

Please "Mark as Installed" if you use this. :)
Donations always appreciated. :up:
Nominate MOTM if you LOVE it! ;)

[Boofo]

Will vB be updating that template with this code?

[ibrahimkoky]

thank you tagged ;)

[BirdOPrey5]

Will vB be updating that template with this code?

http://tracker.vbulletin.com/browse/VBIV-15191

I would not hold my breath...

[Boofo]

Voted! ;)

[BirdOPrey5]

Ah now I get it Boofo.

[CharlieDelta]

Thanks BOP!!

[billstelling]

nice one! installed..

[BirdOPrey5]

Thanks. Please use the "Mark as Installed" option in the top post.

[Sunka]

Installed.

With BOP5 Mods, you have no other option than install https://vborg.vbsupport.ru/external/2012/06/15.gif

Thanks BOP5 https://vborg.vbsupport.ru/external/2012/06/16.gif

[Toorak Times]

Could I add the vBTube links as an option here as well as Vimeo??

[doctorsexy]

Great...installed..:up:

[BirdOPrey5]

Could I add the vBTube links as an option here as well as Vimeo??

No, you'd need additional code to handle such links. Look for the AME3 mod.

[BirdOPrey5]

Updated today because Facebook Flash player has stopped working, breaking Facebook video embeds on all VB 4.x forums that have not been updated to the latest version, as you can do by using this template edit.

[ibrahimkoky]

Updated
Thank you

[Toorak Times]

Thanks BOP, just did this for my 4.2, cheers

[Toorak Times]

No, you'd need additional code to handle such links. Look for the AME3 mod.


So AME will do it? I love the mod but not working on iPhones and pads is a real bummer

[BirdOPrey5]

AME will allow you to add additional video sites.

This mod will allow youtube, facebook, vimeo, daily motion to work on mobile devices/iOS.

[CuteC@t]

Installed
Thank you for being so kind !

[Toorak Times]

BOP, can you include the vBTube to this list...pleaseeee???

[BirdOPrey5]

It's not a matter of me including it- Adding other sites/types here won't let them work. The only video sites it will look for are the built in sites (YouTube, Vimeo, etc..)

There is a mod, Automatic Media Embedder 3 that will let you add additional sites.

Be sure to read the whole thread because IIRC there are several manual fixes you need to make to get it working with 4.2.x.

[final kaoss]

http://tracker.vbulletin.com/browse/VBIV-15191

I would not hold my breath...

Thanks, voted.

[cflyrun]

Excellent and quick fix, now users on ipad can view vimeo videos :)

[Toorak Times]

The following error occurred when attempting to evaluate this template:
Unclosed Tag
This is likely caused by a malformed conditional statement. It is highly recommended that you fix this error before continuing, but you may continue as-is if you wish.

Hi BOP, just tried to upload this and I got this warning. Anything to worry about mate?

[BirdOPrey5]

Yes, you shouldn't get that.

Make sure you deleted all the old content and make sure you copied all the new content. Note the code box you are copying from is more than the text you see, you need to scroll down in the code box to get all the code.

Make sure you are running VB 4.x. This only works on 4.x, not 5.x.

[Toorak Times]

Yeah works cool love the share options at the top of the player. Yeah you were right I didn't have all the code

http://www.tooraktimes.com.au/content.php/4656-Cream-of-The-Crate-Album-120-The-Delltones-The-Best-Of-The-Delltones

[hazem_aliraqi]

thank you bop

[akz645]

Anybody know how to make the youtube video's fullscreen from the website?

Edit: Thanks BOP5.

P.S= Working on vBulletin 4.2.3

[BirdOPrey5]

I've edited the code in the first post so that the YouTube code will now allow the full screen button to show.

[akz645]

I've edited the code in the first post so that the YouTube code will now allow the full screen button to show.
Thanks :)

Do you know how to add facebook videos?
Example: https://www.facebook.com/WilliamSinge/videos/10153926357545620/

I have FB platform enabled.

https://vborg.vbsupport.ru/showthread.php?t=318877
^ I used that to create a BB code & edited the same template (just the FB code part).

However, I don't want it as a BB code. I want it to work straight from the video bb code & I don't want to just paste the ID of the video, but instead the entire link.

Any idea how?

[e24h]

Thanks BOP!!

[BirdOPrey5]

Thanks :)

Do you know how to add facebook videos?
Example: https://www.facebook.com/WilliamSinge/videos/10153926357545620/

I have FB platform enabled.

https://vborg.vbsupport.ru/showthread.php?t=318877
^ I used that to create a BB code & edited the same template (just the FB code part).

However, I don't want it as a BB code. I want it to work straight from the video bb code & I don't want to just paste the ID of the video, but instead the entire link.

Any idea how?

There were some problems with the Facebook video in the latest versions of 4.x. I have instructions for fixing the bug in the bug report here- http://tracker.vbulletin.com/browse/VBIV-15670

You need to be logged into the vBulletin Community Forum first as a licensed user before you can view that link.

[akz645]

There were some problems with the Facebook video in the latest versions of 4.x. I have instructions for fixing the bug in the bug report here- http://tracker.vbulletin.com/browse/VBIV-15670

You need to be logged into the vBulletin Community Forum first as a licensed user before you can view that link.
https://www.facebook.com/video/video.php?v=1944005363878
Your example video works.

I did the XML edit to and went too Debug mode and rebuilt BB Video.

But this still doesn't work:
https://www.facebook.com/WilliamSinge/videos/10153926357545620

If I manually change to this:
https://www.facebook.com/WilliamSinge/videos/10153926357545620/
Then it works.
Note: My video URL setup is different from Lynne.

The difference between your working URL example & my video is this:
- video.php?v=
- videos/
&
- video/
- WilliamSinge/

So the coding should account for both cases of it to work (I think).

[BirdOPrey5]

I see, seems the real name in the URL is causing the issue- that's going to require separate custom code to deal with- that is beyond the scope of this template edit.

[akz645]

I see, seems the real name in the URL is causing the issue- that's going to require separate custom code to deal with- that is beyond the scope of this template edit.
Yeah, but also this:

The difference between your working URL example & my video is this:
- video.php?v=
- videos/
&
- video/
- WilliamSinge/

https://www.facebook.com/video/video.php?v=1944005363878
https://www.facebook.com/WilliamSinge/videos/10153926357545620

[Stratis]

Do we must change http to https ? where is needed ?
Example: http://www.hulu.com is now https://www.hulu.com

My forum is https

Thanks

[BirdOPrey5]

Yes you can do that.

Though I'm not sure Hulu embedding works anymore. It would be fine for YouTube and sites still working.

[Stratis]

Ok, changed... Actually Dailymotion videos did not show up in pages (white space only).
So any one else use this must change too. Do not forget must not change all to https, only if they have change to.

This is all reαdy code.
<vb:if condition="$provider == 'hulu'">
<object width="512" height="288">
<param name="movie" value="https://www.hulu.com/embed/{vb:raw code}"></param>
<param name="allowFullScreen" value="true"></param>
<embed src="https://www.hulu.com/embed/{vb:raw code}" type="application/x-shockwave-flash" width="512" height="288" allowFullScreen="true"></embed>
</object>
<vb:elseif condition="$provider == 'youtube'" />
<iframe class="restrain" title="YouTube video player" width="640" height="390" src="//www.youtube.com/embed/{vb:raw code}?wmode={vb:raw wmode}" frameborder="0" allowfullscreen></iframe>
<vb:elseif condition="$provider == 'youtube_share'" />
<iframe class="restrain" title="YouTube video player" width="640" height="390" src="//www.youtube.com/embed/{vb:raw code}?wmode={vb:raw wmode}" frameborder="0"></iframe>
<vb:elseif condition="$provider == 'vimeo'" />
<iframe src="https://player.vimeo.com/video/{vb:raw code}?portrait=0" width="640" height="360" frameborder="0" webkitAllowFullScreen mozallowfullscreen allowFullScreen></iframe>
<vb:elseif condition="$provider == 'dailymotion'" />
<iframe frameborder="0" width="640" height="390" src="https://www.dailymotion.com/embed/video/{vb:raw code}"></iframe>

<vb:elseif condition="$provider == 'metacafe'" />
<object class="restrain" type="application/x-shockwave-flash" width="640" height="380" data="http://www.metacafe.com/fplayer/{vb:raw code}.swf">
<param name="movie" value="http://www.metacafe.com/fplayer/{vb:raw code}.swf" />
<param name="wmode" value="{vb:raw wmode}" />
</object>
<vb:elseif condition="$provider == 'google'" />
<object class="restrain" type="application/x-shockwave-flash" width="400" height="326" data="https://video.google.com/googleplayer.swf?docid={vb:raw code}">
<param name="movie" value="https://video.google.com/googleplayer.swf?docid={vb:raw code}" />
<param name="wmode" value="{vb:raw wmode}" />
</object>

<vb:elseif condition="$provider == 'facebook'" />
<iframe src="https://www.facebook.com/video/embed?video_id={vb:raw code}" width="720" height="450" frameborder="0"></iframe>
</vb:if>

:)