Skip to content

Instantly share code, notes, and snippets.

@jancbeck
Last active August 29, 2015 14:08
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 1 You must be signed in to fork a gist
  • Save jancbeck/a87c34e4df5b8764efb9 to your computer and use it in GitHub Desktop.
Save jancbeck/a87c34e4df5b8764efb9 to your computer and use it in GitHub Desktop.
HTML5 video snippet and tag for Kirby CMS http://getkirby.com/forum/code-snippets/20141029/html5-video-tag
<?php
/**
* Move this file to /site/snippets/ and rename it video.php
*/
// stop without videos
if(empty($videos)) return;
// set some defaults
if(!isset($width)) $width = 400;
if(!isset($height)) $height = 300;
if(!isset($preload)) $preload = true;
if(!isset($controls)) $controls = true;
// build the html atts for the video element
$preload = ($preload) ? ' preload="preload"' : '';
$controls = ($controls) ? ' controls="controls"' : '';
$poster_attr = ($poster) ? ' poster="'. $poster->url() .'"' : '';
?>
<video width="<?php echo $width ?>" height="<?php echo $height ?>" class="<?php echo $class ?>" <?php echo $preload . $controls . $poster_attr ?>>
<?php foreach($videos as $video): ?>
<?php if(method_exists($url,'url')): ?>
<source src="<?php echo $video->url() ?>" type="<?php echo $video->mime() ?>" />
<?php else : ?>
<source src="<?php echo $url ?>" />
<?php endif ?>
<?php endforeach ?>
<a href="<?php echo $url ?>">
<?php if($poster): ?>
<img src="<?php echo $poster->url() ?>" alt="<?php echo $title ?>" />
<?php else: ?>
<?php echo $title ?>
<?php endif ?>
</a>
</video>
<?php
/**
* Move this file to /site/tags/ and rename it video.php
*/
// video tag
kirbytext::$tags['video'] = array(
'attr' => array(
'width',
'height',
'poster',
'text',
'title',
'class',
'vidclass',
'caption',
'preload',
'controls',
'webm',
'ogv',
'mp4'
),
'html' => function($tag) {
$url = $tag->attr('video');
$alt = $tag->attr('alt');
$title = $tag->attr('title');
$link = $tag->attr('link');
$caption = $tag->attr('caption');
$file = $tag->file($url);
// use the file url if available and otherwise the given url
$url = $file ? $file->url() : url($url);
// alt is just an alternative for text
if($text = $tag->attr('text')) $alt = $text;
// try to get the title from the image object and use it as alt text
if($file) {
if(empty($alt) and $file->alt() != '') {
$alt = $file->alt();
}
if(empty($title) and $file->title() != '') {
$title = $file->title();
}
}
if(empty($alt)) $alt = pathinfo($url, PATHINFO_FILENAME);
$args = array(
'videos' => array( $url ),
'width' => $tag->attr('width'),
'height' => $tag->attr('height'),
'class' => $tag->attr('vidclass'),
'poster' => $tag->attr('poster'),
'preload' => $tag->attr('preload'),
'controls' => $tag->attr('controls'),
'title' => html($title),
'url' => html($url),
'alt' => html($alt));
if ( $poster = $tag->page()->images()->find($tag->attr('poster'))) {
$args['poster'] = $poster;
}
if ( $webm = $tag->page()->videos()->find($tag->attr('webm'))) {
$args['videos'][] = $webm;
}
if ( $mp4 = $tag->page()->videos()->find($tag->attr('mp4'))) {
$args['videos'][] = $mp4;
}
if ( $ogv = $tag->page()->videos()->find($tag->attr('ogv'))) {
$args['videos'][] = $ogv;
}
$video = snippet('video', $args, true);
$figure = new Brick('figure');
$figure->addClass($tag->attr('class'));
$figure->append($video);
if(!empty($caption)) {
$figure->append('<figcaption>' . html($caption) . '</figcaption>');
}
return $figure;
}
);
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment