Blah.

src/views/ProjectsView.vue

@@ -44,31 +44,58 @@
     <div v-if="showFaqModal" class="modal-overlay" @click="closeFaqModal">
       <div class="modal-content" @click.stop>
         <h2>Frequently Asked Questions</h2>
+        <hr>
         <ul class="faq-list">
-          <li>
+    <li>
-            <strong>Do you need an idea person?</strong>
+      <strong>"Do you need an idea person?"</strong>
-            <p>No. Not now, likely not ever.</p>
+            <p>No. Not now, and likely not ever.</p>
           </li>
+          <hr>
           <li>
-            <strong>Do you need an asset creator? What would you pay me?</strong>
+            <strong>"Do you need an asset creator? What would you pay me?"</strong>
             <p>
-              This applies to graphics, models, sounds, music, etc. Racing to tell us random ideas and demanding payment isn't how this works.
+              This applies to graphics, models, sounds, music, and similar work. Suggesting random ideas and demanding payment isn’t how this works.
-              Provide a portfolio and your price sheets. We offer indie rates based on quality. If all you can offer is low-quality work, others will carry the load for you.
+              Provide a portfolio and clear price sheets. We offer fair indie rates based on quality. If your work is lower quality, understand that others
+              may carry more of the creative load.
             </p>
           </li>
+          <hr>
           <li>
-            <strong>If I'm hired to work on sound effects, that means I'm the sound director, right?</strong>
+            <strong>"If I'm hired to work on sound effects, that means I'm the sound director, right?"</strong>
-            <p>No, it doesn't. Roles like "director" require experience, leadership, and proven track records. Don't expect a salary or profit share from a freelance role.</p>
+            <p>
+              No, it doesn’t. Roles like "director" require experience, leadership skills, and a proven track record. Freelance roles are just that—freelance.
+              Don’t expect a salary or profit share from such a position. Additionally, if we hire you to create assets, <b>we</b> decide what’s needed,
+              unless creative freedom is explicitly granted. Thank you for understanding.
+            </p>
           </li>
+          <hr>
           <li>
-            <strong>Well, how much WOULD you pay me?</strong>
+            <strong>"Well, how much WOULD you pay me?"</strong>
-            <p>Provide your portfolio and rates. If you don’t have one, we'll assess based on <i>your</i> quality against indie standards.</p>
+            <p>
+              Provide your portfolio and rates. If you don’t have one, we’ll evaluate your work against indie standards to make a fair offer. We're not presently hiring.
+            </p>
           </li>
+          <hr>
           <li>
-            <strong>(Discussion that includes:) "My idea, COPYRIGHT!"</strong>
+            <strong>On suggesting ideas and claiming ownership</strong>
-            <p>In no fucking world does this work, my dude. Ideas aren't copyrightable - tangible things like art, sound effects, full games, etc <i>are</i>. If you seriously believe otherwise... grow up, seriously.</p>
+            <p>
+              Ideas, concepts, and words alone are not copyrightable—only tangible creations such as art, sound effects, or completed works can be protected by copyright.
+              Claiming ownership of an idea without contributing to its execution is not recognized in the professional world. That said, we value constructive suggestions and
+              may acknowledge meaningful contributions with in-game benefits or recognition. However, we maintain a zero-tolerance policy for unfounded claims or disruptive behavior,
+              to ensure a fair and respectful environment for everyone.
+            </p>
           </li>
-         </ul>
+          <hr>
+          <li>
+            <strong>"You guys make games, so I want you to make this concept of mine!"</strong>
+            <p>
+              Not for free. We have our own projects to focus on, and <u>we are not for hire at this time</u>. Additionally, being an "idea person" is not a paid position in the game
+              development industry. Successful game creation requires collaboration, execution, and tangible contributions.
+            </p>
+          </li>
+        </ul>
+
+        <hr>
         <button @click="closeFaqModal" class="close-button">Close</button>
       </div>
     </div>
