Chart: Possible fix for stuck tooltip (annotation or time series point hover tooltip would not disappear), Fixes #450

CHANGELOG.md

@@ -3,6 +3,7 @@
 **Fixes**
 - [Issue #655](https://github.com/grafana/grafana/issues/655). General: Auto refresh not initiated / started after dashboard loading
 - [Issue #652](https://github.com/grafana/grafana/issues/652). Timepicker: Entering custom date range impossible when refresh is low (now is constantly reset)
+- [Issue #450](https://github.com/grafana/grafana/issues/450). Graph: Tooltip does not disappear sometimes and would get stuck
 
 # 1.7.0-rc1 (2014-08-05)
 

src/app/components/extend-jquery.js

@@ -19,9 +19,8 @@ function ($) {
 
         $tooltip.addClass('grafana-tooltip');
 
-        if (!$.contains(document.body, $tooltip[0])) {
-          $tooltip.appendTo(document.body);
-        }
+        $("#tooltip").remove();
+        $tooltip.appendTo(document.body);
 
         width = $tooltip.outerWidth(true);
         height = $tooltip.outerHeight(true);

src/app/directives/grafanaGraph.js

@@ -327,7 +327,7 @@ function (angular, $, kbn, moment, _) {
           return "%H:%M";
         }
 
-        var $tooltip = $('<div>');
+        var $tooltip = $('<div id="tooltip">');
 
         elem.bind("plothover", function (event, pos, item) {
           var group, value, timestamp, seriesInfo, format;
@@ -357,11 +357,8 @@ function (angular, $, kbn, moment, _) {
             timestamp = dashboard.timezone === 'browser' ?
               moment(item.datapoint[0]).format('YYYY-MM-DD HH:mm:ss') :
               moment.utc(item.datapoint[0]).format('YYYY-MM-DD HH:mm:ss');
-            $tooltip
-              .html(
-                group + value + " @ " + timestamp
-              )
-              .place_tt(pos.pageX, pos.pageY);
+
+            $tooltip.html(group + value + " @ " + timestamp).place_tt(pos.pageX, pos.pageY);
           } else {
             $tooltip.detach();
           }

src/app/services/dashboard/dashboardKeyBindings.js

@@ -61,6 +61,12 @@ function(angular, $) {
         if (popups.length > 0) {
           return;
         }
+        // close modals
+        var modalData = $(".modal").data();
+        if (modalData && modalData.$scope && modalData.$scope.dismiss) {
+          modalData.$scope.dismiss();
+        }
+
         scope.emitAppEvent('panel-fullscreen-exit');
       }, { inputDisabled: true });
     };

src/vendor/jquery/jquery.flot.events.js

@@ -611,4 +611,4 @@
         if (ao.min < bo.min) return -1;
         return 0;
     };
-})(jQuery);
+})(jQuery);