Update version to 5.2.1 in package.json and Artplayer class

packages/artplayer-plugin-hls-control/src/index.js

@@ -15,7 +15,7 @@ function uniqBy(array, property) {
 export default function artplayerPluginHlsControl(option = {}) {
     return (art) => {
         const { $video } = art.template;
-        const { errorHandle } = art.constructor.utils;
+        const { errorHandle, query } = art.constructor.utils;
 
         function updateQuality(hls) {
             if (!hls.levels.length) return;
@@ -48,6 +48,7 @@ export default function artplayerPluginHlsControl(option = {}) {
                 hls.currentLevel = item.value;
                 art.loading.show = true;
                 art.notice.show = `${title}: ${item.html}`;
+                art.emit('artplayerPluginHlsControl:quality', item);
                 return item.html;
             };
 
@@ -59,6 +60,12 @@ export default function artplayerPluginHlsControl(option = {}) {
                     style: { padding: '0 10px' },
                     selector: selector,
                     onSelect: onSelect,
+                    mounted: ($control) => {
+                        const $value = query('.art-selector-value', $control);
+                        art.on('artplayerPluginHlsControl:quality', (item) => {
+                            $value.innerHTML = item.html;
+                        });
+                    },
                 });
             }
 
@@ -71,6 +78,11 @@ export default function artplayerPluginHlsControl(option = {}) {
                     width: 200,
                     selector: selector,
                     onSelect: onSelect,
+                    mounted: (_, setting) => {
+                        art.on('artplayerPluginHlsControl:quality', (item) => {
+                            setting.tooltip = item.html;
+                        });
+                    },
                 });
             }
         }
@@ -100,6 +112,7 @@ export default function artplayerPluginHlsControl(option = {}) {
                 hls.audioTrack = item.value;
                 art.loading.show = true;
                 art.notice.show = `${title}: ${item.html}`;
+                art.emit('artplayerPluginHlsControl:audio', item);
                 return item.html;
             };
 
@@ -111,6 +124,12 @@ export default function artplayerPluginHlsControl(option = {}) {
                     style: { padding: '0 10px' },
                     selector: selector,
                     onSelect: onSelect,
+                    mounted: ($control) => {
+                        const $value = query('.art-selector-value', $control);
+                        art.on('artplayerPluginHlsControl:audio', (item) => {
+                            $value.innerHTML = item.html;
+                        });
+                    },
                 });
             }
 
@@ -123,6 +142,11 @@ export default function artplayerPluginHlsControl(option = {}) {
                     width: 200,
                     selector: selector,
                     onSelect: onSelect,
+                    mounted: (_, setting) => {
+                        art.on('artplayerPluginHlsControl:audio', (item) => {
+                            setting.tooltip = item.html;
+                        });
+                    },
                 });
             }
         }