Add extra views to the new net internals page. This adds tabs along the top f...

chrome/browser/resources/net_internals/requestsview.js

 // Copyright (c) 2010 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.
 
 /**
- * RequestsView is the class which glues together the different components to
- * form the primary UI:
+ * RequestsView displays a filtered list of all the requests, and a details
+ * pane for the selected requests.
  *
- *   - The search filter
- *   - The requests table
- *   - The details panel
- *   - The action bar
+ *  +----------------------++----------------+
+ *  |      filter box      ||                |
+ *  +----------------------+|                |
+ *  |                      ||                |
+ *  |                      ||                |
+ *  |                      ||                |
+ *  |                      ||                |
+ *  |    requests list     ||    details     |
+ *  |                      ||    view        |
+ *  |                      ||                |
+ *  |                      ||                |
+ *  |                      ||                |
+ *  |                      ||                |
+ *  +----------------------++                |
+ *  |      action bar      ||                |
+ *  +----------------------++----------------+
  *
  * @constructor
  */
 function RequestsView(tableBodyId, filterInputId, filterCountId,
-                      deleteSelectedId, selectAllId, detailsView) {
+                      deleteSelectedId, selectAllId,
+                      tabHandlesContainerId, logTabId, timelineTabId,
+                      detailsLogBoxId, detailsTimelineBoxId,
+                      topbarId, middleboxId, bottombarId, sizerId) {
+  View.call(this);
+
+  // Initialize the sub-views.
+  var leftPane = new TopMidBottomView(new DivView(topbarId),
+                                      new DivView(middleboxId),
+                                      new DivView(bottombarId));
+
+  this.detailsView_ = new DetailsView(tabHandlesContainerId,
+                                      logTabId,
+                                      timelineTabId,
+                                      detailsLogBoxId,
+                                      detailsTimelineBoxId);
+
+  this.splitterView_ = new ResizableVerticalSplitView(
+      leftPane, this.detailsView_, new DivView(sizerId));
+
   this.sourceIdToEntryMap_ = {};
   this.currentSelectedSources_ = [];
 
   LogDataProvider.addObserver(this);
 
   this.tableBody_ = document.getElementById(tableBodyId);
-  this.detailsView_ = detailsView;
 
   this.filterInput_ = document.getElementById(filterInputId);
   this.filterCount_ = document.getElementById(filterCountId);
 
   this.filterInput_.addEventListener("search",
       this.onFilterTextChanged_.bind(this), true);
 
   document.getElementById(deleteSelectedId).onclick =
       this.deleteSelected_.bind(this);
 
   document.getElementById(selectAllId).addEventListener(
       'click', this.selectAll_.bind(this), true);
 
   this.currentFilter_ = '';
   this.numPrefilter_ = 0;
   this.numPostfilter_ = 0;
 
   this.invalidateFilterCounter_();
   this.invalidateDetailsView_();
 }
 
+inherits(RequestsView, View);
+
 // How soon after updating the filter list the counter should be updated.
 RequestsView.REPAINT_FILTER_COUNTER_TIMEOUT_MS = 0;
 
+RequestsView.prototype.setGeometry = function(left, top, width, height) {
+  RequestsView.superClass_.setGeometry.call(this, left, top, width, height);
+  this.splitterView_.setGeometry(left, top, width, height);
+};
+
+RequestsView.prototype.show = function(isVisible) {
+  RequestsView.superClass_.show.call(this, isVisible);
+  this.splitterView_.show(isVisible);
+};
+
 RequestsView.prototype.onFilterTextChanged_ = function() {
   this.setFilter_(this.filterInput_.value);
 };
 
 RequestsView.prototype.setFilter_ = function(filterText) {
   this.currentFilter_ = filterText;
 
   // Iterate through all of the rows and see if they match the filter.
   for (var id in this.sourceIdToEntryMap_) {
     var entry = this.sourceIdToEntryMap_[id];
@@ skipping 97 matching lines @@
                       RequestsView.REPAINT_FILTER_COUNTER_TIMEOUT_MS);
   }
 };
 
 RequestsView.prototype.repaintFilterCounter_ = function() {
   this.outstandingRepaintFilterCounter_ = false;
   this.filterCount_.innerHTML = '';
   addTextNode(this.filterCount_,
               this.numPostfilter_ + " of " + this.numPrefilter_);
 };