I created the HM Tube Joomla plugin to play YouTube videos using the JW player, and its customizations and skins. The plugin has evolved, however, to play all the formats that the JW player can play. Available formats are listed below in the Feature section. There are plenty of modules in the JED that use JW player but not many, if any, plugins that allow you to place the video anywhere in your articles. Therefore, because I needed such a plugin, I have created HM Tube, and decided to share it with the Joomla community.
Features:
- Add Tube video to your article.
- Can play all of the following formats:
Video Formats: H.264 (.mp4, .mov, .f4v), FLV (.flv), 3GPP (.3gp, .3g2), YouTube
Sound Formats: AAC (.aac, .m4a), MP3 (.mp3)
Image Formats: JPEG (.jpg), PNG (.png), GIF (.gif)
- Use the JW player and it's many version 2 skins.
- Stream live video with JW player's RTMP support.
- Customize the width and height of the player.
- Position the control bar to top, bottom, or over the video.
- Hide the control bar when idle.
- You can choose to auto start the video on page load or not.
- Choose to enable HD video if applicable.
- Ability to choose which type of stretching, if any, is applied to the video to fit your player.
Installation:
- Download from http://www.hypermodern.org/index.php/hm-tube
- Install like any other Joomla plugin. Refer too http://docs.joomla.org/Installing_an_extension if you need help.
Usage:
Using the HM Tube plugin is simple. Simply find the YouTube video you want to use and enclose it inside the following tags:
[hmyt]your YouTube video here[/hmyt]
For now, the plugin supports only You Tube urls in formats similar to:
http://www.youtube.com/watch?v=sxku0EpqzKI
To play one of the other many video formats JW Player supports like .flv, or .mp4, just use the url to the video of your choice.
An example with the tags would look like:
[hmyt ]http://www.youtube.com/watch?v=sxku0EpqzKI[/hmyt]
Or for other video formats:
[hmyt ]http://content.longtailvideo.com/videos/flvplayer.flv[/hmyt]
Which the plugin would turn into a video that looks like this:
The above video received its parameters like width, height, skin type and ect from pre-selected defaults chosen in the admin section. As of version 0.9.2, the admin section looks like this:
The option are fairly straight forward. Below is a description of what each opton does.
- Width and Height: Player width and height of course are the width and height of the player.
- Control Location: The location that you want the control bar (the bar that has the play button on it).
- Play in HD?: If you want to play the video in HD, select yes, and your video, if it supports HD, will be played in HD.
- Controlbar Autohide: only works when Control Location is set to "over". When these conditions are met, the control bar (the one with the play button on it), will hide when there is no mouse activity. When you mouse over the video again, the control bar will appear.
- Auto start Media?: If you want the video to start when the page loads, select Yes, otherwise select No.
- Stretching: These are different types of stretching methods JW can use to fit the YouTube video into your chosen width and height. Uniform is selected by default as this will scale the video to your player without distorting it proportionally.
- hmYouTube Skin: These are a collection of skins you can use for your JW Player to change its looks.
Overriding the Defaults
Each of the above admin settings can be overriden through tag parameters. This allows different videos to have different properties than the defaults. For example, suppose you wanted a smaller video on one article than the rest... you can do this with the following tags:
[hmyt width = "500" height="300"]http://www.youtube.com/watch?v=7g4tEef9wEY[/hmyt]
Which would produce a video that looks like this:
The tag parameters are as follows:
tagparam = "tagparamvalue"
In the above video the tags were:
- width = "500"
- height= "300"
There other possible overrides are:
- skin = "nameofskin"
- hd = "true or false"
- controlbar="over, bottom, or top"
- controlbarhide="true or false"
- autostart="true or false"
- stretching="uniform, fill, exactfit, or none"
In the above tags you wouldnt put hd="true or false". You would select either true or false like: hd="false". Likewaise you wouldn't put controlbar="over,bottom, or top". Instead you would choose one and make controlbar="over".
Below are more example of tag usage followed by the video it creates:
[hmyt width = "668" height="375" hd="true" controlbar="top" autostart="true" stretching = "uniform" skin="nemesis" controlbarhide="false"]http://www.youtube.com/watch?v=qrO4YZeyl0I[/hmyt]
[hmyt width = "668" height="375" hd="true" controlbar="over" autostart="false" stretching = "uniform" skin="bekle" controlbarhide="false"]http://www.youtube.com/watch?v=fug3VhEY13g[/hmyt]
Example support for .flv video:
Privacy enhanced YouTube URLs such as http://www.youtube-nocookie.com/embed/sxku0EpqzKI will NOT work with HM Tube. These URLs will result in the following error example:
Playing a local video still requires the full url. For example:
[hmyt ]http://www.hypermodern.org/video/tmsip.mp4[/hmyt]
