Move check for cachedSize into calcBoxSize

apps/boxclk/app.js

@@ -85,9 +85,7 @@
       boxKeys.forEach(key => {
           if (boxes[key].selected) {
               let boxItem = boxes[key];
-              if (!boxItem.cachedSize) {
               calcBoxSize(boxItem);
-              }
               let newX = boxItem.pos.x + e.dx;
               let newY = boxItem.pos.y + e.dy;
   
@@ -320,17 +318,9 @@
       g.setFont(boxItem.font, boxItem.fontSize);
       g.setFontAlign(0, 0);
 
-      // Use cached size if available, otherwise calculate and cache
-      if (!boxItem.cachedSize) {
       calcBoxSize(boxItem);
-      }
 
-      const pos = {
+      const pos = calcBoxPos(boxItem);
-        x1: boxItem.pos.x - boxItem.cachedSize.width / 2,
-        y1: boxItem.pos.y - boxItem.cachedSize.height / 2,
-        x2: boxItem.pos.x + boxItem.cachedSize.width / 2,
-        y2: boxItem.pos.y + boxItem.cachedSize.height / 2
-      };
 
       if (boxItem.selected) {
         g.setColor(boxItem.border);
@@ -353,7 +343,22 @@
   };
 
   // 9. Helper function for touch event
+  let calcBoxPos = function(boxItem) {
+    calcBoxSize(boxItem);
+    return {
+      x1: boxItem.pos.x - boxItem.cachedSize.width / 2,
+      y1: boxItem.pos.y - boxItem.cachedSize.height / 2,
+      x2: boxItem.pos.x + boxItem.cachedSize.width / 2,
+      y2: boxItem.pos.y + boxItem.cachedSize.height / 2
+    };
+  };
+
+  // Use cached size if available, otherwise calculate and cache
   let calcBoxSize = function(boxItem) {
+    if (boxItem.cachedSize) {
+      return boxItem.cachedSize;
+    }
+  
     g.setFont(boxItem.font, boxItem.fontSize);
     g.setFontAlign(0, 0);
   
@@ -366,18 +371,13 @@
       width: totalWidth,
       height: totalHeight
     };
+  
+    return boxItem.cachedSize;
   };
 
   let touchInText = function(e, boxItem, boxKey) {
-    if (!boxItem.cachedSize) {
     calcBoxSize(boxItem);
-    }
+    const pos = calcBoxPos(boxItem);
-    const pos = {
-      x1: boxItem.pos.x - boxItem.cachedSize.width / 2,
-      y1: boxItem.pos.y - boxItem.cachedSize.height / 2,
-      x2: boxItem.pos.x + boxItem.cachedSize.width / 2,
-      y2: boxItem.pos.y + boxItem.cachedSize.height / 2
-    };
     return e.x >= pos.x1 &&
       e.x <= pos.x2 &&
       e.y >= pos.y1 &&