[Devtools] Replace "Stacks" with "Causes"

Source/devtools/front_end/timeline/TimelinePanel.js

 /*
  * Copyright (C) 2012 Google Inc. All rights reserved.
  * Copyright (C) 2012 Intel 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.
@@ skipping 252 matching lines @@
     },
 
     _paintProfilerView: function()
     {
         if (this._lazyPaintProfilerView)
             return this._lazyPaintProfilerView;
         this._lazyPaintProfilerView = new WebInspector.TimelinePaintProfilerView();
         return this._lazyPaintProfilerView;
     },
 
+    _causesView: function()
+    {
+        if (!this._lazyCausesView)
+            this._lazyCausesView = new WebInspector.TimelineCausesView();
+        return this._lazyCausesView;
+    },
+
     /**
      * @param {!WebInspector.TimelineModeView} modeView
      */
     _addModeView: function(modeView)
     {
         modeView.setWindowTimes(this.windowStartTime(), this.windowEndTime());
         modeView.refreshRecords(this._textFilter._regex);
         this._stackView.appendView(modeView.view(), "timelinePanelTimelineStackSplitViewState");
         modeView.view().addEventListener(WebInspector.SplitView.Events.SidebarSizeChanged, this._sidebarResized, this);
         this._currentViews.push(modeView);
@@ skipping 57 matching lines @@
         panelStatusBarElement.appendChild(framesToggleButton.element);
 
         if (Runtime.experiments.isEnabled("timelineOnTraceEvents")) {
             var flameChartToggleButton = new WebInspector.StatusBarButton(WebInspector.UIString("Tracing mode"), "timeline-flame-chart-status-bar-item");
             flameChartToggleButton.toggled = this._flameChartEnabledSetting.get();
             flameChartToggleButton.addEventListener("click", this._flameChartEnabledChanged.bind(this, flameChartToggleButton));
             this._statusBarButtons.push(flameChartToggleButton);
             panelStatusBarElement.appendChild(flameChartToggleButton.element);
         }
 
-        this._captureStacksSetting = WebInspector.settings.createSetting("timelineCaptureStacks", true);
-        this._captureStacksSetting.addChangeListener(this._refreshViews, this);
-        panelStatusBarElement.appendChild(this._createSettingCheckbox(WebInspector.UIString("Stacks"),
-                                                                      this._captureStacksSetting,
-                                                                      WebInspector.UIString("Capture JavaScript stack on every timeline event")));
+        this._captureCausesSetting = WebInspector.settings.createSetting("timelineCaptureCauses", true);
+        this._captureCausesSetting.addChangeListener(this._refreshViews, this);
+        panelStatusBarElement.appendChild(this._createSettingCheckbox(WebInspector.UIString("Causes"),
+                                                                      this._captureCausesSetting,
+                                                                      WebInspector.UIString("Capture causes for timeline events (e.g., stack traces)")));
         this._captureMemorySetting = WebInspector.settings.createSetting("timelineCaptureMemory", false);
         panelStatusBarElement.appendChild(this._createSettingCheckbox(WebInspector.UIString("Memory"),
                                                                       this._captureMemorySetting,
                                                                       WebInspector.UIString("Capture memory information on every timeline event")));
         this._captureMemorySetting.addChangeListener(this._onModeChanged, this);
         if (Runtime.experiments.isEnabled("timelinePowerProfiler") &&
             WebInspector.targetManager.mainTarget().hasCapability(WebInspector.Target.Capabilities.CanProfilePower)) {
             this._capturePowerSetting = WebInspector.settings.createSetting("timelineCapturePower", false);
             panelStatusBarElement.appendChild(this._createSettingCheckbox(WebInspector.UIString("Power"),
                                                                           this._capturePowerSetting,
@@ skipping 267 matching lines @@
         this._recordingOptionUIControls.forEach(handler);
         WebInspector.inspectorView.setCurrentPanelLocked(!enabled);
     },
 
     /**
      * @param {boolean} userInitiated
      */
     _startRecording: function(userInitiated)
     {
         this._userInitiatedRecording = userInitiated;
-        this._model.startRecording(this._captureStacksSetting.get(), this._captureMemorySetting.get(), this._captureLayersAndPicturesSetting && this._captureLayersAndPicturesSetting.get());
+        this._model.startRecording(this._captureCausesSetting.get(), this._captureMemorySetting.get(), this._captureLayersAndPicturesSetting && this._captureLayersAndPicturesSetting.get());
         if (this._lazyFrameModel)
             this._lazyFrameModel.setMergeRecords(false);
 
         for (var i = 0; i < this._overviewControls.length; ++i)
             this._overviewControls[i].timelineStarted();
 
         if (userInitiated)
             WebInspector.userMetrics.TimelineStarted.record();
         this._setUIControlsEnabled(false);
     },
@@ skipping 336 matching lines @@
     },
 
     /**
      * @param {!WebInspector.TracingModel.Event} event
      * @param {!Node} content
      */
     _appendDetailsTabsForTraceEventAndShowDetails: function(event, content)
     {
         var title = WebInspector.TracingTimelineUIUtils.eventStyle(event).title;
         this.showInDetails(title, content);
-        if (!event.picture)
-            return;
-        var paintProfilerView = this._paintProfilerView();
-        this._detailsView.appendTab("paintProfiler", WebInspector.UIString("Paint Profiler"), paintProfilerView);
-        event.picture.requestObject(onGotObject);
-        function onGotObject(result)
-        {
-            if (!result || !result["skp64"])
-                return;
-            paintProfilerView.setPicture(event.thread.target(), result["skp64"]);
+        if (event.picture) {
+            var paintProfilerView = this._paintProfilerView();
+            this._detailsView.appendTab("paintProfiler", WebInspector.UIString("Paint Profiler"), paintProfilerView);
+            event.picture.requestObject(onGotObject);
+            function onGotObject(result)
+            {
+                if (!result || !result["skp64"])
+                    return;
+                paintProfilerView.setPicture(event.thread.target(), result["skp64"]);
+            }
+        }
+        if (this._hasCauses(event)) {
+            var causesView = this._causesView();
+            causesView.setContent(
+                WebInspector.TracingTimelineUIUtils.generateCauses(event, this._detailsLinkifier));
+            this._detailsView.appendTab("causes", WebInspector.UIString("Causes"), causesView);
         }
     },
 
     _updateSelectedRangeStats: function()
     {
         if (this._selection)
             return;
 
         var startTime = this._windowStartTime;
         var endTime = this._windowEndTime;
@@ skipping 87 matching lines @@
 
     /**
      * @param {string} title
      * @param {!Node} node
      */
     showInDetails: function(title, node)
     {
         this._detailsView.setContent(title, node);
     },
 
+    /**
+     * @param {!WebInspector.TracingModel.Event} event
+     * @return {boolean}
+     */
+    _hasCauses: function(event)
+    {
+        // Do not show cause data unless the setting is enabled. This gives us a
+        // single checkbox and a consistent UI, at the cost of not showing
+        // initiator data that might be available when the setting is disabled.
+        if (!event || !this._captureCausesSetting.get())

[caseq, 2014/10/07 09:50:07]

nit: drop !event check

+            return false;
+
+        var initiatorHasStack = event.initiator && event.initiator.stackTrace;
+        return initiatorHasStack || event.stackTrace;
+    },
+
     __proto__: WebInspector.Panel.prototype
 }
 
 /**
  * @constructor
  * @extends {WebInspector.TabbedPane}
  */
 WebInspector.TimelineDetailsView = function()
 {
     WebInspector.TabbedPane.call(this);
@@ skipping 330 matching lines @@
 
 WebInspector.TimelinePanelFactory.prototype = {
     /**
      * @return {!WebInspector.Panel}
      */
     createPanel: function()
     {
         return WebInspector.TimelinePanel._instance();
     }
 }
+
+/**
+ * Display information about an event's direct and indirect causes.
+ *
+ * @interface

[caseq, 2014/10/07 09:50:08]

s/@interface/@constructor/

+ * @extends {WebInspector.VBox}
+ */
+WebInspector.TimelineCausesView = function()
+{
+    WebInspector.VBox.call(this);
+    this.element.classList.add("timeline-causes-view");

[caseq, 2014/10/07 09:50:07]

unused?

+}
+
+WebInspector.TimelineCausesView.prototype = {
+    setContent: function(content)

[caseq, 2014/10/07 09:50:08]

Please annotate @type for content.

+    {
+        this.element.removeChildren();
+        if (!content || !content.children || !content.children.length) {
+            console.error("No content generator set on TimelineCausesView.");
+            content = this.element.createChild("div", "");
+            content.textContent =
+                WebInspector.UIString("No causes reported for this event.");
+        }
+        this.element.appendChild(content);

[caseq, 2014/10/07 09:50:08]

This will throw if (!content), so perhaps put under else?

+    },
+
+    __proto__: WebInspector.VBox.prototype
+};