Merge pull request #41 from shefing/JumpLocation

after Sari review
shefing · Feb 15, 2024 · da26c6c · da26c6c
2 parents c0cd690 + 67b5cfc
commit da26c6c
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 6 deletions.
diff --git a/library/math/numbersLine/src/components/Jump.tsx b/library/math/numbersLine/src/components/Jump.tsx
@@ -6,7 +6,7 @@ import MoveableElement from "./MoveableElement";
 import { useNumbersLineContext } from "@/context/numbersLineContext";
 import { calculatRulerWidth, calculatUnitsAmount } from "../lib/utils";
 import { RulerPadding, jumpArrowHeight } from "../consts/elementConsts";
-import { MatchBaseJumpClassName, clacHeightStartPosition, clacWidthStartPosition } from "../lib/stylesUtils";
+import { MatchBaseJumpClassName, calcHeightStartPosition, calcWidthStartPosition } from "../lib/stylesUtils";
 
 interface IProps {
   element: IElement;
@@ -43,8 +43,8 @@ const Jump = ({ element }: IProps) => {
           width: unit * element.value,
           display: "flex",
           flexDirection: isJumpUnderRuler ? "column-reverse" : "column",
-          left: clacWidthStartPosition(2, windowSize.width, type) + "px",
-          top: clacHeightStartPosition(4, windowSize.height) + "px",
+          left: calcWidthStartPosition(2, windowSize.width, type) + "px",
+          top: calcHeightStartPosition(4, windowSize.height) + "px",
         }}
       >
         <img

diff --git a/library/math/numbersLine/src/lib/stylesUtils.ts b/library/math/numbersLine/src/lib/stylesUtils.ts
@@ -20,14 +20,15 @@ export const MatchDisplayButtonClassName = ( isVisitAble: TypeCover, isChoice: T
   export const MatchBaseJumpClassName = (underRuler: boolean) => {
     return underRuler ? baseJumpClassName + " bg-[#F48460] mb-[1rem]" : baseJumpClassName + " bg-[#009FDE] mt-[1rem]";
   };
-  export const clacWidthStartPosition = (value: number,windowWidth: number, type: LineRange) => {
+  export const calcWidthStartPosition = (value: number,windowWidth: number, type: LineRange) => {
     return (windowWidth - (windowWidth / calculatUnitsAmount(type)))/value;
   }
-  export const clacHeightStartPosition = (value: number, windowHeight: number): number => {
+  export const calcHeightStartPosition = (value: number, windowHeight: number): number => {
     return windowHeight / value;
   }
   export const calcJumpPosition = (transfomPosition: number, windowHeight: number, isJumpUnderRuler: boolean): number => {
-    const base = transfomPosition + clacHeightStartPosition(4, windowHeight);    
+    const startPosition = calcHeightStartPosition(4, windowHeight);    
+    const base = transfomPosition + startPosition;
     return isJumpUnderRuler ? base + jumpBaseHeight/3 : base + jumpArrowHeight + jumpBaseHeight/(3/2)
   };