diff options
author | Ajay <[email protected]> | 2024-01-24 16:21:31 -0500 |
---|---|---|
committer | Ajay <[email protected]> | 2024-01-24 16:21:31 -0500 |
commit | 16f27e5c5cd3a8f99773fd232dd8f1689ecc9bbd (patch) | |
tree | a461c99561543d67bb70f941a456b7c0e6407ee9 | |
parent | 88dc8db6e7f197d14136e2a5485713185d529b8f (diff) | |
download | SponsorBlock-16f27e5c5cd3a8f99773fd232dd8f1689ecc9bbd.tar.gz SponsorBlock-16f27e5c5cd3a8f99773fd232dd8f1689ecc9bbd.zip |
Move animation utils to maze utils
m--------- | maze-utils | 0 | ||||
-rw-r--r-- | src/components/CategoryPillComponent.tsx | 2 | ||||
-rw-r--r-- | src/components/ChapterVoteComponent.tsx | 2 | ||||
-rw-r--r-- | src/content.ts | 2 | ||||
-rw-r--r-- | src/js-components/skipButtonControlBar.ts | 2 | ||||
-rw-r--r-- | src/popup.ts | 2 | ||||
-rw-r--r-- | src/utils/animationUtils.ts | 78 |
7 files changed, 5 insertions, 83 deletions
diff --git a/maze-utils b/maze-utils -Subproject 27db39e39b922b4e09f557ea7cb8eec88f6d475 +Subproject 65609595a9af1cdc66ab49e765d3759cf5a56ca diff --git a/src/components/CategoryPillComponent.tsx b/src/components/CategoryPillComponent.tsx index c72dc18e..36e31b47 100644 --- a/src/components/CategoryPillComponent.tsx +++ b/src/components/CategoryPillComponent.tsx @@ -6,7 +6,7 @@ import ThumbsUpSvg from "../svg-icons/thumbs_up_svg"; import ThumbsDownSvg from "../svg-icons/thumbs_down_svg"; import { downvoteButtonColor, SkipNoticeAction } from "../utils/noticeUtils"; import { VoteResponse } from "../messageTypes"; -import { AnimationUtils } from "../utils/animationUtils"; +import { AnimationUtils } from "../../maze-utils/src/animationUtils"; import { Tooltip } from "../render/Tooltip"; import { getErrorMessage } from "../../maze-utils/src/formating"; diff --git a/src/components/ChapterVoteComponent.tsx b/src/components/ChapterVoteComponent.tsx index d50878a6..677a966d 100644 --- a/src/components/ChapterVoteComponent.tsx +++ b/src/components/ChapterVoteComponent.tsx @@ -6,7 +6,7 @@ import ThumbsUpSvg from "../svg-icons/thumbs_up_svg"; import ThumbsDownSvg from "../svg-icons/thumbs_down_svg"; import { downvoteButtonColor, SkipNoticeAction } from "../utils/noticeUtils"; import { VoteResponse } from "../messageTypes"; -import { AnimationUtils } from "../utils/animationUtils"; +import { AnimationUtils } from "../../maze-utils/src/animationUtils"; import { Tooltip } from "../render/Tooltip"; import { getErrorMessage } from "../../maze-utils/src/formating"; diff --git a/src/content.ts b/src/content.ts index 2b8e3213..71434eb7 100644 --- a/src/content.ts +++ b/src/content.ts @@ -26,7 +26,7 @@ import { SkipButtonControlBar } from "./js-components/skipButtonControlBar"; import { getStartTimeFromUrl } from "./utils/urlParser"; import { getControls, getExistingChapters, getHashParams, isPlayingPlaylist, isVisible } from "./utils/pageUtils"; import { CategoryPill } from "./render/CategoryPill"; -import { AnimationUtils } from "./utils/animationUtils"; +import { AnimationUtils } from "../maze-utils/src/animationUtils"; import { GenericUtils } from "./utils/genericUtils"; import { logDebug, logWarn } from "./utils/logger"; import { importTimes } from "./utils/exporter"; diff --git a/src/js-components/skipButtonControlBar.ts b/src/js-components/skipButtonControlBar.ts index 321e4cf6..b5c18386 100644 --- a/src/js-components/skipButtonControlBar.ts +++ b/src/js-components/skipButtonControlBar.ts @@ -1,7 +1,7 @@ import Config from "../config"; import { SegmentUUID, SponsorTime } from "../types"; import { getSkippingText } from "../utils/categoryUtils"; -import { AnimationUtils } from "../utils/animationUtils"; +import { AnimationUtils } from "../../maze-utils/src/animationUtils"; import { keybindToString } from "../../maze-utils/src/config"; import { isMobileControlsOpen } from "../utils/mobileUtils"; diff --git a/src/popup.ts b/src/popup.ts index e1e5757f..86e79f54 100644 --- a/src/popup.ts +++ b/src/popup.ts @@ -19,7 +19,7 @@ import { VoteResponse, } from "./messageTypes"; import { showDonationLink } from "./utils/configUtils"; -import { AnimationUtils } from "./utils/animationUtils"; +import { AnimationUtils } from "../maze-utils/src/animationUtils"; import { shortCategoryName } from "./utils/categoryUtils"; import { localizeHtmlPage } from "../maze-utils/src/setup"; import { exportTimes } from "./utils/exporter"; diff --git a/src/utils/animationUtils.ts b/src/utils/animationUtils.ts deleted file mode 100644 index 08a59ce0..00000000 --- a/src/utils/animationUtils.ts +++ /dev/null @@ -1,78 +0,0 @@ - /** - * Starts a spinning animation and returns a function to be called when it should be stopped - * The callback will be called when the animation is finished - * It waits until a full rotation is complete - */ -function applyLoadingAnimation(element: HTMLElement, time: number, callback?: () => void): () => Promise<void> { - element.style.animation = `rotate ${time}s 0s infinite`; - - return async () => new Promise((resolve) => { - // Make the animation finite - element.style.animation = `rotate ${time}s`; - - // When the animation is over, hide the button - const animationEndListener = () => { - if (callback) callback(); - - element.style.animation = "none"; - - element.removeEventListener("animationend", animationEndListener); - - resolve(); - }; - - element.addEventListener("animationend", animationEndListener); - }); -} - -function setupCustomHideAnimation(element: Element, container: Element, enabled = true, rightSlide = true): { hide: () => void; show: () => void } { - if (enabled) element.classList.add("autoHiding"); - element.classList.add("sbhidden"); - element.classList.add("animationDone"); - if (!rightSlide) element.classList.add("autoHideLeft"); - - let mouseEntered = false; - - return { - hide: () => { - mouseEntered = false; - if (element.classList.contains("autoHiding")) { - element.classList.add("sbhidden"); - } - }, - show: () => { - mouseEntered = true; - element.classList.remove("animationDone"); - - // Wait for next event loop - setTimeout(() => { - if (mouseEntered) element.classList.remove("sbhidden") - }, 10); - } - }; -} - -function setupAutoHideAnimation(element: Element, container: Element, enabled = true, rightSlide = true): void { - const { hide, show } = this.setupCustomHideAnimation(element, container, enabled, rightSlide); - - container.addEventListener("mouseleave", () => hide()); - container.addEventListener("mouseenter", () => show()); -} - -function enableAutoHideAnimation(element: Element): void { - element.classList.add("autoHiding"); - element.classList.add("sbhidden"); -} - -function disableAutoHideAnimation(element: Element): void { - element.classList.remove("autoHiding"); - element.classList.remove("sbhidden"); -} - -export const AnimationUtils = { - applyLoadingAnimation, - setupAutoHideAnimation, - setupCustomHideAnimation, - enableAutoHideAnimation, - disableAutoHideAnimation -};
\ No newline at end of file |