From 459ab7f2a16a18e7ca0f5a3cc5d4f750cb40d9df Mon Sep 17 00:00:00 2001
From: WofWca <wofwca@protonmail.com>
Date: Mon, 11 Nov 2024 17:13:53 +0400
Subject: [PATCH] adjustments

---
 src/entry-points/popup/App.svelte | 135 ++++++++++++++++++------------
 src/settings/defaultSettings.ts   |  23 +++--
 src/settings/index.ts             |   1 -
 3 files changed, 97 insertions(+), 62 deletions(-)

diff --git a/src/entry-points/popup/App.svelte b/src/entry-points/popup/App.svelte
index 52f19f4..0bb02c1 100644
--- a/src/entry-points/popup/App.svelte
+++ b/src/entry-points/popup/App.svelte
@@ -403,32 +403,40 @@ along with Jump Cutter Browser Extension.  If not, see <https://www.gnu.org/lice
 
   const displayNewBadgeOnExperimentalAlgorithm = new Date() < new Date('2024-09-30');
 
-  function onAdvancedModeChange(event: Event) {
+  function onAdvancedModeChange(isOn: boolean) {
     settingsKeysToSaveToStorage.add('advancedMode');
-    if ((event.target as HTMLInputElement).checked) {
-      settings.experimentalControllerType = ControllerKind_STRETCHING;
-      settings.marginBefore = 0;
-      
-      settingsKeysToSaveToStorage.add('experimentalControllerType');
-      settingsKeysToSaveToStorage.add('marginBefore');
-    }
-
     throttledSaveUnsavedSettingsToStorageAndTriggerCallbacks();
-  }
 
+    if (!isOn) {
+      updateSettingsLocalCopyAndStorage({
+        experimentalControllerType: ControllerKind_STRETCHING,
+        marginBefore: 0,
+        // However, it's not very nice to change this setting,
+        // because it can only be changed back from the options page.
+        silenceSpeedSpecificationMethod: 'relativeToSoundedSpeed',
+      })
+
+      // Set the settings according to the `simpleSlider`'s value.
+      onSimpleSliderInput();
+    }
+  }
   function onSimpleSliderInput() {
-    settings.volumeThreshold = settings.simpleSlider * 0.001;
-    settings.silenceSpeedRaw = settings.simpleSlider * 0.05 + 1;
-    settings.marginAfter = 0.01 * (100 - settings.simpleSlider);
-
     settingsKeysToSaveToStorage.add('simpleSlider');
-    settingsKeysToSaveToStorage.add('volumeThreshold');
-    settingsKeysToSaveToStorage.add('silenceSpeedRaw');
-    settingsKeysToSaveToStorage.add('marginAfter');
-
     throttledSaveUnsavedSettingsToStorageAndTriggerCallbacks();
-  }
 
+    updateSettingsLocalCopyAndStorage({
+      // If you decide to change these values,
+      // remember to also update them in `defaultSettings.ts`.
+      // When adjusting the values, keep in mind that _each_ of them
+      // affects how much we skip, that is adjusting even just one of them
+      // would make the extension skip more,
+      // and adjusting all of them at the same time would make it skip
+      // even more. So, keep them within sane, moderate limits.
+      volumeThreshold: 0.001 + settings.simpleSlider * 0.00015,
+      silenceSpeedRaw: 1.5 + settings.simpleSlider * 0.020,
+      marginAfter: 0.03 + 0.0020 * (100 - settings.simpleSlider)
+    })
+  }
 </script>
 
 <svelte:window
@@ -466,8 +474,8 @@ along with Jump Cutter Browser Extension.  If not, see <https://www.gnu.org/lice
       theme: 'my-tippy',
     }}
   >⚙️</button>
