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

add support of Open Graph

Browse Source
This commit is contained in:
Adrien Beudin 2016-11-04 12:55:02 +01:00
parent 79c17c54cc
commit a465fdfe69
24 changed files with 709 additions and 694 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

58
prosopopee/themes/exposure/templates/base.html
View File

@ -1,35 +1,29 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
{% block css %}
{% endblock %}
{% if settings.rss -%}
<link rel="alternate" type="application/rss+xml" title="{{ settings.title }}" href="{{ settings.url }}/feed.xml" />
{% endif -%}
<!--Let browser know website is optimized for mobile-->
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<title>{{ settings.title }}</title>
</head>
<body>
<div class="gallery-header">
{% block logo %}
{% endblock %}
<h1>{{ settings.title }}</h1>
{% if settings.sub_title -%}<h4>{{ settings.sub_title }}</h4>{% endif -%}
<hr>
{% if settings.menu -%}
{% include 'menu.html' %}
{% endif -%}
</div>
{% block content %}
{% endblock %}
{% include 'footer.html' %}
</body>
<head>
<meta charset="UTF-8">
{% block css %}
{% endblock %}
{% if settings.rss %}
<link rel="alternate" type="application/rss+xml" title="{{ settings.title }}" href="{{ settings.url }}/feed.xml" />
{% endif %}
<!--Let browser know website is optimized for mobile-->
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<title>{{ settings.title }}</title>
</head>
<body>
<div class="gallery-header">
{% block logo %}
{% endblock %}
<h1>{{ settings.title }}</h1>
{% if settings.sub_title %}<h4>{{ settings.sub_title }}</h4>{% endif %}
<hr>
{% if settings.menu %}
{% include 'menu.html' %}
{% endif -%}
</div>
{% block content %}
{% endblock %}
{% include 'footer.html' %}
</body>
</html>

110
prosopopee/themes/exposure/templates/example.html
View File

@ -1,74 +1,74 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<link type="text/css" rel="stylesheet" href="../static/css/style.css" media="screen,projection"/>
<head>
<meta charset="UTF-8">
<link type="text/css" rel="stylesheet" href="../static/css/style.css" media="screen,projection"/>
<!--Let browser know website is optimized for mobile-->
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
</head>
<!--Let browser know website is optimized for mobile-->
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
</head>
<body>
<body>
<div class="gallery-header">
<div class="gallery-header">
<img id="logo" src="../static/img/logo.svg" />
<h1>Gallery Name</h1>
<h4>Subtext of the gallery name</h4>
<hr>
</div>
</div>
<div class="galleries-grid">
<div class="galleries-grid">
<div class="galleries-line">
<div class="gallery-square">
<a href="#">
<div class="gallery-title">
<h2>First Gallery Title</h2>
<h3>Sub gallery title</h3>
<div class="gallery-datetime">3 march 2015</div>
</div>
</a>
<div class="gallery-cover" style="background-image: url('./1.png');"></div>
</div>
<div class="gallery-square">
<a href="#">
<div class="gallery-title">
<h2>Second Gallery Title</h2>
<h3>Sub gallery title</h3>
<div class="gallery-datetime">3 march 2015</div>
</div>
</a>
<div class="gallery-cover" style="background-image: url('./1.png');"></div>
</div>
<div class="gallery-square">
<a href="#">
<div class="gallery-title">
<h2>First Gallery Title</h2>
<h3>Sub gallery title</h3>
<div class="gallery-datetime">3 march 2015</div>
</div>
</a>
<div class="gallery-cover" style="background-image: url('./1.png');"></div>
</div>
<div class="gallery-square">
<a href="#">
<div class="gallery-title">
<h2>Second Gallery Title</h2>
<h3>Sub gallery title</h3>
<div class="gallery-datetime">3 march 2015</div>
</div>
</a>
<div class="gallery-cover" style="background-image: url('./1.png');"></div>
</div>
</div>
<div class="galleries-line">
<div class="gallery-square">
<a href="#">
<div class="gallery-title">
<h2>First Gallery Title</h2>
<h3>Sub gallery title</h3>
<div class="gallery-datetime">3 march 2015</div>
</div>
</a>
<div class="gallery-cover" style="background-image: url('./1.png');"></div>
</div>
<div class="gallery-square">
<a href="#">
<div class="gallery-title">
<h2>Second Gallery Title</h2>
<h3>Sub gallery title</h3>
<div class="gallery-datetime">3 march 2015</div>
</div>
</a>
<div class="gallery-cover" style="background-image: url('./1.png');"></div>
</div>
<div class="gallery-square">
<a href="#">
<div class="gallery-title">
<h2>First Gallery Title</h2>
<h3>Sub gallery title</h3>
<div class="gallery-datetime">3 march 2015</div>
</div>
</a>
<div class="gallery-cover" style="background-image: url('./1.png');"></div>
</div>
<div class="gallery-square">
<a href="#">
<div class="gallery-title">
<h2>Second Gallery Title</h2>
<h3>Sub gallery title</h3>
<div class="gallery-datetime">3 march 2015</div>
</div>
</a>
<div class="gallery-cover" style="background-image: url('./1.png');"></div>
</div>
</div>
</div>
</div>
<p style="visibility: hidden">.</p>
<p style="visibility: hidden">.</p>
<footer>
<footer>
<p>Generate using <a href="https://github.com/psycojoker/prosopopee">Prosopopée</a> · content under <a href="CC-BY-SA">CC-BY-SA</a></p>
</footer>
</body>
</footer>
</body>
</html>

20
prosopopee/themes/exposure/templates/feed.xml
View File

@ -1,13 +1,13 @@
<?xml version="1.0" encoding="utf-8"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom">
<channel>
<title>{{ settings.title }}</title>
<description>{{ settings.sub_title }}</description>
<link>{{ settings.url }}</link>
<atom:link href="{{ settings.url }}/feed.xml" rel="self" type="application/rss+xml" />
{% for gallery in galleries %}
{% set absolute_url = settings.url + "/" %}
{% include "item.html" %}
{% endfor %}
</channel>
<channel>
<title>{{ settings.title }}</title>
<description>{{ settings.sub_title }}</description>
<link>{{ settings.url }}</link>
<atom:link href="{{ settings.url }}/feed.xml" rel="self" type="application/rss+xml" />
{% for gallery in galleries %}
{% set absolute_url = settings.url + "/" %}
{% include "item.html" %}
{% endfor %}
</channel>
</rss>

11
prosopopee/themes/exposure/templates/footer.html
View File

