dont use opacity

3 files changed, 13 insertions, 4 deletions

diff --git a/webAO/utils/getResources.js b/webAO/utils/getResources.js
index 9837c77..7c71e28 100644
--- a/webAO/utils/getResources.js
+++ b/webAO/utils/getResources.js
@@ -2,18 +2,22 @@ const getResources = (AO_HOST, THEME) => ({
   holdit: {
     src: `${AO_HOST}misc/default/holdit_bubble.png`,
     duration: 720,
+    sfx: `${AO_HOST}misc/default/holdit.opus`,
   },
   objection: {
     src: `${AO_HOST}misc/default/objection_bubble.png`,
     duration: 720,
+    sfx: `${AO_HOST}misc/default/objection.opus`,
   },
   takethat: {
     src: `${AO_HOST}misc/default/takethat_bubble.png`,
     duration: 840,
+    sfx: `${AO_HOST}misc/default/takethat.opus`,
   },
   custom: {
     src: "",
     duration: 840,
+    sfx: "",
   },
   witnesstestimony: {
     src: `${AO_HOST}themes/${THEME}/witnesstestimony_bubble.gif`,
diff --git a/webAO/viewport/utils/handleICSpeaking.ts b/webAO/viewport/utils/handleICSpeaking.ts
index c0a9ae1..cf75a80 100644
--- a/webAO/viewport/utils/handleICSpeaking.ts
+++ b/webAO/viewport/utils/handleICSpeaking.ts
@@ -161,11 +161,16 @@ export const handle_ic_speaking = async (playerChatMsg: ChatMsg) => {
       shoutSprite.src = client.resources[shout].src;
       shoutSprite.style.animation = "bubble 700ms steps(10, jump-both)";
     }
-    shoutSprite.style.opacity = "1";
+    shoutSprite.style.display = "block";
 
-    client.viewport.shoutaudio.src = `${AO_HOST}characters/${encodeURI(
+    const perCharPath = `${AO_HOST}characters/${encodeURI(
       client.viewport.getChatmsg().name.toLowerCase(),
     )}/${shout}.opus`;
+    client.viewport.shoutaudio.src = perCharPath;
+    client.viewport.shoutaudio.onerror = () => {
+      client.viewport.shoutaudio.src = client.resources[shout].sfx;
+      client.viewport.shoutaudio.play();
+    };
     client.viewport.shoutaudio.play();
     client.viewport.setShoutTimer(client.resources[shout].duration);
   } else {
diff --git a/webAO/viewport/viewport.ts b/webAO/viewport/viewport.ts
index b5a96a0..c03d750 100644
--- a/webAO/viewport/viewport.ts
+++ b/webAO/viewport/viewport.ts
@@ -317,7 +317,7 @@ const viewport = (): Viewport => {
 
       // Pre-animation stuff
       if (chatmsg.preanimdelay > 0) {
-        shoutSprite.style.opacity = "0";
+        shoutSprite.style.display = "none";
         shoutSprite.style.animation = "";
         const preanim = chatmsg.preanim.toLowerCase();
         setEmote(AO_HOST, client, charName, preanim, "", false, chatmsg.side);
@@ -370,7 +370,7 @@ const viewport = (): Viewport => {
         chatBoxInner.className = `text_${COLORS[chatmsg.color]}`;
 
         if (chatmsg.preanimdelay === 0) {
-          shoutSprite.style.opacity = "0";
+          shoutSprite.style.display = "none";
           shoutSprite.style.animation = "";
         }