HjemLogg inn

HTML5Video.php: Hvordan vise HTML5 videofiler i MediaWiki

onsdag, april 11th, 2012 klokken 13:30.

En eller annen gang i år skrev jeg ett søtt lite tillegg for nettsteds-systemet MediaWiki for å vise HTML5 video. Dette bruker jeg blant annet på nettstedet Norske Dikt.

<?php
$wgExtensionFunctions[] = ‘wfHTMl5Video’;
$wgExtensionCredits['parserhook'][] = array(
‘name’ => ‘HTMl5Video’,
‘description’ => ‘HTMl5Video’,
‘author’ => ‘oyvinds’,
‘url’ => ‘http://oyvinds.livelyblog.com/’
);

function wfHTMl5Video() {
global $wgParser;
$wgParser->setHook(‘HTMl5Video’, ‘renderHTMl5Video’);
}

# The callback function for converting the input text to HTML output
function renderHTMl5Video($input, $args) {
$width = isset($args['width']) ? $args['width'] : ’480′;
$height = isset($args['height']) ? $args['height'] : ’360′;
$poster = isset($args['poster']) ? $args['poster'] : »;
$mp4 = isset($args['mp4']) ? $args['mp4'] : »;
$webm = isset($args['webm']) ? $args['webm'] : »;
$ogv = isset($args['ogv']) ? $args['ogv'] : »;
$ogg = isset($args['ogg']) ? $args['ogg'] : »;

$output = ‘<video controls=»controls» preload=»metadata» width=»‘.$width.’» height=»‘.$height.’»‘;
if ($poster) $output  .= ‘ poster=»‘.$poster.’»‘;
$output .= ‘>’;

if ($mp4) $output  .= «\n».’<source src=»‘.$mp4.’» type=»video/mp4″ />’;
if ($webm) $output .= «\n».’<source src=»‘.$webm.’» type=»video/webm» />’;
if ($ogv) $output  .= «\n».’<source src=»‘.$ogv.’» type=»video/ogg» />’;
if ($ogg) $output  .= «\n».’<source src=»‘.$ogg.’» type=»video/ogg» />’;
$output .= ‘</video>’;
return $output;
}
?>

Koden over kan hentes her: http://dikt.org/extensions/html5video.txt

Det er bare å putte dette i en fil som så lastes fra LocalSettings.php, dette her er ikke snakk om avansert rakettforskning:

require_once( «$IP/extensions/html5video.php» );

Videoer settes inn med en tom <html5video></html5video> tagg hvor første delen har alle parametre slik:

<html5video poster=»http://oyvinds.trykker.net/files/2012/04/oi_nej_jag_tappade_ballen.jpg»
mp4=»http://oyvinds.trykker.net/files/2012/04/oi_nej_jag_tappade_ballen.mp4″
ogv=»http://oyvinds.trykker.net/files/2012/04/oi_nej_jag_tappade_ballen.ogv»
width=»720″ height=»400″></html5video>

Jeg vet det er litt dirty å bruke en tom tagg slik, men det fungerer helt greit. Jeg kunne latt poster-pekeren være i midten, men det virker mer ryddig å ha alt som parametre. Hvis du mener du har en bedre løsning så må du gjerne lage den og bruke den selv. :)

En kommentar til HTML5Video.php: Hvordan vise HTML5 videofiler i MediaWiki

Kom med en kommentar

E-postadressen din blir ikke publisert. Felter merket med * må fylles ut.

Optionally add an image (JPEG only)

*
Bevis at du skrev noe gjennomtenkt ved å skrive inn bokstavene i bildet. Trykk her for annen tekst.
Anti-spam image

Du kan bruke disse HTML-kodene og -egenskapene: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>


  • OHP
    Legg merke til 100kg benk-action til venstre i videoen..
    Les hele saken...
  • Under hundre kroner literen for bensin er BILLIG
    Idag ville folk flest bli svært opprørt over en bensinpris på 25 kroner literen. Sett i historisk perspektiv vil dagens bensinpris og også bensinpriser på 25 kroner og oppover fremstå som billig og "nesten gratis".
    Les hele saken...
  • Amaryllis
    To naboer ga meg en Amaryllis til jul. Slik så den ut 3. Januar. Nå er den ferdig med å blomstre og bladene har vokst ganske så mye: Jeg synes Amaryllis er
    Les hele saken...
trykker.com | Tilfeldig Blogg | Login | Få din egen blogg | ^^^
Nylig oppdaterte blogger

lonlybia

salmebloggeren
1159
hjerleid
4879
misscasino
5026
beautyadelina

Kansel
oyvinds.trykker.com/Login