DevTools: extract a component for layer viewer

third_party/WebKit/Source/devtools/front_end/layer_viewer/PaintProfilerView.js

 /*
  * Copyright (C) 2013 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:
  *
  *     * Redistributions of source code must retain the above copyright
  * notice, this list of conditions and the following disclaimer.
  *     * Redistributions in binary form must reproduce the above
@@ skipping 17 matching lines @@
  * OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
  */
 
 /**
  * @constructor
  * @param {function(string=)} showImageCallback
  * @extends {WebInspector.HBox}
  */
 WebInspector.PaintProfilerView = function(showImageCallback)
 {
     WebInspector.HBox.call(this);

[dgozman, 2016/09/22 16:35:34]

Turn into web component as well?

+    this.registerRequiredCSS("layer_viewer/paintProfiler.css");
     this.element.classList.add("paint-profiler-overview", "hbox");
     this._canvasContainer = this.element.createChild("div", "paint-profiler-canvas-container");
     this._progressBanner = this.element.createChild("div", "banner hidden");
     this._progressBanner.textContent = WebInspector.UIString("Profiling\u2026");
     this._pieChart = new WebInspector.PieChart(55, this._formatPieChartTime.bind(this), true);
     this._pieChart.element.classList.add("paint-profiler-pie-chart");
     this.element.appendChild(this._pieChart.element);
 
     this._showImageCallback = showImageCallback;
 
@@ skipping 470 matching lines @@
     var method = logItem.method.toTitleCase();
 
     var logItemCategories = WebInspector.PaintProfilerView._initLogItemCategories();
     var result = logItemCategories[method];
     if (!result) {
         result = WebInspector.PaintProfilerView.categories()["misc"];
         logItemCategories[method] = result;
     }
     return result;
 }