Two minor net-internals EventsView improvements:

Selecting a source now jumps to it on the DetailsView.
source_dependencies now display source type as a string.

R=eroman@chromium.org
BUG=none

Review URL: http://codereview.chromium.org/9200019

git-svn-id: svn://svn.chromium.org/chrome/trunk/src@118777 0039d316-1c4b-4281-b951-d872f2087c98

4 files changed, 88 insertions, 46 deletions

diff --git a/chrome/browser/resources/net_internals/details_view.js b/chrome/browser/resources/net_internals/details_view.js
index a886551..d5d35a4e 100644
--- a/chrome/browser/resources/net_internals/details_view.js
+++ b/chrome/browser/resources/net_internals/details_view.js
@@ -1,4 +1,4 @@
-// Copyright (c) 2011 The Chromium Authors. All rights reserved.
+// Copyright (c) 2012 The Chromium Authors. All rights reserved.
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
@@ -17,6 +17,13 @@ var DetailsView = (function() {
   function DetailsView(boxId) {
     superClass.call(this, boxId);
     this.sourceEntries_ = [];
+    // Map of source IDs to their corresponding DIVs.
+    this.sourceIdToDivMap_ = {};
+    // True when there's an asychronous repaint outstanding.
+    this.outstandingRepaint_ = false;
+    // ID of source entry we should jump to after the oustanding repaint.
+    // 0 if none, or there's no such repaint.
+    this.outstandingScrollToId_ = 0;
   }
 
   // The delay between updates to repaint.
@@ -29,7 +36,7 @@ var DetailsView = (function() {
     setData: function(sourceEntries) {
       // Make a copy of the array (in case the caller mutates it), and sort it
       // by the source ID.
-      this.sourceEntries_ = createSortedCopy(sourceEntries);
+      this.sourceEntries_ = createSortedCopy_(sourceEntries);
 
       // Repaint the view.
       if (this.isVisible() && !this.outstandingRepaint_) {
@@ -41,8 +48,40 @@ var DetailsView = (function() {
 
     repaint: function() {
       this.outstandingRepaint_ = false;
+      this.sourceIdToDivMap_ = {};
       this.getNode().innerHTML = '';
-      paintLogView(this.sourceEntries_, this.getNode());
+
+      var node = this.getNode();
+
+      for (var i = 0; i < this.sourceEntries_.length; ++i) {
+        if (i != 0)
+          addNode(node, 'hr');
+
+        var sourceEntry = this.sourceEntries_[i];
+        var div = addNode(node, 'div');
+        div.className = 'logSourceEntry';
+
+        var p = addNode(div, 'p');
+        addNodeWithText(p, 'h4',
+                        sourceEntry.getSourceId() + ': ' +
+                            sourceEntry.getSourceTypeString());
+
+        if (sourceEntry.getDescription())
+          addNodeWithText(p, 'h4', sourceEntry.getDescription());
+
+        var logEntries = sourceEntry.getLogEntries();
+        var startDate = timeutil.convertTimeTicksToDate(logEntries[0].time);
+        addNodeWithText(p, 'div', 'Start Time: ' + startDate.toLocaleString());
+
+        sourceEntry.printAsText(div);
+
+        this.sourceIdToDivMap_[sourceEntry.getSourceId()] = div;
+      }
+
+      if (this.outstandingScrollToId_) {
+        this.scrollToSourceId(this.outstandingScrollToId_);
+        this.outstandingScrollToId_ = 0;
+      }
     },
 
     show: function(isVisible) {
@@ -52,10 +91,24 @@ var DetailsView = (function() {
       } else {
         this.getNode().innerHTML = '';
       }
+    },
+
+    /**
+     * Scrolls to the source indicated by |sourceId|, if displayed.  If a
+     * repaint is outstanding, waits for it to complete before scrolling.
+     */
+    scrollToSourceId: function(sourceId) {
+      if (this.outstandingRepaint_) {
+        this.outstandingScrollToId_ = sourceId;
+        return;
+      }
+      var div = this.sourceIdToDivMap_[sourceId];
+      if (div)
+        div.scrollIntoView();
     }
   };
 
-  function createSortedCopy(origArray) {
+  function createSortedCopy_(origArray) {
     var sortedArray = origArray.slice(0);
     sortedArray.sort(function(a, b) {
       return a.getSourceId() - b.getSourceId();
diff --git a/chrome/browser/resources/net_internals/events_view.js b/chrome/browser/resources/net_internals/events_view.js
index 6c850c5..df062f7 100644
--- a/chrome/browser/resources/net_internals/events_view.js
+++ b/chrome/browser/resources/net_internals/events_view.js
@@ -1,4 +1,4 @@
-// Copyright (c) 2011 The Chromium Authors. All rights reserved.
+// Copyright (c) 2012 The Chromium Authors. All rights reserved.
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
@@ -526,12 +526,21 @@ var EventsView = (function() {
 
       if (params.s) {
         var sourceRow = this.sourceIdToRowMap_[params.s];
-        if (sourceRow)
+        if (sourceRow) {
           sourceRow.setSelected(true);
+          this.scrollToSourceId(params.s);
+        }
       }
     },
 
     /**
+     * Scrolls to the source indicated by |sourceId|, if displayed.
+     */
+    scrollToSourceId: function(sourceId) {
+      this.detailsView_.scrollToSourceId(sourceId);
+    },
+
+    /**
      * If already using the specified sort method, flips direction.  Otherwise,
      * removes pre-existing sort parameter before adding the new one.
      */
diff --git a/chrome/browser/resources/net_internals/log_view_painter.js b/chrome/browser/resources/net_internals/log_view_painter.js
index 16ba434..f380dce 100644
--- a/chrome/browser/resources/net_internals/log_view_painter.js
+++ b/chrome/browser/resources/net_internals/log_view_painter.js
@@ -1,4 +1,4 @@
-// Copyright (c) 2011 The Chromium Authors. All rights reserved.
+// Copyright (c) 2012 The Chromium Authors. All rights reserved.
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
@@ -8,7 +8,6 @@
  *               the old net-internals is replaced.
  */
 
-var paintLogView;
 var printLogEntriesAsText;
 var proxySettingsToString;
 var stripCookiesAndLoginInfo;
@@ -17,36 +16,6 @@ var stripCookiesAndLoginInfo;
 (function() {
 'use strict';
 
-paintLogView = function(sourceEntries, node) {
-  for (var i = 0; i < sourceEntries.length; ++i) {
-    if (i != 0)
-      addNode(node, 'hr');
-    addSourceEntry_(node, sourceEntries[i]);
-  }
-}
-
-/**
- * Outputs descriptive text for |sourceEntry| and its events to |node|.
- */
-function addSourceEntry_(node, sourceEntry) {
-  var div = addNode(node, 'div');
-  div.className = 'logSourceEntry';
-
-  var p = addNode(div, 'p');
-  addNodeWithText(p, 'h4',
-                  sourceEntry.getSourceId() + ': ' +
-                      sourceEntry.getSourceTypeString());
-
-  if (sourceEntry.getDescription())
-    addNodeWithText(p, 'h4', sourceEntry.getDescription());
-
-  var logEntries = sourceEntry.getLogEntries();
-  var startDate = timeutil.convertTimeTicksToDate(logEntries[0].time);
-  addNodeWithText(p, 'div', 'Start Time: ' + startDate.toLocaleString());
-
-  sourceEntry.printAsText(div);
-}
-
 function canCollapseBeginWithEnd(beginEntry) {
   return beginEntry &&
          beginEntry.isBegin() &&
@@ -230,7 +199,19 @@ function addRowsForExtraParams(tablePrinter, entry, enableSecurityStripping) {
           continue;
         }
 
-        var paramStr = ' --> ' + k + ' = ' + JSON.stringify(value);
+        var paramStr = ' --> ' + k + ' = ';
+
+        // Handle source_dependency entries - add link and map source type to
+        // string.
+        if (k == 'source_dependency' && typeof value == 'object') {
+          var link = '#events&s=' + value.id;
+          var sourceType = getKeyWithValue(LogSourceType, value.type);
+          paramStr += value.id + ' (' + sourceType + ')';
+          addTextRows(tablePrinter, paramStr, link);
+          continue;
+        }
+
+        paramStr += JSON.stringify(value);
 
         // Append the symbolic name for certain constants. (This relies
         // on particular naming of event parameters to infer the type).
@@ -242,12 +223,7 @@ function addRowsForExtraParams(tablePrinter, entry, enableSecurityStripping) {
           }
         }
 
-        var link = null;
-        // Add link to source_dependency entries.
-        if (k == 'source_dependency' && typeof value == 'object')
-          link = '#events&s=' + value.id;
-
-        addTextRows(tablePrinter, paramStr, link);
+        addTextRows(tablePrinter, paramStr, null);
       }
   }
 }
diff --git a/chrome/browser/resources/net_internals/source_row.js b/chrome/browser/resources/net_internals/source_row.js
index 3a63d69..c08b716 100644
--- a/chrome/browser/resources/net_internals/source_row.js
+++ b/chrome/browser/resources/net_internals/source_row.js
@@ -1,4 +1,4 @@
-// Copyright (c) 2011 The Chromium Authors. All rights reserved.
+// Copyright (c) 2012 The Chromium Authors. All rights reserved.
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
@@ -228,6 +228,8 @@ var SourceRow = (function() {
     onClicked_: function() {
       this.parentView_.clearSelection();
       this.setSelected(true);
+      if (this.isSelected())
+        this.parentView_.scrollToSourceId(this.getSourceId());
     },
 
     onMouseover_: function() {
@@ -246,6 +248,8 @@ var SourceRow = (function() {
 
     onCheckboxToggled_: function() {
       this.setSelected(this.getSelectionCheckbox().checked);
+      if (this.isSelected())
+        this.parentView_.scrollToSourceId(this.getSourceId());
     },
 
     getSelectionCheckbox: function() {