Difference between revisions of "Widget:Html5video"
From Computational Memory Lab
(Created page with "<includeonly> <video controls autobuffer width="<!--{$width|validate:int|escape:'html'}-->" height="<!--{$height|validate:int|escape:'html'}-->"> <source src="<!--{$src}-->.m4...") |
|||
(8 intermediate revisions by the same user not shown) | |||
Line 1: | Line 1: | ||
+ | <noinclude> | ||
+ | ==Usage== | ||
+ | <nowiki>{{#widget:Html5video | ||
+ | |src=../files/mediawiki_videos/Supplemental_Movie_S2 | ||
+ | |width=960 | ||
+ | |height=264 | ||
+ | }}</nowiki> | ||
+ | |||
+ | * <tt>'''src=[SOURCE]'''</tt> Specify path to source video(s), relative to mediawiki root (or full URL). Leave off extension. | ||
+ | ** Best practice is to have <tt>mp4/m4v</tt>, <tt>webm</tt>, and <tt>ogg/ogv</tt> copies. | ||
+ | ** You can <tt>scp</tt> your videos to <tt>/var/www/html/files/mediawiki_videos/</tt> on <tt>memory.psych.upenn.edu</tt> and use a similar path to the example (changing the filename, of course). | ||
+ | * <tt>'''width=[WIDTH]'''</tt> Specify video width in pixels | ||
+ | * <tt>'''height=[HEIGHT]'''</tt> Specify video height in pixels | ||
+ | |||
+ | [http://diveintohtml5.com/video.html Mark Pilgrim's "Dive into HTML5"] was invaluable in wrapping my head around HTML5 video and writing this widget. | ||
+ | </noinclude> | ||
+ | |||
+ | |||
<includeonly> | <includeonly> | ||
<video controls autobuffer width="<!--{$width|validate:int|escape:'html'}-->" height="<!--{$height|validate:int|escape:'html'}-->"> | <video controls autobuffer width="<!--{$width|validate:int|escape:'html'}-->" height="<!--{$height|validate:int|escape:'html'}-->"> |
Latest revision as of 19:59, 22 January 2013
Usage
{{#widget:Html5video |src=../files/mediawiki_videos/Supplemental_Movie_S2 |width=960 |height=264 }}
- src=[SOURCE] Specify path to source video(s), relative to mediawiki root (or full URL). Leave off extension.
- Best practice is to have mp4/m4v, webm, and ogg/ogv copies.
- You can scp your videos to /var/www/html/files/mediawiki_videos/ on memory.psych.upenn.edu and use a similar path to the example (changing the filename, of course).
- width=[WIDTH] Specify video width in pixels
- height=[HEIGHT] Specify video height in pixels
Mark Pilgrim's "Dive into HTML5" was invaluable in wrapping my head around HTML5 video and writing this widget.