sebastian/afg-website
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Fixed paths in templates. Added more demo content

Browse source
This commit is contained in:
Sebastian 2024-05-11 17:19:33 +02:00
parent 285d5e2147
commit b474bdf10a
45 changed files with 65 additions and 84 deletions
Download patch file Download diff file Expand all files Collapse all files

4
templates/gallery.html
View file

@ -35,11 +35,11 @@
</main>
<script type="module">
import PhotoSwipeLightbox from '/js/photoswipe/photoswipe-lightbox.esm.min.js';
import PhotoSwipeLightbox from '{{ get_url(path="js/photoswipe/photoswipe-lightbox.esm.min.js") }}';
const lightbox = new PhotoSwipeLightbox({
gallery: '.gallery',
children: 'a',
pswpModule: () => import('/js/photoswipe/photoswipe.esm.min.js')
pswpModule: () => import('{{ get_url(path="js/photoswipe/photoswipe.esm.min.js") }}')
});
lightbox.init();
</script>

60
templates/masto-comments.html
View file

@ -1,60 +0,0 @@
<br/><br/>
For comments you can use your fediverse account to reply to this
<a href="https://{{page.extra.masto_instance}}/@{{page.extra.masto_user}}/{{page.extra.masto_id}}">toot</a>.<br/>
<div id="mastodon-comments-list">
<button id="load-comment">Load comments</button><br/>
</div>
<noscript>You need JavaScript to view the comments.</noscript>
<script src="/js/purify.min.js"></script>
<script type="text/javascript">
function escapeHtml(unsafe) {
return unsafe
.replace(/&/g, "&amp;")
.replace(/</g, "&lt;")
.replace(/>/g, "&gt;")
.replace(/"/g, "&quot;")
.replace(/'/g, "&#039;");
}
document.getElementById("load-comment").addEventListener("click", function() {
document.getElementById("load-comment").innerHTML = "Loading";
fetch('https://{{page.extra.masto_instance}}/api/v1/statuses/{{page.extra.masto_id}}/context')
.then(function(response) {
return response.json();
})
.then(function(data) {
if(data['descendants'] &&
Array.isArray(data['descendants']) &&
data['descendants'].length > 0) {
document.getElementById('mastodon-comments-list').innerHTML = "";
data['descendants'].forEach(function(reply) {
reply.account.display_name = escapeHtml(reply.account.display_name);
reply.account.emojis.forEach(emoji => {
reply.account.display_name = reply.account.display_name.replace(`:${emoji.shortcode}:`,
`<img src="${escapeHtml(emoji.static_url)}" alt="Emoji ${emoji.shortcode}" height="20" width="20" />`);
});
mastodonComment =
`<div class="mastodon-comment">
<div class="avatar">
<img src="${escapeHtml(reply.account.avatar_static)}" height=60 width=60 alt="">
</div>
<div class="content">
<div class="author">
<a href="${reply.account.url}" rel="nofollow">
<span>${reply.account.display_name}</span>
</a>
<a class="date" href="${reply.uri}" rel="nofollow">
${reply.created_at.substr(0, 10)}
</a>
</div>
<div class="mastodon-comment-content">${reply.content}</div>
</div>
</div>`;
document.getElementById('mastodon-comments-list').appendChild(DOMPurify.sanitize(mastodonComment, {'RETURN_DOM_FRAGMENT': true}));
});
} else {
document.getElementById('mastodon-comments-list').innerHTML = "<p>Not comments found</p>";
}
});
});
</script>

26
templates/page.html
View file

@ -3,25 +3,25 @@
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" type="text/css" href="/css/normalize.css">
<link rel="stylesheet" type="text/css" href="/css/redhat-text/redhat-text.css">
<link rel="stylesheet" type="text/css" href="{{ get_url(path='css/normalize.css') }}">
<link rel="stylesheet" type="text/css" href="{{ get_url(path='css/redhat-text/redhat-text.css') }}">
<link rel="stylesheet" type="text/css" href="/js/photoswipe/photoswipe.css">
<link rel="stylesheet" type="text/css" href="{{ get_url(path='js/photoswipe/photoswipe.css') }}">
{% block additional_css %}{% endblock %}
<link rel="stylesheet" type="text/css" href="/css/style.css">
<link rel="stylesheet" type="text/css" href="{{ get_url(path='css/style.css') }}">
<link rel="alternate" type="application/rss+xml" title="RSS Feed for {{ config.title }}" href="/rss.xml" />
<link rel="alternate" type="application/rss+xml" title="RSS Feed for {{ config.title }}" href="{{ get_url(path='/rss.xml') }}" />
<script src="/js/mathjax/tex-chtml-full.js" id="MathJax-script" async></script>
<script src="{{ get_url(path='/js/mathjax/tex-chtml-full.js') }}" id="MathJax-script" async></script>
<title>{% block title %}{{ config.title }} :: {{ page.title }}{% endblock title %}</title>
</head>
<body>
<header>
<img class="logo" src="/images/logo.png" />
<img class="logo" src="{{ get_url(path='/images/logo.png') }}" />
<div class="text">
<div class="heading">{{ config.title }}</div>
@ -39,12 +39,16 @@
<button class="dropbtn">{{subsec.title}} &#x2304;</button>
<div class="dropdown-content">
{% for subsec_page in subsec.pages %}
<a href="{{subsec_page.path}}">{{subsec_page.title}}</a>
<a href="{{ get_url(path=subsec_page.path) }}">{{subsec_page.title}}</a>
{% endfor %}
</div>
</div>
{% else %}
<a href="{{subsec.path}}">{{subsec.title}}</a>
{%if subsec.pages | length == 1 %}
<a href="{{ get_url(path=subsec.pages[0].path) }}">{{subsec.title}}</a>
{% else %}
<a href="{{ get_url(path=subsec.path) }}">{{subsec.title}}</a>
{% endif %}
{% endif %}
{% endfor %}
<a href="javascript:void(0);" style="font-size:15px;" class="icon" onclick="expandHamburger()">&#9776;</a>
@ -83,10 +87,10 @@
</script>
<script type="module">
import PhotoSwipeLightbox from '/js/photoswipe/photoswipe-lightbox.esm.min.js';
import PhotoSwipeLightbox from '{{ get_url(path="/js/photoswipe/photoswipe-lightbox.esm.min.js") }}';
const options = {
gallery: 'main .lightbox',
pswpModule: () => import('/js/photoswipe/photoswipe.esm.min.js')
pswpModule: () => import('{{ get_url(path="/js/photoswipe/photoswipe.esm.min.js") }}')
};
const lightbox = new PhotoSwipeLightbox(options);
lightbox.init();