Keyword

I'm running Allvideo in flash with HTML5 fallback

  • Craig Pearson
  • Craig Pearson's Avatar Topic Author
  • Offline
  • Junior Member
More
13 years 9 months ago #91775 by Craig Pearson
I have this running, so uploaded Mp4s will run using the flash player and if not available using HTML5. This means of course your videos will run on iPad and iPhones as well as other browsers (runs in IE 6, 7, 8, Safari, firefox) - I can post how to do it if anyone is interested.

Please Log in or Create an account to join the conversation.

  • Craig Pearson
  • Craig Pearson's Avatar Topic Author
  • Offline
  • Junior Member
More
13 years 8 months ago #91776 by Craig Pearson
Replied by Craig Pearson on topic I'm running Allvideo in flash with HTML5 fallback
Sure will post once I get a chance - little busy at the moment.

Rich said:
Craig,

 

I'd love to hear how you did it, and if you have it working with the standard K2 video field.

 

Cheers,

 

Rich

Please Log in or Create an account to join the conversation.

  • Craig Pearson
  • Craig Pearson's Avatar Topic Author
  • Offline
  • Junior Member
More
13 years 8 months ago #91777 by Craig Pearson
Replied by Craig Pearson on topic I'm running Allvideo in flash with HTML5 fallback
1st get your K2 running as you normally would with the normal Allvideos plug in working.
Next download the current version of the JWplayer (5.4) at www.longtailvideo.com/
(note: make backups of anything your replace below)
Go to your allvideos plug in  area located here:
yoursite/plugins/content/jw_allvideos/includes/players/mediaplayer/
and replace the player.swf with the new one
Add the yt.swf to the same directory
Add the Jwplayer.js and swfobjct.js to wherever you want (I did in root) and call these scripts from your template (as you would any script)
Okay files are in place
Now go to the sources.php file under yoursite/plugins/content/jw_allvideos/includes (make a copy)
and make these alterations:
You will note the player used is based on the extension you upload - so if you upload an FLV file it will use the "flv" section of the code. If you search for "mp4" you will see its using quicktime to run the movie.
Change the MP4 code from what it currently is to the following: (between the *****)
*****
"mp4" => "
<div id=\"container\">Loading the player ...</div>
<script type=\"text/javascript\">
jwplayer(\"container\").setup({
autostart: {AUTOPLAY},
height: {HEIGHT},
width: {WIDTH},
file: \"{SITEURL}/{FOLDER}/{SOURCE}.mp4\", 
image: \"{SITEURL}/images/video.png\",
players: [
{ type: \"flash\", src: \"{SITEURL}/plugins/content/jw_allvideos/includes/players/mediaplayer/player.swf\" },
{ type: \"html5\" }
]
});
</script>
",
*******
Note: I have a default video image I use for videos set in the code {SITEURL}/images/video.png - so that there is not just a black screen - otherwise make sure you have an image in your first frame of your video and then you can take the code out.
That should do it.

Please Log in or Create an account to join the conversation.

More
13 years 3 months ago #91778 by ccvid
Does this work for your AllVideos?  It doesn't for mine, but I have an older version.  I've updated the code in the old version so much that I'm shy of an upgrade. 

Any suggestions on how I could change my code to have the html5 fallback?  (My mp4 player uses the jwplayer and not quicktime.)


"mp4" => "<object type=\"application/x-shockwave-flash\" style=\"width:{VWIDTH}px;height:{VHEIGHT}px;\" data=\"$mosConfig_live_site/plugins/content/jw_allvideos/players/mediaplayer_4.0.46.swf\">    <param name=\"movie\" value=\"$mosConfig_live_site/plugins/content/jw_allvideos/players/mediaplayer_4.0.46.swf\" />    <param name=\"quality\" value=\"high\" />    <param name=\"wmode\" value=\"{TRANSPARENCY}\" />    <param name=\"bgcolor\" value=\"{BACKGROUND}\" />    <param name=\"autoplay\" value=\"{AUTOPLAY}\" />    <param name=\"allowfullscreen\" value=\"true\" />    <param name=\"allowscriptaccess\" value=\"always\" />    <param name=\"flashvars\" value=\"file=$mosConfig_live_site/{VFOLDER}/{AVSOURCE}.mp4&image=$mosConfig_live_site/{VFOLDER}/VideoLoading.jpg&autostart={AUTOPLAY},{CONTROLBAR}&fullscreen=true\" /></object>",

 

I tried the following version of your code, but this didn't work either:

 

"mp4" => "<div id=\"container\">Loading the player ...</div><script type=\"text/javascript\">jwplayer(\"container\").setup({autostart: {AUTOPLAY},height: {VHEIGHT},width: {VWIDTH},file: \"$mosConfig_live_site/{VFOLDER}/{AVSOURCE}.mp4\", image: \"$mosConfig_live_site/video/VideoLoading.jpg\",players: [{ type: \"flash\", src: \"$mosConfig_live_site/plugins/content/jw_allvideos/players/mediaplayer_5.6.swf\" },{ type: \"html5\" }]});</script>",

 

 

You'll notice that there are two different versions of the jwplayer (5.6 & 4.0.46).  That's because I prefer 4..0.46, but if 5.6 is needed to play html5, I'll use it.

 

Thanks very much!!!

Ben

Please Log in or Create an account to join the conversation.

  • Craig Pearson
  • Craig Pearson's Avatar Topic Author
  • Offline
  • Junior Member
More
13 years 3 months ago #91779 by Craig Pearson
Replied by Craig Pearson on topic I'm running Allvideo in flash with HTML5 fallback
If I'm correct in what I'm seeing here your using mediaplayer_4.0.46.swf. You need the latest version (at least 5.5) that has the html 4 capability. Just download the new one and place that one in "players" and change the name to it.

 

Remember you can always keep your current code just copy it elsewhere and name it "Xmp4" => " and use mp4 for the code you want to use live.

 

Here is my updated code for the source file including google plugin using Jw5.6 player

(note: I do have some custom calls to the admin for thumbnail - you can use standard code for that - for {GOOG} I have an admin variable set for that, you can just replace it in the code with your ID number for google - replace the whole {GOOG} reference )

 

"mp4" => "<div id=\"container\">Loading the player ...</div>

 <script type=\"text/javascript\">

jwplayer(\"container\").setup({

autostart: {AUTOPLAY},

height: {HEIGHT},

width: {WIDTH},

file: \"{SITEURL}/{FOLDER}/{SOURCE}.mp4\", 

image: \"{SITEURL}/{THUMBS}.jpg\",

plugins: {

gapro: {

accountid: \"{GOOG}\" ,

trackstarts: \"true\",

trackpercentage: \"true\",

tracktime: \"true\",

bridgeobject: \"window._gaq\"         },    

sharing: {     

code: true,    

link: true     } },

players: [ { type: \"flash\", src: \"{SITEURL}/plugins/content/jw_allvideos/includes/players/mediaplayer/player.swf\" },

{ type: \"html5\" } ] });

 </script> ",

Please Log in or Create an account to join the conversation.

More
13 years 3 months ago #91780 by ccvid
Thank you so much for the quick reply.  I still can't get it to work.  I even upgraded to AllVideos 3.3 and Overwrote the player.swf with the 5.6 version of jwplayer.  I know something is working because "Loading the player" loads.  But there's nothing else.

 

The only thing that I can guess is that the file "yt.swf" you mention is nowhere to be found in the 5.6 download. 

 

Here's my script

<div id=\"container\">Loading the player ...</div><script type=\"text/javascript\">jwplayer(\"container\").setup({autostart: {AUTOPLAY},height: {HEIGHT},width: {WIDTH},file: \"{SITEURL}/{FOLDER}/{SOURCE}.mp4\", image: \"{SITEURL}/images/video.png\",players: [{ type: \"flash\", src: \"{SITEURL}/plugins/content/jw_allvideos/includes/players/mediaplayer/player.swf\" },{ type: \"html5\" }]});</script>",

Please Log in or Create an account to join the conversation.

  • Craig Pearson
  • Craig Pearson's Avatar Topic Author
  • Offline
  • Junior Member
More
13 years 3 months ago #91781 by Craig Pearson
Replied by Craig Pearson on topic I'm running Allvideo in flash with HTML5 fallback
Yt (youtube) is no longer needed in 5.6.

The player is not loading for some reason. Loading the player ... will show in most situations as its just a div with text. 

Questions:

Does it work at all just using the base install of AllVideos 3.3?

Does it work using an FLV?

What browser are you testing it in?

IMPORTANT - was the mp4 made to proper mp4 itunes spec? - I use handbrake to convert, starting with their universal Apple settings that outputs an m4v then change the m4v to mp4 in the filename. If you don't create the proper file you may have issues. I have seen it work on an iPad but not on iPhone when I made it wrong.

 

Please Log in or Create an account to join the conversation.

More
13 years 3 months ago #91782 by ccvid
Yt (youtube) is no longer needed in 5.6.


--cool, I didn't understand that one.

 

The player is not loading for some reason. Loading the player ... will show in most situations as its just a div with text.  Does it work at all just using the base install of AllVideos 3.3?


Yes

 

Does it work using an FLV?


Yes

 

What browser are you testing it in?


Firefox 3.6.17 & Safari 4.1.3

 

IMPORTANT - was the mp4 made to proper mp4 itunes spec? - I use handbrake to convert, starting with their universal Apple settings that outputs an m4v then change the m4v to mp4 in the filename. If you don't create the proper file you may have issues. I have seen it work on an iPad but not on iPhone when I made it wrong.


I created this mp4 with Apple's MPEG Streamclip.  I exported it to MPEG-4 as an iTunes iPod 640x480 video using H.264 compression.  This setting works with jwplayer using the quicktime plugin and using the jwplayer itself.  Here's a link to the video...it's currently set to be played by the jwplayer. 

 

Here's a link to the video alone.

 

Thanks again for the help!

Ben

Please Log in or Create an account to join the conversation.

  • Craig Pearson
  • Craig Pearson's Avatar Topic Author
  • Offline
  • Junior Member
More
13 years 3 months ago #91783 by Craig Pearson
Replied by Craig Pearson on topic I'm running Allvideo in flash with HTML5 fallback
Well I'm a little stumped. Your code is fine and I downloaded the video and ran it in mine fine (though note, the mp4 is playing in the flash player not html5 - I can't check that locally but you should still see it running fine on your normal browsers). I even took your code and replaced in my source file and it ran fine.

So Code is correct, video is correct.

Only other thing I can think of that has caused issues is on the server end. Did you check permissions on the video that was uploaded? That as been an issue at times for me.

As an experiment you can upload a small mp4 (use the demo one that comes with the allvideos download) via K2 - see if that works - if it does replace the video at the server end with the larger one - just remember to use the Item (article) ID number for the file name.

These should be located in siteroot/media/k2/videos/ I usually have to open up permissions on this K2 folder area to get things to work properly. Other than that, not much else I can tell ya.

Please Log in or Create an account to join the conversation.


Powered by Kunena Forum