Changing HTML insertion approach

src/randomization.mjs

@@ -1,6 +1,7 @@
 import pkg from './routes.mjs';
 import { existsSync, readFileSync } from 'fs';
 const { cookingInserts, vegetables, charRandom, splashRandom, cacheBustList, text404 } = pkg;
+export { insertText, paintSource, tryReadFile };
 
 /*
 //  Try this instead of the .replace method. Might be more performant.
@@ -14,13 +15,14 @@ const insertText = (lis, str, newText) => {
 //  This will put other relevant argument types, like a string, into a list.
     lis = [].concat(lis);
 
+    let position;
 //  Loop through each of the placeholder strings.
-    for (let i = lis.length - 1, position; i >= 0; i--) {
+    for (let placeholder of lis) {
 //      Find all matches of a placeholder string and insert new text there.
-        while ((position = str.indexOf(lis[i])) >= 0)
+        while ((position = str.indexOf(placeholder)) >= 0)
             str = str.slice(0, position)
                 + (typeof newText == "function" ? newText() : newText)
-                + str.slice(position + lis[i].length);
+                + str.slice(position + placeholder.length);
     }
     return str;
 };
@@ -59,12 +61,10 @@ cacheBusting = str => {
     for (let item of Object.entries(cacheBustList))
         str = insertText(item[0], str, item[1]);
     return str;
-};
-
-
+},
 
 //  Applies the final obfuscation changes to an entire file.
-export const paintSource = str => insertCharset(hutaoInsert(insertCooking(cacheBusting(str)))),
+paintSource = str => insertCharset(hutaoInsert(insertCooking(cacheBusting(str)))),
 
 //  Grabs the text content of a file.
 tryReadFile = file => existsSync(file) ? readFileSync(file, "utf8") : text404;

src/server.mjs

@@ -1,4 +1,5 @@
 import { paintSource, tryReadFile } from './randomization.mjs';
+import loadTemplates from './templates.mjs';
 import pkg from './routes.mjs';
 import { readFile } from 'fs/promises';
 import path from 'path';
@@ -98,13 +99,13 @@ app.use(helmet({
 //  This takes one of those files and displays it for a site visitor.
 //  Query strings like /?j are converted into paths like /views/hidden.html
 //  back here. Which query string converts to what is defined in routes.mjs.
-router.get('/', async (req, res) => res.send(paintSource(tryReadFile(
+router.get('/', async (req, res) => res.send(paintSource(loadTemplates(tryReadFile(
     path.join(__dirname,
     'views',
 //  This returns the file path, and has the index page set as the home page.
     '/?'.indexOf(req.url) ? pages[Object.keys(req.query)[0]] : pages.index
     )
-))));
+)))));
 
 
 app.use(router);
@@ -116,7 +117,7 @@ app.use("/baremux/", express.static(baremuxPath));
 app.disable('x-powered-by');
 
 app.use((req, res) => {
-    res.status(404).send(paintSource(text404));
+    res.status(404).send(paintSource(loadTemplates(text404)));
 });
 
 

src/templates.mjs

@@ -0,0 +1,16 @@
+import insertText from './randomization.mjs';
+export { loadTemplates as default };
+
+
+const header = '<a href=/ class=brand>H­o­ly U­n­b­lo­c­k­er v5.­7.8</a> <input id=mnavecb type=checkbox> <label class=mnave for=mnavecb><span class=mnavebutton></span></label><ul class=navbar><li><a href=/?z>W­eb Pr­ox­ie­s</a><li><a href=/?g>G­a­me­s</a><li><a href=/?y>Yo­uT­u­be</a><li><a href=/?sx>Applications</a><li class=dropdown-parent><a href=#>M­or­e <i class="fas fa-ellipsis-v"></i></a><div class=dropdown-child tabindex=0><ul class=subnavbar><i class="fas fa-bars"></i><li><a href=/?x>Book­mark­lets</a><li><a href=/?in>Docs</a><li><a href=/?faq>FA­Q</a><li><a href=/?c>Credit­s</a><li><a href=/?t>TO­S</a></ul></div><li class=dropdown-parent><a href=#>Settings <i class="fas fa-tools"></i></a><div class=dropdown-child tabindex=0><div id=csel></div></div></ul>',
+
+footer = '<div class=footerflex><div class=footerbrand><h3><a href=/ >Holy Unblocker LTS</a></h3><p>Global Web Proxy Innovation, Done Right.</div><div class=footerlist><h3>Services</h3><ul><li><a href=https://github.com/titaniumnetwork-dev/Ultraviolet target=_blank>Ultraviolet</a><li><a href=https://github.com/MercuryWorkshop/wisp-server-node target=_blank>Wisp</a><li><a href=https://discord.gg/VNT4E7gN5Y target=_blank>Rammerhead</a><li><a href=https://github.com/binary-person/womginx target=_blank>Womginx</a></ul></div><div class=footerlist><h3>About</h3><ul><li><a href=https://github.com/QuiteAFancyEmerald/Holy-Unblocker target=_blank>GitHub</a><li><a href=/?t>Privacy and Terms of Service</a><li><a href=/?c>Credits</a></ul></div><div class=footerlist><a href=#header><i class="fas fa-angle-double-up"></i></a></div></div><div class=footersocials><a href=https://github.com/QuiteAFancyEmerald/Holy-Unblocker target=_blank class=soc-github><i class="fa-github fab"></i></a> <a href=https://docs.titaniumnetwork.org target=_blank class=soc-patreon><i class="fas fa-file-code"></i></a></div><p class=copyright>Holy Unblocker LTS © 2024',
+
+description = `<div id="info" class="box-info box-large text-center textm"> <h2>What is Holy Unblocker?</h2> <p>Holy Unblocker, an official flagship Titanium Network site, can bypass web filters or "blockers" regardless of whether it is an extension or network-based.</p><p>Being a secure web proxy service, it supports numerous sites while being updated frequently and concentrating on detail with design, mechanics, and features.</p><h2>How do I unblock websites using Holy Unblocker?</h2> <p>Head to the <a href="?z">Web Proxies</a> page and select one of the proxies featured! Afterwards, type out the site you wish to access in the search box ("example.com").</p><p>If you wish to explore the games featured on HU, check out the <a href="?g">game</a> pages.</p><h2>Don't know the difference between each web proxy?</h2> <p>Check out the use case for each proxy in the page description. A quick overview:</p><p>- Corrosion: Broad support for the majority of sites but slower (YouTube, now.gg, .io sites) <br>- Womginx: Fast but has forward support for most sites (Discord, Bing and DuckDuckGo) </p><h2>Are all sites supported? Why are some sites not loading?</h2> <p>As advanced as they are, web proxies are not perfect. This means that some sites may not be supported by any of the proxies listed here due to limitations or security measures.</p><p>This also applies to speed; naturally things will be slower or broken under a proxy versus direct access.</p></div>`,
+
+loadTemplates = str => {
+    str = insertText("<!--HEADER-->", str, header);
+    str = insertText("<!--FOOTER-->", str, footer);
+    str = insertText("<!--DESC-->", str, description);
+    return str;
+};

views/index.html

@@ -42,7 +42,7 @@
 
   <body>
     <!-- IMPORTANT-HUCOOKINGINSERT-DONOTDELETE -->
-    <div id="header" class="fullwidth"></div>
+    <div id="header" class="fullwidth"><!--HEADER--></div>
     <div id="particles-js" class="fullwidth"></div>
     <div id="banner" class="fullwidth">
       <p class="text-center">
@@ -291,15 +291,12 @@
         >
       </div>
     </div>
-    <div id="footer" class="fullwidth"></div>
+    <div id="footer" class="fullwidth"><!--FOOTER--></div>
     <!-- IMPORTANT-HUCOOKINGINSERT-DONOTDELETE -->
     <script src="assets/js/common.js"></script>
     <script src="assets/js/links.js"></script>
-    <script src="assets/js/header.js"></script>
     <script src="assets/js/csel.js"></script>
-    <script src="assets/js/footer.js"></script>
     <script src="assets/js/card.js"></script>
-    <script src="assets/js/desc.js"></script>
     <script src="https://unpkg.com/aos@next/dist/aos.js"></script>
     <script>
       AOS.init();