Removed double rerender of tooltip

sir-dunxalot · May 15, 2016 · cf3ab3b · cf3ab3b
1 parent ea5762a
commit cf3ab3b
Show file tree

Hide file tree

Showing 2 changed files with 21 additions and 12 deletions.
diff --git a/addon/components/tooltip-on-element.js b/addon/components/tooltip-on-element.js
@@ -173,7 +173,7 @@ export default EmberTetherComponent.extend({
 
   /* Methods */
 
-  close() {
+  hide() {
     this.set('tooltipIsVisible', false);
   },
 
@@ -204,13 +204,13 @@ export default EmberTetherComponent.extend({
 
         if (_showOn !== 'none') {
           $target.on(_showOn, () => {
-            this.open();
+            this.show();
           });
         }
 
         if (_hideOn !== 'none') {
           $target.on(_hideOn, () => {
-            this.close();
+            this.hide();
           });
         }
       }
@@ -220,24 +220,28 @@ export default EmberTetherComponent.extend({
 
       if (event !== 'focus') {
         $target.focusin(() => {
-          this.open();
+          this.show();
         });
 
         $target.focusout(() => {
-          this.close();
+          this.hide();
         });
       }
 
       $target.keydown((keyEvent) => {
         if (keyEvent.which === 27) {
-          this.close();
+          this.hide();
           keyEvent.preventDefault();
 
           return false;
         }
       });
     }
 
+    /* When this component has rendered we need
+    to check if Tether moved its position to keep the
+    element in bounds */
+
     let renderedSide;
 
     ['top', 'right', 'bottom', 'left'].forEach(function(side) {
@@ -246,6 +250,10 @@ export default EmberTetherComponent.extend({
       }
     });
 
+    /* We then use the side the tooltip was *actually*
+    rendered on to set the correct offset from
+    the target element */
+
     const spacing = this.get('spacing');
 
     let offset;
@@ -265,10 +273,7 @@ export default EmberTetherComponent.extend({
         break;
     }
 
-    console.log(offset);
-
     this.set('offset', offset);
-    this.tetherDidChange();
   },
 
   setTimer: Ember.observer('tooltipIsVisible', function() {
@@ -290,7 +295,7 @@ export default EmberTetherComponent.extend({
         /* Hide tooltip after specified duration */
 
         const hideTimer = run.later(() => {
-          this.close();
+          this.hide();
         }, _duration);
 
         /* Save timer ID for cancelling should an event
@@ -301,7 +306,7 @@ export default EmberTetherComponent.extend({
     }
   }),
 
-  open() {
+  show() {
     this.set('tooltipIsVisible', true);
   },
 
@@ -313,7 +318,7 @@ export default EmberTetherComponent.extend({
     const $target = $(this.get('target'));
 
     this.set('effect', null);
-    this.close();
+    this.hide();
 
     $target.removeAttr('aria-describedby');
     $target.off();

diff --git a/tests/dummy/app/styles/app.scss b/tests/dummy/app/styles/app.scss
@@ -75,3 +75,7 @@ a {
 md-toolbar.md-default-theme {
   background-color: #D39120;
 }
+
+.tooltip {
+  z-index: 61; // Over md-sidenav
+}