Show tooltip with local variable value in Observatory debugger

runtime/observatory/lib/src/elements/script_inset.dart

 // Copyright (c) 2013, the Dart project authors.  Please see the AUTHORS file
 // for details. All rights reserved. Use of this source code is governed by a
 // BSD-style license that can be found in the LICENSE file.
 
 library script_inset_element;
 
 import 'dart:async';
 import 'dart:html';
 import 'observatory_element.dart';
 import 'service_ref.dart';
 import 'package:observatory/service.dart';
+import 'package:observatory/utils.dart';
 import 'package:polymer/polymer.dart';
 
 const nbsp = "\u00A0";
 
 void addInfoBox(Element content, Function infoBoxGenerator) {
   var infoBox;
   var show = false;
   var originalBackground = content.style.backgroundColor;
   buildInfoBox() {
     infoBox = infoBoxGenerator();
@@ skipping 66 matching lines @@
 class CurrentExecutionAnnotation extends Annotation {
   void applyStyleTo(element) {
     if (element == null) {
       return;  // TODO(rmacnak): Handling overlapping annotations.
     }
     element.classes.add("currentCol");
     element.title = "Current execution";
   }
 }
 
+class LocalVariableAnnotation extends Annotation {
+  final value;
+
+  LocalVariableAnnotation(LocalVarLocation location, this.value) {
+    line = location.line;
+    columnStart = location.column;
+    columnStop = location.endColumn;
+  }
+
+  void applyStyleTo(element) {
+    if (element == null) {
+      return;  // TODO(rmacnak): Handling overlapping annotations.
+    }
+    element.style.fontWeight = "bold";
+    element.title = "${value.shortName}";
+  }
+}
+
 class CallSiteAnnotation extends Annotation {
   CallSite callSite;
 
   CallSiteAnnotation(this.callSite) {
     line = callSite.line;
     columnStart = callSite.column - 1;  // Call site is 1-origin.
     var tokenLength = callSite.name.length;  // Approximate.
     if (callSite.name.startsWith("get:") ||
         callSite.name.startsWith("set:")) tokenLength -= 4;
     columnStop = columnStart + tokenLength;
@@ skipping 104 matching lines @@
   @published Script script;
 
   /// Set the height to make the script inset scroll.  Otherwise it
   /// will show from startPos to endPos.
   @published String height = null;
 
   @published int currentPos;
   @published int startPos;
   @published int endPos;
   @published bool inDebuggerContext = false;
+  @published ObservableList variables;
 
   int _currentLine;
   int _currentCol;
   int _startLine;
   int _endLine;
 
   var annotations = [];
   var annotationsCursor;
 
   StreamSubscription scriptChangeSubscription;
@@ skipping 12 matching lines @@
   void detached() {
     if (scriptChangeSubscription != null) {
       // Don't leak. If only Dart and Javascript exposed weak references...
       scriptChangeSubscription.cancel();
       scriptChangeSubscription = null;
     }
     super.detached();
   }
 
   void currentPosChanged(oldValue) {
-    update();
+    _updateTask.queue();
     _scrollToCurrentPos();
   }
 
   void startPosChanged(oldValue) {
-    update();
+    _updateTask.queue();
   }
 
   void endPosChanged(oldValue) {
-    update();
+    _updateTask.queue();
   }
 
   void scriptChanged(oldValue) {
-    update();
+    _updateTask.queue();
+  }
+
+  void variablesChanged(oldValue) {
+    _updateTask.queue();
   }
 
   Element a(String text) => new AnchorElement()..text = text;
   Element span(String text) => new SpanElement()..text = text;
 
   Element hitsUnknown(Element element) {
     element.classes.add('hitsNone');
     element.title = "";
     return element;
   }
   Element hitsNotExecuted(Element element) {
     element.classes.add('hitsNotExecuted');
     element.title = "Line did not execute";
     return element;
   }
   Element hitsExecuted(Element element) {
     element.classes.add('hitsExecuted');
     element.title = "Line did execute";
     return element;
   }
 
   Element container;
 
+  Task _updateTask;
   void update() {
+    assert(_updateTask != null);
     if (script == null) {
       // We may have previously had a script.
       if (container != null) {
         container.children.clear();
       }
       return;
     }
     if (!script.loaded) {
       script.load().then((_) => update());
       return;
@@ skipping 68 matching lines @@
             annotations.add(new FunctionDeclarationAnnotation(func));
           }
         }
       }
 
       for (var callSite in script.callSites) {
         annotations.add(new CallSiteAnnotation(callSite));
       }
     }
 
+    // We have local variable information.
+    if (variables != null) {
+      // For each variable.
+      for (var variable in variables) {
+        // Find variable usage locations.
+        var locations = script.scanForLocalVariableLocations(
+              variable['name'], variable['tokenPos'], variable['endTokenPos']);
+
+        // Annotate locations.
+        for (var location in locations) {
+          annotations.add(new LocalVariableAnnotation(location,
+                                                      variable['value']));
+        }
+      }
+    }
+
     annotations.sort();
   }
 
   Element linesTable() {
     var table = new DivElement();
     table.classes.add("sourceTable");
 
     annotationsCursor = 0;
 
     int blankLineCount = 0;
@@ skipping 164 matching lines @@
       }
       consumeUntil(line.text.length);
     }
 
     // So blank lines are included when copying script to the clipboard.
     e.append(span('\n'));
 
     return e;
   }
 
-  ScriptInsetElement.created() : super.created();
+  ScriptInsetElement.created()
+      : super.created() {
+    _updateTask = new Task(update);
+  }
 }