flow-web/templates/blog_overview.stpl
Andreas Widen a4a5c7daa5
Initial commit.
Signed-off-by: Andreas Widen <aw@luflow.net>
2026-07-27 17:57:03 +02:00

184 lines
9.4 KiB
Text

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE-edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="keywords" content="luflow Blog, <%= self.overview_keywords %>, page <%= self.overview_current_page %>">
<meta name="description" content="<%= self.overview_title %> Page <%= self.overview_current_page %>">
<link type="application/atom+xml" rel="alternate" title="luflow.net — Activity Feed" href="/feeds/blog.atom">
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
<link rel="icon" type="image/svg+xml" sizes="any" href="/static/img/icon.svg" />
<link rel="manifest" href="/site.webmanifest">
<link rel="stylesheet" href="/static/css/common.css">
<link rel="stylesheet" href="/static/css/item-preview.css">
<link rel="stylesheet" href="/static/css/buttons.css">
<link rel="stylesheet" href="/static/css/breadcrumbs.css">
<link rel="stylesheet" href="/static/css/header.css">
<link rel="stylesheet" href="/static/css/footer.css">
<link rel="stylesheet" href="/static/css/page.css">
<link rel="stylesheet" href="/static/css/sidebar.css">
<title><%= self.overview_title %> Page <%= self.overview_current_page %> | luflow.net</title>
</head>
<body>
<div id="content">
<% include!("./partials/header.stpl"); %>
<% include!("./partials/blog_overview_breadcrumbs.stpl"); %>
<main>
<section class="page-post centered-text">
<h2><%= self.overview_title %><span class="page-number-indicator"> (Page <%= self.overview_current_page %> of <%= self.overview_num_pages %>)</span></h2>
<div class="sheet">
<%
if self.overview_type == 1 {
if let Some(indices) = self.topic_blog_indices.get(&self.overview_topic) {
for i in self.overview_offset..self.overview_offset + self.overview_num_posts {
let index = match indices.get(i) {
Some(value) => value,
_ => panic!("Did not find blog post for index: {}", i),
};
let post = match self.blog_posts.get(*index) {
Some(value) => value,
_ => panic!("Did not find blog post for index: {}", i),
};
%>
<a class="item-preview" href="/<%= post.base_dir %>/<%= post.url %>/">
<h3 lang="en"><%= post.title %></h3>
<p class="item-date"><%= post.published.to_string() %></p>
<p class="item-summary" lang="en"><%= post.snippet %></p>
</a>
<%
}
}
} else if self.overview_type == 2 {
if let Some(indices) = self.year_blog_indices.get(&self.overview_year) {
for i in self.overview_offset..self.overview_offset + self.overview_num_posts {
let index = match indices.get(i) {
Some(value) => value,
_ => panic!("Did not find blog post for index: {}", i),
};
let post = match self.blog_posts.get(*index) {
Some(value) => value,
_ => panic!("Did not find blog post for index: {}", i),
};
%>
<a class="item-preview" href="/<%= post.base_dir %>/<%= post.url %>/">
<h3 lang="en"><%= post.title %></h3>
<p class="item-date"><%= post.published.to_string() %></p>
<p class="item-summary" lang="en"><%= post.snippet %></p>
</a>
<%
}
}
} else if self.overview_type == 0 {
for i in self.overview_offset..self.overview_offset + self.overview_num_posts {
let post = match self.blog_posts.get(i) {
Some(value) => value,
_ => panic!("Did not find blog post for index: {}", i),
};
%>
<a class="item-preview" href="/<%= post.base_dir %>/<%= post.url %>/">
<h3 lang="en"><%= post.title %></h3>
<p class="item-date"><%= post.published.to_string() %></p>
<p class="item-summary" lang="en"><%= post.snippet %></p>
</a>
<%
}
} else {
panic!("overview_type: {} is not implemented!", self.overview_type);
}
%>
<nav class="page-selector">
<h3 class="a11y-offset">Page <%= self.overview_current_page %> of <%= self.overview_num_pages %>. Go to another page: </h3>
<%
for i in 1..self.overview_num_pages + 1 {
let mut page_url = format!("/{}/page/{}/", self.base_dir, i);
if self.overview_type == 1 {
page_url = format!("/{}/topic/{}/page/{}/", self.base_dir, self.overview_topic_sanitized, i);
} else if self.overview_type == 2 {
page_url = format!("/{}/year/{}/page/{}/", self.base_dir, self.overview_year, i);
}
let mut button_class = "button-little";
if i == self.overview_current_page {
button_class = "button-little button-little-active";
}
%>
<a class="<%= button_class %>" href="<%= page_url %>"><%= i %></a>
<% } %>
</nav>
</div>
<section class="side-bar">
<h3 class="a11y-offset">Blog menu: </h3>
<ul class="bar-list">
<h4 class="bar-title bar-title-top">Get blog updates</h4>
<li class="bar-item">
<a class="bar-link feed-link" href="/feeds/blog.atom">Atom feed</a>
</li>
</ul>
<ul class="bar-list">
<h4 class="bar-title bar-title-top">Posts by topic</h4>
<%
for (i, topic) in self.topics.iter().enumerate() {
let mut topic_sanitized = String::from("");
if let Some(value) = self.topics_sanitized.get(i) {
topic_sanitized = String::from(value);
}
let mut num_blog_posts_topic = 0;
if let Some(indices) = self.topic_blog_indices.get(topic) {
num_blog_posts_topic = indices.len();
}
let topic_url = format!("/{}/topic/{}/", self.base_dir, topic_sanitized);
%>
<li class="bar-item">
<a class="bar-link" href="<%= topic_url %>"><%= topic %> (<%= num_blog_posts_topic %>)</a>
</li>
<% } %>
</ul>
<ul class="bar-list">
<h4 class="bar-title bar-title-top">Posts by year</h4>
<%
for year in &self.years {
let mut num_blog_posts_year = 0;
if let Some(indices) = self.year_blog_indices.get(year) {
num_blog_posts_year = indices.len();
}
let year_url = format!("/{}/year/{}/", self.base_dir, year);
%>
<li class="bar-item">
<a class="bar-link" href="<%= year_url %>"><%= year %> (<%= num_blog_posts_year %>)</a>
</li>
<% } %>
</ul>
</section>
</section>
</main>
<% include!("./partials/footer.stpl"); %>
</div>
<% include!("./partials/script_core.stpl"); %>
<script>
// make menu item active visually:
let menuItem = document.getElementById("Blog");
if (menuItem)
{
menuItem.classList.add("menu-item-active");
}
</script>
</body>
</html>