@ -1,11 +1,10 @@
{% if settings.licence is not defined %}
{% set licence_url = 'https://creativecommons.org/licenses/by-sa/3.0/' -%}
{% set licence_name = 'CC-BY-SA' -%}
{% set licence_url = 'https://creativecommons.org/licenses/by-sa/3.0/' %}
{% set licence_name = 'CC-BY-SA' %}
{% else %}
{% set licence_url = settings.licence.url -%}
{% set licence_name = settings.licence.name -%}
{% set licence_url = settings.licence.url %}
{% set licence_name = settings.licence.name %}
{% endif %}
<footer>
<p>Generated using <a href="https://github.com/psycojoker/prosopopee">Prosopopée</a> · content under <a href="{{ licence_url }}">{{ licence_name }}</a> · atom logo by <a href="https://thenounproject.com/jjjon/">Jonathan Li</a> under <a href="https://creativecommons.org/licenses/by/3.0/">CC-BY</a></p>
<p>Generated using <a href="https://github.com/psycojoker/prosopopee">Prosopopée</a> · content under <a href="{{ licence_url }}">{{ licence_name }}</a> · atom logo by <a href="https://thenounproject.com/jjjon/">Jonathan Li</a> under <a href="https://creativecommons.org/licenses/by/3.0/">CC-BY</a></p>
</footer>

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

@ -1,132 +1,127 @@
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta charset="UTF-8">
<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"/>
<link type="text/css" rel="stylesheet" href="../static/css/panorama_viewer.css" media="screen,projection"/>
<!--Let browser know website is optimized for mobile-->
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
{% if gallery.description %}
<meta name="description" content="{{ gallery.description }}" />
{% endif %}
{% if gallery.lang %}
<meta name="language" content="{{ gallery.lang }}" />
{% endif %}
<title>{{ gallery.title }} · {{ settings.title }}</title>
</head>
<body>
{% for section in gallery.sections %}
{% include "sections/" + section.type + ".html" %}
{% endfor %}
{% if settings.share %}
{% include "share.html" %}
{% endif %}
<div class="back-to-home">
<hr>
<a href="../">
<div id="logo" src="./../static/img/logo.svg">
HOME
</div>
</a>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta charset="UTF-8">
<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"/>
<link type="text/css" rel="stylesheet" href="../static/css/panorama_viewer.css" media="screen,projection"/>
<!--Let browser know website is optimized for mobile-->
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
{% if gallery.description %}
<meta name="description" content="{{ gallery.description }}" />
{% endif %}
{% if gallery.lang %}
<meta name="language" content="{{ gallery.lang }}" />
{% endif %}
{% if settings.settings.og %}
{% include "opengraph.html" %}
{% endif %}
<title>{{ gallery.title }} · {{ settings.title }}</title>
</head>
<body>
{% for section in gallery.sections %}
{% include "sections/" + section.type + ".html" %}
{% endfor %}
{% if settings.share %}
{% include "share.html" %}
{% endif %}
<div class="back-to-home">
<hr>
<a href="../">
<div id="logo" src="./../static/img/logo.svg">
HOME
</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>
<script type="text/javascript" src="../static/js/jquery.panorama_viewer.min.js" charset="utf-8"></script>
<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">
</a>
</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>
<script type="text/javascript" src="../static/js/jquery.panorama_viewer.min.js" charset="utf-8"></script>
<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">
$(function() {
baguetteBox.run(".baguette", {});
baguetteBox.run(".baguette", {});
$(".panorama").panorama_viewer({
repeat: true,
direction: "horizontal",
animationTime: 150,
easing: "linear",
overlay: true
});
$(".panorama").panorama_viewer({
repeat: true,
direction: "horizontal",
animationTime: 150,
easing: "linear",
overlay: true
});
});
var video = $("video.lazy");
video.on('click', function(e){
var vid = video[0];
vid.play();
if (vid.requestFullscreen) {
vid.requestFullscreen();
} else if (vid.mozRequestFullScreen) {
vid.mozRequestFullScreen();
} else if (vid.webkitRequestFullscreen) {
vid.webkitRequestFullscreen();
}
var vid = video[0];
vid.play();
if (vid.requestFullscreen) {
vid.requestFullscreen();
} else if (vid.mozRequestFullScreen) {
vid.mozRequestFullScreen();
} else if (vid.webkitRequestFullscreen) {
vid.webkitRequestFullscreen();
}
});
$(function() {
$("img.lazy").lazyload({
effect : "fadeIn"
});
$("video.lazy").lazyload({
effect : "fadeIn"
});
$("section.lazy").lazyload({
effect : "fadeIn"
});
$("img.lazy").lazyload({
effect : "fadeIn"
});
$("video.lazy").lazyload({
effect : "fadeIn"
});
$("section.lazy").lazyload({
effect : "fadeIn"
});
});
{% if settings.settings.light_mode %}
var slowLoad = window.setTimeout( function() {
var html_node = document.getElementsByTagName('html')[0];
var div = document.createElement('div');
div.setAttribute('id', 'slow-notice');
var t1 = document.createTextNode("The website is taking a long time to load.");
var br = document.createElement('br');
var t2 = document.createTextNode("You can switch to the ");
var a = document.createElement('a');
a.setAttribute('href', './light');
a.innerHTML = 'Light Weight Site';
var html_node = document.getElementsByTagName('html')[0];
var div = document.createElement('div');
div.setAttribute('id', 'slow-notice');
var t1 = document.createTextNode("The website is taking a long time to load.");
var br = document.createElement('br');
var t2 = document.createTextNode("You can switch to the ");
var a = document.createElement('a');
a.setAttribute('href', './light');
a.innerHTML = 'Light Weight Site';
var dismiss = document.createElement('span');
dismiss.innerHTML = '[x] dismiss';
dismiss.setAttribute('class', 'dismiss');
dismiss.onclick = function() {
html_node.removeChild(div);
}
var dismiss = document.createElement('span');
dismiss.innerHTML = '[x] dismiss';
dismiss.setAttribute('class', 'dismiss');
dismiss.onclick = function() {
html_node.removeChild(div);
}
var dismiss_container = document.createElement('div');
dismiss_container.appendChild(dismiss);
dismiss_container.setAttribute('class', 'dismiss-container');
var dismiss_container = document.createElement('div');
dismiss_container.appendChild(dismiss);
dismiss_container.setAttribute('class', 'dismiss-container');
div.appendChild(t1);
div.appendChild(br);
div.appendChild(t2);
div.appendChild(a);
div.appendChild(dismiss_container);
div.appendChild(t1);
div.appendChild(br);
div.appendChild(t2);
div.appendChild(a);
div.appendChild(dismiss_container);
html_node.appendChild(div);
html_node.appendChild(div);
}, 1000 );
window.addEventListener( 'load', function() {
try {
window.clearTimeout( slowLoad );
html_node.removeChild(div);
} catch (e){
// that's okay.
}
try {
window.clearTimeout( slowLoad );
html_node.removeChild(div);
} catch (e){
// that's okay.
}
});
{% endif %}
</script>
{% include "footer.html" %}
</body>
</script>
{% include "footer.html" %}
</body>
</html>

