<xen:require css="sedo_bbcode_multimedia.css" />
<xen:require js="js/sedo/html5media/html5media.min.js" />
<div class="sedo_bb_media {$options.css}"
{xen:if '!{$options.responsiveMode}', 'style="width:{$options.width}px"'}>
<xen:if is="{$options.isValid}">
<xen:if is="{$options.mediaType} == 'audio'">
<xen:if is="{$options.fallback}">
<audio controls preload>
<source src="{xen:raw $content}"></source>
<source src="{xen:raw $options.fallback}"></source>
</audio>
<xen:else />
<audio src="{xen:raw $content}" controls preload></audio>
</xen:if>
<xen:else />
<xen:if is="{$options.fallback}">
<video class="{xen:if '{$options.displayNoViewPerms}', 'noperms'}"
{xen:if '!{$options.responsiveMode}', 'width="{$options.width}" height="{$options.height}"'}
{xen:if '{$options.poster}', 'poster="{$options.poster}"'}
controls preload>
<source src="{xen:raw $content}"></source>
<source src="{xen:raw $options.fallback}"></source>
</video>
<xen:else />
<video src="{xen:raw $content}" width="{$options.width}" height="{$options.height}" {xen:if '{$options.poster}', 'poster="{$options.poster}"'} controls preload></video>
</xen:if>
</xen:if>
<xen:if is="{$options.caption} OR {$options.displayNoViewPerms}">
<p class="caption {$options.cssCaption}">{xen:if '{$options.displayNoViewPerms}', '{xen:phrase sedo_html5media_no_perms}', '{$options.caption}'}</p>
</xen:if>
<xen:else />
<p class="invalid">{xen:phrase sedo_html5media_file_not_valid}</p>
</xen:if>
</div>