@@ -139,7 +166,7 @@ export default {
     },
   },
   methods: {
-    filterByTag(tag) {
+    filterByTag(tag: string) {
       this.selectedTag = tag;
     },
     closeFaqModal() {
@@ -263,7 +290,9 @@ export default {
   border-radius: 8px;
   max-width: 600px;
   width: 90%;
-  text-align: left;
+  max-height: 80vh; /* Limits height to 80% of the viewport */
+  overflow-y: auto; /* Enables vertical scrolling if content overflows */
+  text-align: center;
 }
 
 .modal-content h2 {
@@ -313,5 +342,4 @@ export default {
 .faq-button:hover {
   background: #74a8e0;
 }
-
 </style>

src/views/ServersView.vue

@@ -48,13 +48,15 @@
           </span>
         </p>
 
-        <p>
+        <p v-if="showPlayerCount">
           <i class="fas fa-users players-icon"></i>
-          Players Online: {{ modalData.playersOnline || 0 }} / {{ modalData.maxPlayers || 0 }}
+          Players Online: {{ displayPlayerCount }}
         </p>
+
         <h3>About</h3>
         <p v-if="modalData.about" v-html="modalData.about"></p>
         <p v-else>No description available.</p>
+
         <h3>Connection Instructions</h3>
         <div v-if="modalData.instructions">
           <p class="ip-display" v-if="modalData.instructions.public">
@@ -66,22 +68,46 @@
             <span class="ip">{{ modalData.instructions.local }}</span>
           </p>
         </div>
+
+        <h3 v-if="modalData.installInstructions">Installation Instructions</h3>
+        <p v-if="modalData.installInstructions">{{ modalData.installInstructions }}</p>
+
         <a v-if="modalData.link" :href="modalData.link" target="_blank" class="link">
           Download Modpack
         </a>
-        &nbsp;
+        &nbsp;&nbsp;<button @click="closeModal" class="close-button">Close</button>
-        <button @click="closeModal" class="close-button">Close</button>
       </div>
     </div>
   </div>
 </template>
 
 <script lang="ts">
-export default {
+import { defineComponent } from "vue";
+
+interface ServerInstructions {
+  public: string;
+  local: string;
+}
+
+interface Server {
+  name?: string;
+  banner: string;
+  status: string;
+  playersOnline?: number;
+  maxPlayers?: number;
+  about: string;
+  instructions: ServerInstructions;
+  installInstructions?: string;
+  queryIP: string;
+  link: string | null;
+}
+
+export default defineComponent({
   data() {
     return {
       showModal: false,
-      modalData: {},
+      modalData: {} as Server,
+
       alwaysOnServers: {
         "Minecraft Java Modern": {
           banner: "minecraft-modern-banner.jpg",
@@ -93,6 +119,7 @@ export default {
             public: "",
             local: "192.168.1.201",
           },
+          installInstructions: "Download Minecraft Java Edition from Mojang's website.",
           queryIP: "",
           link: "",
         },
@@ -104,8 +131,9 @@ export default {
           about: "This is the Minecraft Java 1.12.2 server with mods.",
           instructions: {
             public: "",
-            local: "192.168.1.3",
+            local: "",
           },
+          installInstructions: "Install Forge 1.12.2 and download the modpack provided.",
           queryIP: "",
           link: "",
         },
@@ -119,8 +147,10 @@ export default {
             public: "",
             local: "192.168.1.121",
           },
+          installInstructions:
+            "Use TModLoader from Steam (not base Terraria) and download our pack.",
           queryIP: "",
-          link: "",
+          link: "https://steamcommunity.com/sharedfiles/filedetails/?id=2943030068",
         },
         "Team Fortress 2": {
           banner: "tf2-banner.jpg",
@@ -132,73 +162,156 @@ export default {
             public: "",
             local: "192.168.1.203",
           },
+          installInstructions: "Download Team Fortress 2 for free on Steam.",
           queryIP: "",
           link: "",
         },
-      },
+      } as Record<string, Server>, // Add type Record<string, Server> for alwaysOnServers
+
       toggledServers: {
         "Core Keeper": {
-          banner: "tf2-banner.jpg",
+          banner: "core-keeper-banner.jpg",
           status: "unknown",
           playersOnline: 0,
           maxPlayers: 16,
-          about: "...",
+          about: "Explore, mine, and survive in this pixelated adventure.",
           instructions: {
             public: "",
             local: "192.168.1.204",
           },
+          installInstructions: "Available on Steam. Ensure your game is up to date.",
           queryIP: "",
           link: null,
         },
-        ECO: { status: "unknown", queryIP: "http://eco.example.com/status" },
+        ECO: {
-        Enshrouded: { status: "unknown", queryIP: "http://enshrouded.example.com/status" },
+          banner: "eco-banner.jpg",
-        Empyrion: { status: "unknown", queryIP: "http://empyrion.example.com/status" },
+          status: "unknown",
-        Palworld: { status: "unknown", queryIP: "http://palworld.example.com/status" },
+          playersOnline: 0,
-        "Survive The Nights": { status: "unknown", queryIP: "http://survivethenights.example.com/status" },
+          maxPlayers: 50,
-        Valheim: { status: "unknown", queryIP: "http://valheim.example.com/status" },
+          about: "A global survival game where players build an ecosystem.",
-        "V Rising": { status: "unknown", queryIP: "http://vrising.example.com/status" },
+          instructions: {
-      },
+            public: "eco.example.com",
+            local: "",
+          },
+          installInstructions:
+            "Download ECO from the official website or Steam. Use the provided IP.",
+          queryIP: "http://eco.example.com/status",
+          link: null,
+        },
+        Enshrouded: {
+          banner: "enshrouded-banner.jpg",
+          status: "unknown",
+          playersOnline: 0,
+          maxPlayers: 16,
+          about: "A survival crafting game in a mysterious fantasy setting.",
+          instructions: {
+            public: "",
+            local: "",
+          },
+          installInstructions: undefined,
+          queryIP: "http://enshrouded.example.com/status",
+          link: null,
+        },
+        Empyrion: {
+          banner: "empyrion-banner.jpg",
+          status: "unknown",
+          playersOnline: 0,
+          maxPlayers: 16,
+          about: "Explore space and build your intergalactic empire.",
+          instructions: {
+            public: "",
+            local: "",
+          },
+          installInstructions:
+            "Download Empyrion from Steam and ensure mods match server settings.",
+          queryIP: "http://empyrion.example.com/status",
+          link: null,
+        },
+        Palworld: {
+          banner: "palworld-banner.jpg",
+          status: "unknown",
+          playersOnline: 0,
+          maxPlayers: 32,
+          about: "A multiplayer game where you befriend and fight alongside creatures.",
+          instructions: {
+            public: "",
+            local: "",
+          },
+          installInstructions: "Available on Steam. Join the server via multiplayer menu.",
+          queryIP: "http://palworld.example.com/status",
+          link: null,
+        },
+        "Survive The Nights": {
+          banner: "survive-the-nights-banner.jpg",
+          status: "unknown",
+          playersOnline: 0,
+          maxPlayers: 10,
+          about: "A survival horror game set in a post-apocalyptic world.",
+          instructions: {
+            public: "",
+            local: "",
+          },
+          installInstructions: "Purchase on Steam and ensure to update your client.",
+          queryIP: "http://survivethenights.example.com/status",
+          link: null,
+        },
+        Valheim: {
+          banner: "valheim-banner.jpg",
+          status: "unknown",
+          playersOnline: 0,
+          maxPlayers: 10,
+          about: "A Viking-themed survival game set in a procedurally generated world.",
+          instructions: {
+            public: "",
+            local: "",
+          },
+          installInstructions: "Install via Steam and ensure mods match server settings.",
+          queryIP: "http://valheim.example.com/status",
+          link: null,
+        },
+        "V Rising": {
+          banner: "v-rising-banner.jpg",
+          status: "unknown",
+          playersOnline: 0,
+          maxPlayers: 20,
+          about: "Rise as a vampire lord in this survival RPG.",
+          instructions: {
+            public: "",
+            local: "",
+          },
+          installInstructions:
+            "Available on Steam. Ensure your game and server mods are synced.",
+          queryIP: "http://vrising.example.com/status",
+          link: null,
+        },
+      } as Record<string, Server>, // Add type Record<string, Server> for toggledServers
     };
   },
+  computed: {
+    showPlayerCount(): boolean {
+      return (
+        this.modalData.playersOnline !== undefined &&
+        this.modalData.maxPlayers !== undefined
+      );
+    },
+    displayPlayerCount(): string {
+      if (this.modalData.maxPlayers === undefined) return "? / ?";
+      if (this.modalData.playersOnline === undefined) return "? / ?";
+      return `${this.modalData.playersOnline} / ${this.modalData.maxPlayers}`;
+    },
+  },
   methods: {
-    openModal(serverName) {
+    openModal(serverName: string) {
-      console.log("Opening modal for:", serverName); // Debugging log
+      this.modalData =
-      this.modalData = this.alwaysOnServers[serverName] || this.toggledServers[serverName] || {};
+        this.alwaysOnServers[serverName] || this.toggledServers[serverName] || {};
-      console.log("Modal data:", this.modalData); // Debugging log
       this.modalData.name = serverName;
       this.showModal = true;
     },
     closeModal() {
       this.showModal = false;
     },
-    async queryServerStatus(serverName, queryIP) {
-      try {
-        console.log(`Querying status for ${serverName} at ${queryIP}...`);
-        const response = await fetch(queryIP);
-        const data = await response.json();
-        const server = this.alwaysOnServers[serverName] || this.toggledServers[serverName];
-        server.status = data.status || "unknown";
-        server.playersOnline = data.playersOnline || 0;
-        server.maxPlayers = data.maxPlayers || server.maxPlayers || 0;
-      } catch (error) {
-        console.error(`Failed to fetch status for ${serverName}:`, error);
-        const server = this.alwaysOnServers[serverName] || this.toggledServers[serverName];
-        server.status = "unknown";
-      }
-    },
-    queryAllServerStatuses() {
-      for (const [serverName, server] of Object.entries(this.alwaysOnServers)) {
-        if (server.queryIP) this.queryServerStatus(serverName, server.queryIP);
-      }
-      for (const [serverName, server] of Object.entries(this.toggledServers)) {
-        if (server.queryIP) this.queryServerStatus(serverName, server.queryIP);
-      }
-    },
   },
-  mounted() {
+});
-    this.queryAllServerStatuses();
-  },
-};
 </script>
 
 <style scoped>