90
prosopopee/themes/exposure/templates/index.html
View File

@ -1,57 +1,57 @@
{% extends "base.html" %}
{% block css %}
<link type="text/css" rel="stylesheet" href="static/css/fonts.css" media="screen,projection"/>
<link type="text/css" rel="stylesheet" href="static/css/style.css" media="screen,projection"/>
<link type="text/css" rel="stylesheet" href="static/css/fonts.css" media="screen,projection"/>
<link type="text/css" rel="stylesheet" href="static/css/style.css" media="screen,projection"/>
{% endblock %}
{% block logo %}
{% if sub_index %}
<div class="back-to-home">
<hr>
<a href="../">
<div id="logo" src="static/img/logo.svg">
Back
</div>
</a>
{% if sub_index %}
<div class="back-to-home">
<hr>
<a href="../">
<div id="logo" src="static/img/logo.svg">
Back
</div>
{% else %}
<img id="logo" src="static/img/logo.svg"/>
{% endif %}
</a>
</div>
{% else %}
<img id="logo" src="static/img/logo.svg"/>
{% endif %}
{% endblock %}
{% block content %}
<div class="galleries-grid">
{% for galleries_line in galleries|reverse|batch(3)|reverse %}
<div class="galleries-line covers-{{ galleries_line|length }}">
{% for gallery in galleries_line|reverse %}<!-- comment tricks against space between inline-block
--><div class="gallery-square">
<a href="{{ gallery.link }}">
<div class="gallery-title">
<h2>{{ gallery.title }}</h2>
{% if gallery.sub_title %}<h3>{{ gallery.sub_title }}</h3>{% endif %}
{% if settings.show_date and gallery.date %}<div class="gallery-datetime">{{ gallery.date.strftime("%d %B %Y") }}</div>{% endif %}
{% if gallery.tags %}<div class="gallery-tag">IN {% for tag in gallery.tags -%} <span> {{ tag }}</span> {% endfor -%}</div>{% endif %}
</div>
</a>
{% if gallery.cover_type == "video" %}
{% set video = Video(gallery.cover) %}
{{ video.copy() }}
<div class="gallery-cover">
<video autoplay loop muted class="fillWidth">
<source src="{{ video }}" type="video/webm" data-source="{{ video }}" data-format="vp8" data-extension="webm">
</video>
<img class="fillWidth" alt="" src="{{ video.generate_thumbnail("900") }}">
</div>
{% else %}
{% set cover = Image(gallery.cover) %}
{{ cover.copy() }}
<div class="gallery-cover" style="background-image: url('{{ cover.generate_thumbnail("x900") }}'), url('{{ cover.generate_thumbnail("x150") }}');"></div>
{% endif %}
</div><!-- comment tricks against space between inline-block
-->{% endfor %}
<div class="galleries-grid">
{% for galleries_line in galleries|reverse|batch(3)|reverse %}
<div class="galleries-line covers-{{ galleries_line|length }}">
{% for gallery in galleries_line|reverse %}<!-- comment tricks against space between inline-block
--><div class="gallery-square">
<a href="{{ gallery.link }}">
<div class="gallery-title">
<h2>{{ gallery.title }}</h2>
{% if gallery.sub_title %}<h3>{{ gallery.sub_title }}</h3>{% endif %}
{% if settings.show_date and gallery.date %}<div class="gallery-datetime">{{ gallery.date.strftime("%d %B %Y") }}</div>{% endif %}
{% if gallery.tags %}<div class="gallery-tag">IN {% for tag in gallery.tags -%} <span> {{ tag }}</span> {% endfor -%}</div>{% endif %}
</div>
{% endfor %}
</div>
<p style="visibility: hidden">.</p>
</a>
{% if gallery.cover_type == "video" %}
{% set video = Video(gallery.cover) %}
{{ video.copy() }}
<div class="gallery-cover">
<video autoplay loop muted class="fillWidth">
<source src="{{ video }}" type="video/webm" data-source="{{ video }}" data-format="vp8" data-extension="webm">
</video>
<img class="fillWidth" alt="" src="{{ video.generate_thumbnail("900") }}">
</div>
{% else %}
{% set cover = Image(gallery.cover) %}
{{ cover.copy() }}
<div class="gallery-cover" style="background-image: url('{{ cover.generate_thumbnail("x900") }}'), url('{{ cover.generate_thumbnail("x150") }}');"></div>
{% endif %}
</div><!-- comment tricks against space between inline-block
-->{% endfor %}
</div>
{% endfor %}
</div>
<p style="visibility: hidden">.</p>
{% endblock %}

23
prosopopee/themes/exposure/templates/item.html
View File

@ -1,16 +1,15 @@
{% set absolute_url = absolute_url+ gallery.link+"/" -%}
{% set absolute_url = absolute_url+ gallery.link+"/" %}
<item>
<title>{{ gallery.title }}</title>
<link>{{ absolute_url }}</link>
<guid>{{ gallery.link }}</guid>
{% if gallery.sub_title -%}
<description>{{ gallery.sub_title }}</description>
{% endif -%}
<pubDate>{{ gallery.date }}</pubDate>
<title>{{ gallery.title }}</title>
<link>{{ absolute_url }}</link>
<guid>{{ gallery.link }}</guid>
{% if gallery.sub_title %}
<description>{{ gallery.sub_title }}</description>
{% endif -%}
<pubDate>{{ gallery.date }}</pubDate>
</item>
{% for sub_gallery in gallery.sub_gallery %}
{% with gallery=sub_gallery %}
{% include "item.html" %}
{% endwith %}
{% with gallery=sub_gallery %}
{% include "item.html" %}
{% endwith %}
{% endfor %}

14
prosopopee/themes/exposure/templates/menu.html
View File

@ -1,19 +1,19 @@
<nav>
<div class="nav-wrapper">
<ul>
{%- for line in settings.menu -%}
{% for line in settings.menu %}
{% set file_name, menu_name = line.items()[0] %}
{% if file_name.startswith('http') %}
{% set file_name = file_name %}
{% set file_name = file_name %}
{% elif gallery %}
{% set file_name = "../"+file_name %}
{%- endif -%}
{%- if loop.first -%}
{% set file_name = "../"+file_name %}
{% endif %}
{% if loop.first %}
<li><a href={{ file_name }} class=first-item-menu>{{ menu_name }}</a></li>
{% else %}
<li><a href={{ file_name }} class=item-menu>{{ menu_name }}</a></li>
{%- endif -%}
{%- endfor -%}
{% endif %}
{% endfor %}
</ul>
</div>
</nav>

13
prosopopee/themes/exposure/templates/opengraph.html Normal file
View File

