feat: Config option for enabling/disabling logo

Also adds relevant docs for new config options

Author: TasoOneAsia

README.md

@@ -44,6 +44,8 @@ The config can be found in `web/config.js`. This holds a plethora of configurati
 | BACKGROUND_IMAGES | An array of file names for images present in the `web/backgrounds` folder. | `BACKGROUND_IMAGES = ["1.jpg","2.jpg"]`
 | ENABLE_CURSOR | Whether to enable the cursor while in the loading screen | `ENABLE_CURSOR = false`
 | ENABLE_GFM_MARKDOWN | Whether to enable the `Github Flavored Markdown` spec for the parser | `ENABLE_GFM_MARKDOWN = true`
+| ENABLE_SERVER_LOGO | Whether to enable the server logo | `ENABLE_SERVER_LOGO = true`
+| SERVER_LOGO_POSITION | Where to place logo if enabled | `SERVER_LOGO_POSITION = 'top-left'`
 
 ## Customize
 

web/assets/script.js

@@ -3,7 +3,7 @@ import {
   BACKGROUND_CHANGE_INTERVAL,
   BACKGROUND_IMAGES,
   ENABLE_CURSOR,
-  SERVER_LOGO_POSITION
+  SERVER_LOGO_POSITION, ENABLE_SERVER_LOGO
 } from '../config.js'
 
 import { parsedMdTips } from "./markdown_parser.js";
@@ -124,7 +124,9 @@ const startBackgroundInterval = () => {
 /*
   Set Initial element class for server logo placement
 */
-const setServerLogoPosition = () => {
+const setupServerLogo = () => {
+  if (!ENABLE_SERVER_LOGO) return;
+  logoEl.css('visibility', 'visible')
   logoEl.addClass(SERVER_LOGO_POSITION)
 }
 
@@ -133,7 +135,7 @@ const setServerLogoPosition = () => {
 window.addEventListener('DOMContentLoaded', () => {
   startBackgroundInterval()
   setRandomTip()
-  setServerLogoPosition()
+  setupServerLogo()
   spinnerEl.fadeIn()
 })
 

web/assets/styles.css

@@ -74,8 +74,8 @@ a[onclick] {
 }
 
 #server-logo {
-  background:  url("./images/logo.png");
-  background-repeat: no-repeat;
+  background: url("./images/logo.png") no-repeat;
+  visibility: hidden;
   background-size: contain;
   position: absolute;
   width: 15vh;

web/config.js

@@ -49,5 +49,9 @@ export const ENABLE_CURSOR = true
 // Enable github flavored markdown
 export const ENABLE_GFM_MARKDOWN = false
 
+// Enable or disable the included server logo to change this
+// logo simply switch the `logo.png` file with the image of your choice
+export const ENABLE_SERVER_LOGO = true
+
 // Define server logo placement ['top-left', 'top-right', 'bottom-right', 'center']
 export const SERVER_LOGO_POSITION = 'center'