feat: Add interactivity to header buttons and auxiliary pages.

Starciad · Jan 24, 2024 · cd22aa9 · cd22aa9
1 parent 915030f
commit cd22aa9
Show file tree

Hide file tree

Showing 4 changed files with 41 additions and 3 deletions.
diff --git a/about.html b/about.html
@@ -0,0 +1,11 @@
+<!DOCTYPE html>
+<html lang="en-US">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>🎭 ➥ SCSG - About - Star Character Sheet Generator.</title>
+</head>
+<body>
+    Under construction.
+</body>
+</html>
diff --git a/credits.html b/credits.html
@@ -0,0 +1,11 @@
+<!DOCTYPE html>
+<html lang="en-US">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>🎭 ➥ SCSG - Credits - Star Character Sheet Generator.</title>
+</head>
+<body>
+    Under construction.
+</body>
+</html>
diff --git a/index.html b/index.html
@@ -59,12 +59,12 @@
 <body>
     <header>
         <div id="header-left">
-            <button class="btn btn-nil">Repository</button>
+            <button id="scsg-repository-button" class="btn btn-nil">Repository</button>
         </div>
 
         <div id="header-right">
-            <button class="btn btn-nil">Credits</button>
-            <button class="btn btn-nil">About</button>
+            <button id="scsg-credits-button" class="btn btn-nil">Credits</button>
+            <button id="scsg-about-button" class="btn btn-nil">About</button>
         </div>
     </header>
 

diff --git a/scripts/main.js b/scripts/main.js
@@ -3,6 +3,10 @@ import { SCSGenerator } from "./core/dataGenerator.js";
 // Elements
 let SCSGGenerateButton = document.querySelector("#scsg-generate-button");
 
+let SCSGRepositoryButton = document.querySelector("#scsg-repository-button");
+let SCSGCreditsButton = document.querySelector("#scsg-credits-button");
+let SCSGAboutButton = document.querySelector("#scsg-about-button");
+
 // Events
 SCSGGenerateButton.addEventListener('click', () => {
     let nameStyleType = document.querySelector("#name-style-type").value;
@@ -14,4 +18,16 @@ SCSGGenerateButton.addEventListener('click', () => {
         sexType,
         ageRangeType
     );
+});
+
+SCSGRepositoryButton.addEventListener('click', () => {
+    window.open("https://github.com/Starciad/SCSG.git", '_blank').focus();
+});
+
+SCSGCreditsButton.addEventListener('click', () => {
+    window.location.href = "./about.html";
+});
+
+SCSGAboutButton.addEventListener('click', () => {
+    window.location.href = "./credits.html";
 });