@ -0,0 +1,13 @@
<meta property="og:title" content="{{ gallery.title }}"/>
<meta property="og:image" content="{{ gallery.cover }}"/>
<meta property="og:site_name" content="{{ settings.title }}"/>
{% if gallery.description %}
<meta property="og:description" content="{{ gallery.description }}"/>
{% endif %}
<meta property="og:type" content="article"/>
<meta property="article:published_time" content="{{ gallery.date }}">
{% if gallery.tags %}
{% for tag in gallery.tags %}
<meta property="article:tag" content="{{ tag }}">
{% endfor %}
{% endif %}

156
prosopopee/themes/exposure/templates/page-example.html
View File

@ -1,103 +1,103 @@
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta charset="UTF-8">
<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"/>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta charset="UTF-8">
<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"/>
<!--Let browser know website is optimized for mobile-->
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
</head>
<!--Let browser know website is optimized for mobile-->
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
</head>
<body>
<body>
<section class="full-picture" style="background: transparent url('./1.png') no-repeat scroll center top / cover;">
<div class="picture-text">
<div class="picture-text-column">
<h1>Some title on the picture</h1>
<h2>Some subtitle</h2>
<div class="datetime">march 3th 2015</div>
</div>
<div class="picture-text">
<div class="picture-text-column">
<h1>Some title on the picture</h1>
<h2>Some subtitle</h2>
<div class="datetime">march 3th 2015</div>
</div>
</div>
</section>
<section class="full-picture" style="background: transparent url('./1.png') no-repeat scroll center top / cover;">
</section>
<section class="bordered-picture baguette">
<a href="./1.png">
<img src="./1.png">
</a>
<a href="./1.png">
<img src="./1.png">
</a>
</section>
<section class="pictures-group baguette">
<div class="pictures-line">
<div class="picture">
<a href="./1.png">
<img src="./1-small.png">
</a>
</div>
<div class="separator"></div>
<div class="picture">
<a href="./2.png">
<img src="./2-small.png">
</a>
</div>
<div class="separator"></div>
<div class="picture">
<a href="./1.png">
<img src="./1-small.png">
</a>
</div>
<div class="pictures-line">
<div class="picture">
<a href="./1.png">
<img src="./1-small.png">
</a>
</div>
<div class="pictures-line">
<div class="picture">
<a href="./1.png">
<img src="./1-small.png">
</a>
</div>
<div class="separator"></div>
<div class="picture">
<a href="./2.png">
<img src="./2-small.png">
</a>
</div>
<div class="separator"></div>
<div class="picture">
<a href="./2.png">
<img src="./2-small.png">
</a>
</div>
<div class="separator"></div>
<div class="picture">
<a href="./2.png">
<img src="./2-small.png">
</a>
</div>
<div class="separator"></div>
<div class="picture">
<a href="./2.png">
<img src="./2-small.png">
</a>
</div>
<div class="separator"></div>
<div class="picture">
<a href="./2.png">
<img src="./2-small.png">
</a>
</div>
<div class="separator"></div>
<div class="picture">
<a href="./1.png">
<img src="./1-small.png">
</a>
</div>
</div>
<div class="pictures-line">
<div class="picture">
<a href="./1.png">
<img src="./1-small.png">
</a>
</div>
<div class="separator"></div>
<div class="picture">
<a href="./2.png">
<img src="./2-small.png">
</a>
</div>
<div class="separator"></div>
<div class="picture">
<a href="./2.png">
<img src="./2-small.png">
</a>
</div>
<div class="separator"></div>
<div class="picture">
<a href="./2.png">
<img src="./2-small.png">
</a>
</div>
<div class="separator"></div>
<div class="picture">
<a href="./2.png">
<img src="./2-small.png">
</a>
</div>
</div>
</section>
<div class="back-to-home">
<div class="back-to-home">
<hr>
<a href="..">
<div id="logo" src="./../static/img/logo.svg"/>
HOME
</div>
<div id="logo" src="./../static/img/logo.svg"/>
HOME
</div>
</a>
</div>
</div>
<script type="text/javascript" src="../static/js/baguetteBox.min.js" charset="utf-8"></script>
<script type="text/javascript" charset="utf-8">
baguetteBox.run(".baguette", {});
</script>
<footer>
<script type="text/javascript" src="../static/js/baguetteBox.min.js" charset="utf-8"></script>
<script type="text/javascript" charset="utf-8">
baguetteBox.run(".baguette", {});
</script>
<footer>
<p>Generate using <a href="https://github.com/psycojoker/prosopopee">Prosopopée</a> · content under <a href="CC-BY-SA">CC-BY-SA</a></p>
</footer>
</body>
</footer>
</body>
</html>

14
prosopopee/themes/exposure/templates/page.html
View File

@ -1,32 +1,26 @@
{% extends "base.html" %}
{% block css %}
<link type="text/css" rel="stylesheet" href="../static/css/fonts.css" media="screen,projection"/>
<link type="text/css" rel="stylesheet" href="../static/css/style.css" media="screen,projection"/>
<link type="text/css" rel="stylesheet" href="../static/css/style-page.css" media="screen,projection"/>
{% endblock %}
{% block logo %}
<img id="logo" src="../static/img/logo.svg" />
{% endblock %}
{% block content %}
<section class="text">
<h2>{{ gallery.title }}</h2>
</section>
{% for section in gallery.sections %}
{% include "sections/" + section.type + ".html" %}
{% include "sections/" + section.type + ".html" %}
{% endfor %}
<div class="back-to-home">
<hr>
<a href="../index.html">
<div id="logo" src="../static/img/logo.svg"/>
HOME
</div>
<div id="logo" src="../static/img/logo.svg"/>
HOME
</div>
</a>
</div>
<script type="text/javascript" src="../static/js/jquery-2.1.4.min.js" charset="utf-8"></script>
{% endblock %}

58
prosopopee/themes/exposure/templates/sections/author.html
View File

@ -1,33 +1,33 @@
{% set image = Image(section.image) %}
{{ image.copy() }}
<div class="author-meta">
<img src={{ image.generate_thumbnail("80x80") }} alt="" class="circle">
<div>
<span class=author-info>Story by
<h4>{{ section.name }}</h4>
{% if section.text %}
<div class=desc>{{ section.text }}</div>
{% endif %}
</span>
</div>
<div class="separator"></div>
<div>
{% if section.twitter %}
<span>
<a href="http://twitter.com/{{ section.twitter }}">Twitter</a>
</span>
<span> | </span>
{% endif %}
{% if section.facebook %}
<span>
<a href="http://facebook.com/{{ section.facebook }}">Facebook</a>
</span>
<span> | </span>
{% endif %}
{% if section.website %}
<span>
<a href="{{ section.sebsite }}">{{ section.website }}</a>
</span>
{% endif %}
</div>
<img src={{ image.generate_thumbnail("80x80") }} alt="" class="circle">
<div>
<span class=author-info>Story by
<h4>{{ section.name }}</h4>
{% if section.text %}
<div class=desc>{{ section.text }}</div>
{% endif %}
</span>
</div>
<div class="separator"></div>
<div>
{% if section.twitter %}
<span>
<a href="http://twitter.com/{{ section.twitter }}">Twitter</a>
</span>
<span> | </span>
{% endif %}
{% if section.facebook %}
<span>
<a href="http://facebook.com/{{ section.facebook }}">Facebook</a>
</span>
<span> | </span>
{% endif %}
{% if section.website %}
<span>
<a href="{{ section.sebsite }}">{{ section.website }}</a>
</span>
{% endif %}
</div>
</div>

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

