From 962e9ade371caf1b643d0afabd2c45bbaf3ec383 Mon Sep 17 00:00:00 2001
From: NoCrypt <57245077+NoCrypt@users.noreply.github.com>
Date: Sat, 10 Aug 2024 21:31:59 +0700
Subject: [PATCH] feat: auto-skip intro/outro toggle

---
 README.md                                   |  1 +
 common/modules/util.js                      |  1 +
 common/views/Player/Player.svelte           | 15 +++++++++------
 common/views/Settings/PlayerSettings.svelte |  6 ++++++
 4 files changed, 17 insertions(+), 6 deletions(-)

diff --git a/README.md b/README.md
index 1764181d..479e0fd4 100644
--- a/README.md
+++ b/README.md
@@ -42,6 +42,7 @@ Includes all original Miru features, plus:
 - Disabled smooth scrolling by default due to poor performance on my device
 - Gesture lock on Android to prevent misclick
 - Right click or long press on RSS Section will open the anime episode list
+- Toggleable auto skip intro/outro
 
 ## **Building and Development**
 
diff --git a/common/modules/util.js b/common/modules/util.js
index f0813853..7e40e6ed 100644
--- a/common/modules/util.js
+++ b/common/modules/util.js
@@ -125,6 +125,7 @@ export const defaults = {
   playerAutoplay: true,
   playerPause: true,
   playerAutocomplete: true,
+  playerAutoSkip: false,
   playerDeband: false,
   playerSeek: 5,
   rssQuality: '1080',
diff --git a/common/views/Player/Player.svelte b/common/views/Player/Player.svelte
index 0e692c90..a04497fc 100644
--- a/common/views/Player/Player.svelte
+++ b/common/views/Player/Player.svelte
@@ -804,6 +804,7 @@
   }
 
   let currentSkippable = null
+  $: currentSkippable && $settings.playerAutoSkip && skip()
   function checkSkippableChapters () {
     const current = findChapter(currentTime)
     if (current) {
@@ -1555,14 +1556,16 @@
   .seekbar {
     font-size: 2rem !important;
   }
-  .miniplayer .mobile-focus-target {
-    display: block !important;
-  }
-  .miniplayer .mobile-focus-target:focus-visible {
-    background: hsla(209, 100%, 55%, 0.3);
-  }
 
   @media (pointer: none), (pointer: coarse) {
+
+    .miniplayer .mobile-focus-target {
+      display: block !important;
+    }
+    .miniplayer .mobile-focus-target:focus-visible {
+      background: hsla(209, 100%, 55%, 0.3);
+    }
+
     .bottom .ctrl[data-name='playPause'],
     .bottom .volume,
     .bottom .keybinds {
diff --git a/common/views/Settings/PlayerSettings.svelte b/common/views/Settings/PlayerSettings.svelte
index e50dbc0d..3fc833e6 100644
--- a/common/views/Settings/PlayerSettings.svelte
+++ b/common/views/Settings/PlayerSettings.svelte
@@ -142,6 +142,12 @@
     <label for='player-autocomplete'>{settings.playerAutocomplete ? 'On' : 'Off'}</label>
   </div>
 </SettingCard>
+<SettingCard title='Auto-Skip Intro/Outro' description='Automatically skip intro and outro. Warning, sometimes it can skip wrong part of the episode and you can&apos;t view Intro/Outro at all.'>
+  <div class='custom-switch'>
+    <input type='checkbox' id='player-auto-skip' bind:checked={settings.playerAutoSkip} />
+    <label for='player-auto-skip'>{settings.playerAutoSkip ? 'On' : 'Off'}</label>
+  </div>
+</SettingCard>
 <SettingCard title='Seek Duration' description='Seconds to seek an episode with arrow keys'>
   <div class='input-group w-100 mw-full'>
     <input type='number' bind:value={settings.playerSeek} min='1' max='50' class='form-control text-right bg-dark' />