Moodle 2.0 resize video in html block

Moodle 2.0 resize video in html block

by Mary Cooch -
Number of replies: 20
Picture of Documentation writers Picture of Moodle HQ Picture of Particularly helpful Moodlers Picture of Testers Picture of Translators

OK - usually when I post a question I find my own answer within minutes, so here's hoping...

I like to put videos in an html block on the side. As the blocks are small I use the ?d=160x160 or whatever resize method to get them to a small size - but I can't do this with a Moodle 2.0 block and I can't see how to do this. That massive "flow player" thingie won't budge and I am a bit stuck. What am I missing?

Average of ratings: -
In reply to Mary Cooch

Re: Moodle 2.0 resize video in html block

by Miguel Guhlin -

Mary:
Howdy! I just put a YouTube video in an HTML block using the embed code from YouTube, adjusting it to dimensions of 150x150. That worked.

However, embedding the video in HTML code, as well as just adding the "?d=160x160" to the end of the video (you know, highlight spaces, then link those and add the desired size) didn't work at all.

Fortunately, the following code worked in HTML view and displayed correct size in the Moodle 2.0 HTML block:

<embed src="http://itls.saisd.net/km/uploads/videos/SLinterview.flv"
autostart="true" width="160" height="160" />

Hoping this is what you were looking for,

Miguel Guhlin

In reply to Miguel Guhlin

Re: Moodle 2.0 resize video in html block

by Mary Cooch -
Picture of Documentation writers Picture of Moodle HQ Picture of Particularly helpful Moodlers Picture of Testers Picture of Translators

Hi Miguel- well - the code worked in that it has resized my video - however, I have got a message saying FF needs to download  a plugin for this and when I clicked to download it - it tells me there is no suitable plugin? Ah well  - I am half way there smile And in IE it didn't work at all. My videos are uploaded to Moodle rather than coming from youtube btw.

In reply to Mary Cooch

Re: Moodle 2.0 resize video in html block

by Bex Ferriday -

I played with the URL / coding and ended up with the right sized block, but with no visible YouTube video inside it anymore (just an image place holder, which was exactly the right size!)  I also copied and pasted Miguel's coding into another HTML box and it did exactly the same thing....so I can get good size / no film or film at a size far too big to be of any use!

In reply to Bex Ferriday

Re: Moodle 2.0 resize video in html block

by Mary Cooch -
Picture of Documentation writers Picture of Moodle HQ Picture of Particularly helpful Moodlers Picture of Testers Picture of Translators

I am responding in the hope that some others might have a solution here, or Miguel might get back with more details of how it worked for him -because this is a really important thing for me and I don't want to add anything to the tracker in case we are missing an obvious easy fix.

In reply to Mary Cooch

Re: Moodle 2.0 resize video in html block

by Miguel Guhlin -

Hmm...

Now, am I understanding that the following solution did NOT work for you? If not, I hope you'll try the approach suggested in the link shown above (using embed code with MP4):

http://www.mguhlin.org/2010/11/embed-video-in-html-block-moodle2.html

Mary, on a Minnesota list of Moodlers, a similar problem arose. This is what I came up with and it works fine on my Chrome/Firefox browsers on ubuntuLinux.

http://www.mguhlin.org/2010/11/embedding-single-play-mp4-video-in.html

Here's what the HTML block embedded video looks like on a Moodle 2.0 install:

