TianHeJianKang/uni_modules/lime-shared/animation/useTransition.ts

// @ts-nocheck
import { ComponentPublicInstance } from 'vue'
import { ease } from './ease';
import { Timeline, Animation } from './';
export type UseTransitionOptions = {
	duration ?: number
	immediate ?: boolean
	context ?: ComponentPublicInstance
}
// #ifndef APP-IOS || APP-ANDROID
import { ref, watch, Ref } from '@/uni_modules/lime-shared/vue'

export function useTransition(percent : Ref<number>|(() => number), options : UseTransitionOptions) : Ref<number> {
	const current = ref(0)
	const { immediate, duration = 300 } = options
	let tl:Timeline|null = null;
	let timer = -1
	const isFunction = typeof percent === 'function'
	watch(isFunction ? percent : () => percent.value, (v) => {
		if(tl == null){
			tl = new Timeline()
		}
		tl.start();
		tl.add(
			new Animation(
				current.value,
				v,
				duration,
				0,
				ease,
				nowValue => {
					current.value = nowValue
					clearTimeout(timer)
					if(current.value == v){
						timer = setTimeout(()=>{
							tl?.pause();
							tl = null
						}, duration)
					}
				}
			)
		);
	}, { immediate })

	return current
}

// #endif

// #ifdef APP-IOS || APP-ANDROID
type UseTransitionReturnType = Ref<number>
export function useTransition(source : any, options : UseTransitionOptions) : UseTransitionReturnType {
	const outputRef : Ref<number> = ref(0)
	const immediate = options.immediate ?? false
	const duration = options.duration ?? 300
	const context = options.context //as ComponentPublicInstance | null
	let tl:Timeline|null = null;
	let timer = -1
	const watchFunc = (v : number) => {
		if(tl == null){
			tl = new Timeline()
		}
		tl!.start();
		tl!.add(
			new Animation(
				outputRef.value,
				v,
				duration,
				0,
				ease,
				nowValue => {
					outputRef.value = nowValue //nowValue < 0.0001 ? 0 : Math.abs(v - nowValue) < 0.00001 ? v : nowValue;
					clearTimeout(timer)
					if(outputRef.value == v){
						timer = setTimeout(()=>{
							tl?.pause();
							tl = null
						}, duration)
					}
				}
			), null
		);
	}

	if (context != null && typeof source == 'string') {
		context.$watch(source, watchFunc, { immediate } as WatchOptions)
	} else {
		watch(source, watchFunc, { immediate } as WatchOptions)
	}
	
	const stop = ()=>{
		
	}
	return outputRef //as UseTransitionReturnType
}

// #endif