-  {#if settings.advancedMode}
   <div class="others__wrapper">
+    {#if settings.advancedMode}
     <!-- TODO work on accessibility for the volume indicator. https://atomiks.github.io/tippyjs/v6/accessibility. -->
     <span
       class="others__item"
@@ -495,6 +503,10 @@ along with Jump Cutter Browser Extension.  If not, see <https://www.gnu.org/lice
         style="width: 6rem;"
       ></meter>
     </span>
+    {:else}
+    <div style="flex-grow: 1"></div>
+    {/if}
+    <!-- TODO in "simple mode" the toolip's content is cut clipped. -->
     <!-- Why button? So the tooltip can be accessed with no pointer device. Any better ideas? -->
     <button
       type="button"
@@ -569,7 +581,6 @@ along with Jump Cutter Browser Extension.  If not, see <https://www.gnu.org/lice
       </div>
     </button>
   </div>
-  {/if}
   <!-- TODO transitions? -->
   <div
     style={
@@ -725,32 +736,26 @@ along with Jump Cutter Browser Extension.  If not, see <https://www.gnu.org/lice
   </div>
 
   {#if !settings.advancedMode}
-    <div style="margin-bottom: 5px; margin-top: 5px;">
-      <input
-      type="range"
-      style="width: 100%;"
-      min="0"
-      max="100"
-      bind:value={settings.simpleSlider}
-      on:input={onSimpleSliderInput}
-      />
-      <div style="display: flex; width: 100%">
-        <div style="width: 50%;">{getMessage("skipLess")}</div>
-        <div style="width: 50%; text-align: right;">{getMessage("skipMore")}</div>
+    <label
+      style="
+        margin-top: 1rem;
+        display: block;
+      "
+    >
+      <div style="display: flex; justify-content: space-between;">
+        <div>{getMessage("skipLess")}</div>
+        <div>{getMessage("skipMore")}</div>
       </div>
-    </div>
-  {/if}
-
-  <div>
-    <label>
       <input
-      type="checkbox"
-      bind:checked={settings.advancedMode}
-      on:change={onAdvancedModeChange}
+        type="range"
+        style="width: 100%;"
+        min="0"
+        max="100"
+        bind:value={settings.simpleSlider}
+        on:input={onSimpleSliderInput}
       />
-      {getMessage("advancedMode")}
     </label>
-  </div>
+  {/if}
 
   {#if settings.advancedMode}
   <label
@@ -880,16 +885,40 @@ along with Jump Cutter Browser Extension.  If not, see <https://www.gnu.org/lice
     }}
   />
   {/if}
-  {#if settings.popupAlwaysShowOpenLocalFileLink}
-    <!-- svelte-ignore a11y-missing-attribute --->
-    <!-- svelte-ignore a11y-no-static-element-interactions -->
-    <a
-      class="capitalize-first-letter"
-      {...openLocalFileLinkProps}
-      on:click={onClickOpenLocalFileLink}
-      style="display: inline-block; margin-top: 1rem;"
-    >📂 {getMessage('openLocalFile')}</a>
-  {/if}
+  <div
+    style="
+      display: flex;
+      align-items: flex-end;
+      justify-content: space-between;
+      flex-wrap: wrap;
+    "
+  >
+    {#if settings.popupAlwaysShowOpenLocalFileLink}
+      <!-- svelte-ignore a11y-missing-attribute --->
+      <!-- svelte-ignore a11y-no-static-element-interactions -->
+      <a
+        class="capitalize-first-letter"
+        {...openLocalFileLinkProps}
+        on:click={onClickOpenLocalFileLink}
+        style="margin-top: 1rem;"
+      >📂 {getMessage('openLocalFile')}</a>
+    {/if}
+    <label
+      style="
+        display: inline-flex;
+        align-items: center;
+        margin-top: 1rem;
+      "
+    >
+      <input
+        type="checkbox"
+        style="margin: 0px 0.5rem 0px 0px;"
+        bind:checked={settings.advancedMode}
+        on:change={e => onAdvancedModeChange(e.currentTarget.checked)}
+      />
+      {getMessage("popupAdvancedMode")}
+    </label>
+  </div>
 {/await}
 
 <style>
diff --git a/src/settings/defaultSettings.ts b/src/settings/defaultSettings.ts
index d995dbe..0e49d9a 100644
--- a/src/settings/defaultSettings.ts
+++ b/src/settings/defaultSettings.ts
@@ -26,20 +26,28 @@ import { getGeckoLikelyMaxNonMutedPlaybackRate } from '@/helpers';
 import { browserHasAudioDesyncBug } from '@/helpers/browserHasAudioDesyncBug';
 import { isMobile } from '@/helpers/isMobile';
 
-const simpleSliderDefault = 30;
+// Start with a below-middle value to let the user get a feel
+// for how the extension behaves without being too disruptive,
+// and then let them crank it up if they feel like it.
+// The value of 50 should be optimal for most users (based on my feeling).
+const simpleSliderDefaultVal = 33;
 
 const ElementPlaybackControllerStretchingSpecificDefaults = {
-  volumeThreshold: simpleSliderDefault * 0.001,
+  // If you decide to change these values,
+  // remember to also update them in `popup/App.svelte`.
+  volumeThreshold: 0.001 + simpleSliderDefaultVal * 0.00015,
   marginBefore: 0,
-  marginAfter: 0.01 * (100 - simpleSliderDefault),
+  marginAfter: 0.03 + 0.0020 * (100 - simpleSliderDefaultVal),
 } as const;
 
 export const defaultSettings: Readonly<Settings> = {
   volumeThreshold: ElementPlaybackControllerStretchingSpecificDefaults.volumeThreshold,
-  previousVolumeThreshold:  simpleSliderDefault * 0.001,
+  previousVolumeThreshold:  ElementPlaybackControllerStretchingSpecificDefaults.volumeThreshold,
   silenceSpeedSpecificationMethod: 'relativeToSoundedSpeed',
-  silenceSpeedRaw:         simpleSliderDefault * 0.05 + 1,
-  previousSilenceSpeedRaw: simpleSliderDefault * 0.05 + 1,
+  // If you decide to change these values,
+  // remember to also update them in `popup/App.svelte`.
+  silenceSpeedRaw:         1.5 + simpleSliderDefaultVal * 0.020,
+  previousSilenceSpeedRaw: 1.5 + simpleSliderDefaultVal * 0.020,
   // Argument for `soundedSpeed !== 1`:
   // * It reminds the user that the extension is enabled, so he's not confused by media getting seeked seemingly
   // randomly.
@@ -254,6 +262,5 @@ export const defaultSettings: Readonly<Settings> = {
   onPlaybackRateChangeFromOtherScripts: 'updateSoundedSpeed',
 
   advancedMode: false,
-
-  simpleSlider: simpleSliderDefault,
+  simpleSlider: simpleSliderDefaultVal,
 };
diff --git a/src/settings/index.ts b/src/settings/index.ts
index d31eb0b..c6d90c9 100644
--- a/src/settings/index.ts
+++ b/src/settings/index.ts
@@ -153,7 +153,6 @@ export interface Settings {
   __lastHandledUpdateToVersion?: `${number}.${number}.${number}`,
 
   advancedMode: boolean,
-
   simpleSlider: number,
 }