DevTools: extract modules (with extensions)

third_party/WebKit/Source/devtools/front_end/timeline/TimelineTreeView.js

 // Copyright 2015 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.
 /**
  * @unrestricted
  */
 Timeline.TimelineTreeView = class extends UI.VBox {
   constructor() {
     super();
     this.element.classList.add('timeline-tree-view');
@@ skipping 14 matching lines @@
   /**
    * @param {!TimelineModel.TimelineModel} model
    * @param {!Array<!TimelineModel.TimelineModel.Filter>} filters
    */
   _init(model, filters) {
     this._model = model;
     this._linkifier = new Components.Linkifier();
 
     this._filters = filters.slice();
 
-    var columns = /** @type {!Array<!UI.DataGrid.ColumnDescriptor>} */ ([]);
+    var columns = /** @type {!Array<!DataGrid.DataGrid.ColumnDescriptor>} */ ([]);
     this._populateColumns(columns);
 
     var mainView = new UI.VBox();
     this._populateToolbar(mainView.element);
-    this._dataGrid = new UI.SortableDataGrid(columns);
-    this._dataGrid.addEventListener(UI.DataGrid.Events.SortingChanged, this._sortingChanged, this);
+    this._dataGrid = new DataGrid.SortableDataGrid(columns);
+    this._dataGrid.addEventListener(DataGrid.DataGrid.Events.SortingChanged, this._sortingChanged, this);
     this._dataGrid.element.addEventListener('mousemove', this._onMouseMove.bind(this), true);
-    this._dataGrid.setResizeMethod(UI.DataGrid.ResizeMethod.Last);
+    this._dataGrid.setResizeMethod(DataGrid.DataGrid.ResizeMethod.Last);
     this._dataGrid.setRowContextMenuCallback(this._onContextMenu.bind(this));
     this._dataGrid.asWidget().show(mainView.element);
 
     this._splitWidget = new UI.SplitWidget(true, true, 'timelineTreeViewDetailsSplitWidget');
     this._splitWidget.show(this.element);
     this._splitWidget.setMainWidget(mainView);
 
     this._detailsView = new UI.VBox();
     this._detailsView.element.classList.add('timeline-details-view', 'timeline-details-view-body');
     this._splitWidget.setSidebarWidget(this._detailsView);
-    this._dataGrid.addEventListener(UI.DataGrid.Events.SelectedNode, this._updateDetailsForSelection, this);
+    this._dataGrid.addEventListener(DataGrid.DataGrid.Events.SelectedNode, this._updateDetailsForSelection, this);
 
     /** @type {?TimelineModel.TimelineProfileTree.Node|undefined} */
     this._lastSelectedNode;
   }
 
   /**
    * @param {!Timeline.TimelineSelection} selection
    */
   updateContents(selection) {
     this.setRange(selection.startTime(), selection.endTime());
@@ skipping 100 matching lines @@
   /**
    * @param {function(!SDK.TracingModel.Event):(string|symbol)=} eventIdCallback
    * @return {!TimelineModel.TimelineProfileTree.Node}
    */
   _buildTopDownTree(eventIdCallback) {
     return TimelineModel.TimelineProfileTree.buildTopDown(
         this._model.mainThreadEvents(), this._filters, this._startTime, this._endTime, eventIdCallback);
   }
 
   /**
-   * @param {!Array<!UI.DataGrid.ColumnDescriptor>} columns
+   * @param {!Array<!DataGrid.DataGrid.ColumnDescriptor>} columns
    */
   _populateColumns(columns) {
     columns.push({id: 'self', title: Common.UIString('Self Time'), width: '110px', fixedWidth: true, sortable: true});
     columns.push({id: 'total', title: Common.UIString('Total Time'), width: '110px', fixedWidth: true, sortable: true});
     columns.push({id: 'activity', title: Common.UIString('Activity'), disclosure: true, sortable: true});
   }
 
   _sortingChanged() {
     var columnId = this._dataGrid.sortColumnId();
     if (!columnId)
@@ skipping 13 matching lines @@
         sortFunction = compareName;
         break;
       default:
         console.assert(false, 'Unknown sort field: ' + columnId);
         return;
     }
     this._dataGrid.sortNodes(sortFunction, !this._dataGrid.isSortOrderAscending());
 
     /**
      * @param {string} field
-     * @param {!UI.DataGridNode} a
-     * @param {!UI.DataGridNode} b
+     * @param {!DataGrid.DataGridNode} a
+     * @param {!DataGrid.DataGridNode} b
      * @return {number}
      */
     function compareNumericField(field, a, b) {
       var nodeA = /** @type {!Timeline.TimelineTreeView.TreeGridNode} */ (a);
       var nodeB = /** @type {!Timeline.TimelineTreeView.TreeGridNode} */ (b);
       return nodeA._profileNode[field] - nodeB._profileNode[field];
     }
 
     /**
-     * @param {!UI.DataGridNode} a
-     * @param {!UI.DataGridNode} b
+     * @param {!DataGrid.DataGridNode} a
+     * @param {!DataGrid.DataGridNode} b
      * @return {number}
      */
     function compareStartTime(a, b) {
       var nodeA = /** @type {!Timeline.TimelineTreeView.TreeGridNode} */ (a);
       var nodeB = /** @type {!Timeline.TimelineTreeView.TreeGridNode} */ (b);
       return nodeA._profileNode.event.startTime - nodeB._profileNode.event.startTime;
     }
 
     /**
-     * @param {!UI.DataGridNode} a
-     * @param {!UI.DataGridNode} b
+     * @param {!DataGrid.DataGridNode} a
+     * @param {!DataGrid.DataGridNode} b
      * @return {number}
      */
     function compareName(a, b) {
       var nodeA = /** @type {!Timeline.TimelineTreeView.TreeGridNode} */ (a);
       var nodeB = /** @type {!Timeline.TimelineTreeView.TreeGridNode} */ (b);
       var nameA = Timeline.TimelineTreeView.eventNameForSorting(nodeA._profileNode.event);
       var nameB = Timeline.TimelineTreeView.eventNameForSorting(nodeB._profileNode.event);
       return nameA.localeCompare(nameB);
     }
   }
@@ skipping 31 matching lines @@
         null;
     var profileNode = gridNode && gridNode._profileNode;
     if (profileNode === this._lastHoveredProfileNode)
       return;
     this._lastHoveredProfileNode = profileNode;
     this._onHover(profileNode);
   }
 
   /**
    * @param {!UI.ContextMenu} contextMenu
-   * @param {!UI.DataGridNode} gridNode
+   * @param {!DataGrid.DataGridNode} gridNode
    */
   _onContextMenu(contextMenu, gridNode) {
     var profileNode = gridNode._profileNode;
     if (!profileNode)
       return;
     this._appendContextMenuItems(contextMenu, profileNode);
   }
 
   /**
    * @param {!TimelineModel.TimelineProfileTree.Node} treeNode
    * @return {?Timeline.TimelineTreeView.GridNode}
    */
   _dataGridNodeForTreeNode(treeNode) {
     return treeNode[Timeline.TimelineTreeView.TreeGridNode._gridNodeSymbol] || null;
   }
 };
 
 
 /**
  * @unrestricted
  */
