From 02ce8531cc34ee670e423357e9168acd2472ce9a Mon Sep 17 00:00:00 2001
From: Sahil Batra <sahil@zulip.com>
Date: Mon, 9 Aug 2021 18:27:06 +0530
Subject: [PATCH] notification: Rename notification-sound audio and child
 elements.

This is a prep commit for adding UI for realm-level defaults
of user settings.
This commit renames notification-sound-audio element to
user-notification-sound-audio because we will be adding similar
element for realm-level default of user settings also.

We also change the child elements to have current id as their
class for the same reason.
---
 static/js/notifications.js          | 13 +++++++++----
 static/js/settings_notifications.js |  2 +-
 templates/zerver/app/index.html     |  6 +++---
 3 files changed, 13 insertions(+), 8 deletions(-)

diff --git a/static/js/notifications.js b/static/js/notifications.js
index 2e43be224f..7f84fe3c95 100644
--- a/static/js/notifications.js
+++ b/static/js/notifications.js
@@ -95,13 +95,18 @@ export function initialize() {
 function update_notification_sound_source() {
     const notification_sound = user_settings.notification_sound;
     const audio_file_without_extension = "/static/audio/notification_sounds/" + notification_sound;
-    $("#notification-sound-source-ogg").attr("src", `${audio_file_without_extension}.ogg`);
-    $("#notification-sound-source-mp3").attr("src", `${audio_file_without_extension}.mp3`);
+    const container_elem = $("#user-notification-sound-audio");
+    container_elem
+        .find(".notification-sound-source-ogg")
+        .attr("src", `${audio_file_without_extension}.ogg`);
+    container_elem
+        .find(".notification-sound-source-mp3")
+        .attr("src", `${audio_file_without_extension}.mp3`);
 
     if (notification_sound !== "none") {
         // Load it so that it is ready to be played; without this the old sound
         // is played.
-        $("#notification-sound-audio")[0].load();
+        container_elem[0].load();
     }
 }
 
@@ -503,7 +508,7 @@ export function received_messages(messages) {
             });
         }
         if (should_send_audible_notification(message)) {
-            $("#notification-sound-audio")[0].play();
+            $("#user-notification-sound-audio")[0].play();
         }
     }
 }
diff --git a/static/js/settings_notifications.js b/static/js/settings_notifications.js
index fff9d26b7b..41ff498530 100644
--- a/static/js/settings_notifications.js
+++ b/static/js/settings_notifications.js
@@ -103,7 +103,7 @@ export function set_up() {
 
     container.find(".play_notification_sound").on("click", () => {
         if (user_settings.notification_sound !== "none") {
-            $("#notification-sound-audio")[0].play();
+            $("#user-notification-sound-audio")[0].play();
         }
     });
 
diff --git a/templates/zerver/app/index.html b/templates/zerver/app/index.html
index 7c53b38fbc..ef6428ce00 100644
--- a/templates/zerver/app/index.html
+++ b/templates/zerver/app/index.html
@@ -204,9 +204,9 @@
     <div class="left-sidebar-modal-holder"></div>
     <div class="mute-user-modal-holder"></div>
     <div id="move-a-topic-modal-holder"></div>
-    <audio id="notification-sound-audio">
-        <source id="notification-sound-source-ogg" type="audio/ogg" />
-        <source id="notification-sound-source-mp3" type="audio/mpeg" />
+    <audio id="user-notification-sound-audio">
+        <source class="notification-sound-source-ogg" type="audio/ogg" />
+        <source class="notification-sound-source-mp3" type="audio/mpeg" />
     </audio>
 </div>
 {% endblock %}