ref #main: style fixes

Author: kzorluoglu

functions.php

@@ -1,4 +1,17 @@
 <?php
+
+function d8_set_permalink_structure() {
+    // Check if the permalink structure is already set to 'post name'
+    if ( get_option('permalink_structure') !== '/%postname%/' ) {
+        // Set the permalink structure to 'post name'
+        global $wp_rewrite;
+        $wp_rewrite->set_permalink_structure('/%postname%/');
+        $wp_rewrite->flush_rules();
+    }
+}
+
+add_action('after_switch_theme', 'd8_set_permalink_structure');
+
 function terminal_theme_scripts() {
     wp_enqueue_style('terminal-style', get_template_directory_uri() . '/style.css');
     // Enqueue your script
@@ -8,13 +21,17 @@ function terminal_theme_scripts() {
     wp_localize_script('terminal-theme-script', 'wpData', array(
         'baseUrl' => get_site_url(),
 		'siteTitle' => get_bloginfo('name'), // Retrieves the WordPress site title
-		'siteDescription' => get_bloginfo('description'), // Retrieves the WordPress site description 
+		'siteDescription' => get_bloginfo('description'), // Retrieves the WordPress site description
+        'memoryUsage' => size_format(memory_get_usage(), 2),
+        'currentTheme' => wp_get_theme()->get('Name'),
+        'serverSoftware' => $_SERVER['SERVER_SOFTWARE'],
+        'ipAddress' => $_SERVER['REMOTE_ADDR'],
+        'requestTime' => $_SERVER['REQUEST_TIME'],
     ));
 }
 
 add_action('wp_enqueue_scripts', 'terminal_theme_scripts');
 
-
 function terminal_setup() {
     add_theme_support( 'title-tag' );
     add_theme_support( 'automatic-feed-links' );
@@ -25,15 +42,15 @@ function terminal_setup() {
 
 
 function terminal_meta_description() {
+
+    $description = '';
+
     if (is_single() || is_page()) {
         // For single posts or pages
         $description = get_the_excerpt();
     } elseif (is_home() || is_front_page()) {
         // For the home/front page
         $description = get_bloginfo('description');
-    } else {
-        // Default description
-        $description = 'Your default description here';
     }
 
     return esc_attr(strip_tags($description));

script.js

@@ -2,21 +2,29 @@ const config = {
     baseUrl: wpData.baseUrl, // This will be dynamically set to the WordPress base URL,
 	siteTitle: wpData.siteTitle,
 	siteDescription: wpData.siteDescription,
+    currentTheme: wpData.currentTheme,
+    memoryUsage: wpData.memoryUsage,
+    serverSoftware: wpData.serverSoftware,
+    ipAddress: wpData.ipAddress,
+    requestTime: wpData.requestTime,
 
 };
 
 const history = document.getElementById('history');
 
-welcomeScreen();
+document.addEventListener('DOMContentLoaded', (event) => {
+    welcomeScreen();
+});
 
-function welcomeScreen() {
-	getTitle();
-	executeCommand('help');
+async function welcomeScreen() {
+	getTitle().then(r => {
+        executeCommand('help').then(r => {
+            autoExecuteCommandFromURL();
+        });
+    } );
 }
 
-document.addEventListener('DOMContentLoaded', (event) => {
-    autoExecuteCommandFromURL();
-});
+
 
 async function autoExecuteCommandFromURL() {
     const url = window.location.href;
@@ -123,6 +131,9 @@ function appendCommandInput() {
 
 async function getTitle() {
 
+    const totalPosts = await getTotalPosts();
+    const totalCategories = await getTotalCategories();
+
 	const domain = new URL(config.baseUrl).hostname;
 	const emailAddress = `hello@${domain}`;
 
@@ -131,14 +142,30 @@ async function getTitle() {
 	history.innerHTML += `<div class="command-output">$</div>`;
 	history.innerHTML += `<div class="command-output">$ System information as of ${new Date().toLocaleString()}</div>`;
 	history.innerHTML += `<div class="command-output">$</div>`;
-	history.innerHTML += `<div class="command-output">$ System load:  [Data Unavailable]    Processes:           [Data Unavailable]</div>`;
-	history.innerHTML += `<div class="command-output">$ Usage of /:   [Data Unavailable]    Users logged in:     [Data Unavailable]</div>`;
-	history.innerHTML += `<div class="command-output">$ Memory usage: [Data Unavailable]    IP address:          [Data Unavailable]</div>`;
-	history.innerHTML += `<div class="command-output">$ Swap usage:   [Data Unavailable]</div>`;
-	history.innerHTML += `<div class="command-output">$</div>`;
-	history.innerHTML += `<div class="command-output">$ [Number] articles can be explored.</div>`;
-	history.innerHTML += `<div class="command-output">$ [Number] categories to discover.</div>`;
-	history.innerHTML += `<div class="command-output">$</div>`;
+    history.innerHTML += `
+    <table class="no-spacing">
+        <tr>
+            <td>$ System software:</td>
+            <td>${config.serverSoftware}</td>
+            <td>Total Articles:</td>
+            <td>${totalPosts}</td>
+        </tr>
+        <tr>
+            <td>$ Request Time:</td>
+            <td>${config.requestTime}</td>
+            <td>Total Categories:</td>
+            <td>${totalCategories}</td>
+        </tr>
+        <tr>
+            <td>$ Memory usage:</td>
+            <td>${config.memoryUsage}</td>
+            <td>IP address:</td>
+            <td>${config.ipAddress}</td>
+        </tr>
+    </table>
+`;
+    history.innerHTML += `<div class="command-output">$ Current theme: ${config.currentTheme} </div>`;
+    history.innerHTML += `<div class="command-output">$</div>`;
 }
 
 
@@ -351,3 +378,23 @@ function openImagePopup(imageUrl) {
 
     document.body.appendChild(popup);
 }
+
+async function getTotalPosts() {
+    try {
+        const response = await fetch(`${config.baseUrl}/wp-json/wp/v2/posts?per_page=1`);
+        return response.headers.get('X-WP-Total');
+    } catch (error) {
+        console.error('Error fetching total posts:', error);
+        return 'Unavailable';
+    }
+}
+
+async function getTotalCategories() {
+    try {
+        const response = await fetch(`${config.baseUrl}/wp-json/wp/v2/categories?per_page=1`);
+        return response.headers.get('X-WP-Total');
+    } catch (error) {
+        console.error('Error fetching total categories:', error);
+        return 'Unavailable';
+    }
+}

style.css

@@ -126,4 +126,51 @@ body, html {
 
 .share-links a:hover {
     text-decoration: underline; /* Adds underline on hover */
+}
+
+table.no-spacing {
+    border-spacing:0; /* Removes the cell spacing via CSS */
+    border-collapse: collapse;  /* Optional - if you don't want to have double border where cells touch */
+}
+
+pre {
+    background-color: #f5f5f5; /* Light grey background */
+    border: 1px solid #ddd; /* Light border */
+    border-left: 3px solid #f36d33; /* Accent border */
+    color: #666; /* Darker text color for readability */
+    page-break-inside: avoid;
+    font-family: monospace;
+    font-size: 15px; /* Larger font size */
+    line-height: 1.6;
+    margin-bottom: 1.6em;
+    max-width: 100%;
+    overflow: auto;
+    padding: 1em 1.5em;
+    display: block;
+    word-wrap: break-word;
+}
+
+code {
+    font-family: monospace;
+    font-size: 0.9em; /* Slightly smaller font size */
+}
+@media (max-width: 600px) {
+    pre {
+        padding: 0.5em; /* Smaller padding on small screens */
+    }
+}
+
+h1, h2, h3, h4, h5, h6 {
+    color: #fff; /* White color for headers */
+    margin-top: 1em;
+    margin-bottom: 0.5em;
+}
+
+p {
+    margin-bottom: 1em;
+}
+
+ul, ol {
+    margin-left: 20px;
+    margin-bottom: 1em;
 }