[ui] add playsInline to every image/video elem (#6259)

Author: feederbox826

ui/v2.5/src/components/Images/ImageCard.tsx

@@ -169,6 +169,7 @@ export const ImageCard: React.FC<IImageCardProps> = (
             <ImagePreview
               loop={video}
               autoPlay={video}
+              playsInline={video}
               className="image-card-preview-image"
               alt={props.image.title ?? ""}
               src={source}

ui/v2.5/src/components/Images/ImageDetails/Image.tsx

@@ -370,6 +370,7 @@ const ImagePage: React.FC<IProps> = ({ image }) => {
           <ImageView
             loop={image.visual_files[0].__typename == "VideoFile"}
             autoPlay={image.visual_files[0].__typename == "VideoFile"}
+            playsInline={image.visual_files[0].__typename == "VideoFile"}
             controls={image.visual_files[0].__typename == "VideoFile"}
             className="m-sm-auto no-gutter image-image"
             style={

ui/v2.5/src/components/Images/ImageWallItem.tsx

@@ -39,6 +39,7 @@ export const ImageWallItem: React.FC<RenderImageProps & IExtraProps> = (
     <ImagePreview
       loop={video}
       muted={video}
+      playsInline={video}
       autoPlay={video}
       key={props.photo.key}
       style={imgStyle}

ui/v2.5/src/components/Scenes/SceneMarkerWallPanel.tsx

@@ -96,6 +96,7 @@ export const MarkerWallItem: React.FC<
         loop={video}
         muted={!video || !playSound || !active}
         autoPlay={video}
+        playsInline={video}
         key={props.photo.key}
         src={props.photo.src}
         width={width}

ui/v2.5/src/components/Scenes/SceneWallPanel.tsx

@@ -89,6 +89,7 @@ export const SceneWallItem: React.FC<
         loop={video}
         muted={!video || !playSound || !active}
         autoPlay={video}
+        playsInline={video}
         key={props.photo.key}
         src={props.photo.src}
         width={width}

ui/v2.5/src/hooks/Lightbox/Lightbox.tsx

@@ -455,6 +455,7 @@ export const LightboxComponent: React.FC<IProps> = ({
     React.createElement(image.paths.preview != "" ? "video" : "img", {
       loop: image.paths.preview != "",
       autoPlay: image.paths.preview != "",
+      playsInline: image.paths.preview != "",
       src:
         image.paths.preview != ""
           ? image.paths.preview ?? ""