Skip to content

Commit

Permalink
adjustments
Browse files Browse the repository at this point in the history
  • Loading branch information
WofWca committed Nov 11, 2024
1 parent 772dcc8 commit 459ab7f
Show file tree
Hide file tree
Showing 3 changed files with 97 additions and 62 deletions.
135 changes: 82 additions & 53 deletions src/entry-points/popup/App.svelte
Original file line number Diff line number Diff line change
Expand Up @@ -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
Expand Down Expand Up @@ -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"
Expand Down Expand Up @@ -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"
Expand Down Expand Up @@ -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={
Expand Down Expand Up @@ -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
Expand Down Expand Up @@ -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>
Expand Down
23 changes: 15 additions & 8 deletions src/settings/defaultSettings.ts
Original file line number Diff line number Diff line change
Expand Up @@ -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.
Expand Down Expand Up @@ -254,6 +262,5 @@ export const defaultSettings: Readonly<Settings> = {
onPlaybackRateChangeFromOtherScripts: 'updateSoundedSpeed',

advancedMode: false,

simpleSlider: simpleSliderDefault,
simpleSlider: simpleSliderDefaultVal,
};
1 change: 0 additions & 1 deletion src/settings/index.ts
Original file line number Diff line number Diff line change
Expand Up @@ -153,7 +153,6 @@ export interface Settings {
__lastHandledUpdateToVersion?: `${number}.${number}.${number}`,

advancedMode: boolean,

simpleSlider: number,
}

Expand Down

0 comments on commit 459ab7f

Please sign in to comment.