clamp tooltip position to the visible area of the viewport. closes #1041

miguelcobain · Jun 14, 2019 · c9022e9 · c9022e9
1 parent f03272b
commit c9022e9
Showing 1 changed file with 15 additions and 1 deletion.
diff --git a/addon/utils/calculate-tooltip-position.js b/addon/utils/calculate-tooltip-position.js
@@ -1,3 +1,5 @@
+import clamp from './clamp';
+
 export default function calculateTooltipPosition(tooltip, target, position) {
   let panelBounds = tooltip.getBoundingClientRect();
   let panelWidth = panelBounds.width;
@@ -41,5 +43,17 @@ export default function calculateTooltipPosition(tooltip, target, position) {
       break;
   }
 
+  // clamp position to the visible area of the viewport
+
+  let tooltipBounds = tooltip.getBoundingClientRect();
+
+  // account for negative margins
+  let { marginTop: tooltipMarginTop, marginLeft: tooltipMarginLeft } = window.getComputedStyle(tooltip);
+  tooltipMarginTop = parseInt(tooltipMarginTop);
+  tooltipMarginLeft = parseInt(tooltipMarginLeft);
+
+  positionStyle.top = clamp(positionStyle.top, 0 - tooltipMarginTop, window.innerHeight - tooltipBounds.height - tooltipMarginTop);
+  positionStyle.left = clamp(positionStyle.left, 0 - tooltipMarginLeft, window.innerWidth - tooltipBounds.width - tooltipMarginLeft);
+
   return positionStyle;
-}
+}