Html5AVCtrl

Summary: Enable youtube-like keyboard and mouse control of HTML5 video and audio.
Version: 20160804
Prerequisites: None
Maintainer: Ling-San Meng
License: GPL3+
Categories: Video Audio HTML5 Media
Users: (view? / edit)
Discussion: Html5AVCtrl-Talk?

All sections are optional, you can remove those that do not apply to your recipe, and add new ones.

Description

Demo available at Jsfiddle:
https://jsfiddle.net/q2jzhed1/3/

This recipe enables youtube-like keyboard and mouse control of HTML5 video and audio. Click on the control panel or the poster image to gain control over a video or audio. Click to toggle play/pause; double click to toggle fullscreen. Press space to toggle play/pause. Press left/right keys to go backward/forward 5 seconds. Press up/dn to change volume. Press number keys for a quick jump. Press f to toggle fullscreen.

For enabling HTML5 video and/or audio, please visit HTML5Extensions. This recipe is pure javascript, so it works with all the HTML5 video and audio plugins.

Installation

  • Download html5avctrl.zipΔ
  • Place the "html5avctrl" dir in your "Pmwiki/pub" directory.
  • Add to "local/config.php" the following lines:
    if ($action == 'browse' || $_REQUEST['preview'])
    {
      $HTMLHeaderFmt['html5avctrl'] =
       "<script type='text/javascript' src='$PubDirUrl/html5avctrl/html5avctrl.js'></script>";
    }

Change log / Release notes

If the recipe has multiple releases, then release notes can be placed here. Note that it's often easier for people to work with "release dates" instead of "version numbers".

  • 20160804 - first release.

Contributors

See also

Comments

See discussion at Html5AVCtrl-Talk?.

User notes? : If you use, used or reviewed this recipe, you can add your name. These statistics appear in the Cookbook listings and will help newcomers browsing through the wiki.