[Devtools] New structure and colorize rows for network products

third_party/WebKit/Source/devtools/front_end/network/NetworkPanel.js

 /*
  * Copyright (C) 2007, 2008 Apple Inc.  All rights reserved.
  * Copyright (C) 2008, 2009 Anthony Ricaud <rik@webkit.org>
  * Copyright (C) 2011 Google Inc. All rights reserved.
  *
  * Redistribution and use in source and binary forms, with or without
  * modification, are permitted provided that the following conditions
  * are met:
  *
  * 1.  Redistributions of source code must retain the above copyright
@@ skipping 170 matching lines @@
     this._panelToolbar.appendSeparator();
     this._panelToolbar.appendToolbarItem(NetworkConditions.NetworkConditionsSelector.createOfflineToolbarCheckbox());
     this._panelToolbar.appendToolbarItem(this._createNetworkConditionsSelect());
 
     this._setupGroupingCombo();
 
     this._panelToolbar.appendToolbarItem(new UI.ToolbarItem(this._progressBarContainer));
   }
 
   _setupGroupingCombo() {
-    var extensions = self.runtime.extensions(Network.NetworkGroupLookupInterface);
+    var extensions = self.runtime.extensions(Network.GroupLookupInterface);
     if (!extensions.length)
       return;
 
     var setting = Common.settings.createSetting('networkGrouping', '');
     /** @type {!Array<!{value: string, label: string, title: string}>} */
     var options = [{value: '', label: Common.UIString('No grouping'), title: Common.UIString('No grouping')}];
 
     extensions.forEach(extension => {
       var identifier = extension.descriptor()['id'];
       this._groupingExtensions.set(identifier, extension);
       options.push({value: identifier, label: extension.title(), title: extension.title()});
     });
     this._panelToolbar.appendToolbarItem(new UI.ToolbarSettingComboBox(options, setting, Common.UIString('Group by')));
     setting.addChangeListener(event => this._groupingChanged(/** @type {string} */ (event.data)));
     this._groupingChanged(setting.get());
   }
 
   /**
    * @param {string} identifier
    */
   _groupingChanged(identifier) {
     var extension = this._groupingExtensions.get(identifier);
     if (extension) {
       extension.instance().then(
-          grouping => this._networkLogView.setGrouping(/** @type {?Network.NetworkGroupLookupInterface} */ (grouping)));
+          grouping => this._networkLogView.setGrouping(/** @type {?Network.GroupLookupInterface} */ (grouping)));
     } else {
       this._networkLogView.setGrouping(null);
     }
   }
 
   /**
    * @return {!UI.ToolbarComboBox}
    */
   _createNetworkConditionsSelect() {
     var toolbarItem = new UI.ToolbarComboBox(null);
@@ skipping 520 matching lines @@
    * @param {string} actionId
    * @return {boolean}
    */
   handleAction(context, actionId) {
     var panel = UI.context.flavor(Network.NetworkPanel);
     console.assert(panel && panel instanceof Network.NetworkPanel);
     panel._toggleRecording();
     return true;
   }
 };