@ -1,53 +1,51 @@
{% if section.background %}
<div class="bg-section" style="background: {{ section.background }};">
{% endif %}
{% if section.image.type == "video" %}
{% set video = Video(section.image) %}
{% set caption = section.text %}
{{ video.copy() }}
<section class="bordered-picture baguette" style="position: relative;">
<div class="caption">
<img class="lazy" data-original="{{ video.generate_thumbnail("2000") }}" src="" alt="">
<video class="lazy" id="video" poster="{{ video.generate_thumbnail("2000") }}" alt="" autoplay="autoplay" loop="loop" preload="none" muted>
<source src="{{ video }}" type="video/webm" data-source="{{ video }}" data-format="vp8" data-extension="webm">
</video>
{% if caption %}
<div class="caption__overlay">
<h5 class="caption__overlay__title">{{ caption }}</h5>
</div>
{% endif %}
</div>
</section>
{% else %}
{% set image = Image(section.image) %}
{% set caption = section.text %}
{{ image.copy() }}
<section class="bordered-picture baguette">
<div class="caption">
<a href="{{ image }}" {% if caption %}data-caption="{{ caption }}"{% endif %}
data-at-450="{{ image.generate_thumbnail("x450") }}"
data-at-800="{{ image.generate_thumbnail("x800") }}"
data-at-1366="{{ image.generate_thumbnail("x1366") }}"
data-at-1920="{{ image.generate_thumbnail("x1920") }}"
>
<picture>
<source srcset="{{ image.generate_thumbnail("x450") }}" media="(max-width: 450px)">
<source srcset="{{ image.generate_thumbnail("x800") }}" media="(max-width: 800px)">
<source srcset="{{ image.generate_thumbnail("x1366") }}" media="(max-width: 1366px)">
<source srcset="{{ image.generate_thumbnail("x1920") }}" media="(max-width: 1920px)">
<img src="{{ image }}" data-original="{{ image }}" alt="">
</picture>
{% if caption %}
<div class="caption__overlay">
<h5 class="caption__overlay__title">{{ caption }}</h5>
</div>
{% endif %}
</a>
</div>
</section>
{% endif %}
{% if section.background %}
<div class="bg-section" style="background: {{ section.background }};">
{% endif %}
{% if section.image.type == "video" %}
{% set video = Video(section.image) %}
{% set caption = section.text %}
{{ video.copy() }}
<section class="bordered-picture baguette" style="position: relative;">
<div class="caption">
<img class="lazy" data-original="{{ video.generate_thumbnail("2000") }}" src="" alt="">
<video class="lazy" id="video" poster="{{ video.generate_thumbnail("2000") }}" alt="" autoplay="autoplay" loop="loop" preload="none" muted>
<source src="{{ video }}" type="video/webm" data-source="{{ video }}" data-format="vp8" data-extension="webm">
</video>
{% if caption %}
<div class="caption__overlay">
<h5 class="caption__overlay__title">{{ caption }}</h5>
</div>
{% endif %}
</div>
</section>
{% else %}
{% set image = Image(section.image) %}
{% set caption = section.text %}
{{ image.copy() }}
<section class="bordered-picture baguette">
<div class="caption">
<a href="{{ image }}" {% if caption %}data-caption="{{ caption }}"{% endif %}
data-at-450="{{ image.generate_thumbnail("x450") }}"
data-at-800="{{ image.generate_thumbnail("x800") }}"
data-at-1366="{{ image.generate_thumbnail("x1366") }}"
data-at-1920="{{ image.generate_thumbnail("x1920") }}"
>
<picture>
<source srcset="{{ image.generate_thumbnail("x450") }}" media="(max-width: 450px)"/>
<source srcset="{{ image.generate_thumbnail("x800") }}" media="(max-width: 800px)"/>
<source srcset="{{ image.generate_thumbnail("x1366") }}" media="(max-width: 1366px)"/>
<source srcset="{{ image.generate_thumbnail("x1920") }}" media="(max-width: 1920px)"/>
<img src="{{ image }}" data-original="{{ image }}" alt=""/>
</picture>
{% if caption %}
<div class="caption__overlay">
<h5 class="caption__overlay__title">{{ caption }}</h5>
</div>
{% endif %}
</a>
</div>
</section>
{% endif %}
{% if section.background %}
</div>
{% endif %}

90
prosopopee/themes/exposure/templates/sections/full-picture.html
View File

