markmental/ws4kp-linhanced
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

only load custom.js if present

Browse source
This commit is contained in:
Matt Walsh 2025-03-24 22:52:32 -05:00
commit 372cb0cfab
3 changed files with 27 additions and 8 deletions
Download patch file Download diff file Expand all files Collapse all files

15
server/scripts/custom.sample.js
View file

@ -2,8 +2,7 @@
// it is intended to allow for customizations that do not get published back to the git repo // it is intended to allow for customizations that do not get published back to the git repo
// for example, changing the logo // for example, changing the logo
// start running after all content is loaded const customTask = () => {
document.addEventListener('DOMContentLoaded', () => {
// get all of the logo images // get all of the logo images
const logos = document.querySelectorAll('.logo img'); const logos = document.querySelectorAll('.logo img');
// loop through each logo // loop through each logo
@ -11,4 +10,16 @@ document.addEventListener('DOMContentLoaded', () => {
// change the source // change the source
elem.src = 'my-custom-logo.gif'; elem.src = 'my-custom-logo.gif';
}); });
};
// start running after all content is loaded, or immediately if page content is already loaded
if (document.readyState === 'loading') {
// Loading hasn't finished yet
document.addEventListener('DOMContentLoaded', customTask);
} else {
// `DOMContentLoaded` has already fired
customTask();
}
document.addEventListener('DOMContentLoaded', () => {
}); });

13
server/scripts/index.mjs
View file

@ -9,6 +9,7 @@ import settings from './modules/settings.mjs';
document.addEventListener('DOMContentLoaded', () => { document.addEventListener('DOMContentLoaded', () => {
init(); init();
getCustomCode();
}); });
const categories = [ const categories = [
@ -413,3 +414,15 @@ const fullScreenResizeCheck = () => {
// store state of fullscreen element for next change detection // store state of fullscreen element for next change detection
fullScreenResizeCheck.wasFull = !!document.fullscreenElement; fullScreenResizeCheck.wasFull = !!document.fullscreenElement;
}; };
const getCustomCode = async () => {
// fetch the custom file and see if it returns a 200 status
const response = await fetch('scripts/custom.js', { method: 'HEAD' });
if (response.ok) {
// add the script element to the page
const customElem = document.createElement('script');
customElem.src = 'scripts/custom.js';
customElem.type = 'text/javascript';
document.body.append(customElem);
}
};

7
views/index.ejs
View file

@ -1,4 +1,4 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml"> <html lang="en" xmlns="http://www.w3.org/1999/xhtml">
@ -20,7 +20,6 @@
<script type="text/javascript" src="resources/data.min.js?_=<%=production%>"></script> <script type="text/javascript" src="resources/data.min.js?_=<%=production%>"></script>
<script type="text/javascript" src="resources/vendor.min.js?_=<%=production%>"></script> <script type="text/javascript" src="resources/vendor.min.js?_=<%=production%>"></script>
<script type="text/javascript" src="resources/ws.min.js?_=<%=production%>"></script> <script type="text/javascript" src="resources/ws.min.js?_=<%=production%>"></script>
<script type="text/javascript" src="scripts/custom.js?_=<%=production%>"></script>
<% } else { %> <% } else { %>
<link rel="stylesheet" type="text/css" href="styles/main.css" /> <link rel="stylesheet" type="text/css" href="styles/main.css" />
<script type="text/javascript" src="scripts/vendor/auto/jquery.js"></script> <script type="text/javascript" src="scripts/vendor/auto/jquery.js"></script>
@ -45,14 +44,10 @@
<script type="module" src="scripts/modules/radar.mjs"></script> <script type="module" src="scripts/modules/radar.mjs"></script>
<script type="module" src="scripts/modules/settings.mjs"></script> <script type="module" src="scripts/modules/settings.mjs"></script>
<script type="module" src="scripts/index.mjs"></script> <script type="module" src="scripts/index.mjs"></script>
<script type="text/javascript" src="scripts/custom.js"></script>
<!-- data --> <!-- data -->
<script type="text/javascript" src="scripts/data/travelcities.js"></script> <script type="text/javascript" src="scripts/data/travelcities.js"></script>
<script type="text/javascript" src="scripts/data/regionalcities.js"></script> <script type="text/javascript" src="scripts/data/regionalcities.js"></script>
<script type="text/javascript" src="scripts/data/stations.js"></script> <script type="text/javascript" src="scripts/data/stations.js"></script>
<script type="text/javascript" src="scripts/custom.js"></script>
<% } %> <% } %>
</head> </head>