only load css and js if section is used

This commit is contained in:
Adrien Beudin 2017-05-14 18:13:47 +02:00
parent c42b029b97
commit 91c702b299
3 changed files with 38 additions and 2 deletions

View File

@ -8,6 +8,7 @@ Changelog
* Add youtube section https://prosopopee.readthedocs.org/en/latest/sections.html#youtube by beudbeud
* Add quotes section https://prosopopee.readthedocs.org/en/latest/sections.html#quote by beudbeud
* Add deploy and preview option https://prosopopee.readthedocs.io/en/latest/build.html#preview by beudbeud
* Load only css and jss if the section is used by beudbeud
0.4 (2016-12-11)

View File

@ -1,3 +1,10 @@
{% for section in gallery.sections %}
{% if section.type == 'panorama' %}
{% set panorama = true %}
{% elif section.type == 'audio'%}
{% set audio = true %}
{% endif %}
{% endfor %}
<!DOCTYPE html>
<html>
<head>
@ -6,8 +13,11 @@
<link type="text/css" rel="stylesheet" href="../static/css/fonts.css" media="screen,projection"/>
<link type="text/css" rel="stylesheet" href="../static/css/style-page.css" media="screen,projection"/>
<link type="text/css" rel="stylesheet" href="../static/css/baguetteBox.min.css" media="screen,projection"/>
{% if panorama %}
<link type="text/css" rel="stylesheet" href="../static/css/panorama_viewer.css" media="screen,projection"/>
{% elif audio %}
<link type="text/css" rel="stylesheet" href="../static/css/mediaelementplayer.css" media="screen,projection"/>
{% endif %}
<!--Let browser know website is optimized for mobile-->
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
{% if gallery.description %}
@ -38,15 +48,19 @@
</div>
<script type="text/javascript" src="../static/js/jquery-2.1.4.min.js" charset="utf-8"></script>
<script type="text/javascript" src="../static/js/baguetteBox.min.js" charset="utf-8"></script>
{% if panorama %}
<script type="text/javascript" src="../static/js/jquery.panorama_viewer.min.js" charset="utf-8"></script>
{% elif audio %}
<script type="text/javascript" src="../static/js/mediaelement-and-player.min.js" charset="utf-8"></script>
{% endif %}
<script type="text/javascript" src="../static/js/jquery.lazyload.min.js" charset="utf-8"></script>
<script type="text/javascript" src="../static/js/picturefill.min.js" charset="utf-8"></script>
<script type="text/javascript" src="../static/js/mediaelement-and-player.min.js" charset="utf-8"></script>
<script type="text/javascript">
$(function() {
baguetteBox.run(".baguette", {});
{% if panorama %}
$(".panorama").panorama_viewer({
repeat: true,
direction: "horizontal",
@ -54,8 +68,10 @@ $(function() {
easing: "linear",
overlay: true
});
{% endif %}
});
{% if audio %}
$('audio').mediaelementplayer({
alwaysShowControls: true,
features: ['playpause','progress','volume'],
@ -66,6 +82,7 @@ $('audio').mediaelementplayer({
iPhoneUseNativeControls: true,
AndroidUseNativeControls: true
});
{% endif %}
var video = $("video");
video.on('click', function(e){

View File

@ -1,3 +1,10 @@
{% for section in gallery.sections %}
{% if section.type == 'panorama' %}
{% set panorama = true %}
{% elif section.type == 'audio'%}
{% set audio = true %}
{% endif %}
{% endfor %}
<!DOCTYPE html>
<html>
<head>
@ -6,8 +13,13 @@
<link rel="stylesheet" href="../static/css/materialize.css"/>
<link rel="stylesheet" href="../static/css/style-page.css">
<link type="text/css" rel="stylesheet" href="../static/css/baguetteBox.min.css" media="screen,projection"/>
{% for section in gallery.sections %}
{% if panorama %}
<link type="text/css" rel="stylesheet" href="../static/css/panorama_viewer.css" media="screen,projection"/>
{% endif %}
{% if audio %}
<link type="text/css" rel="stylesheet" href="../static/css/mediaelementplayer.css" media="screen,projection"/>
{% endif %}
<link rel="stylesheet" href="../static/css/font-awesome.css">
<!--Let browser know website is optimized for mobile-->
@ -46,8 +58,11 @@
<script type="text/javascript" src="../static/js/jquery-2.1.4.min.js" charset="utf-8"></script>
<script type="text/javascript" src="../static/js/materialize.min.js" charset="utf-8"></script>
<script type="text/javascript" src="../static/js/baguetteBox.min.js" charset="utf-8"></script>
{% if panorama %}
<script type="text/javascript" src="../static/js/jquery.panorama_viewer.min.js" charset="utf-8"></script>
{% elif audio %}
<script type="text/javascript" src="../static/js/jquery.lazyload.min.js" charset="utf-8"></script>
{% endif %}
<script type="text/javascript" src="../static/js/mediaelement-and-player.min.js" charset="utf-8"></script>
<script type="text/javascript" charset="utf-8">
$(document).ready(function(){
@ -66,7 +81,7 @@ video.on('click', function(e){
vid.webkitRequestFullscreen();
}
});
{% if audio %}
$('audio').mediaelementplayer({
alwaysShowControls: true,
features: ['playpause','progress','volume'],
@ -77,6 +92,7 @@ $('audio').mediaelementplayer({
iPhoneUseNativeControls: true,
AndroidUseNativeControls: true
});
{% endif %}
$(function() {
@ -92,6 +108,7 @@ $(function() {
$(function() {
baguetteBox.run(".baguette", {});
{% if panorama %}
$(".panorama").panorama_viewer({
repeat: true,
direction: "horizontal",
@ -99,6 +116,7 @@ $(function() {
easing: "linear",
overlay: true
});
{% endif %}
});
{% if settings.settings.light_mode %}