@ -1,53 +1,45 @@
{% if section.image.type == "video" %}
{% set video = Video(section.image) %}
{{ video.copy() }}
<section class="full-picture">
<div class="video-container">
{% if section.text %}
<div class="title-container">
<div class="headline">
<h1>{{ section.text.title }}</h1>
<h2>{{ section.text.sub_title }}</h2>
{% if section.text.date_end %}
<div class="datetime">{{ section.text.date.strftime("%d %B %Y") }} to {{ section.text.date_end.strftime("%d %B %Y") }}</div>
{% else %}
{% if section.text.date %}
<div class="datetime">{{ section.text.date.strftime("%d %B %Y") }}</div>{% endif %}
{% endif %}
</div>
</div>
{% endif %}
<video autoplay loop muted class="fillWidth">
<source src="{{ video }}" type="video/webm" data-source="{{ video }}" data-format="vp8" data-extension="webm">
</video>
<img class="lazy full-picture" src="{{ video.generate_thumbnail("2000") }}">
</div>
</section>
{% else %}
{% set image = Image(section.image) %}
{{ image.copy() }}
<section class="full-picture" style="background: url('{{ image.generate_thumbnail("x2000") }}') no-repeat fixed center top / cover, url('{{ image.generate_thumbnail("x450") }}') no-repeat fixed center top / cover transparent;">
{% set video = Video(section.image) %}
{{ video.copy() }}
<section class="full-picture">
<div class="video-container">
{% if section.text %}
<div class="picture-text">
<div class="picture-text-column">
<h1>{{ section.text.title }}</h1>
<h2>{{ section.text.sub_title }}</h2>
{% if section.text.date_end %}
<div class="datetime">{{ section.text.date.strftime("%d %B %Y") }} to {{ section.text.date_end.strftime("%d %B %Y") }}</div>
{% else %}
{% if section.text.date %}
<div class="datetime">{{ section.text.date.strftime("%d %B %Y") }}</div>{% endif %}
{% endif %}
</div>
</div>
<div class="title-container">
<div class="headline">
<h1>{{ section.text.title }}</h1>
<h2>{{ section.text.sub_title }}</h2>
{% if section.text.date_end %}
<div class="datetime">{{ section.text.date.strftime("%d %B %Y") }} to {{ section.text.date_end.strftime("%d %B %Y") }}</div>
{% else %}
{% if section.text.date %}
<div class="datetime">{{ section.text.date.strftime("%d %B %Y") }}</div>{% endif %}
{% endif %}
</div>
</div>
{% endif %}
</section>
<video autoplay loop muted class="fillWidth">
<source src="{{ video }}" type="video/webm" data-source="{{ video }}" data-format="vp8" data-extension="webm">
</video>
<img class="lazy full-picture" src="{{ video.generate_thumbnail("2000") }}">
</div>
</section>
{% else %}
{% set image = Image(section.image) %}
{{ image.copy() }}
<section class="full-picture" style="background: url('{{ image.generate_thumbnail("x2000") }}') no-repeat fixed center top / cover, url('{{ image.generate_thumbnail("x450") }}') no-repeat fixed center top / cover transparent;">
{% if section.text %}
<div class="picture-text">
<div class="picture-text-column">
<h1>{{ section.text.title }}</h1>
<h2>{{ section.text.sub_title }}</h2>
{% if section.text.date_end %}
<div class="datetime">{{ section.text.date.strftime("%d %B %Y") }} to {{ section.text.date_end.strftime("%d %B %Y") }}</div>
{% else %}
{% if section.text.date %}
<div class="datetime">{{ section.text.date.strftime("%d %B %Y") }}</div>{% endif %}
{% endif %}
</div>
</div>
{% endif %}
</section>
{% endif %}

12
prosopopee/themes/exposure/templates/sections/html.html
View File

@ -1,11 +1,11 @@
{% if section.background or section.color %}
<div class="bg-section" style="{% if section.background -%};background: {{ section.background }};{% endif %}{% if section.color -%}color: {{ section.color }};{% endif %}">
{% endif %}
<section class="html">
<div class="bg-section" style="{% if section.background %};background: {{ section.background }};{% endif %}{% if section.color %}color: {{ section.color }};{% endif %}">
{% endif %}
<section class="html">
<center>
{{ section.html }}
{{ section.html }}
</center>
</section>
{% if section.background or section.color %}
</section>
{% if section.background or section.color %}
</div>
{% endif %}

2
prosopopee/themes/exposure/templates/sections/panorama.html
View File

@ -1,5 +1,5 @@
{% set image = Image(section.image) %}
{{ image.copy() }}
<section class="panorama">
<img src="{{ image.generate_thumbnail("x800") }}">
<img src="{{ image.generate_thumbnail("x800") }}">
</section>

20
prosopopee/themes/exposure/templates/sections/paragraph.html
View File

@ -1,18 +1,14 @@
{% if section.background or section.color %}
<div class="bg-section" style="{% if section.background -%}background: {{ section.background }};{% endif %}{% if section.color -%}color: {{ section.color }};{% endif %}">
{% endif %}
<section class="paragraph">
<div class="bg-section" style="{% if section.background %}background: {{ section.background }};{% endif %}{% if section.color %}color: {{ section.color }};{% endif %}">
{% endif %}
<section class="paragraph">
{% if section.title %}
<h2>{{ section.title }}</h2>
<h2>{{ section.title }}</h2>
{% else %}
<div class="separator"></div>
<div class="separator"></div>
{% endif %}
<p>{{ section.text }}</p>
</section>
{% if section.background or section.color %}
</div>
</section>
{% if section.background or section.color %}
</div>
{% endif %}

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

@ -1,59 +1,50 @@
{% if section.background %}
<div class="bg-section" style="background: {{ section.background }};">
{% endif %}
<section class="pictures-group baguette">
{% for line in section.images %}
<div class="bg-section" style="background: {{ section.background }};">
{% endif %}
<section class="pictures-group baguette">
{% for line in section.images %}
<div class="pictures-line">
{% for image in line %}
<div class="picture caption">
{% for image in line %}
<div class="picture caption">
{% if image.type == "video" %}
{% set caption = image.text %}
{% set video = Video(image) %}
{{ video.copy() }}
<img class="lazy" data-original="{{ video.generate_thumbnail("600") }}" src="" alt="">
<video class="lazy" id="video" poster="{{ video.generate_thumbnail("600") }}" alt="" autoplay="autoplay" loop="loop" preload="auto" muted>
<source src="{{ video }}" type="video/webm" data-source="{{ video }}" data-format="vp8" data-extension="webm">
</video>
{% if caption %}
<div class="caption__overlay">
<h5 class="caption__overlay__title">{{ caption }}</h5>
</div>
{% endif %}
{% else %}
{% set caption = image.text %}
{% set image = Image(image) %}
{{ image.copy() }}
<a href="{{ image }}" {% if caption %}data-caption="{{ caption }}"{% endif %}
data-at-450="{{ image.generate_thumbnail("x450") }}"
data-at-800="{{ image.generate_thumbnail("x800") }}"
data-at-1366="{{ image.generate_thumbnail("x1366") }}"
data-at-1920="{{ image.generate_thumbnail("x1920") }}"
>
<img class="lazy" src="" data-original="{{ image.generate_thumbnail("x600") }}" alt="">
{% if caption %}
<div class="caption__overlay">
<h5 class="caption__overlay__title">{{ caption }}</h5>
</div>
{% endif %}
</a>
{% endif %}
{% set caption = image.text %}
{% set video = Video(image) %}
{{ video.copy() }}
<img class="lazy" data-original="{{ video.generate_thumbnail("600") }}" src="" alt="">
<video class="lazy" id="video" poster="{{ video.generate_thumbnail("600") }}" alt="" autoplay="autoplay" loop="loop" preload="auto" muted>
<source src="{{ video }}" type="video/webm" data-source="{{ video }}" data-format="vp8" data-extension="webm">
</video>
{% if caption %}
<div class="caption__overlay">
<h5 class="caption__overlay__title">{{ caption }}</h5>
</div>
{% if not loop.last %}
<div class="separator"></div>
{% endif %}
{% else %}
{% set caption = image.text %}
{% set image = Image(image) %}
{{ image.copy() }}
<a href="{{ image }}" {% if caption %}data-caption="{{ caption }}"{% endif %}
data-at-450="{{ image.generate_thumbnail("x450") }}"
data-at-800="{{ image.generate_thumbnail("x800") }}"
data-at-1366="{{ image.generate_thumbnail("x1366") }}"
data-at-1920="{{ image.generate_thumbnail("x1920") }}"
>
<img class="lazy" src="" data-original="{{ image.generate_thumbnail("x600") }}" alt="">
{% if caption %}
<div class="caption__overlay">
<h5 class="caption__overlay__title">{{ caption }}</h5>
</div>
{% endif %}
</a>
{% endif %}
</div>
{% if not loop.last %}
<div class="separator"></div>
{% endif %}
{% endfor %}
</div>
{% endfor %}
</div>
{% endfor %}
</section>
{% if section.background %}
</div>
</section>
{% if section.background %}
</div>
{% endif %}

