Stop chant audio on accordion selection but not scroll

Listens to a click on any chant accordion header to stop audio, but keeps audio playing even if user has scrolled to a new image.
DDMAL · Sep 6, 2023 · 4a4b5cb · 4a4b5cb
1 parent 5a5b1b3
commit 4a4b5cb
Show file tree

Hide file tree

Showing 2 changed files with 20 additions and 4 deletions.
diff --git a/nginx/public/node/frontend/public/js/app/manuscript-detail/folio/ChantItemView.js b/nginx/public/node/frontend/public/js/app/manuscript-detail/folio/ChantItemView.js
@@ -1,8 +1,11 @@
 import Marionette from 'marionette';
+import Backbone from 'backbone';
 import ChantRecordView from './ChantRecordView';
 
 import template from './chant-item.template.html';
 
+var manuscriptChannel = Backbone.Radio.channel('manuscript');
+
 /**
  * A panel containing chant information
  */
@@ -18,12 +21,14 @@ export default Marionette.LayoutView.extend({
     },
 
     ui: {
-        collapse: '.collapse'
+        collapse: '.collapse',
+        panelHeading: '.panel-heading'
     },
 
     events: {
         'hide.bs.collapse': '_triggerFoldChant',
-        'show.bs.collapse': '_triggerUnfoldChant'
+        'show.bs.collapse': '_triggerUnfoldChant',
+        'click @ui.panelHeading': 'onChantAccordionClick'
     },
 
     collapseContent: function ()
@@ -74,5 +79,13 @@ export default Marionette.LayoutView.extend({
     _triggerUnfoldChant: function ()
     {
         this.trigger('unfold:chant');
+    },
+
+    /**
+     * Trigger an event to stop any audio that is playing
+        */
+    onChantAccordionClick: function ()
+    {
+        manuscriptChannel.trigger('chantAccordion:click');
     }
 });
diff --git a/nginx/public/node/frontend/public/js/app/manuscript-detail/folio/ChantRecordView.js b/nginx/public/node/frontend/public/js/app/manuscript-detail/folio/ChantRecordView.js
@@ -245,7 +245,7 @@ export default Marionette.ItemView.extend({
 		this.model.set('volpiano', formattedVolpiano);
 		var cdb_uri = this.model.get('cdb_uri');
 		this.model.set({ 'cdb_link_url': 'https://cantus.uwaterloo.ca/node/' + cdb_uri });
-		this.listenTo(manuscriptChannel, 'change:chant', this.chantChanged);
+		manuscriptChannel.on('chantAccordion:click',this.stopChantAudio, this);
 	},
 	ui : {
 		volpianoSyllables: ".volpiano-syllable",
@@ -265,9 +265,12 @@ export default Marionette.ItemView.extend({
 	stop: function(){
 		audioStopReset(MIDI);
 	},
-	chantChanged: function(){
+	stopChantAudio: function(){
 		if (MIDI.getContext().state === "running"){
 			audioStopReset(MIDI);
 		}
+	},
+	onDestroy: function(){
+		manuscriptChannel.off('chantAccordion:click',this.stopChantAudio, this);
 	}
 });