simplify _placeTooltip by calling _getOffset less

Author: jayenashar

intro.js

@@ -419,7 +419,8 @@
     var tooltipCssClass = '',
         currentStepObj,
         tooltipOffset,
-        targetElementOffset,
+        targetOffset,
+        windowSize,
         currentTooltipPosition;
 
     //reset the old style
@@ -456,22 +457,22 @@
         currentTooltipPosition = _determineAutoPosition.call(this, targetElement, tooltipLayer, currentTooltipPosition)
       }
     }
-    var targetOffset = _getOffset(targetElement);
-    var tooltipHeight = _getOffset(tooltipLayer).height;
-    var windowSize = _getWinSize();
+    targetOffset  = _getOffset(targetElement);
+    tooltipOffset = _getOffset(tooltipLayer);
+    windowSize    = _getWinSize();
     switch (currentTooltipPosition) {
       case 'top':
         tooltipLayer.style.left = '15px';
-        tooltipLayer.style.top = '-' + (tooltipHeight + 10) + 'px';
+        tooltipLayer.style.top = '-' + (tooltipOffset.height + 10) + 'px';
         arrowLayer.className = 'introjs-arrow bottom';
         break;
       case 'right':
-        tooltipLayer.style.left = (_getOffset(targetElement).width + 20) + 'px';
-        if (targetOffset.top + tooltipHeight > windowSize.height) {
+        tooltipLayer.style.left = (targetOffset.width + 20) + 'px';
+        if (targetOffset.top + tooltipOffset.height > windowSize.height) {
           // In this case, right would have fallen below the bottom of the screen.
           // Modify so that the bottom of the tooltip connects with the target
           arrowLayer.className = "introjs-arrow left-bottom";
-          tooltipLayer.style.top = "-" + (tooltipHeight - targetOffset.height - 20) + "px"
+          tooltipLayer.style.top = "-" + (tooltipOffset.height - targetOffset.height - 20) + "px"
         }
         arrowLayer.className = 'introjs-arrow left';
         break;
@@ -480,10 +481,10 @@
           tooltipLayer.style.top = '15px';
         }
 
-        if (targetOffset.top + tooltipHeight > windowSize.height) {
+        if (targetOffset.top + tooltipOffset.height > windowSize.height) {
           // In this case, left would have fallen below the bottom of the screen.
           // Modify so that the bottom of the tooltip connects with the target
-          tooltipLayer.style.top = "-" + (tooltipHeight - targetOffset.height - 20) + "px";
+          tooltipLayer.style.top = "-" + (tooltipOffset.height - targetOffset.height - 20) + "px";
           arrowLayer.className = 'introjs-arrow right-bottom';
         } else {
           arrowLayer.className = 'introjs-arrow right';
@@ -496,8 +497,6 @@
         arrowLayer.style.display = 'none';
 
         //we have to adjust the top and left of layer manually for intro items without element
-        tooltipOffset = _getOffset(tooltipLayer);
-
         tooltipLayer.style.left   = '50%';
         tooltipLayer.style.top    = '50%';
         tooltipLayer.style.marginLeft = '-' + (tooltipOffset.width / 2)  + 'px';
@@ -512,28 +511,25 @@
       case 'bottom-right-aligned':
         arrowLayer.className      = 'introjs-arrow top-right';
         tooltipLayer.style.right  = '0px';
-        tooltipLayer.style.bottom = '-' + (_getOffset(tooltipLayer).height + 10) + 'px';
+        tooltipLayer.style.bottom = '-' + (tooltipOffset.height + 10) + 'px';
         break;
       case 'bottom-middle-aligned':
-        targetElementOffset = _getOffset(targetElement);
-        tooltipOffset       = _getOffset(tooltipLayer);
-
         arrowLayer.className      = 'introjs-arrow top-middle';
-        var tooltipLayerStyleLeft = targetElementOffset.width / 2 - tooltipOffset.width / 2;
+        var tooltipLayerStyleLeft = targetOffset.width / 2 - tooltipOffset.width / 2;
         // off the right side of the window
-        if (targetElementOffset.left + tooltipLayerStyleLeft + tooltipOffset.width > windowSize.width)
-          tooltipLayer.style.left = (windowSize.width - tooltipOffset.width - targetElementOffset.left) + 'px';
+        if (targetOffset.left + tooltipLayerStyleLeft + tooltipOffset.width > windowSize.width)
+          tooltipLayer.style.left = (windowSize.width - tooltipOffset.width - targetOffset.left) + 'px';
         else
           tooltipLayer.style.left = tooltipLayerStyleLeft + 'px';
-        tooltipLayer.style.top    = (targetElementOffset.height +  20) + 'px';
+        tooltipLayer.style.top    = (targetOffset.height +  20) + 'px';
         break;
       case 'bottom-left-aligned':
       // Bottom-left-aligned is the same as the default bottom
       case 'bottom':
       // Bottom going to follow the default behavior
       default:
-        tooltipLayer.style.bottom = '-' + (_getOffset(tooltipLayer).height + 10) + 'px';
-        tooltipLayer.style.left = (_getOffset(targetElement).width / 2 - _getOffset(tooltipLayer).width / 2) + 'px';
+        tooltipLayer.style.bottom = '-' + (tooltipOffset.height + 10) + 'px';
+        tooltipLayer.style.left = (targetOffset.width / 2 - tooltipOffset.width / 2) + 'px';
 
         arrowLayer.className = 'introjs-arrow top';
         break;