Fix the readme to reference the renamed config

.gitignore

@@ -9,7 +9,7 @@ Thumbs.db
 ~$*
 
 # The active config file copied from config-dist.php
-variables.php
+config.php
 
 # Vim
 *.swp

README.md

@@ -14,7 +14,7 @@ This small project provides a web based viewer for comics in the CBZ and CBR for
 * Create a MySQL/MariaDB database for the app with privileges granted to a user
 * Import the `install/initial_db_mysql.sql` database structure
 * Change the ownership of the `comics/` and `thumbs/` folders to the web server user
-* Copy the `variables-dist.php` file to `variables.php` and edit that file appropriately
+* Copy the `config-dist.php` file to `config.php` and edit that file appropriately
 * Set up the cron job for things in [cron/](cron/). If installing on a systemd OS see services below.
 
 ## Services

ajax/showcomic.php

@@ -96,9 +96,7 @@ foreach ( $files as $file ) {
    $images[] = $comicoutputurl . $file;
    $captions[] = substr(basename($comicoutputurl), 0, -4) . ": {$count} of {$last}";
 }
-$debug = (DEBUG_SHOWCOMICAJAX || DEBUG_ALL);
 
-$data["debug"] = $debug;
 $data["images"] = $images;
 $data["captions"] = $captions;
 header('Content-Type: application/json');

config-dist.php

@@ -37,13 +37,6 @@ define('DBUSER', 'comics');
 define('DBPASS', 'comics');
 define('DBNAME', 'comics');
 
-//
-// These are some variables used for development and debugging.
-// They can be safely ignored.
-//
-define('DEBUG_ALL', false);
-define('DEBUG_SHOWCOMICAJAX', false);
-
 //
 // Constants
 //

css/comics.css

@@ -1,36 +1,43 @@
+:root {
+   --default-font: 'Comic Sans MS';
+   --background-color: #121211;
+   --foreground-color: #ddddd1;
+   --text-color: #22dd22;
+   --read-color: green;
+}
 
 body {
-   background-color: #121211;
+   background-color: var(--background-color);
-   color: #ddddd1;
+   color: var(--foreground-color);
-   font-family: 'Comic Sans MS';
+   font-family: var(--default-font);
    font-weight: bold;
    font-size: 15pt;
 }
 
 a, a:link, a:visited, a:active {
    text-decoration: none;
-   color: #22dd22;
+   color: var(--text-color);
 }
 
 #sortorder {
    cursor: pointer;
-   color: #22dd22;
+   color: var(--text-color);
 }
 
 .link {
    cursor: pointer;
-   color: #22dd22;
+   color: var(--text-color);
 }
 
 .header {
    height: 1em;
    font-size: 24pt;
    font-weight: bold;
-   font-family: 'Comic Sans MS';
+   font-family: var(--default-font);
    text-align: center;
    margin-left: 20px;
    margin-right: 20px;
-   border-bottom: 2px solid #ddddd1;
+   border-bottom: 2px solid var(--default-color);
 }
 .sorter {
    float: left;
@@ -58,20 +65,24 @@ a, a:link, a:visited, a:active {
    width: 330px;
    height: 495px;
    margin: 5px;
-   border: 2px solid #ddddd1;
+   border: 2px solid var(--default-color);
    padding: 2px;
    display: inline-block;
    overflow: hidden;
 }
 
 .readborder {
-   border-color: green !important;
+   border-color: var(--read-color) !important;
 }
 
-.debug {
+.fancybox-outer {
-   position: absolute;
+   background: #323231;
-   top: 0px;
+}
-   left: 0px;
+.fancybox-title {
-   z-index: 42;
+   font: normal 10px "Comic Sans MS";
+}
+.fancybox-title-over-wrap {
+   color: #bbb; padding: 0px 4px 0px 4px;
 }
 
+/* vim:sw=3 ts=3 et:

header.php

@@ -1,7 +1,7 @@
 <?php
 
-// Script defining constants and variables used in the comics system
+// Config file
-require 'variables.php';
+require 'config.php';
 // Script containing global functions used by all scripts
 require 'functions.php';
 // Script containing the "require_login() function"
@@ -21,7 +21,7 @@ if ( php_sapi_name() != "cli" ) {
     }
 
     // This session variable is set to the current browsing folder.
-    // It is relative to the COMICSDIR constant defined in variables.php
+    // It is relative to the COMICSDIR constant defined in config.php
     if ( !isset($_SESSION['compath']) ) {
         $_SESSION['compath'] = '/';
     }

htmlfooter.php

@@ -1,4 +1,6 @@
-<div id='debug' class='debug'></div>
+<script type='text/javascript' src='core/jquery-3.6.0.min.js'></script>
-
+<script type='text/javascript' src='core/simpleLightbox.min.js'></script>
+<script type='text/javascript' src='core/toastr.min.js'></script>
+<script type='text/javascript' src='js/comics.js'></script>
 </body>
 </html>

htmlheader.php

@@ -16,23 +16,6 @@
 <link rel='stylesheet' type='text/css' href='css/reset.css' media='screen' />
 <link rel='stylesheet' type='text/css' href='css/comics.css' media='screen' />
 <link rel="stylesheet" type="text/css" href="core/simpleLightbox.min.css" />
-<!-- Toastr CSS -->
 <link rel="stylesheet" type="text/css" href="core/toastr.css" />
-<script type='text/javascript' src='core/jquery-3.6.0.min.js'></script>
-<script type='text/javascript' src='js/comics.js'></script>
-<script type='text/javascript' src='core/simpleLightbox.min.js'></script>
-<script type='text/javascript' src='core/toastr.min.js'></script>
-<style type='text/css'>
-.fancybox-outer { background: #323231; }
-.fancybox-title { font: normal 10px "Comic Sans MS"; }
-.fancybox-title-over-wrap { color: #bbb; padding: 0px 4px 0px 4px; }
-.mtest {
-  margin-top: 0px;
-  margin-bottom: 0px;
-  padding-top: 0px;
-  padding-bottom: 0px;
-  border: 1px solid red;
-}
-</style>
 </head>
 <body>

js/comics.js

@@ -194,8 +194,7 @@ function updateCurrentPage() {
 // This JS function is called when a user clicks on a comic.
 // "showcomic.php" is called with the comic to view as a parameter.
 // It returns a JSON object representing the collection of images.
-// If in debug mode the javascript code is displayed in the browser.
+// A lightbox/modal object is created to display the comic.
-// If not in debug mode a lightbox object is created to display the comic.
 //
 function showComic(comic, name) {
    toastr.success("Extracting comic and opening viewer...", "Showing: " + name);
@@ -208,8 +207,6 @@ function showComic(comic, name) {
                        redirectToLogin();
                        return;
                     }
-                    // Clear out the debug DIV and start the fancybox.
-                    $("#debug").html("");
                     lightbox = SimpleLightbox.open({
                        items: data.images,
                        captions: data.captions,