-Timeline.TimelineTreeView.GridNode = class extends UI.SortableDataGridNode {
+Timeline.TimelineTreeView.GridNode = class extends DataGrid.SortableDataGridNode {
   /**
    * @param {!TimelineModel.TimelineProfileTree.Node} profileNode
    * @param {number} grandTotalTime
    * @param {number} maxSelfTime
    * @param {number} maxTotalTime
    * @param {!Timeline.TimelineTreeView} treeView
    */
   constructor(profileNode, grandTotalTime, maxSelfTime, maxTotalTime, treeView) {
     super(null, false);
 
@@ skipping 394 matching lines @@
 /**
  * @unrestricted
  */
 Timeline.CallTreeTimelineTreeView = class extends Timeline.AggregatedTimelineTreeView {
   /**
    * @param {!TimelineModel.TimelineModel} model
    * @param {!Array<!TimelineModel.TimelineModel.Filter>} filters
    */
   constructor(model, filters) {
     super(model, filters);
-    this._dataGrid.markColumnAsSortedBy('total', UI.DataGrid.Order.Descending);
+    this._dataGrid.markColumnAsSortedBy('total', DataGrid.DataGrid.Order.Descending);
   }
 
   /**
    * @override
    * @return {!TimelineModel.TimelineProfileTree.Node}
    */
   _buildTree() {
     var grouping = this._groupBySetting.get();
     var topDown = this._buildTopDownTree(this._groupingFunction(grouping));
     if (grouping === Timeline.AggregatedTimelineTreeView.GroupBy.None)
       return topDown;
     return new TimelineModel.TimelineAggregator().performGrouping(topDown);
   }
 };
 
 /**
  * @unrestricted
  */
 Timeline.BottomUpTimelineTreeView = class extends Timeline.AggregatedTimelineTreeView {
   /**
    * @param {!TimelineModel.TimelineModel} model
    * @param {!Array<!TimelineModel.TimelineModel.Filter>} filters
    */
   constructor(model, filters) {
     super(model, filters);
-    this._dataGrid.markColumnAsSortedBy('self', UI.DataGrid.Order.Descending);
+    this._dataGrid.markColumnAsSortedBy('self', DataGrid.DataGrid.Order.Descending);
   }
 
   /**
    * @override
    * @return {!TimelineModel.TimelineProfileTree.Node}
    */
   _buildTree() {
     var topDown = this._buildTopDownTree(this._groupingFunction(this._groupBySetting.get()));
     return TimelineModel.TimelineProfileTree.buildBottomUp(topDown);
   }
 };
 
 /**
  * @unrestricted
  */
 Timeline.EventsTimelineTreeView = class extends Timeline.TimelineTreeView {
   /**
    * @param {!TimelineModel.TimelineModel} model
    * @param {!Array<!TimelineModel.TimelineModel.Filter>} filters
    * @param {!Timeline.TimelineModeViewDelegate} delegate
    */
   constructor(model, filters, delegate) {
     super();
     this._filtersControl = new Timeline.TimelineFilters();
     this._filtersControl.addEventListener(Timeline.TimelineFilters.Events.FilterChanged, this._onFilterChanged, this);
     this._init(model, filters);
     this._delegate = delegate;
     this._filters.push.apply(this._filters, this._filtersControl.filters());
-    this._dataGrid.markColumnAsSortedBy('startTime', UI.DataGrid.Order.Ascending);
+    this._dataGrid.markColumnAsSortedBy('startTime', DataGrid.DataGrid.Order.Ascending);
   }
 
   /**
    * @override
    * @param {!Timeline.TimelineSelection} selection
    */
   updateContents(selection) {
     super.updateContents(selection);
     if (selection.type() === Timeline.TimelineSelection.Type.TraceEvent) {
       var event = /** @type {!SDK.TracingModel.Event} */ (selection.object());
@@ skipping 47 matching lines @@
     var node = this._findNodeWithEvent(event);
     if (!node)
       return;
     this.selectProfileNode(node, false);
     if (expand)
       this._dataGridNodeForTreeNode(node).expand();
   }
 
   /**
    * @override
-   * @param {!Array<!UI.DataGrid.ColumnDescriptor>} columns
+   * @param {!Array<!DataGrid.DataGrid.ColumnDescriptor>} columns
    */
   _populateColumns(columns) {
     columns.push(
         {id: 'startTime', title: Common.UIString('Start Time'), width: '110px', fixedWidth: true, sortable: true});
     super._populateColumns(columns);
   }
 
   /**
    * @override
    * @param {!Element} parent
@@ skipping 37 matching lines @@
 
 /**
  * @unrestricted
  */
 Timeline.TimelineStackView = class extends UI.VBox {
   constructor(treeView) {
     super();
     var header = this.element.createChild('div', 'timeline-stack-view-header');
     header.textContent = Common.UIString('Heaviest stack');
     this._treeView = treeView;
-    var columns = /** @type {!Array<!UI.DataGrid.ColumnDescriptor>} */ ([
+    var columns = /** @type {!Array<!DataGrid.DataGrid.ColumnDescriptor>} */ ([
       {id: 'total', title: Common.UIString('Total Time'), fixedWidth: true, width: '110px'},
       {id: 'activity', title: Common.UIString('Activity')}
     ]);
-    this._dataGrid = new UI.ViewportDataGrid(columns);
-    this._dataGrid.setResizeMethod(UI.DataGrid.ResizeMethod.Last);
-    this._dataGrid.addEventListener(UI.DataGrid.Events.SelectedNode, this._onSelectionChanged, this);
+    this._dataGrid = new DataGrid.ViewportDataGrid(columns);
+    this._dataGrid.setResizeMethod(DataGrid.DataGrid.ResizeMethod.Last);
+    this._dataGrid.addEventListener(DataGrid.DataGrid.Events.SelectedNode, this._onSelectionChanged, this);
     this._dataGrid.asWidget().show(this.element);
   }
 
   /**
    * @param {!Array<!TimelineModel.TimelineProfileTree.Node>} stack
    * @param {!TimelineModel.TimelineProfileTree.Node} selectedNode
    */
   setStack(stack, selectedNode) {
     var rootNode = this._dataGrid.rootNode();
     rootNode.removeChildren();
@@ skipping 18 matching lines @@
 
   _onSelectionChanged() {
     this.dispatchEventToListeners(Timeline.TimelineStackView.Events.SelectionChanged);
   }
 };
 
 /** @enum {symbol} */
 Timeline.TimelineStackView.Events = {
   SelectionChanged: Symbol('SelectionChanged')
 };