New pages and stuff, with @CloudburstSys

7 files changed, 149 insertions, 8 deletions

diff --git a/views/about.ejs b/views/about.ejs
index 1dfb4b0..9dc7a60 100644
--- a/views/about.ejs
+++ b/views/about.ejs
@@ -25,7 +25,23 @@
 <%- include("./partials/header.ejs", {title: "About Us"}) %>
 
 <div id="navbar-skipper">
-    Content here!
+    <br>
+    <div class="container">
+        <div class="section" id="this-section">
+            <!-- The pony who wrote this code is cute. - Scoots -->
+            <!-- The pony who wrote the above comment is cute. - Twi -->
+            <a class="section-title" href="#this-section">This section</a>
+            <p class="section-content">
+                We take our work very seriously, as you can see from the comments on this page.
+            </p>
+        </div>
+        <div class="section" id="another-section">
+            <a class="section-title" href="#this-section">Another section</a>
+            <p class="section-content">
+                Please don't see our code. Pleaaaaaase!
+            </p>
+        </div>
+    </div>
 </div>
 
 <%- include("./partials/footer.ejs") %>
\ No newline at end of file
diff --git a/views/broken.ejs b/views/broken.ejs
new file mode 100644
index 0000000..84c0e62
--- /dev/null
+++ b/views/broken.ejs
@@ -0,0 +1,31 @@
+<!--
+  ~ MIT License
+  ~
+  ~ Copyright (c) 2022- Equestria.dev Developers
+  ~
+  ~ Permission is hereby granted, free of charge, to any person obtaining a copy
+  ~ of this software and associated documentation files (the "Software"), to deal
+  ~ in the Software without restriction, including without limitation the rights
+  ~ to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+  ~ copies of the Software, and to permit persons to whom the Software is
+  ~ furnished to do so, subject to the following conditions:
+  ~
+  ~ The above copyright notice and this permission notice shall be included in all
+  ~ copies or substantial portions of the Software.
+  ~
+  ~ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+  ~ IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+  ~ FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+  ~ AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+  ~ LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+  ~ OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+  ~ SOFTWARE.
+  ~
+  -->
+<%- include("./partials/header.ejs", {title: "About Us"}) %>
+
+<div id="navbar-skipper">
+    <% throw new Error("Hello I'm a broken page") %>
+</div>
+
+<%- include("./partials/footer.ejs") %>
\ No newline at end of file
diff --git a/views/error.ejs b/views/error.ejs
new file mode 100644
index 0000000..cee0fd2
--- /dev/null
+++ b/views/error.ejs
@@ -0,0 +1,64 @@
+<!--
+  ~ MIT License
+  ~
+  ~ Copyright (c) 2022- Equestria.dev Developers
+  ~
+  ~ Permission is hereby granted, free of charge, to any person obtaining a copy
+  ~ of this software and associated documentation files (the "Software"), to deal
+  ~ in the Software without restriction, including without limitation the rights
+  ~ to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+  ~ copies of the Software, and to permit persons to whom the Software is
+  ~ furnished to do so, subject to the following conditions:
+  ~
+  ~ The above copyright notice and this permission notice shall be included in all
+  ~ copies or substantial portions of the Software.
+  ~
+  ~ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+  ~ IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+  ~ FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+  ~ AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+  ~ LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+  ~ OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+  ~ SOFTWARE.
+  ~
+  -->
+<%- include("./partials/header.ejs", {title: "Error " + code}) %>
+
+<div id="navbar-skipper">
+    <br>
+
+    <div class="container">
+        <h1 style="text-align: center;"><%= code %></h1>
+        <h2 style="text-align: center;"><%= message %></h2>
+        <p style="text-align: center;">An error occurred on our side, and we can't show this page for now. Please try again later! If you report a bug, a developer might ask you to give the weird code stuff below.</p>
+        <a class="btn btn-primary" href="/" style="margin-left:auto;margin-right:auto;display:block;width:max-content;">Go home</a>
+        <br>
+        <details>
+            <summary style="opacity: .5;">Show weird code stuff</summary>
+            <div style="background-color:rgba(0, 0, 0, .25);border-radius:10px;margin-top:10px;padding:10px;">
+                <ul>
+                    <li>URL: <%= req.url %></li>
+                    <%
+
+                    let ua = new UAParser(req.header('user-agent'));
+
+                    %>
+                    <li>Browser: <%= ua.getBrowser().name + " " + ua.getBrowser().version %></li>
+                    <li>Engine: <%= ua.getEngine().name + " " + ua.getEngine().version %></li>
+                    <li>Vapor Trail Version: <%= version %> (build <%= build %>)</li>
+                    <li>Core Version: <%= process.version %></li>
+                    <li>Memory (RSS): <%= (process.memoryUsage().rss / 1024).toFixed(2) %>K</li>
+                    <li>Memory (Heap Total): <%= (process.memoryUsage().heapTotal / 1024).toFixed(2) %>K</li>
+                    <li>Memory (Heap Used): <%= (process.memoryUsage().heapUsed / 1024).toFixed(2) %>K</li>
+                    <li>Memory (External): <%= (process.memoryUsage().heapUsed / 1024).toFixed(2) %>K</li>
+                    <li>Memory (Array Buffers): <%= (process.memoryUsage().arrayBuffers / 1024).toFixed(2) %>K</li>
+                </ul>
+                <% if (typeof err !== "undefined") { %>
+                <pre><%= err.stack %></pre>
+                <% } %>
+            </div>
+        </details>
+    </div>
+</div>
+
+<%- include("./partials/footer.ejs") %>
\ No newline at end of file
diff --git a/views/partials/header.ejs b/views/partials/header.ejs
index 431be60..fee03d8 100644
--- a/views/partials/header.ejs
+++ b/views/partials/header.ejs
@@ -32,6 +32,9 @@
     <link rel="stylesheet" href="/bootstrap/styles.css">
     <link rel="stylesheet" href="/assets/custom.css">
     <link rel="stylesheet" href="/assets/plurality.css">