14
prosopopee/themes/exposure/templates/sections/text.html
View File

@ -1,11 +1,9 @@
{% if section.background or section.color %}
<div class="bg-section" style="{% if section.background -%}background: {{ section.background }};{% endif %}{% if section.color -%}color: {{ section.color }};{% endif %}">
{% endif %}
<section class="text">
<div class="bg-section" style="{% if section.background -%}background: {{ section.background }};{% endif %}{% if section.color -%}color: {{ section.color }};{% endif %}">
{% endif %}
<section class="text">
{{ section.text }}
</section>
{% if section.background or section.color %}
</div>
</section>
{% if section.background or section.color %}
</div>
{% endif %}

16
prosopopee/themes/exposure/templates/share.html
View File

@ -1,18 +1,18 @@
{% set absolute_url = settings.url + "/" + link -%}
{% set absolute_url = settings.url + "/" + link %}
<div class=share>
<h5>Share this story</h5>
<ul class="icon">
<h5>Share this story</h5>
<ul class="icon">
<li>
<a class="twitter" href="https://twitter.com/share?text={{ gallery.name }}&url={{absolute_url}}{%if gallery.tags %}&hashtags={% for tag in gallery.tags -%}{{ tag }}{% if not loop.lirst and not loop.last %},{% endif %}{% endfor -%}{% endif -%}" target="_blank">Twitter</a>
<a class="twitter" href="https://twitter.com/share?text={{ gallery.name }}&url={{absolute_url}}{%if gallery.tags %}&hashtags={% for tag in gallery.tags %}{{ tag }}{% if not loop.lirst and not loop.last %},{% endif %}{% endfor %}{% endif %}" target="_blank">Twitter</a>
</li>
<li>
<a class="facebook" href="http://www.facebook.com/share.php?u={{absolute_url}}" target="_blank">Facebook</a>
<a class="facebook" href="http://www.facebook.com/share.php?u={{absolute_url}}" target="_blank">Facebook</a>
</li>
<li>
<a class="pinterest" href="http://www.pinterest.com/pin/create/button/?url={{absolute_url}}" target="_blank">Pinterest</a>
<a class="pinterest" href="http://www.pinterest.com/pin/create/button/?url={{absolute_url}}" target="_blank">Pinterest</a>
</li>
<li>
<a class="google" href="https://plus.google.com/share?url={{absolute_url}}" target="_blank">Google +</a>
<a class="google" href="https://plus.google.com/share?url={{absolute_url}}" target="_blank">Google +</a>
</li>
</ul>
</ul>
</div>

66
prosopopee/themes/light/templates/gallery-index.html
View File

@ -5,36 +5,46 @@
{% endif %}
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta charset="UTF-8">
<link type="text/css" rel="stylesheet" href="{{ pathstatic }}/static/css/fonts.css" media="screen,projection"/>
<link type="text/css" rel="stylesheet" href="{{ pathstatic }}/static/css/style-page.css" media="screen,projection"/>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta charset="UTF-8">
<link type="text/css" rel="stylesheet" href="{{ pathstatic }}/static/css/fonts.css" media="screen,projection"/>
<link type="text/css" rel="stylesheet" href="{{ pathstatic }}/static/css/style-page.css" media="screen,projection"/>
<!--Let browser know website is optimized for mobile-->
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<title>{{ gallery.title }} · {{ settings.title }}</title>
</head>
<!--Let browser know website is optimized for mobile-->
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
{% if gallery.description %}
<meta name="description" content="{{ gallery.description }}" />
{% endif %}
{% if gallery.lang %}
<meta name="language" content="{{ gallery.lang }}" />
{% endif %}
{% if settings.settings.og %}
{% include "opengraph.html" %}
{% endif %}
<body>
<div id="wrapper">
{% for section in gallery.sections %}
{% include "sections/" + section.type + ".html" %}
{% endfor %}
<title>{{ gallery.title }} · {{ settings.title }}</title>
</head>
{% if settings.share %}
{% include "share.html" %}
{% endif %}
<body>
<div id="wrapper">
{% for section in gallery.sections %}
{% include "sections/" + section.type + ".html" %}
{% endfor %}
<div class="back-to-home">
<hr>
<a href="../../">
<div id="logo" src="./static/img/logo.svg">
HOME
</div>
</a>
</div>
</div>
{% include "footer.html" %}
</body>
{% if settings.share %}
{% include "share.html" %}
{% endif %}
<div class="back-to-home">
<hr>
<a href="../../">
<div id="logo" src="./static/img/logo.svg">
HOME
</div>
</a>
</div>
</div>
{% include "footer.html" %}
</body>
</html>

13
prosopopee/themes/light/templates/opengraph.html Normal file
View File

@ -0,0 +1,13 @@
<meta property="og:title" content="{{ gallery.title }}"/>
<meta property="og:image" content="{{ gallery.cover }}"/>
<meta property="og:site_name" content="{{ settings.title }}"/>
{% if gallery.description %}
<meta property="og:description" content="{{ gallery.description }}"/>
{% endif %}
<meta property="og:type" content="article"/>
<meta property="article:published_time" content="{{ gallery.date }}">
{% if gallery.tags %}
{% for tag in gallery.tags %}
<meta property="article:tag" content="{{ tag }}">
{% endfor %}
{% endif %}

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

