Sync to latest trace-viewer

bug:20761637

Cherry-pick of 26c92f4cb78a275f1ebb94dd976f37bdd7d53ce7 from AOSP

Change-Id: I645b485ff2643b6efbec1fa25de6fc81a98c3ee5
diff --git a/trace-viewer/trace_viewer/core/analysis/multi_thread_slice_sub_view.html b/trace-viewer/trace_viewer/core/analysis/multi_thread_slice_sub_view.html
index 692f1a8..fbe61e4 100644
--- a/trace-viewer/trace_viewer/core/analysis/multi_thread_slice_sub_view.html
+++ b/trace-viewer/trace_viewer/core/analysis/multi_thread_slice_sub_view.html
@@ -7,6 +7,8 @@
 
 <link rel="import" href="/core/analysis/analysis_sub_view.html">
 <link rel="import" href="/core/analysis/multi_event_sub_view.html">
+<link rel="import" href="/core/analysis/flow_classifier.html">
+<link rel="import" href="/core/analysis/related_flows.html">
 
 <polymer-element name="tv-c-a-multi-thread-slice-sub-view"
     extends="tracing-analysis-sub-view">
@@ -19,6 +21,9 @@
       display: flex;
       flex: 1 1 auto;
     }
+    #content > tv-c-a-related-flows {
+      margin-left: 8px;
+    }
     </style>
     <div id="content"></div>
   </template>
@@ -62,6 +67,22 @@
       var mesv = document.createElement('tv-c-a-multi-event-sub-view');
       mesv.selection = selection;
       this.$.content.appendChild(mesv);
+
+      var fc = new tv.c.analysis.FlowClassifier();
+      selection.forEach(function(slice) {
+        slice.inFlowEvents.forEach(function(flow) {
+          fc.addInFlow(flow);
+        });
+        slice.outFlowEvents.forEach(function(flow) {
+          fc.addOutFlow(flow);
+        });
+      });
+      if (fc.hasEvents) {
+        var rflows = document.createElement('tv-c-a-related-flows');
+        rflows.setFlows(
+            fc.inFlowEvents, fc.outFlowEvents, fc.internalFlowEvents);
+        this.$.content.appendChild(rflows);
+      }
     },
 
     get requiresTallView() {
@@ -76,4 +97,4 @@
     }
   });
   </script>
-</polymer>
+</polymer-element>