Your Moodle version

Activities: Videofile

Maintained by Picture of Jonas Nockert Jonas Nockert
Easy cross-browser compatibility videos using Video.js.
Moodle 2.4, 2.5, 2.6, 2.7

Videofile is a Moodle 2.4+ resource plugin intended to provide teachers with easy handling of cross-browser compatible videos using Video.js. In most cases it should be enough to add .mp4 video files which will then play in an html5 player in modern browsers and in a flash player in older browsers.

Videofile and Video.js also supports WebVTT captions as well as a poster image that displays before the video is started. It works well with responsive themes.


Screenshot #0
Screenshot #1


Picture of Jonas Nockert
Jonas Nockert (Lead maintainer)
Please login to view contributors details and/or to contact them

Comments RSS

Show comments
  • Picture of Italo Adriano Barros Correia Marcelino
    Sat, Jun 14, 2014, 2:54 PM
    How do i make a video with a URL?
  • Picture of Mathew Gancarz
    Thu, Jun 19, 2014, 11:52 PM
    Hi Jonas, thank you for the great videofile player! It's exactly what we were looking for to help make our courses responsive with video.

    I do have one enhancement request or if this is something you'd rather not implement, perhaps some advice on how to implement it ourselves.

    If the video is responsive, it ends up being huge on wide screens, and the width/height are ignored for purposes of setting the size of the window. What we would like to see or do, is if the video is responsive, then to have an option to use width/height as max-width and max-height on the videofile div, in the video-js class. This will put an upper-bound on the video on large screens and also allow it to nicely size down and be still responsive on smaller screens.

    This is the line of outputted html I think where the max-width and max-height tags would go: (had to remove the <>'s as it looks like the comment box accepts html!
    div id="videofile-2" class="video-js vjs-default-skin vjs-paused vjs-controls-enabled vjs-user-inactive" style="width: 959px; height: 539.4375px;"

    If I manually modify this line in Chrome and add max-width and max-height, it seems to work.
    It looks like this line is generated in render.php, in the get_video_element_html function on line 177. I'm just not sure how to modify the html_writer::start_tag statement to add the style="max-width:$width; max-height = $height;" statements.
  • Picture of Jonas Nockert
    Fri, Jun 20, 2014, 2:06 AM
    That sounds like a great idea, @Mathew. No guarantees but I'll try to get that out next week.
  • Picture of Mathew Gancarz
    Fri, Jun 20, 2014, 6:13 AM
    Great to hear Jonas! Meanwhile I've put in a workaround where I've tweaked the styles.css to be:
    .videofile .video-js {
    margin: 0 auto;
    max-width: 640px;
    max-height: 480px;

    One problem with my hack I've just discovered is that when I full-screen the HTML5 player, it still listens to the max-width and max-height, making it a floating 640x480 window at the top of the screen, rather than a full-screen window.

    I guess this is something to test for if you decide to implement my suggestion.
  • Picture of Jonas Nockert
    Wed, Jun 25, 2014, 10:39 PM
    Mathew Gancarz: I've now uploaded a new version. Hopefully the max size works like you wanted. Please let me know if you have any problems with it.

    Thanks for the suggestion and also many thanks for the heads up with full screen mode : )
  • Picture of Mathew Gancarz
    Fri, Jun 27, 2014, 12:13 AM
    Thank you Jonah, testing it and so far it works as expected. Thank you for implementing this so quickly, I'm glad you liked the idea!
  • Picture of Zac Cosner
    Fri, Jul 11, 2014, 2:54 AM
    Jonas, Did you ever implement disabling "download file " from right click?
  • Picture of Sergey Ab
    Mon, Aug 25, 2014, 10:19 PM
    Nice plugin, thanks!

    + for enhancing by adding options/setting for autoplay and for hiding download link.

    Is it possible to update video.js to latest release from developers site without altering plugin?

    Thank you in advance.
  • Picture of Shutiri Yarbe
    Sun, Sep 21, 2014, 5:41 PM
    Hello Jonas,

    I've been using videofile resource for months. I love it and truly need it for our website. Thank you !

    I'd like to add videofiles to the book resource, so I can have videos on the pages/chapters of each book.

    How can I do that?

    Already tried:
    - View page source, copy the videofile code and paste it on the WYSIWYG editor of the chapter.
    1. skin won't work
    2. 'Try mp4' feature pulls a HEAVY quicktime player, instead of opening the file in full page mode.

    Thank you.

  • Picture of Ahmed Ibrahim
    Sun, Jan 11, 2015, 10:31 PM
    Does this plugin work with moodle 2.8?
  • Picture of Jonas Nockert
    Sun, Jan 11, 2015, 11:43 PM
    Ahmed, I haven't actually tried it with 2.8. If you decide to test it, please let me know if it works or not.

    All best, Jonas
  • Just wondering . . .
    Tue, Feb 17, 2015, 12:05 PM
    Ahmed: any luick with 2.8??

  • On the jetty
    Mon, Mar 2, 2015, 11:55 PM
    Hi, I have installed to moodle 2.8.1 and it seems to work ok
  • Picture of Foot Tsang
    Wed, Apr 22, 2015, 5:30 PM
    Dear Jonas,

    This player works very well. Thanks a lot for your nice work!

    May I know if it is possible to include the function of switching video quality (e.g. HD & CC)? It consumes lots of data if it is viewed by phone. Thanks!

  • Picture of Matteus Barbosa
    Fri, Apr 24, 2015, 3:41 AM
    Portuguese/BR (pt_br) language strings file translated to objective words and free of errors: (my drive folder)
1 2 3 4
Please login to post comments