@ -1,128 +1,138 @@
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta charset="UTF-8">
<link rel="stylesheet" href="../static/css/materialize.css"/>
<link rel="stylesheet" href="../static/css/styles.css">
<link type="text/css" rel="stylesheet" href="../static/css/baguetteBox.min.css" media="screen,projection"/>
<link type="text/css" rel="stylesheet" href="../static/css/panorama_viewer.css" media="screen,projection"/>
{% if settings.share %}
<link rel="stylesheet" href="../static/css/font-awesome.css">
{% endif %}
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta charset="UTF-8">
<link rel="stylesheet" href="../static/css/materialize.css"/>
<link rel="stylesheet" href="../static/css/styles.css">
<link type="text/css" rel="stylesheet" href="../static/css/baguetteBox.min.css" media="screen,projection"/>
<link type="text/css" rel="stylesheet" href="../static/css/panorama_viewer.css" media="screen,projection"/>
{% if settings.share %}
<link rel="stylesheet" href="../static/css/font-awesome.css">
{% endif %}
<!--Let browser know website is optimized for mobile-->
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<title>{{ gallery.title }} · {{ settings.title }}</title>
</head>
<!--Let browser know website is optimized for mobile-->
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
{% if gallery.description %}
<meta name="description" content="{{ gallery.description }}" />
{% endif %}
{% if gallery.lang %}
<meta name="language" content="{{ gallery.lang }}" />
{% endif %}
{% if settings.settings.og %}
{% include "opengraph.html" %}
{% endif %}
<body>
<main>
<title>{{ gallery.title }} · {{ settings.title }}</title>
</head>
{% for section in gallery.sections %}
{% include "sections/" + section.type + ".html" %}
{% endfor %}
<body>
<main>
{% for section in gallery.sections %}
{% include "sections/" + section.type + ".html" %}
{% endfor %}
{% if settings.share %}
{% include 'share.html' -%}
{% else -%}
<div class="fixed-action-btn" style="bottom: 45px; right: 24px;">
<a href="../" class="btn-floating btn-large red">
<i class="mdi-action-home"></i>
</a>
</div>
{% endif %}
{% if settings.share %}
{% include 'share.html' -%}
{% else -%}
<div class="fixed-action-btn" style="bottom: 45px; right: 24px;">
<a href="../" class="btn-floating btn-large red">
<i class="mdi-action-home"></i>
</a>
</div>
{% endif %}
<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>
<script type="text/javascript" src="../static/js/jquery.panorama_viewer.min.js" charset="utf-8"></script>
<script type="text/javascript" src="../static/js/jquery.lazyload.min.js" charset="utf-8"></script>
<script type="text/javascript" charset="utf-8">
<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>
<script type="text/javascript" src="../static/js/jquery.panorama_viewer.min.js" charset="utf-8"></script>
<script type="text/javascript" src="../static/js/jquery.lazyload.min.js" charset="utf-8"></script>
<script type="text/javascript" charset="utf-8">
$(document).ready(function(){
$('.parallax').parallax();
$('.parallax').parallax();
});
var video = $("video.lazy");
video.on('click', function(e){
var vid = video[0];
vid.play();
if (vid.requestFullscreen) {
vid.requestFullscreen();
} else if (vid.mozRequestFullScreen) {
vid.mozRequestFullScreen();
} else if (vid.webkitRequestFullscreen) {
vid.webkitRequestFullscreen();
}
var vid = video[0];
vid.play();
if (vid.requestFullscreen) {
vid.requestFullscreen();
} else if (vid.mozRequestFullScreen) {
vid.mozRequestFullScreen();
} else if (vid.webkitRequestFullscreen) {
vid.webkitRequestFullscreen();
}
});
$(function() {
$("img.lazy").lazyload({
effect : "fadeIn"
});
$("video.lazy").lazyload({
effect : "fadeIn"
});
$("img.lazy").lazyload({
effect : "fadeIn"
});
$("video.lazy").lazyload({
effect : "fadeIn"
});
});
$(function() {
baguetteBox.run(".baguette", {});
$(".panorama").panorama_viewer({
repeat: true,
direction: "horizontal",
animationTime: 150,
easing: "linear",
overlay: true
});
baguetteBox.run(".baguette", {});
$(".panorama").panorama_viewer({
repeat: true,
direction: "horizontal",
animationTime: 150,
easing: "linear",
overlay: true
});
});
{% if settings.settings.light_mode %}
var slowLoad = window.setTimeout( function() {
var html_node = document.getElementsByTagName('html')[0];
var div = document.createElement('div');
div.setAttribute('id', 'slow-notice');
var t1 = document.createTextNode("The website is taking a long time to load.");
var br = document.createElement('br');
var t2 = document.createTextNode("You can switch to the ");
var a = document.createElement('a');
a.setAttribute('href', './light');
a.innerHTML = 'Light Weight Site';
var html_node = document.getElementsByTagName('html')[0];
var div = document.createElement('div');
div.setAttribute('id', 'slow-notice');
var t1 = document.createTextNode("The website is taking a long time to load.");
var br = document.createElement('br');
var t2 = document.createTextNode("You can switch to the ");
var a = document.createElement('a');
a.setAttribute('href', './light');
a.innerHTML = 'Light Weight Site';
var dismiss = document.createElement('span');
dismiss.innerHTML = '[x] dismiss';
dismiss.setAttribute('class', 'dismiss');
dismiss.onclick = function() {
html_node.removeChild(div);
}
var dismiss = document.createElement('span');
dismiss.innerHTML = '[x] dismiss';
dismiss.setAttribute('class', 'dismiss');
dismiss.onclick = function() {
html_node.removeChild(div);
}
var dismiss_container = document.createElement('div');
dismiss_container.appendChild(dismiss);
dismiss_container.setAttribute('class', 'dismiss-container');
var dismiss_container = document.createElement('div');
dismiss_container.appendChild(dismiss);
dismiss_container.setAttribute('class', 'dismiss-container');
div.appendChild(t1);
div.appendChild(br);
div.appendChild(t2);
div.appendChild(a);
div.appendChild(dismiss_container);
div.appendChild(t1);
div.appendChild(br);
div.appendChild(t2);
div.appendChild(a);
div.appendChild(dismiss_container);
html_node.appendChild(div);
html_node.appendChild(div);
}, 1000 );
window.addEventListener( 'load', function() {
try {
window.clearTimeout( slowLoad );
html_node.removeChild(div);
} catch (e){
// that's okay.
}
try {
window.clearTimeout( slowLoad );
html_node.removeChild(div);
} catch (e){
// that's okay.
}
});
{% endif %}
$(".button-collapse").sideNav();
</script>
</main>
{% include 'footer.html'%}
</body>
</script>
</main>
{% include 'footer.html'%}
</body>
</html>

13
prosopopee/themes/material/templates/opengraph.html Normal file
View File

@ -0,0 +1,13 @@
<meta property="og:title" content="{{ gallery.title }}"/>
<meta property="og:image" content="{{ gallery.cover }}"/>
<meta property="og:site_name" content="{{ settings.title }}"/>
{% if gallery.description %}
<meta property="og:description" content="{{ gallery.description }}"/>
{% endif %}
<meta property="og:type" content="article"/>
<meta property="article:published_time" content="{{ gallery.date }}">
{% if gallery.tags %}
{% for tag in gallery.tags %}
<meta property="article:tag" content="{{ tag }}">
{% endfor %}
{% endif %}