updated sequence

src/components/complexPage/SequenceSlider.tsx

@@ -12,7 +12,7 @@ import useSequence from "../../store/useSequence";
 import SequenceHighlighting from "./SequenceHighlighting";
 
 const arrayLength = 360;
-const keyframes: number[] = [50, 177, 247, 338];
+const keyframes: number[] = [51, 178, 249, 339];
 // const keyframes: number[] = [50, 177, 248, 338];
 
 interface SequenceSliderProps {
@@ -55,7 +55,7 @@ function SequenceSlider({ path }: SequenceSliderProps) {
       duration: 0.75,
       ease: "power1.inOut",
       onUpdate: () => {
-        const roundedIndex = Math.round(obj.selectedImageIndex);
+        const roundedIndex = Math.floor(obj.selectedImageIndex);
 
         if (roundedIndex >= arrayLength) {
           setSelectedRightImageIndex(roundedIndex - arrayLength);
@@ -82,7 +82,7 @@ function SequenceSlider({ path }: SequenceSliderProps) {
       duration: 0.75,
       ease: "power1.inOut",
       onUpdate: () => {
-        const roundedIndex = Math.round(obj.selectedImageIndex);
+        const roundedIndex = Math.floor(obj.selectedImageIndex);
 
         if (roundedIndex > arrayLength) {
           setSelectedRightImageIndex(
@@ -174,7 +174,7 @@ function SequenceSlider({ path }: SequenceSliderProps) {
           ))}
         </div>
         <SequenceHighlighting
-          keyframe={selectedImageRightIndex + 2}
+          keyframe={selectedImageRightIndex + 1}
           onClick={handleOnSequenceClick}
         />
       </div>