+    <link rel="stylesheet" href="/assets/projects.css">
+    <link rel="stylesheet" href="/assets/about.css">
+    <link rel="icon" href="/assets/favicon.png" type="image/png">
     <script src="/bootstrap/script.js"></script>
     <title><%= title %> - The Cuties</title>
 </head>
diff --git a/views/plurality.ejs b/views/plurality.ejs
index 412906e..ad57734 100644
--- a/views/plurality.ejs
+++ b/views/plurality.ejs
@@ -39,10 +39,27 @@ let frontersRaindrops = raindrops['fronters']['members'].map((i) => { return i['
 <div id="navbar-skipper">
     <div class="container">
         <br>
-        <h2 style="text-align: center;">We are plural.</h2>
+        <h2 style="text-align: center;">Hello, we are plural!</h2>
+        <p style="text-align: center;"><%= (cloudburst["members"].length + raindrops["members"].length) - 2 %> ponies, 2 brains!</p>
 
+        <div id="cnp-intro-outer">
+            <div id="cnp-intro" style="display:grid;grid-template-columns: 131px 1fr;grid-gap:10px;background:#353535;border-radius:10px;padding:10px;">
+                <div id="cnp-image-outer" style="display:flex;align-items:center;">
+                    <img id="cnp-image" alt="" src="https://ponies.equestria.horse/Special:Redirect/file/Logo.jpg" style="height:131px;border-radius:10px;">
+                </div>
+                <div id="cnp-content-outer" style="display:flex;align-items:center;">
+                    <div id="cnp-content">
+                        <h4 id="cnp-title">There is even better than this page</h4>
+                        <span id="cnp-tagline">On <b>Cuties and Plurality</b>, you can get additional information about all of us, such as what each one of us likes doing, pronouns, species, and more.</span><br>
+                        <a id="cnp-link" href="https://ponies.equestria.horse" target="_blank" class="btn btn-outline-light" style="display:inline-block;margin-top:10px;">Read more</a>
+                    </div>
+                </div>
+            </div>
+        </div>
+
+        <br>
         <div id="systems">
-            <div>
+            <div id="system-cloudburst">
                 <img id="system-cloudburst-icon" class="system-icon" alt="" src="<%= cloudburst["general"]["avatar_url"] %>">
                 <h3 id="system-cloudburst-name" class="system-name">Cloudburst System</h3>
                 <p id="system-cloudburst-description" class="system-description">Plural system of <%= cloudburst["members"].length - 1 %> ponies!</p>
@@ -55,7 +72,7 @@ let frontersRaindrops = raindrops['fronters']['members'].map((i) => { return i['
                 </a>
                 <% }} %>
             </div>
-            <div>
+            <div id="system-raindrops">
                 <img id="system-raindrops-icon" class="system-icon" alt="" src="<%= raindrops["general"]["avatar_url"] %>">
                 <h3 id="system-raindrops-name" class="system-name">Raindrops System</h3>
                 <p id="system-raindrops-description" class="system-description">Plural system of <%= raindrops["members"].length - 1 %> ponies!</p>
diff --git a/views/projects.ejs b/views/projects.ejs
index 2e31af1..705a1fe 100644
--- a/views/projects.ejs
+++ b/views/projects.ejs
@@ -26,12 +26,20 @@
 
 <div id="navbar-skipper">
     <br>
+    <h2 style="text-align: center;">Projects</h2>
+    <p style="text-align: center;margin-bottom:20px;"><%= Object.keys(projectCache).length %> projects we're working on</p>
     <div class="projects-container container">
         <% for (let project of Object.keys(projectCache)) { %>
-        <div class="project" id="project-<%= project %>">
-            <% let data = projectCache[project]; %>>
-            <h3 class="name"><%= data.name %>></h3>
-        </div>
+        <% let data = projectCache[project]; %>
+        <a class="project" id="project-<%= data.id %>" target="_blank"
+            <% if (![undefined, null, ""].includes(data.url)) { %>
+                href="<%= data.url %>"
+            <% } %>
+        >
+            <img class="project-language" src="/assets/languages/<%= data.language %>.svg" />
+            <h3 class="project-name"><%= data.name %></h3>
+            <p class="project-description"><%= data.description %></p>
+        </a>
         <% } %>
     </div>
 </div>
diff --git a/views/servers.ejs b/views/servers.ejs
index 1367bfe..2248c6d 100644
--- a/views/servers.ejs
+++ b/views/servers.ejs
@@ -26,6 +26,8 @@
 
 <div id="navbar-skipper">
     <br>
+    <h2 style="text-align: center;">Servers</h2>
+    <p style="text-align: center;margin-bottom:20px;"><%= Object.keys(serverCache).length %> servers we manage</p>
     <div class="server-container container">
         <% for (let server of Object.keys(serverCache)) { %>
             <div class="server" id="server-<%= server %>">