Unfinished stats page, FAQ mini section, other changes

This commit is contained in:
bingus_violet 2024-05-15 22:31:17 -05:00
parent 4805c1ba48
commit 25353fe2df
5 changed files with 65 additions and 12 deletions

View file

@ -82,6 +82,8 @@ function converter(html, query) {
} }
var replacers = { var replacers = {
"ALL_KEYWORDS": undefined,
"ALL_HIGHLIGHTS": Object.keys(highlightedWords).join(", "),
"BRANCH_NAME": bnchName, "BRANCH_NAME": bnchName,
"BRANCH_SUB": bnchSub, "BRANCH_SUB": bnchSub,
"COMMIT_COUNT": commitCount, "COMMIT_COUNT": commitCount,
@ -103,6 +105,8 @@ function converter(html, query) {
"WEATHER_TEXT": "" "WEATHER_TEXT": ""
} }
replacers.ALL_KEYWORDS = "{" + Object.keys(replacers).join("}{") + "} "
var rpTable = Object.keys(replacers) var rpTable = Object.keys(replacers)
for (let index = 0; index < rpTable.length; index++) { for (let index = 0; index < rpTable.length; index++) {

View file

@ -26,12 +26,13 @@
<h2><br>1. Questions & Answers<hr></h2> <h2><br>1. Questions & Answers<hr></h2>
<main> <main>
<h3>Why are so many words colored?</h3> <h3>Why are so many words colored?</h3>
<p>I like the way it looks to have certain words be highlighted, makes it look fancier and easier to read (imo). So, when I remade this site, I went ahead and added an <em>Automatic Word Highlighting System!</em> This allows me have words automatically highlighted, on the server side, without having to do it in the code manually. E.G.</p> <p>I like the way it looks to have certain words be highlighted, makes it look fancier and easier to read (imo). So, when I remade this site, I went ahead and added an <em>Automatic Word Highlighting System!</em> This allows me have words automatically highlighted, on the server side, without having to do it in the code manually. Here's the current list of highlighted words:</p>
<p>Godot Engine, Javascript, NodeJS, Forgejo, Violet, Asahi, CSS, and more :)</p> <p class="textBlock">{ALL_HIGHLIGHTS}</p>
<br>
<h3>I thought the site doesn't use Javascript? So why is it there?</h3> <h3>I thought the site doesn't use Javascript? So why is it there?</h3>
<p>Originally, all my sites were completely Javascript free. As of late, though, I decided to add Javascript to this one. Javascript will <b><em>NEVER</em></b> be a requirement on this site. Javascript will ONLY be used where nessacary, and I will do everything possible to make the experience indistinguishable.</p> <p>Originally, all my sites were completely Javascript free. As of late, though, I decided to add Javascript to this one. Javascript will <b><em>NEVER</em></b> be a requirement on this site. Javascript will ONLY be used where nessacary, and I will do everything possible to make the experience indistinguishable.</p>
<p>For example, things such as the song duration bar on my activities are pure HTML, using some mathy NodeJS-generated CSS animations! The only thing the site uses Javascript for right now, is setting the scroll to the top of the page on reload, and real time updating discord activities.</p>
</main> </main>
<p>For example, things such as the song duration bar on my activities are pure HTML, using some mathy NodeJS-generated CSS animations! The only thing the site uses Javascript for right now, is setting the scroll to the top of the page on reload, and real time updating discord activities.</p>
<h3>Why are there 4 CSS files?</h3> <h3>Why are there 4 CSS files?</h3>
<p>Originally the idea was that I could organize the site with:</p> <p>Originally the idea was that I could organize the site with:</p>
<ol> <ol>

View file

@ -83,16 +83,10 @@
<h1>Socials</h1> <h1>Socials</h1>
{PATH_SOCIALS} {PATH_SOCIALS}
<br> <br>
<!-- <h1>FAQ:</h1> <h1><hr>FAQ</h1>
{PATH_FAQ} --> {PATH_FAQ}
<h1><hr>Stats</h1> {PATH_STATS}
<br>
<ul>
<li>Page generation time: {LOAD_TIME}</li>
<li>Uptime: {UPTIME}</li>
<li>Total reloads: {RELOAD_COUNT}</li>
</ul>
<p>{WEATHER_TEXT}</p> <p>{WEATHER_TEXT}</p>
<br> <br>

44
static/stats/index.html Normal file
View file

@ -0,0 +1,44 @@
<!DOCTYPE html>
<html lang="en">
<head>
<link rel="stylesheet" type="text/css" href="../style.css">
<link rel="stylesheet" type="text/css" href="../subpage.css">
<script src="../main.js"></script>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Violet's Purgatory</title>
<meta name="darkreader-lock">
<meta content="Stats - Violet's Purgatory" property="og:title" />
<meta content="This page just does a semi-intensive speed test on the site, and displays related statistics." property="og:description" />
<meta content="https://api.violets-purgatory.dev/v1/pfp" property="og:image" />
<meta content="#a200ff" data-react-helmet="true" name="theme-color" />
</head>
<body>
{WEATHER_MODIFIER}
<h1>Stats</h1>
<p>This is the <em>full</em> stats page! This page exists for testing the speed of site generation, and contains every keyword on Violet's Purgatory in a hidden div.</p>
<div style="display: none">
{ALL_KEYWORDS} {ALL_KEYWORDS} {ALL_KEYWORDS} {ALL_KEYWORDS} {ALL_KEYWORDS}
</div>
<main>
<h1><hr>Stats</h1>
<br>
<ul>
<li>Page generation time: {LOAD_TIME}</li>
<li>Uptime: {UPTIME}</li>
<li>Total reloads: {RELOAD_COUNT}</li>
</ul>
</main>
</div>
</body>
</html>

View file

@ -244,6 +244,16 @@ li {
margin-right: 1.9%; margin-right: 1.9%;
} }
.textBlock {
color: rgb(255, 255, 255);
white-space: pre-wrap;
background-color: rgb(20, 20, 20);
border: 2px lightgray solid;
padding: 15px;
/* font-family: 'Source Code Pro', sans-serif; */
text-align: center;
}
.lengthBar>span { .lengthBar>span {
margin: 0; margin: 0;
padding: 0; padding: 0;