http://excel.saisd.net/itech/index.php
(this is a scratch Moodle 2 site and yes, I'm aware of the errors on the right side)

Both the 1.9 example and the 2.0 example are using the same MP4 video with the exact same code. I have tested it in Chrome, Firefox and Opera browsers.

Of course, reflecting on the situation you describe, have you thought about the video format itself? is it FLV or MP4/MOV ? That might have a bearing on what embed code you use.

What kind of computer OS are you using, browser, etc.?

Hoping this helps,

Miguel Guhlin

http://moodlemayhem.org

http://mguhlin.org

In reply to Miguel Guhlin

Re: Moodle 2.0 resize video in html block

by Mary Cooch -
Picture of Documentation writers Picture of Moodle HQ Picture of Particularly helpful Moodlers Picture of Testers Picture of Translators

I can't speak for our friend here but for me, the first solution didn't work - just resized the frame but didn't display the video. I always use (and advise to use FLV) because I think it is the most accessible of video formats. I  know a fair number of our staff like wmv but they don't always play depending on your browser (I recall on older version of FF I couldn't get wmv to play) I am using FF the latest version and am on a Windows 7 laptop -I am going to try again and try your mp4 solution - if I can find a handy mp4. I hope this gets resolved smile

In reply to Mary Cooch

Re: Moodle 2.0 resize video in html block

by Miguel Guhlin -

Try the code with flv instead...for fun, that's what I did here:

http://excel.saisd.net/itech

top left corner...replaced the MP4 video in the previous example with FLV.

 

<br /> <object height="136" width="160" codebase="http://www.apple.com/qtactivex/qtplugin.cab" classid="clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B"> <param value="http://itls.saisd.net/km/uploads/videos/kidpubintro.flv" name="src" /> <param value="false" name="autoplay" /> <embed height="136" width="160" autoplay="false" pluginspage="http://www.apple.com/quicktime/download" type="image/x-macpaint" src="http://itls.saisd.net/km/uploads/videos/kidpubintro.flv" /></object>

In reply to Miguel Guhlin

Re: Moodle 2.0 resize video in html block

by Mary Cooch -
Picture of Documentation writers Picture of Moodle HQ Picture of Particularly helpful Moodlers Picture of Testers Picture of Translators

Hi Miguel - I am finally about to try out this code to resize an flv video I have put in an html block- but your code is an image so I can't copy it and alter it - could you upload a txt file of it please? Also - I am confused - I am not a coder at all but in yours there is a link to apple/QT - I am only wanting to display and resize an flv file so surely I don't need all of that code?

There MUST be a simpler way to do this -what am I missing? sad

In reply to Mary Cooch

Re: Moodle 2.0 resize video in html block

by Miguel Guhlin -

Mary,

Forget anything I wrote earlier. Those solutions worked on my UbuntuLinux machine but not on my Mac...sigh. On my Mac, they just appeared as big windows with a blue Quicktime "Q" in them. As I struggled through the desert of despair, only one thing kept me going...I couldn't bear to leave you without a solution (especially you). At the very moment I was about to give up, a vision appeared, providing guidance.

;->

wink

Thankfully, it works and you can see it in place http://excel.saisd.net/itech as of Friday, 12/3/2010.

How to Embed FLV Video in Moodle 2.0 HTML Block

  1. Download JWPLAYER, a free Flash video player and put it on your server in a directory somewhere that's easy to link to.
  2. Use this embed code (copy-n-paste the code into HTML block while in HTML view) replacing the the 2 links. The first link goes to the location of JWPlayer's "player.swf" file and the second link to your video
  3. Try it out!

If you like, you can just change the blue code to try it out (smile).

The source for this eureka moment--because i never would have figured it out--is this forum post.

Wishing you well,

Miguel Guhlin

http://moodlemayhem.org

In reply to Miguel Guhlin

Re: Moodle 2.0 resize video in html block

by Mary Cooch -
Picture of Documentation writers Picture of Moodle HQ Picture of Particularly helpful Moodlers Picture of Testers Picture of Translators

Miguel how sweet!smile I will have a go at that -  however; it's kind of cheating really because what about those people who don't have access to their server to be able to add extra players? We need an in-house solution. I am wondering if this has been reported in the tracker  already?

In reply to Mary Cooch

Re: Moodle 2.0 resize video in html block

by Miguel Guhlin -

I don't know about reporting it to the tracker, but why couldn't Moodle bundle the JWPlayer in somewhere? I wonder what it costs?

In reply to Miguel Guhlin

Re: JW Player in Moodle (was Resize Video in 2.0)

by Mary Cooch -
Picture of Documentation writers Picture of Moodle HQ Picture of Particularly helpful Moodlers Picture of Testers Picture of Translators

I think the discussion has been had already somewhere on this moodle - the player that is built into moodle 1.9 IS a version of the jW player I think but they can't include the latest player because it's commercial  or some such reason... http://docs.moodle.org/en/FLV_Player#Deprecated ....changing the title so someone who remembers the discussion can explain

In reply to Miguel Guhlin

Re: Moodle 2.0 resize video in html block

by Clarence Prudhoe -

Miguel, take a look at this open source player as an alternative to the JW Player.  It's FREE! and works well.

http://www.video-flash.de/flv-flash-fullscreen-video-player/

Clarence

In reply to Clarence Prudhoe

Re: Moodle 2.0 resize video in html block

by Miguel Guhlin -

Clarence, thanks so much for sharing this! It's free open source!! Much better alternative to JWPlayer.

So, Mary, why couldn't Moodle use this alternative player?

Off to try it out,

Miguel Guhlin

In reply to Clarence Prudhoe

Re: Moodle 2.0 resize video in html block

by Miguel Guhlin -

Clarence, maybe I'm missing something but even though I try to constrain the size to width/height of 160 with the FLV Flash FullScreen Video Player, it's not taking, like the JWPlayer does.

You can compare the 3 here:

http://excel.saisd.net/itech in the top left corner

Hmm...ideas/suggestions?

In reply to Miguel Guhlin

Re: Moodle 2.0 resize video in html block

by Clarence Prudhoe -

Hi Miguel,

Sorry, I haven't tried to do that yet.  I just found the site and am planing to test it later.

Maybe it would work better if you use the html Object  Tag instead of iFrame.

Did you try the HTML Generator at http://www.video-flash.de/flv-flash-fullscreen-video-player/html-generator/

That might work better.

Let us know if this works.

Clarence

In reply to Clarence Prudhoe

Re: Moodle 2.0 resize video in html block

by Miguel Guhlin -

Yes, I tried the HTML generator AND the iFrame, and modified my own code. You can see all the attempts here - http://excel.saisd.net/itech

Only JWPlayer is working the right way.

Sigh. I'll keep my fingers crossed and hope the Trackers resolve the issue.

With appreciation,

Miguel Guhlin

http://mguhlin.net

In reply to Mary Cooch

Re: Moodle 2.0 resize video in html block

by William Ratto -

Hi Mary,

I hope this helps, my site is primarily instructional videos, this is what I did to solve my problem. I am using my own JW Player from http://www.longtail.com. You want media player 5.3 version.

1. I unzipped the jwplayer file into a local directory on my local machine, then uploaded the following 3 files to my web root into a directory I made (jwplayer) on my server's root directory. Also any video files I also uoloaded to this directory to make my life eaiser.
[Web Root]/jwplayer/player.swf
[Web Root]/jwplayer/jwplayer.js
[Web Root]/jwplayer/yt.swf

2. I tried many different codes but this one worked for me on all  browsers.

<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" id="single1" name="single1" height="180" width="180">
<param name="movie" value="http://www.yourdomainname/playerdirectory/player.swf" />
<param name="allowfullscreen" value="true" />
<param name="allowscriptaccess" value="always" />
<param name="wmode" value="transparent" />
<param name="flashvars" value="duration=20&amp;file=http://www.yourdomainname/playerdirectory/yourflvfile.flv&amp;image=&amp;screencolor=#890208&amp;bufferlength=10" /> <embed type="application/x-shockwave-flash" id="single2" name="single2" src="http://www.yourdomainname/playerdirectory/player.swf" bgcolor="undefined" allowscriptaccess="always" allowfullscreen="true" wmode="transparent" flashvars="duration=20&amp;file=http://www.cimbc.com/jwplayer/webtest.flv&amp;image=http://www.www.yourdomainname.com/videofiledirectory/image.jpg&amp;screencolor=#890208&amp;bufferlength=10" height="180" width="180"></embed>
</object>
This also works great in any side block the above deminsions work perfect for blocks.

On a personal note I wish there was a way to resize the default jwplayer screen in Moodle 2.0, I feel this is a very big problem. in the php setting file it's set to 600x800 and when I change that it stille defaults to 600x800 screen size.

Hope this helps.

Sincerely

William

In reply to William Ratto

Re: Moodle 2.0 resize video in html block

by Rossiani Wijaya -

The latest patch for this issue is available at MDL-23870.

With the new patch, you will be able to resize the flash player by adding the following at the end of the link "?d=320x240" (width and height).

Please take a look the patch and feel free to leave any comment.

Thanks

Rosie

Average of ratings: Useful (1)