tdesign-mobile-vue
Version:
tdesign-mobile-vue
1 lines • 7.99 kB
Source Map (JSON)
{"version":3,"file":"animation.mjs","sources":["../../../../src/_common/js/message/animation.ts"],"sourcesContent":["import { PLACEMENT_LIST } from './constants';\n\ntype CompositeOperationOrAuto = 'accumulate' | 'add' | 'auto' | 'replace';\n\ninterface Keyframe {\n composite?: CompositeOperationOrAuto;\n easing?: string;\n offset?: number | null;\n [property: string]: string | number | null | undefined;\n}\n\nconst ANIMATION_OPTION = {\n duration: 200,\n easing: 'linear',\n};\n\nfunction setDomStyleAfterAnimation(dom: HTMLElement, styleAfterAnimation: Keyframe) {\n const keys = Object.keys(styleAfterAnimation);\n for (let i = 0; i < keys.length; i += 1) {\n const key = keys[i];\n // @ts-ignore\n // TODO: CSSStyleDeclaration\n // eslint-disable-next-line no-param-reassign\n dom.style[key] = styleAfterAnimation[key];\n }\n}\n\nfunction getFadeInKeyframes(placement: string, offsetWidth: Number, offsetHeight: Number): Array<Keyframe> | null {\n if (!PLACEMENT_LIST.includes(placement)) return null;\n if (['top-left', 'left', 'bottom-left'].includes(placement)) {\n return [\n { opacity: 0, marginLeft: `-${offsetWidth}px` },\n { opacity: 1, marginLeft: '0' },\n ];\n }\n if (['top-right', 'right', 'bottom-right'].includes(placement)) {\n return [\n { opacity: 0, marginRight: `-${offsetWidth}px` },\n { opacity: 1, marginRight: '0' },\n ];\n }\n if (['top', 'center'].includes(placement)) {\n return [\n { opacity: 0, marginTop: `-${offsetHeight}px` },\n { opacity: 1, marginTop: '0' },\n ];\n }\n if (['bottom'].includes(placement)) {\n return [\n { opacity: 0, transform: `translate3d(0, ${offsetHeight}px, 0)` },\n { opacity: 1, transform: 'translate3d(0, 0, 0)' },\n ];\n }\n return null;\n}\n\nfunction getFadeOutKeyframes(placement: string, offsetHeight: Number): Array<Keyframe> | null {\n if (!PLACEMENT_LIST.includes(placement)) return null;\n if (['bottom-left', 'bottom', 'bottom-right'].includes(placement)) {\n const marginOffset = `${offsetHeight}px`;\n return [\n { opacity: 1, marginTop: '0px' },\n { opacity: 0, marginTop: marginOffset },\n ];\n }\n const marginOffset = `-${offsetHeight}px`;\n return [\n { opacity: 1, marginTop: '0px' },\n { opacity: 0, marginTop: marginOffset },\n ];\n}\n\nfunction fadeIn(dom: HTMLElement, placement: string) {\n if (!dom) return;\n const offsetWidth = dom?.offsetWidth || 0;\n const offsetHeight = dom?.offsetHeight || 0;\n const fadeInKeyframes: Array<Keyframe> | null = getFadeInKeyframes(placement, offsetWidth, offsetHeight);\n if (!fadeInKeyframes) return;\n const styleAfterFadeIn = fadeInKeyframes[fadeInKeyframes.length - 1];\n setDomStyleAfterAnimation(dom, styleAfterFadeIn);\n dom.animate?.(fadeInKeyframes, ANIMATION_OPTION);\n}\n\nfunction fadeOut(dom: HTMLElement, placement: string, onFinish: Function) {\n if (!dom) return;\n const offsetHeight = dom.offsetHeight || 0;\n const fadeOutKeyframes: Array<Keyframe> | null = getFadeOutKeyframes(placement, offsetHeight);\n if (!fadeOutKeyframes) {\n onFinish();\n return;\n }\n const styleAfterFadeOut = fadeOutKeyframes[fadeOutKeyframes.length - 1];\n setDomStyleAfterAnimation(dom, styleAfterFadeOut);\n const animation = dom.animate && dom.animate(fadeOutKeyframes, ANIMATION_OPTION);\n if (animation) {\n animation.onfinish = () => {\n // eslint-disable-next-line no-param-reassign\n dom.style.display = 'none';\n onFinish();\n };\n } else {\n // eslint-disable-next-line no-param-reassign\n dom.style.display = 'none';\n onFinish();\n }\n}\n\nexport { fadeIn, fadeOut };\n"],"names":["ANIMATION_OPTION","duration","easing","setDomStyleAfterAnimation","dom","styleAfterAnimation","keys","Object","i","length","key","style","getFadeInKeyframes","placement","offsetWidth","offsetHeight","PLACEMENT_LIST","includes","opacity","marginLeft","concat","marginRight","marginTop","transform","getFadeOutKeyframes","marginOffset","fadeIn","_dom$animate","fadeInKeyframes","styleAfterFadeIn","animate","call","fadeOut","onFinish","fadeOutKeyframes","styleAfterFadeOut","animation","onfinish","display"],"mappings":"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"}