From 0c5939ae16846a0e08553ca0aaec62028f11bf90 Mon Sep 17 00:00:00 2001
From: 4gray <fourgray@proton.me>
Date: Sat, 27 Sep 2025 20:05:35 +0200
Subject: [PATCH] feat(video-player): integrate Artplayer and remove DPlayer

- Enableplayer global config and component options:
  - set Artplayer.AUTO_PLAYBACK_TIMEOUT to 10000 to reduce autoplay
    timeouts.
  - enable autoPlayback, playsInline, airplay, backdrop, mutex and set
    theme on Artplayer instance to improve playback behaviour and UI.
  - add autoSize, autoMini, pip, screenshot, aspectRatio and fullscreen
    settings for a consistent feature set.

- Harden channel URL check to avoid null errors:
  - use optional chaining when checking channel.url for m3u8.

- Move StreamFormat import ordering and clean unused enum entry:
  - remove DPlayer from VideoPlayer enum and related commented code.
  - remove DPlayer component imports, declarations and template branch,
    simplifying player selection and eliminating dead code.

- Tidy component decorator formatting and fix template array trailing
  commas to preserve style consistency.

These changes replace the deprecated/removed DPlayer integration with a
fully configured Artplayer, improve runtime safety, and clean up unused
code.
---
 .../components/art-player/art-player.component.ts   | 13 ++++++++++---
 .../video-player/video-player.component.html        |  8 --------
 .../video-player/video-player.component.ts          |  2 --
 src/app/settings/settings.component.ts              |  8 ++------
 src/app/settings/settings.interface.ts              |  3 +--
 5 files changed, 13 insertions(+), 21 deletions(-)

