Website-Redesign/layouts/partials/paginator.html

108 lines
3.6 KiB
HTML

{{ if .Site.Params.infiniteScrolling }}
<script>
var nextPage = '/index.json';
function renderTags(tags) {
if (tags.length <= 0) return '';
let res = '| <span title="tags"> </span>';
for (let tag of tags) {
res += `<a href="/tags/${tag}">#${tag}</a>
`;
}
return res;
}
function renderImage(image) {
if (!image) return '';
return `<img src="${image}" />`
}
function renderSingleArticle(article) {
if (article.ignore) return '';
return `
<article class="card postlistitem {{ if .Site.Params.discreteCards }}discrete{{ end }}">
<div>
<h2>
<a href="${article.link}">${article.title}</a>
</h2>
<p class="date">
<span title="Date"> </span>
${article.date}
${renderTags(article.tags)}
</p>
{{ if .Site.Params.imageInArticlePreview }}
${renderImage(article.image)}
{{end}}
<div class="articlePreview">
<p>${article.summary}</p>
<p><a href="${article.link}">Continue reading </a></p>
</div>
</div>
<hr />
</article>
`;
}
function renderArticles(articles) {
let rendered = articles.map(a => renderSingleArticle(a)).join('\n');
document.getElementById('postlist').innerHTML += rendered;
}
function getNext(first=false) {
if (!nextPage) return;
fetch(nextPage).then(res => res.json())
.then(res => {
nextPage = res['next'];
if (first) {
document.getElementById('getNextBtnContainer').innerHTML += `
<div style="text-align: center; font-size: 1.7em;">
<a style="cursor: pointer" onclick="getNext();">
Load more articles
</a>
</div>
`;
return;
}
if (!nextPage) document.getElementById('getNextBtnContainer').innerHTML = '';
renderArticles(res['articles']);
});
}
getNext(true);
</script>
{{ end }}
{{ if .Site.Params.infiniteScrolling }}<noscript>{{ end }}
{{ if gt .Paginator.TotalPages 1 }}
{{ $navtype := .Site.Params.Navtype }}
<div id="pageNavigation" class='
{{ if eq $navtype "circles" }}
nav-circles
{{ end }}
'>
{{ if .Paginator.HasPrev }}
<a href="{{ .Paginator.Prev.URL }}" title="Previous page">
{{ if eq $navtype "circles" }}
{{ else }}
&lt;&lt;&lt;
{{ end }}
</a>
{{ end }}
{{ $currentPage := .Paginator.PageNumber }}
{{ range .Paginator.Pagers }}
{{ if ne .PageNumber $currentPage }}
<a href="{{ .URL }}">{{ .PageNumber }}</a>
{{ else }}
<span>
{{ if eq $navtype "circles" }}{{ .PageNumber }}
{{ else }}[{{ .PageNumber }}]{{ end }}
</span>
{{ end }}
{{ end }}
{{ if .Paginator.HasNext }}
<a href="{{ .Paginator.Next.URL }}" title="Next page">
{{ if eq $navtype "circles" }}
{{ else }}
&gt;&gt;&gt;
{{ end }}
</a>
{{ end }}
</div>
{{ end }}
{{ if .Site.Params.infiniteScrolling }}</noscript>{{ end }}