prenex/magcms
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

fix fullscreen video on click

Browse Source
This commit is contained in:
Adrien Beudin 2017-06-04 21:54:04 +02:00
parent c4ddefd45a
commit 95358281ef
6 changed files with 24 additions and 28 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
prosopopee/themes/exposure/templates/gallery-index.html
View File

@ -79,18 +79,16 @@ $('audio').mediaelementplayer({
}); });
{% endif %} {% endif %}
var video = $("video"); function goFullscreen(id) {
video.on('click', function(e){ var element = document.getElementById(id);
var vid = video[0]; if (element.requestFullscreen) {
vid.play(); element.requestFullscreen();
if (vid.requestFullscreen) { } else if (element.mozRequestFullScreen) {
vid.requestFullscreen(); element.mozRequestFullScreen();
} else if (vid.mozRequestFullScreen) { } else if (element.webkitRequestFullScreen) {
vid.mozRequestFullScreen(); element.webkitRequestFullScreen();
} else if (vid.webkitRequestFullscreen) { }
vid.webkitRequestFullscreen(); }
}
});
$(function() { $(function() {
$("img.lazy").lazyload({ $("img.lazy").lazyload({

2
prosopopee/themes/exposure/templates/sections/bordered-picture.html
View File

@ -9,7 +9,7 @@
<section class="bordered-picture baguette" style="position: relative;"> <section class="bordered-picture baguette" style="position: relative;">
<div class="caption"> <div class="caption">
<img class="lazy" data-original="{{ video.generate_thumbnail("2000") }}" src="" alt=""> <img class="lazy" data-original="{{ video.generate_thumbnail("2000") }}" src="" alt="">
<video class="lazy responsive-video" id="video" poster="{{ video.generate_thumbnail("2000") }}" alt="" autoplay="autoplay" loop="loop" preload="none" muted> <video class="lazy responsive-video" id="{{ video }}" onclick="goFullscreen('{{ video }}');" poster="{{ video.generate_thumbnail("2000") }}" alt="" autoplay="autoplay" loop="loop" preload="none" muted>
<source src="{{ video }}.{{ format }}" type="video/{{ format }}"> <source src="{{ video }}.{{ format }}" type="video/{{ format }}">
</video> </video>
{% if caption %} {% if caption %}

2
prosopopee/themes/exposure/templates/sections/pictures-group.html
View File

@ -12,7 +12,7 @@
{% set format = settings.ffmpeg.extension %} {% set format = settings.ffmpeg.extension %}
{{ video.copy() }} {{ video.copy() }}
<img class="lazy" data-original="{{ video.generate_thumbnail("600") }}" src="" alt=""> <img class="lazy" data-original="{{ video.generate_thumbnail("600") }}" src="" alt="">
<video class="lazy responsive-video" id="video" poster="{{ video.generate_thumbnail("600") }}" alt="" autoplay="autoplay" loop="loop" preload="auto" muted> <video class="lazy responsive-video" id="{{ video }}" onclick="goFullscreen('{{ video }}');" poster="{{ video.generate_thumbnail("600") }}" alt="" autoplay="autoplay" loop="loop" preload="auto" muted>
<source src="{{ video }}.{{ format }}" type="video/{{ format }}"> <source src="{{ video }}.{{ format }}" type="video/{{ format }}">
</video> </video>
{% if caption %} {% if caption %}

22
prosopopee/themes/material/templates/gallery-index.html
View File

@ -62,18 +62,16 @@ $(document).ready(function(){
$('.parallax').parallax(); $('.parallax').parallax();
}); });
var video = $("video.lazy"); function goFullscreen(id) {
video.on('click', function(e){ var element = document.getElementById(id);
var vid = video[0]; if (element.requestFullscreen) {
vid.play(); element.requestFullscreen();
if (vid.requestFullscreen) { } else if (element.mozRequestFullScreen) {
vid.requestFullscreen(); element.mozRequestFullScreen();
} else if (vid.mozRequestFullScreen) { } else if (element.webkitRequestFullScreen) {
vid.mozRequestFullScreen(); element.webkitRequestFullScreen();
} else if (vid.webkitRequestFullscreen) { }
vid.webkitRequestFullscreen(); }
}
});
{% if gallery.audio_enabled %} {% if gallery.audio_enabled %}
$('audio').mediaelementplayer({ $('audio').mediaelementplayer({

2
prosopopee/themes/material/templates/sections/bordered-picture.html
View File

@ -12,7 +12,7 @@
<div class="bordered-picture baguette caption"> <div class="bordered-picture baguette caption">
{% if video %} {% if video %}
<img class="responsive-img lazy z-depth-2" data-original="{{ video.generate_thumbnail("2000") }}" alt=""> <img class="responsive-img lazy z-depth-2" data-original="{{ video.generate_thumbnail("2000") }}" alt="">
<video class="lazy responsive-video" poster="{{ video.generate_thumbnail("2000") }}" alt="" autoplay="autoplay" loop="loop" preload="auto" muted=""> <video class="lazy responsive-video" id="{{ video }}" onclick="goFullscreen('{{ video }}');" poster="{{ video.generate_thumbnail("2000") }}" alt="" autoplay="autoplay" loop="loop" preload="auto" muted>
<source src="{{ video }}.{{ format }}" type="video/{{ format }}"> <source src="{{ video }}.{{ format }}" type="video/{{ format }}">
</video> </video>
{% else %} {% else %}

2
prosopopee/themes/material/templates/sections/pictures-group.html
View File

@ -12,7 +12,7 @@
{% set format = settings.ffmpeg.extension %} {% set format = settings.ffmpeg.extension %}
{{ video.copy() }} {{ video.copy() }}
<img class="z-depth-2 lazy responsive-img" data-original="{{ video.generate_thumbnail("600") }}" src="" alt=""> <img class="z-depth-2 lazy responsive-img" data-original="{{ video.generate_thumbnail("600") }}" src="" alt="">
<video class="lazy responsive-video" id="video" poster="{{ video.generate_thumbnail("600") }}" alt="" autoplay="autoplay" loop="loop" preload="auto" muted> <video class="lazy responsive-video" id="{{ video }}" onclick="goFullscreen('{{ video }}');" poster="{{ video.generate_thumbnail("600") }}" alt="" autoplay="autoplay" loop="loop" preload="auto" muted>
<source src="{{ video }}.{{ format }}" type="video/{{ format }}"> <source src="{{ video }}.{{ format }}" type="video/{{ format }}">
</video> </video>
{% if caption %} {% if caption %}