fix(subtitles): improve multisubtitle change operation

DIYgod · Jun 13, 2022 · b974065 · b974065
1 parent b656087
commit b974065
Showing 1 changed file with 33 additions and 5 deletions.
diff --git a/src/js/subtitles.js b/src/js/subtitles.js
@@ -9,17 +9,45 @@ class Subtitles {
             this.show();
         });
 
-        for (let i = 0; i < this.player.template.subtitlesItem.length; i++) {
+        const lastItemIndex = this.player.template.subtitlesItem.length - 1;
+        for (let i = 0; i < lastItemIndex; i++) {
             this.player.template.subtitlesItem[i].addEventListener('click', () => {
                 this.hide();
+                if (this.player.options.subtitle.index !== i) {
+                    // clear subtitle show for new subtitle don't have now duration time. If don't, will display last subtitle.
+                    this.player.template.subtitle.innerHTML = `<p></p>`;
+                    // update video track src
+                    this.player.template.subtrack.src = this.player.template.subtitlesItem[i].dataset.subtitle;
+                    // update options current subindex for reload (such as changeQuality)
+                    this.player.options.subtitle.index = i;
+                    if (this.player.template.subtitle.classList.contains('dplayer-subtitle-hide')) {
+                        this.subContainerShow();
+                    }
+                }
+            });
+        }
+        this.player.template.subtitlesItem[lastItemIndex].addEventListener('click', () => {
+            this.hide();
+            if (this.player.options.subtitle.index !== lastItemIndex) {
                 // clear subtitle show for new subtitle don't have now duration time. If don't, will display last subtitle.
                 this.player.template.subtitle.innerHTML = `<p></p>`;
                 // update video track src
-                this.player.template.subtrack.src = this.player.template.subtitlesItem[i].dataset.subtitle;
+                this.player.template.subtrack.src = '';
                 // update options current subindex for reload (such as changeQuality)
-                this.player.options.subtitle.index = i;
-            });
-        }
+                this.player.options.subtitle.index = lastItemIndex;
+                this.subContainerHide();
+            }
+        });
+    }
+
+    subContainerShow() {
+        this.player.template.subtitle.classList.remove('dplayer-subtitle-hide');
+        this.player.events.trigger('subtitle_show');
+    }
+
+    subContainerHide() {
+        this.player.template.subtitle.classList.add('dplayer-subtitle-hide');
+        this.player.events.trigger('subtitle_hide');
     }
 
     hide() {