wip

front/components/Play/PartitionMagic.tsx

@@ -10,7 +10,6 @@ import LoadingComponent from '../Loading';
 
 // note we are also using timestamp in a context
 export type ParitionMagicProps = {
-	timestamp: number;
 	songID: number;
 	shouldPlay: boolean;
 	onEndReached: () => void;
@@ -79,6 +78,8 @@ const PartitionMagic = ({
 		if (!melodySound.current) {
 			Audio.Sound.createAsync({
 				uri: API.getPartitionMelodyUrl(songID),
+			}, {
+				progressUpdateIntervalMillis: 200,
 			}).then((track) => {
 				melodySound.current = track.sound;
 			});
@@ -102,16 +103,27 @@ const PartitionMagic = ({
 	}, [onError, isError]);
 
 	React.useEffect(() => {
-		if (onReady && isPartitionSvgLoaded && !isLoading && melodySound.current?._loaded) {
+		if (isPartitionSvgLoaded && !isLoading && melodySound.current?._loaded) {
 			onReady();
 		}
-	}, [onReady, isPartitionSvgLoaded, isLoading, melodySound.current?._loaded]);
+	}, [isPartitionSvgLoaded, isLoading, melodySound.current?._loaded]);
 
 	React.useEffect(() => {
 		if (!melodySound.current || !melodySound.current._loaded) {
 			return;
 		}
 		if (shouldPlay) {
+			melodySound.current.getStatusAsync().then((status) => {
+				const lastCur = data!.cursors[data!.cursors.length - 1]!;
+				const maxTs = lastCur.timestamp + lastCur.timing;
+				const newRate = status.durationMillis! / maxTs;
+				console.log('newRate', newRate);
+				if (newRate < 0 || newRate > 2) {
+					console.error('wrong rate');
+				} else {
+					melodySound.current?.setRateAsync(newRate, false);
+				}
+			});
 			melodySound.current.playAsync().then(onPlay).catch(console.error);
 		} else {
 			melodySound.current.pauseAsync().then(onPause).catch(console.error);
@@ -131,13 +143,14 @@ const PartitionMagic = ({
 		if (data?.cursors.length === 0) return;
 
 		melodySound.current.setOnPlaybackStatusUpdate((status) => {
+			//@ts-expect-error positionMillis is not in the type
 			const timestamp = status?.positionMillis ?? 0;
 			getCursorToPlay(
-				data?.cursors ?? [],
+				data!.cursors,
 				currentCurIdx.current,
-				timestamp - transitionDuration,
+				timestamp + transitionDuration,
 				(cursor, idx) => {
-					console.log('cursor', cursor, idx);
+					console.log('cursor', cursor, status);
 					currentCurIdx.current = idx;
 					partitionOffset.value = withTiming(
 						-(cursor.x - data!.cursors[0]!.x) / partitionDims[0],