5 files changed, 21 insertions, 2 deletions
diff --git a/webAO/packets/handlers/handleARUP.ts b/webAO/packets/handlers/handleARUP.ts
index 5a7aebb..7f72b15 100644
--- a/webAO/packets/handlers/handleARUP.ts
+++ b/webAO/packets/handlers/handleARUP.ts
@@ -1,5 +1,4 @@
 import { client } from "../../client";
-import { renderAreaList } from "../../dom/renderAreaList";
 import { safeTags } from "../../encoding";
 
 /**
@@ -11,6 +10,7 @@ export const handleARUP = (args: string[]) => {
   for (let i = 0; i < args.length - 1; i++) {
     if (client.areas[i]) {
       // the server sends us ARUP before we even get the area list
+      const thisarea = document.getElementById(`area${i}`)!;
       switch (Number(args[0])) {
         case 0: // playercount
           client.areas[i].players = Number(args[i + 1]);
@@ -25,7 +25,18 @@ export const handleARUP = (args: string[]) => {
           client.areas[i].locked = safeTags(args[i + 1]);
           break;
       }
+
+      thisarea.className = `area-button area-${client.areas[
+        i
+      ].status.toLowerCase()}`;
+
+      thisarea.innerText = `${client.areas[i].name} (${client.areas[i].players}) [${client.areas[i].status}]`;
+
+      thisarea.title =
+        `Players: ${client.areas[i].players}\n` +
+        `Status: ${client.areas[i].status}\n` +
+        `CM: ${client.areas[i].cm}\n` +
+        `Area lock: ${client.areas[i].locked}`;
     }
   }
-  renderAreaList();
 };
diff --git a/webAO/packets/handlers/handleCI.ts b/webAO/packets/handlers/handleCI.ts
index 58a6dad..c0cbd84 100644
--- a/webAO/packets/handlers/handleCI.ts
+++ b/webAO/packets/handlers/handleCI.ts
@@ -8,6 +8,8 @@ import { handleCharacterInfo } from "../../client/handleCharacterInfo";
  */
 export const handleCI = (args: string[]) => {
   // Loop through the 10 characters that were sent
+  document.getElementById("client_loadingtext")!.innerHTML =
+    `Loading Character ${args[1]}/${client.char_list_length}`;
   for (let i = 2; i <= args.length - 2; i++) {
     if (i % 2 === 0) {
       const chargs = args[i].split("&");
diff --git a/webAO/packets/handlers/handleEI.ts b/webAO/packets/handlers/handleEI.ts
index 6602214..3d15766 100644
--- a/webAO/packets/handlers/handleEI.ts
+++ b/webAO/packets/handlers/handleEI.ts
@@ -11,6 +11,8 @@ import { prepChat } from "../../encoding";
  * @param {Array} args packet arguments
  */
 export const handleEI = (args: string[]) => {
+  document.getElementById("client_loadingtext")!.innerHTML =
+    `Loading Evidence ${args[1]}/${client.evidence_list_length}`;
   const evidenceID = Number(args[1]);
   const arg = args[2].split("&");
   client.evidences[evidenceID] = {
diff --git a/webAO/packets/handlers/handleEM.ts b/webAO/packets/handlers/handleEM.ts
index 94d224c..b3947dd 100644
--- a/webAO/packets/handlers/handleEM.ts
+++ b/webAO/packets/handlers/handleEM.ts
@@ -10,6 +10,7 @@ import { isAudio } from "../../client/isAudio";
  * @param {Array} args packet arguments
  */
 export const handleEM = (args: string[]) => {
+  document.getElementById("client_loadingtext")!.innerHTML = "Loading Music";
   if (args[1] === "0") {
     client.resetMusicList();
     client.resetAreaList();
diff --git a/webAO/packets/handlers/handleSM.ts b/webAO/packets/handlers/handleSM.ts
index 17453c1..1c3fd5e 100644
--- a/webAO/packets/handlers/handleSM.ts
+++ b/webAO/packets/handlers/handleSM.ts
@@ -8,11 +8,14 @@ import { createArea } from "../../client/createArea";
  * @param {Array} args packet arguments
  */
 export const handleSM = (args: string[]) => {
+  document.getElementById("client_loadingtext")!.innerHTML = "Loading Music ";
   client.resetMusicList();
   client.resetAreaList();
 
   client.musics_time = false;
 
+  document.getElementById("client_loadingtext")!.innerHTML = `Loading Music`;
+
   for (let i = 1; i < args.length - 1; i++) {
     // Check when found the song for the first time
     const trackname = args[i];