fix(VideoFeeder): should not be muted on play when AutoPlay is false (#2560)

* fix🐛 (VideoFeeder): should not be muted on play when AutoPlay is false

* 🐛 fix(Xgplayer): Cannot read properties of undefined(reading 'destroy')

Author: capdiem

src/Masa.Blazor.JS/src/wrappers/xgplayer/index.ts

@@ -1,12 +1,12 @@
 import Xgplayer, { Events, IPlayerOptions, Start } from "xgplayer";
 import MusicPreset, { Music } from "xgplayer-music";
+import DynamicBg from "xgplayer/es/plugins/dynamicBg";
 import Mobile from "xgplayer/es/plugins/mobile";
 import Play from "xgplayer/es/plugins/play";
 import Playbackrate from "xgplayer/es/plugins/playbackRate";
 import Progress from "xgplayer/es/plugins/progress";
 import Time from "xgplayer/es/plugins/time";
 import Volume from "xgplayer/es/plugins/volume";
-import DynamicBg from "xgplayer/es/plugins/dynamicBg";
 
 export type XgplayerOptions = Omit<
   IPlayerOptions,
@@ -339,11 +339,18 @@ class XgplayerProxy {
   };
 
   destroy() {
-    this.el &&
+    if (this.el) {
       this.el.removeEventListener("touchend", this.onFullscreenTouchend);
-    this.player.destroy();
-    this.player = null;
-    this.handle.dispose();
+    }
+
+    if (this.player) {
+      this.player.destroy();
+      this.player = null;
+    }
+
+    if (this.handle) {
+      this.handle.dispose();
+    }
   }
 
   private debug(message: string, ...args: any[]) {

src/Masa.Blazor.JSComponents.VideoFeeder/VideoFeeder/MVideoFeeder.razor

@@ -29,6 +29,7 @@
                             GlobalMuted="@_globalMuted"
                             GlobalMutedChanged="@OnGlobalMutedChange"
                             Autoplay="@Autoplay"
+                            AutoplayMuted="@AutoplayMuted"
                             Loop="@_autoplayNext"
                             DynamicBg="@DynamicBg"
                             RotateFullscreen="@RotateFullscreen"

src/Masa.Blazor.JSComponents.VideoFeeder/VideoFeeder/MVideoFeeder.razor.cs

@@ -25,6 +25,8 @@ public partial class MVideoFeeder<TItem> where TItem : notnull
 
     [Parameter] public bool Autoplay { get; set; }
 
+    [Parameter] public bool AutoplayMuted { get; set; }
+
     [Parameter] public bool DynamicBg { get; set; }
 
     /// <summary>
@@ -93,6 +95,7 @@ protected override void OnInitialized()
         base.OnInitialized();
 
         _autoplayNext = DefaultAutoplayNext;
+        _globalMuted = AutoplayMuted;
         UpdateVideos();
     }
 
@@ -111,7 +114,7 @@ private void UpdateVideos()
         if (!_itemsHasSet && Items.Count > 0)
         {
             _itemsHasSet = true;
-            _videos = Items.Select(i => new Video<TItem>(i, ItemUrl, ItemPoster, ItemStartTime)).ToList();
+            _videos = Items.Select(i => new Video<TItem>(i, ItemUrl, ItemPoster, ItemStartTime, AutoplayMuted)).ToList();
         }
     }
 

src/Masa.Blazor.JSComponents.VideoFeeder/VideoFeeder/Player.razor

@@ -10,7 +10,7 @@
 
     <MXgplayer Poster="@poster"
                Autoplay="@Autoplay"
-               AutoplayMuted
+               AutoplayMuted="@AutoplayMuted"
                StartTime="@Data.StartTime"
                Loop="@Loop"
                Url="@Data.Url"

src/Masa.Blazor.JSComponents.VideoFeeder/VideoFeeder/Player.razor.cs

@@ -16,6 +16,8 @@ public partial class Player<TItem> : MasaComponentBase where TItem : notnull
 
     [Parameter] public bool Autoplay { get; set; }
 
+    [Parameter] public bool AutoplayMuted { get; set; }
+
     [Parameter] public int Index { get; set; }
 
     [Parameter] public bool GlobalMuted { get; set; }

src/Masa.Blazor.JSComponents.VideoFeeder/VideoFeeder/Video.cs

@@ -4,11 +4,17 @@ namespace Masa.Blazor.JSComponents.VideoFeeder;
 
 public class Video<TItem> where TItem : notnull
 {
-    internal Video(TItem item, Func<TItem, string?> url, Func<TItem, string?>? poster, Func<TItem, double>? startTime)
+    internal Video(
+        TItem item,
+        Func<TItem, string?> url,
+        Func<TItem, string?>? poster,
+        Func<TItem, double>? startTime,
+        bool muted)
     {
         Poster = poster?.Invoke(item);
         Url = url.Invoke(item);
         StartTime = startTime?.Invoke(item) ?? 0;
+        Muted = muted;
         Item = item;
     }