diff --git a/src/app/player/components/art-player/art-player.component.ts b/src/app/player/components/art-player/art-player.component.ts
index a9ac54676..a5228d319 100644
--- a/src/app/player/components/art-player/art-player.component.ts
+++ b/src/app/player/components/art-player/art-player.component.ts
@@ -1,4 +1,3 @@
-
 import {
     Component,
     ElementRef,
@@ -12,6 +11,8 @@ import Artplayer from 'artplayer';
 import Hls from 'hls.js';
 import { Channel } from '../../../../../shared/channel.interface';
 
+Artplayer.AUTO_PLAYBACK_TIMEOUT = 10000;
+
 @Component({
     selector: 'app-art-player',
     imports: [],
@@ -28,7 +29,7 @@ import { Channel } from '../../../../../shared/channel.interface';
                 height: 100%;
             }
         `,
-    ]
+    ],
 })
 export class ArtPlayerComponent implements OnInit, OnDestroy, OnChanges {
     @Input() channel: Channel;
@@ -62,7 +63,7 @@ export class ArtPlayerComponent implements OnInit, OnDestroy, OnChanges {
         const el = this.elementRef.nativeElement.querySelector(
             '.artplayer-container'
         );
-        const isLive = this.channel.url.toLowerCase().includes('m3u8');
+        const isLive = this.channel?.url?.toLowerCase().includes('m3u8');
 
         this.player = new Artplayer({
             container: el,
@@ -72,6 +73,7 @@ export class ArtPlayerComponent implements OnInit, OnDestroy, OnChanges {
             autoplay: true,
             type: this.getVideoType(this.channel.url),
             pip: true,
+            autoPlayback: true,
             autoSize: true,
             autoMini: true,
             screenshot: true,
@@ -80,6 +82,11 @@ export class ArtPlayerComponent implements OnInit, OnDestroy, OnChanges {
             aspectRatio: true,
             fullscreen: true,
             fullscreenWeb: true,
+            playsInline: true,
+            airplay: true,
+            backdrop: true,
+            mutex: true,
+            theme: '#ff0000',
             customType: {
                 m3u8: function (video: HTMLVideoElement, url: string) {
                     if (Hls.isSupported()) {
diff --git a/src/app/player/components/video-player/video-player.component.html b/src/app/player/components/video-player/video-player.component.html
index c4a60704b..078cdf910 100644
--- a/src/app/player/components/video-player/video-player.component.html
+++ b/src/app/player/components/video-player/video-player.component.html
@@ -49,14 +49,6 @@
                         [showCaptions]="playerSettings.showCaptions"
                     />
                 }
-                <!-- Add DPlayer component -->
-                @if (playerSettings.player === 'dplayer') {
-                    <app-d-player
-                        [channel]="activeChannel"
-                        [volume]="volume"
-                        [showCaptions]="playerSettings.showCaptions"
-                    />
-                }
                 <!-- Add ArtPlayer component -->
                 @if (playerSettings.player === 'artplayer') {
                     <app-art-player
diff --git a/src/app/player/components/video-player/video-player.component.ts b/src/app/player/components/video-player/video-player.component.ts
index 16ecdec48..088734fae 100644
--- a/src/app/player/components/video-player/video-player.component.ts
+++ b/src/app/player/components/video-player/video-player.component.ts
@@ -38,7 +38,6 @@ import {
 } from '../../../state/selectors';
 import { ArtPlayerComponent } from '../art-player/art-player.component';
 import { AudioPlayerComponent } from '../audio-player/audio-player.component';
-import { DPlayerComponent } from '../d-player/d-player.component';
 import { EpgListComponent } from '../epg-list/epg-list.component';
 import { HtmlVideoPlayerComponent } from '../html-video-player/html-video-player.component';
 import { InfoOverlayComponent } from '../info-overlay/info-overlay.component';
@@ -67,7 +66,6 @@ export const COMPONENT_OVERLAY_REF = new InjectionToken(
         SidebarComponent,
         ToolbarComponent,
         VjsPlayerComponent,
-        DPlayerComponent,
         ArtPlayerComponent,
     ],
     templateUrl: './video-player.component.html',
diff --git a/src/app/settings/settings.component.ts b/src/app/settings/settings.component.ts
index 2adbdef8a..548e9dcbb 100644
--- a/src/app/settings/settings.component.ts
+++ b/src/app/settings/settings.component.ts
@@ -49,9 +49,9 @@ import { HeaderComponent } from '../shared/components/header/header.component';
 import * as PlaylistActions from '../state/actions';
 import { selectIsEpgAvailable } from '../state/selectors';
 import { SettingsService } from './../services/settings.service';
-import { StreamFormat } from './stream-format.enum';
 import { Language } from './language.enum';
 import { VideoPlayer } from './settings.interface';
+import { StreamFormat } from './stream-format.enum';
 import { Theme } from './theme.enum';
 
 @Component({
@@ -107,14 +107,10 @@ export class SettingsComponent implements OnInit {
             id: VideoPlayer.VideoJs,
             label: 'VideoJs Player',
         },
-        /* {
-            id: VideoPlayer.DPlayer,
-            label: 'DPlayer',
-        },
         {
             id: VideoPlayer.ArtPlayer,
             label: 'ArtPlayer',
-        }, */
+        },
         ...(this.isTauri ? this.osPlayers : []),
     ];
 
diff --git a/src/app/settings/settings.interface.ts b/src/app/settings/settings.interface.ts
index c18062c8e..4f0114cc9 100644
--- a/src/app/settings/settings.interface.ts
+++ b/src/app/settings/settings.interface.ts
@@ -1,5 +1,5 @@
-import { StreamFormat } from './stream-format.enum';
 import { Language } from './language.enum';
+import { StreamFormat } from './stream-format.enum';
 import { Theme } from './theme.enum';
 
 /**
@@ -10,7 +10,6 @@ export enum VideoPlayer {
     Html5Player = 'html5',
     MPV = 'mpv',
     VLC = 'vlc',
-    DPlayer = 'dplayer',
     ArtPlayer = 'artplayer',
 }