Select Git revision
rendering.ts
Code owners
Assign users and groups as approvers for specific file changes. Learn more.
rendering.ts 14.36 KiB
import { FinishedTranscriptMeta, Resolution, Todo } from "./parsing";
export function renderResolutionToHtml(resolution: Resolution): string {
return `
<div class="card mb-3 text-center" id="${resolution.number}">
<div class="card-header" >Beschluss <code>${resolution.number}</code></div>
<div class="card-body">
<h5 class="card-title"></h5>
<p class="card-text">${resolution.text}</p>
<div class="container container-sm">
<div class="row align-items-center">
<div class="col">
<span class="p-1 border-bottom border-success border-2">
Ja: ${resolution.votes.yes}
</span>
</div>
<div class="col">
<span class="p-1 border-bottom border-danger border-2">
Nein: ${resolution.votes.no}
</span>
</div>
<div class="col">
<span class="p-1 border-bottom border-info border-2">
Enthaltung: ${resolution.votes.abstention}
</span>
</div>
</div>
</div>
</div>
<div class="card-footer ${
resolution.result === "Angenommen" ? "bg-success" : "bg-danger"
} bg-opacity-25">
${resolution.result}
</div>
${
resolution.provisional
? `<div class="card-footer bg-warning bg-opacity-25">
<strong class="font-bold">Kommissarisch, weil:</strong> ${resolution.provisional}
</div>`
: ""
}
</div>`;
}
export function renderTodoToHtml(todo: Todo): string {
return `
<div class="card mb-3 text-center">
<div class="card-header">Neues To-Do</div>
<div class="card-body">
<h5 class="card-title"></h5>
<p class="card-text">${todo.text}</p>
</div>
<div class="card-footer bg-info bg-opacity-25">
<div class="bg-opacity-100">
${
todo.team
? `<span class="badge text-bg-info mb-1 me-1">Team: ${todo.team}</span>`
: ""
}
${
todo.people
? `<span class="badge text-bg-info mb-1 me-1">Zuständig: ${todo.people}</span>`
: ""
}
</div>
</div>
</div>`;
}
export function generateFooterPartialHtml(depth: number = 0): string {
const depthTraversal = new Array(depth).fill("..").join("/");
return `
<footer class="my-5 container text-center">
<p>
<a href="https://fsinfo.cs.tu-dortmund.de/impressum">Impressum</a>
|
<a href="https://fsinfo.cs.tu-dortmund.de/datenschutz/start">Datenschutz</a>
</p>
<p class="text-muted">
<small>
<a href="./${depthTraversal}/index.json">JSON</a> <a href="./${depthTraversal}/index.xml">RSS-Feed</a>
</small>
</p>
<p class="text-muted">
<small>
HTML generiert: ${new Date().toLocaleString("de-DE")}
</small>
</p>
</footer>`;
}
export function renderTranscriptPageHtml(
transcriptHtml: string,
meta: any,
): string {
return `<!DOCTYPE html>
<html lang="de">
<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" />
<title>${meta.title}</title>
<link href="../../bootstrap.min.css" rel="stylesheet">
<style>
div:target {
border-width: 0.4rem;
border-color: #f4c4aa;
scroll-margin-top: 4rem;
}
h1 {
border-top: solid 0.1rem;
margin-top: 2rem;
padding-top: 1rem;
}
@media print {
.hide-in-print {
display: none !important;
}
}
</style>
<script>
window.addEventListener("beforeprint", () => document.getElementById("metadata").open = true );
window.addEventListener("afterprint", () => document.getElementById("metadata").open = false );
</script>
</head>
<body class="bg-body">
<div>
<header class="hide-in-print">
<nav class="navbar navbar-expand bg-body-tertiary">
<ul class="navbar-nav">
<li class="nav-item">
<a class="nav-link" href="../..">Protokolle</a>
</li>
<li class="nav-item">
<a class="nav-link" href="../../resolutions/">Beschlüsse</a>
</li>
<li class="nav-item">
<a class="nav-link" href="https://gitlab.fachschaften.org/search?group_id=29&project_id=77&repository_ref=master&scope=blobs&search=">Suche</a>
</li>
</ul>
</nav>
</header>
</div>
<div class="container mt-2 mb-2">
<div class="bg-body-tertiary">
<article class="p-4">
<div class="p-2 rounded text-center" style="background-color: #DDDDDD">
Fehler in diesem Protokoll können von Gremien-Mitgliedern
<a href="https://gitlab.fachschaften.org/tudo-fsinfo/fsr/sitzungen/-/merge_requests">direkt per Merge Request</a>
behoben werden. Andernfalls bitte an die Protokollanten (siehe <a href="https://oh14.de/fsr">oh14.de/fsr</a>) wenden.
</div>
<h1 class="mb-4">${meta.title}</h1>
<div class="card mb-4">
<details class="card-body" id="metadata">
<summary class="hide-in-print"><b>Metadaten</b></summary>
<p>
Start: ${meta.start}, Ende: ${meta.end}
<br />
Sitzungsleitung: ${meta.head}, Protokoll: ${meta.author}
</p>
<div class="row">
<div class="col">
<b>Anwesend:</b>
<ul>
${meta.present.map((p) => "<li>" + p + "</li>").join("\n")}
</ul>
</div>
<div class="col">
<b>Abwesend:</b>
<ul>
${meta.absent.map((p) => "<li>" + p + "</li>").join("\n")}
</ul>
</div>
<div class="col">
<b>Gäste:</b>
<ul>
${meta.guests.map((p) => "<li>" + p + "</li>").join("\n")}
</ul>
</div>
</div>
</details>
</div>
<div class="ms-2 me-2">
<p><i>Die Sitzung wird um ${meta.start} eröffnet.</i></p>
${transcriptHtml}
<p><i>Die Sitzung wird um ${meta.end} geschlossen.</i></p>
</div>
</article>
</div>
</div>
${generateFooterPartialHtml(2)}
</body>
</html>`;
}
function getTranscriptFilename(t: FinishedTranscriptMeta) {
return [
"fsr-sitzung",
typeof t.number === "number" ? `${t.number}`.padStart(3, '0') : null,
`${t.date}`,
t.label && t.spec_version === -1 ? `${t.label.toLowerCase()}` : null,
].filter(x => x !== null).join("-")
+ (t.spec_version === -1 ? ".pdf" : "");
}
function getTranscriptTitle(t: FinishedTranscriptMeta) {
const interjection =
(t.number ? ` ${t.number}` : "")
+ (t.label ? ` ${t.label}` : "");
return `FSR-Sitzung${interjection} (${t.date})`;
}
export function generateIndexHtml(
transcripts: FinishedTranscriptMeta[],
): string {
return `<!DOCTYPE html>
<html lang="de">
<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" />
<title>FSR-Protokolle</title>
<link href="./bootstrap.min.css" rel="stylesheet">
</head>
<body>
<div class="">
<header>
<nav class="navbar navbar-expand bg-body-tertiary">
<ul class="navbar-nav">
<li class="nav-item">
<a class="nav-link" href="#">Protokolle</a>
</li>
<li class="nav-item">
<a class="nav-link" href="./resolutions/">Beschlüsse</a>
</li>
<li class="nav-item">
<a class="nav-link" href="https://gitlab.fachschaften.org/search?group_id=29&project_id=77&repository_ref=master&scope=blobs&search=">Suche</a>
</li>
</ul>
</nav>
</header>
</div>
<div class="container mt-2 mb-2">
<ul>
${transcripts
.map((t) => {
const title = getTranscriptTitle(t);
return `<li>${!t.no_link ? `<a href="./protokolle/${getTranscriptFilename(t)}">${title}</a>` : title}</li>`;
})
.join("\n")}
</ul>
</div>
${generateFooterPartialHtml(0)}
</body>
</html>`;
}
export function generateResolutionsHtml(
transcripts: FinishedTranscriptMeta[],
modifiedBy: Map<string, string[]>,
): string {
return `<!DOCTYPE html>
<html lang="de">
<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" />
<title>FSR-Protokolle</title>
<link href="../bootstrap.min.css" rel="stylesheet">
<style>
tr:target {
border-width: 0.4rem;
border-color: #f4c4aa;
scroll-margin-top: 4rem;
}
details > summary {
color: #a7a8aa;
}
details[open] > summary {
color: #a7a8aa;
}
</style>
</head>
<body>
<svg style="display: none" version="2.0">
<defs>
<symbol id="clipboard-icon" viewbox="0 0 16 16" fill="currentColor">
<path d="M4 1.5H3a2 2 0 0 0-2 2V14a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V3.5a2 2 0 0 0-2-2h-1v1h1a1 1 0 0 1 1 1V14a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V3.5a1 1 0 0 1 1-1h1v-1z"/>
<path d="M9.5 1a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-3a.5.5 0 0 1-.5-.5v-1a.5.5 0 0 1 .5-.5h3zm-3-1A1.5 1.5 0 0 0 5 1.5v1A1.5 1.5 0 0 0 6.5 4h3A1.5 1.5 0 0 0 11 2.5v-1A1.5 1.5 0 0 0 9.5 0h-3z"/>
</symbol>
</defs>
<use href="#clipboard-icon"/>
</svg>
<div class="">
<header>
<nav class="navbar navbar-expand bg-body-tertiary">
<ul class="navbar-nav">
<li class="nav-item">
<a class="nav-link" href="../">Protokolle</a>
<i class="fa fa-link"></i> </li>
<li class="nav-item">
<a class="nav-link" href="#">Beschlüsse</a>
</li>
<li class="nav-item">
<a class="nav-link" href="https://gitlab.fachschaften.org/search?group_id=29&project_id=77&repository_ref=master&scope=blobs&search=">Suche</a>
</li>
</ul>
</nav>
</header>
</div>
<div class="container mt-2 mb-2">
<table class="table">
<thead>
<tr>
<th>
Datum
</th>
<th>
Nummer
</th>
<th>
Text
</th>
<th>
Ja/Nein/Enth.
</th>
<th>
Ergebnis
</th>
<th>
⚓️
</th>
</tr>
</thead>
<tbody>
${transcripts
.map((t) => {
const transcriptFilename = !t.no_link
? getTranscriptFilename(t)
: null;
const resolutions = t.resolutions ?? [];
return resolutions.map((r) =>
generateResolutionRowHtml(
r,
transcriptFilename,
t.date,
modifiedBy.get(r.number),
),
);
})
.flat()
.join("\n")}
</tbody>
</table>
</div>
${generateFooterPartialHtml(0)}
</body>
</html>`;
}
function generateResolutionRowHtml(
resolution: Resolution,
transcriptFileName?: string,
date: string,
modifiedBy?: string[],
): string {
function samePageResolutionLink(number: string) {
return `<a href=${"#" + number}>${number}</a>`;
}
let linkedNumber =
transcriptFileName !== null
? `<a href="../protokolle/${transcriptFileName}/#${resolution.number}">${resolution.number}</a>`
: `${resolution.number}`;
return `<tr id="${resolution.number}">
<td>
${date}
</td>
<td>
${linkedNumber}
</td>
<td>
${resolution.text}
${
resolution.modifies && resolution.modifies.length > 0
? `<p><strong>Modifiziert:</strong> ${resolution.modifies
.map(samePageResolutionLink)
.join(", ")}</p>`
: ""
}
${
modifiedBy
? `<p><strong>Modifiziert von:</strong> ${modifiedBy
.map(samePageResolutionLink)
.join(", ")}</p>`
: ""
}
${
resolution.provisional
? `<p><strong>Kommissarisch, weil:</strong> ${resolution.provisional}</p>`
: ""
}
${
typeof resolution.money_granted === "string"
? generateHledgerDetailsHtml(resolution)
: ""
}
${
resolution.note
? `<p><strong>Notiz:</strong> ${resolution.note}</p>`
: ""
}
</td>
<td>
${resolution.votes.yes} / ${resolution.votes.no} / ${
resolution.votes.abstention
}
</td>
<td>
${resolution.result}
</td>
<td>
<a href="#${resolution.number}">
🔗
</a>
</td>
</tr>`;
}
export function generateTranscriptsRssXml(
transcripts: FinishedTranscriptMeta[],
rootUrl: string | null = null,
): string {
return `<?xml version="1.0" encoding="UTF-8" ?>
<rss version="2.0">
<channel>
<title>Protokolle</title>
${transcripts
.map(
(t) =>
`<item>${
!t.no_link
? `<link>${rootUrl ?? "."}/protokolle/${getTranscriptFilename(t)}</link>`
: ``
}<description>${getTranscriptTitle(t)}</description><title>${getTranscriptTitle(t)}</title><pubDate>${t.date}</pubDate></item>`,
)
.join("\n ")}
</channel>
</rss>`;
}
function generateHledgerDetailsHtml(resolution: Resolution): string {
const hledgerText = `${resolution.date} ${resolution.number}: beschlossen
[Gebunden:${resolution.number}] ${resolution.money_granted}
[Vermögen:FSR:Gebunden]`;
return `<details><summary><small class="text-body-secondary fw-light">Hledger-Statement für die Buchhaltung</small></summary><pre><code id="reso-text-${resolution.number}">${hledgerText}</code></pre><button class="btn btn-outline-primary btn-sm" onclick="navigator.clipboard.writeText(document.getElementById(\'reso-text-${resolution.number}\').innerText)"><svg width="16" height="16" version="2.0"><use href="#clipboard-icon" /></svg> Hledger-Statement kopieren</button></details>`;
}