Fix HTML5 video display in IE

This commit is contained in:
Nicolas Le Goff
2012-07-17 17:24:02 +02:00
parent f7ab0d0c74
commit a38e8b31b1
3 changed files with 39 additions and 8 deletions

View File

@@ -13,10 +13,12 @@
<video id="{{ unique_id }}" class="videoTips video-js vjs-default-skin" controls autoplay
preload="auto" width="{{ displayWidth|round }}" height="{{ displayHeight | round }}"
data-setup="{}">
{% set s_width = null %}
{% set s_height = null %}
{% for name, subdef in arraySubdefs %}
{% if loop.first %}
<input type="hidden" name="width" value="{{subdef.get_width()}}"/>
<input type="hidden" name="height" value="{{subdef.get_height()}}"/>
{% set s_width = subdef.get_width() %}
{% set s_height = subdef.get_height() %}
{% endif %}
{% if session.is_authenticated() == true %}
{% set url = subdef.get_url() %}
@@ -26,6 +28,8 @@
<source src="{{ url }}" type='{{ subdef.get_mime() }}'>
{% endfor %}
</video>
<input type="hidden" name="width" value="{{ s_width }}"/>
<input type="hidden" name="height" value="{{ s_height }}"/>
</div>
<script type="text/javascript">
@@ -38,7 +42,7 @@
var parent = $(this).parent();
player.width(parent.width());
player.height(parent.height());
});
}).trigger('resize-video-js');
$('#{{ unique_id }}').bind('unload-video-js', function(){
player.destroy();

View File

@@ -1,6 +1,7 @@
{% extends "common/index_bootstrap.html.twig" %}
{% import 'common/thumbnail.html' as thumbnail %}
{% import 'common/HTML5Video.html.twig' as thumbnailHTML5 %}
{% import 'common/caption_templates/preview.html' as caption %}
{% block javascript %}
@@ -53,9 +54,26 @@
</div>
<div class="container PNB">
{% if basket_element %}
{% set bask_prev = basket_element.getRecord().get_preview() %}
{{thumbnail.format(bask_prev,bask_prev.get_width(),bask_prev.get_height(),'',session, false)}}
{% endif %}
{% set bask_prev = basket_element.getRecord().get_preview() %}
{% if basket_element.getRecord().get_type() == 'video' %}
{% set previewHtml5 = basket_element.getRecord().getSubdfefByDeviceAndMime(constant('\\databox_subdef::DEVICE_SCREEN'), ['video/ogg', 'video/mp4', 'video/webm']) %}
{% if previewHtml5|length < 3 %}
{% set previewHtml5 = null %}
{% endif %}
{% endif %}
{% set width = bask_prev.get_width() %}
{% set height = bask_prev.get_height() %}
{% if previewHtml5 %}
{{ thumbnailHTML5.format(previewHtml5, width, height, '', session, false) }}
{% else %}
{{ thumbnail.format(bask_prev, width,height, '', session, false) }}
{% endif %}
{% endif %}
{% include 'lightbox/selector_box.twig' %}
{% include 'lightbox/sc_note.twig' %}
</div>

View File

@@ -925,8 +925,15 @@ function set_image_position(smooth, image, width, height, container, callback)
}
if(typeof callback == 'undefined')
{
callback = function(){};
}
callback = function(){
$('.videoTips.video-js', $(image).closest('.container')).trigger('resize-video-js');
};
} else {
callback = function(){
$('.videoTips.video-js', $(image).closest('.container')).trigger('resize-video-js');
callback();
};
}
dimensions.width = parseInt(width);
dimensions.height = parseInt(height);
@@ -1006,6 +1013,8 @@ function scid_click(event, el)
.empty()
.append(data.options_html);
$('.videoTips.video-js', $('.container', container)).trigger('unload-video-js');
$('.container', container).empty()
.append(data.preview+data.selector_html+data.note_html);