Should add a proper csp against XSS

obhq · Jun 28, 2024 · bc102ca · bc102ca
1 parent d35313d
commit bc102ca
Show file tree

Hide file tree

Showing 5 changed files with 22 additions and 16 deletions.
diff --git a/public_html/_images/obliteration-screenshots.png b/public_html/_images/obliteration-screenshots.png
diff --git a/public_html/app.js b/public_html/app.js
@@ -26,10 +26,10 @@ document.addEventListener('DOMContentLoaded', async function () {
     }, 1900); // timed with the transition speed in css
 });
 
-function buttonScroll() {
+document.getElementById("buttonScroll").addEventListener('click', () => {
     const targetElement = document.getElementById('main2');
     targetElement.scrollIntoView({behavior: 'smooth'});
-}
+});
 
 
 function countingAnimation(number, element) {

diff --git a/public_html/compatibility/app.js b/public_html/compatibility/app.js
@@ -124,10 +124,10 @@ document.addEventListener('DOMContentLoaded', async function () {
 
 
 // Searching in the game menu
-function OnCompMenuSearch() {
+document.getElementById("gameSearch").addEventListener('input', () => {
     currentPage = 1;
     updateSearchResults();
-}
+})
 
 
 // it searches the json and updates any needed variables
@@ -289,6 +289,7 @@ function gameCardHandler(jsonData) {
 }
 
 
+
 // updates the values of the page selector and handles the changing of the page number
 function PageSelectorUpdater(state) {
     const minNumberElement = document.getElementById("pageSelectorMin");
@@ -357,12 +358,17 @@ function PageSelectorUpdater(state) {
 
 
 // gets called when the onInput is called on the page selector "search bar"
-function OnPageSelectorSearch() {
+document.getElementById("pageSelectorSearch").addEventListener('input', () => {
     clearTimeout(Timer);
 
     Timer = setTimeout(() => {
 
         PageSelectorUpdater("search");
 
     }, 700);
-}
+});
+
+document.getElementById("pageSelectorMin").addEventListener('click', () => PageSelectorUpdater('min'));
+document.getElementById("pageSelectorMax").addEventListener('click', () => PageSelectorUpdater('max'));
+document.getElementById("pageSelectorMore").addEventListener('click', () => PageSelectorUpdater('more'));
+document.getElementById("pageSelectorLess").addEventListener('click', () => PageSelectorUpdater('less'));
diff --git a/public_html/compatibility/index.html b/public_html/compatibility/index.html
@@ -4,6 +4,7 @@
     <meta charset="UTF-8">
     <meta http-equiv="X-UA-Compatible" content="IE=edge">
     <meta name="viewport" content="width=device-width, initial-scale=1">
+    <meta http-equiv="Content-Security-Policy" content="default-src 'self'; style-src 'self' 'unsafe-inline' https://rsms.me/; font-src 'self' https://rsms.me/;">
     <title>Obliteration - Compatibility List</title>
     <meta name="description"
           content="Obliteration is an experimental open-source PS4 emulator written in Rust for Windows, MacOS, and Linux.">
@@ -83,7 +84,7 @@
 
         <label>
             <input autocomplete="off" type="text" name="obliteration" class="compMenuSearchBar"
-                   placeholder="GAME TITLE / ID" id="gameSearch" oninput="OnCompMenuSearch()">
+                   placeholder="GAME TITLE / ID" id="gameSearch">
         </label>
 
     </div>
@@ -115,16 +116,14 @@
     <div class="endMenu">
 
         <div class="pageBarContainer">
-            <img class="pageBarImage pageBarImageR" alt="Arrow pointing Backwards" src="/_images/arrow_forward.svg"
-                 onclick="PageSelectorUpdater('less')">
-            <p class="pageBarText" id="pageSelectorMin" onclick="PageSelectorUpdater('min')"></p>
+            <img class="pageBarImage pageBarImageR" id="pageSelectorLess" alt="Arrow pointing Backwards" src="/_images/arrow_forward.svg">
+            <p class="pageBarText" id="pageSelectorMin"></p>
             <label>
                 <input autocomplete="off" type="number" min="1" name="obliteration" class="pageBarSearch"
-                       placeholder="..." id="pageSelectorSearch" oninput="OnPageSelectorSearch()">
+                       placeholder="..." id="pageSelectorSearch">
             </label>
-            <p class="pageBarText" id="pageSelectorMax" onclick="PageSelectorUpdater('max')"></p>
-            <img class="pageBarImage" alt="Arrow pointing Forwards" src="/_images/arrow_forward.svg"
-                 onclick="PageSelectorUpdater('more')">
+            <p class="pageBarText" id="pageSelectorMax"></p>
+            <img class="pageBarImage" id="pageSelectorMore" alt="Arrow pointing Forwards" src="/_images/arrow_forward.svg">
         </div>
 
         <h4 class="endMenuInfoText" id="infoText">Fetching Results</h4>

diff --git a/public_html/index.html b/public_html/index.html
@@ -4,6 +4,7 @@
     <meta charset="UTF-8">
     <meta http-equiv="X-UA-Compatible" content="IE=edge">
     <meta name="viewport" content="width=device-width, initial-scale=1">
+    <meta http-equiv="Content-Security-Policy" content="default-src 'self'; style-src 'self' 'unsafe-inline' https://rsms.me/; font-src 'self' https://rsms.me/;">
     <title>Obliteration</title>
     <meta name="description"
           content="Obliteration is an experimental open-source PS4 emulator written in Rust for Windows, MacOS, and Linux.">
@@ -70,15 +71,15 @@
             </tr>
         </table>
         <div class="mainButtonContainer">
-            <a class="mainButton" onclick="buttonScroll()">Learn More</a>
+            <a class="mainButton" id="buttonScroll">Learn More</a>
             <a class="mainButton" href="/download">Download</a>
         </div>
     </div>
 </main>
 
 <div class="main2" id="main2">
     <div class="main2Content toAnimate">
-        <img class="main2Image" src="https://github.com/obhq/obliteration/raw/main/screenshots.png"
+        <img class="main2Image" src="/_images/obliteration-screenshots.png"
              alt="Screenshot of Obliteration">
         <div class="main2Text">
             <p class="bigText main2Text1">About