trace-viewer/trace_viewer/core/analysis/single_event_sub_view.html - platform/external/chromium-trace - Git at Google

 <!DOCTYPE html>
 <!--
 Copyright (c) 2013 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.
 -->

 <link rel="import" href="/core/analysis/analysis_sub_view.html">
 <link rel="import" href="/base/units/time_duration_span.html">
 <link rel="import" href="/base/units/time_stamp_span.html">
 <link rel="import" href="/core/analysis/stack_frame.html">
 <link rel="import" href="/core/analysis/generic_object_view.html">
 <link rel="import" href="/base/ui/table.html">
 <link rel="import" href="/base/units/util.html">
 <link rel="import" href="/base/base.html">
 <link rel="import" href="/base/ui.html">

 <polymer-element name="tr-c-a-single-event-sub-view"
     extends="tr-c-a-sub-view">
   <template>
     <style>
     :host {
       display: flex;
       flex-direction: column;
     }
     #table {
       flex: 1 1 auto;
       align-self: stretch;
     }
     </style>
     <tr-b-ui-table id="table">
     </tr-b-ui-table>
   </template>
   <script>
   'use strict';

   Polymer({
     ready: function() {
       this.currentSelection_ = undefined;
       this.$.table.tableColumns = [
         {
           title: 'Label',
           value: function(row) { return row.name; },
           width: '150px'
         },
         {
           title: 'Value',
           width: '100%',
           value: function(row) { return row.value; }
         }
       ];
       this.$.table.showHeader = false;
     },

     get selection() {
       return this.currentSelection_;
     },

     set selection(selection) {
       if (selection.length !== 1)
         throw new Error('Only supports single slices');
       this.setSelectionWithoutErrorChecks(selection);
     },

     setSelectionWithoutErrorChecks: function(selection) {
       this.currentSelection_ = selection;
       this.updateContents_();
     },

     getEventRows_: function(event) {
       var rows = [];

       if (event.error)
         rows.push({ name: 'Error', value: event.error });

       if (event.title)
         rows.push({ name: 'Title', value: event.title });

       if (event.category)
         rows.push({ name: 'Category', value: event.category });

       var startEl = document.createElement('tr-b-u-time-stamp-span');
       startEl.timestamp = event.start;
       rows.push({ name: 'Start', value: startEl });

       if (event.duration) {
         var wallDurationEl = document.createElement(
             'tr-b-u-time-duration-span');
         wallDurationEl.duration = event.duration;
         rows.push({ name: 'Wall Duration', value: wallDurationEl });
       }

       if (event.cpuDuration) {
         var cpuDurationEl = document.createElement(
             'tr-b-u-time-duration-span');
         cpuDurationEl.duration = event.cpuDuration;
         rows.push({ name: 'CPU Duration', value: cpuDurationEl });
       }

       if (event.subSlices !== undefined && event.subSlices.length !== 0) {
         if (event.selfTime) {
           var selfTimeEl = document.createElement('tr-b-u-time-duration-span');
           selfTimeEl.duration = event.selfTime;
           rows.push({ name: 'Self Time', value: selfTimeEl });
         }

         if (event.cpuSelfTime) {
           var cpuSelfTimeEl = document.createElement(
               'tr-b-u-time-duration-span');
           cpuSelfTimeEl.duration = event.cpuSelfTime;
           if (event.cpuSelfTime > event.selfTime) {
             cpuSelfTimeEl.warning =
                 ' Note that CPU Self Time is larger than Self Time. ' +
                 'This is a known limitation of this system, which occurs ' +
                 'due to several subslices, rounding issues, and imprecise ' +
                 'time at which we get cpu- and real-time.';
           }
           rows.push({name: 'CPU Self Time',
                      value: cpuSelfTimeEl});
         }
       }

       if (event.durationInUserTime) {
         var durationInUserTimeEl = document.createElement(
             'tr-b-u-time-duration-span');
         durationInUserTimeEl.duration = event.durationInUserTime;
         rows.push({ name: 'Duration (U)', value: durationInUserTimeEl });
       }

       function createStackFrameEl(sf) {
         var sfEl = document.createElement('tr-c-a-stack-frame');
         sfEl.stackFrame = sf;
         return sfEl;
       }
       if (event.startStackFrame && event.endStackFrame) {
         if (event.startStackFrame === event.endStackFrame) {
           rows.push({name: 'Start+End Stack Trace',
               value: createStackFrameEl(event.startStackFrame)});

         } else {
           rows.push({ name: 'Start Stack Trace',
               value: createStackFrameEl(event.startStackFrame)});
           rows.push({ name: 'End Stack Trace',
               value: createStackFrameEl(event.endStackFrame)});
         }
       } else if (event.startStackFrame) {
         rows.push({ name: 'Start Stack Trace',
             value: createStackFrameEl(event.startStackFrame)});

       } else if (event.endStackFrame) {
         rows.push({ name: 'End Stack Trace',
             value: createStackFrameEl(event.endStackFrame)});
       }

       if (event.info) {
         var descriptionEl = tr.b.ui.createDiv({
             textContent: event.info.description,
             maxWidth: '300px'
         });
         rows.push({
           name: 'Description',
           value: descriptionEl
         });


         if (event.info.docLinks) {
           event.info.docLinks.forEach(function(linkObject) {
             var linkEl = document.createElement('a');
             linkEl.target = '_blank';
             linkEl.href = linkObject.href;
             linkEl.textContent = linkObject.textContent;
             rows.push({
               name: linkObject.label,
               value: linkEl
             });
           });
         }
       }

       if (event.associatedAlerts.length) {
         var alertSubRows = [];
         event.associatedAlerts.forEach(function(alert) {
           var linkEl = document.createElement('tr-c-a-analysis-link');
           linkEl.setSelectionAndContent(function() {
             return new tr.c.Selection(alert);
           }, alert.info.description);
           alertSubRows.push({
             name: alert.title,
             value: linkEl
           });
         });

         rows.push({
           name: 'Alerts', value: '',
           isExpanded: true, subRows: alertSubRows
         });
       }
       return rows;
     },

     addArgsToRows_: function(rows, args) {
       var n = 0;
       for (var argName in args) {
         n += 1;
       }
       if (n > 0) {
         var subRows = [];
         for (var argName in args) {
           var argView =
               document.createElement('tr-c-a-generic-object-view');
           argView.object = args[argName];
           subRows.push({ name: argName,
                       value: argView});
         }
         rows.push({
           name: 'Args', value: '',
           isExpanded: true, subRows: subRows
         });
       }
       return rows;
     },

     updateContents_: function() {
       if (this.currentSelection_ === undefined) {
         this.$.table.rows = [];
         this.$.table.rebuild();
         return;
       }

       var event = this.currentSelection_[0];

       var rows = this.getEventRows_(event);
       this.addArgsToRows_(rows, event.args);

       this.$.table.tableRows = rows;
       this.$.table.rebuild();
     }
   });
   </script>
 </polymer-element>
	<!DOCTYPE html>
	<!--
	Copyright (c) 2013 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.
	-->

	<link rel="import" href="/core/analysis/analysis_sub_view.html">
	<link rel="import" href="/base/units/time_duration_span.html">
	<link rel="import" href="/base/units/time_stamp_span.html">
	<link rel="import" href="/core/analysis/stack_frame.html">
	<link rel="import" href="/core/analysis/generic_object_view.html">
	<link rel="import" href="/base/ui/table.html">
	<link rel="import" href="/base/units/util.html">
	<link rel="import" href="/base/base.html">
	<link rel="import" href="/base/ui.html">

	<polymer-element name="tr-c-a-single-event-sub-view"
	extends="tr-c-a-sub-view">
	<template>
	<style>
	:host {
	display: flex;
	flex-direction: column;
	}
	#table {
	flex: 1 1 auto;
	align-self: stretch;
	}
	</style>
	<tr-b-ui-table id="table">
	</tr-b-ui-table>
	</template>
	<script>
	'use strict';

	Polymer({
	ready: function() {
	this.currentSelection_ = undefined;
	this.$.table.tableColumns = [
	{
	title: 'Label',
	value: function(row) { return row.name; },
	width: '150px'
	},
	{
	title: 'Value',
	width: '100%',
	value: function(row) { return row.value; }
	}
	];
	this.$.table.showHeader = false;
	},

	get selection() {
	return this.currentSelection_;
	},

	set selection(selection) {
	if (selection.length !== 1)
	throw new Error('Only supports single slices');
	this.setSelectionWithoutErrorChecks(selection);
	},

	setSelectionWithoutErrorChecks: function(selection) {
	this.currentSelection_ = selection;
	this.updateContents_();
	},

	getEventRows_: function(event) {
	var rows = [];

	if (event.error)
	rows.push({ name: 'Error', value: event.error });

	if (event.title)
	rows.push({ name: 'Title', value: event.title });

	if (event.category)
	rows.push({ name: 'Category', value: event.category });

	var startEl = document.createElement('tr-b-u-time-stamp-span');
	startEl.timestamp = event.start;
	rows.push({ name: 'Start', value: startEl });

	if (event.duration) {
	var wallDurationEl = document.createElement(
	'tr-b-u-time-duration-span');
	wallDurationEl.duration = event.duration;
	rows.push({ name: 'Wall Duration', value: wallDurationEl });
	}

	if (event.cpuDuration) {
	var cpuDurationEl = document.createElement(
	'tr-b-u-time-duration-span');
	cpuDurationEl.duration = event.cpuDuration;
	rows.push({ name: 'CPU Duration', value: cpuDurationEl });
	}

	if (event.subSlices !== undefined && event.subSlices.length !== 0) {
	if (event.selfTime) {
	var selfTimeEl = document.createElement('tr-b-u-time-duration-span');
	selfTimeEl.duration = event.selfTime;
	rows.push({ name: 'Self Time', value: selfTimeEl });
	}

	if (event.cpuSelfTime) {
	var cpuSelfTimeEl = document.createElement(
	'tr-b-u-time-duration-span');
	cpuSelfTimeEl.duration = event.cpuSelfTime;
	if (event.cpuSelfTime > event.selfTime) {
	cpuSelfTimeEl.warning =
	' Note that CPU Self Time is larger than Self Time. ' +
	'This is a known limitation of this system, which occurs ' +
	'due to several subslices, rounding issues, and imprecise ' +
	'time at which we get cpu- and real-time.';
	}
	rows.push({name: 'CPU Self Time',
	value: cpuSelfTimeEl});
	}
	}

	if (event.durationInUserTime) {
	var durationInUserTimeEl = document.createElement(
	'tr-b-u-time-duration-span');
	durationInUserTimeEl.duration = event.durationInUserTime;
	rows.push({ name: 'Duration (U)', value: durationInUserTimeEl });
	}

	function createStackFrameEl(sf) {
	var sfEl = document.createElement('tr-c-a-stack-frame');
	sfEl.stackFrame = sf;
	return sfEl;
	}
	if (event.startStackFrame && event.endStackFrame) {
	if (event.startStackFrame === event.endStackFrame) {
	rows.push({name: 'Start+End Stack Trace',
	value: createStackFrameEl(event.startStackFrame)});

	} else {
	rows.push({ name: 'Start Stack Trace',
	value: createStackFrameEl(event.startStackFrame)});
	rows.push({ name: 'End Stack Trace',
	value: createStackFrameEl(event.endStackFrame)});
	}
	} else if (event.startStackFrame) {
	rows.push({ name: 'Start Stack Trace',
	value: createStackFrameEl(event.startStackFrame)});

	} else if (event.endStackFrame) {
	rows.push({ name: 'End Stack Trace',
	value: createStackFrameEl(event.endStackFrame)});
	}

	if (event.info) {
	var descriptionEl = tr.b.ui.createDiv({
	textContent: event.info.description,
	maxWidth: '300px'
	});
	rows.push({
	name: 'Description',
	value: descriptionEl
	});


	if (event.info.docLinks) {
	event.info.docLinks.forEach(function(linkObject) {
	var linkEl = document.createElement('a');
	linkEl.target = '_blank';
	linkEl.href = linkObject.href;
	linkEl.textContent = linkObject.textContent;
	rows.push({
	name: linkObject.label,
	value: linkEl
	});
	});
	}
	}

	if (event.associatedAlerts.length) {
	var alertSubRows = [];
	event.associatedAlerts.forEach(function(alert) {
	var linkEl = document.createElement('tr-c-a-analysis-link');
	linkEl.setSelectionAndContent(function() {
	return new tr.c.Selection(alert);
	}, alert.info.description);
	alertSubRows.push({
	name: alert.title,
	value: linkEl
	});
	});

	rows.push({
	name: 'Alerts', value: '',
	isExpanded: true, subRows: alertSubRows
	});
	}
	return rows;
	},

	addArgsToRows_: function(rows, args) {
	var n = 0;
	for (var argName in args) {
	n += 1;
	}
	if (n > 0) {
	var subRows = [];
	for (var argName in args) {
	var argView =
	document.createElement('tr-c-a-generic-object-view');
	argView.object = args[argName];
	subRows.push({ name: argName,
	value: argView});
	}
	rows.push({
	name: 'Args', value: '',
	isExpanded: true, subRows: subRows
	});
	}
	return rows;
	},

	updateContents_: function() {
	if (this.currentSelection_ === undefined) {
	this.$.table.rows = [];
	this.$.table.rebuild();
	return;
	}

	var event = this.currentSelection_[0];

	var rows = this.getEventRows_(event);
	this.addArgsToRows_(rows, event.args);

	this.$.table.tableRows = rows;
	this.$.table.rebuild();
	}
	});
	</script>
	</polymer-element>