docs(hls): [SITE-HLS-01] add bilingual guides and fix example SDK ownership

docs/assets/example/hls.control.js

@@ -4,46 +4,56 @@
 // import Hls from 'hls.js';
 // import artplayerPluginHlsControl from 'artplayer-plugin-hls-control';
 
+const useHls = Hls.isSupported()
+let hls
+
+function destroyHls() {
+  const previous = hls
+  hls = undefined
+  if (previous)
+    previous.destroy()
+}
+
 const art = new Artplayer({
   container: '.artplayer-app',
   url: 'https://playertest.longtailvideo.com/adaptive/elephants_dream_v4/index.m3u8',
   setting: true,
-  plugins: [
-    artplayerPluginHlsControl({
-      quality: {
-        // Show qualitys in control
-        control: true,
-        // Show qualitys in setting
-        setting: true,
-        // Get the quality name from level
-        getName: level => `${level.height}P`,
-        // I18n
-        title: 'Quality',
-        auto: 'Auto',
-      },
-      audio: {
-        // Show audios in control
-        control: true,
-        // Show audios in setting
-        setting: true,
-        // Get the audio name from track
-        getName: track => track.name,
-        // I18n
-        title: 'Audio',
-        auto: 'Auto',
-      },
-    }),
-  ],
+  plugins: useHls
+    ? [
+        artplayerPluginHlsControl({
+          quality: {
+            // Show quality choices in the controls
+            control: true,
+            // Show quality choices in settings
+            setting: true,
+            // Get the quality name from level
+            getName: level => `${level.height}P`,
+            // I18n
+            title: 'Quality',
+            auto: 'Auto',
+          },
+          audio: {
+            // Show audios in control
+            control: true,
+            // Show audios in setting
+            setting: true,
+            // Get the audio name from track
+            getName: track => track.name || track.lang || 'Audio',
+            // I18n
+            title: 'Audio',
+            auto: 'Auto',
+          },
+        }),
+      ]
+    : [],
   customType: {
     m3u8: function playM3u8(video, url, art) {
-      if (Hls.isSupported()) {
-        if (art.hls)
-          art.hls.destroy()
-        const hls = new Hls()
+      destroyHls()
+      if (useHls) {
+        hls = new Hls()
+        art.hls = hls
         hls.loadSource(url)
         hls.attachMedia(video)
-        art.hls = hls
-        art.on('destroy', () => hls.destroy())
       }
       else if (video.canPlayType('application/vnd.apple.mpegurl')) {
         video.src = url
@@ -54,3 +64,5 @@ const art = new Artplayer({
     },
   },
 })
+
+art.on('destroy', destroyHls)