Convert tracks code to polymer.

Convert tracks code to polymer.

[DO NOT COMMIT] This is currently pretty broken...

This CL converts the code for the track system over to polymer elements.

[dsinclair, 2015-07-14 21:11:06]

This is getting closer, so wanted to get any early feedback you have. (If you
patch it in and trying, the canvas will load blank and you need to
expand/collapse a process track to have it appear).

There are lots of issues still, like you can't pan vertically .....

[petrcermak, 2015-07-15 15:30:37]

Wow! This is really great work. Here's a couple of comments.

Thanks,
Petr

https://codereview.appspot.com/256760043/diff/100001/tracing/tracing/ui/extra...
File tracing/tracing/ui/extras/rail/rail_score_span.html (right):

https://codereview.appspot.com/256760043/diff/100001/tracing/tracing/ui/extra...
tracing/tracing/ui/extras/rail/rail_score_span.html:13: :host { display: span; }
nit: I personally find the original notation (3 lines) a little more readable.

https://codereview.appspot.com/256760043/diff/100001/tracing/tracing/ui/extra...
File tracing/tracing/ui/extras/system_stats/system_stats_instance_track.html
(left):

https://codereview.appspot.com/256760043/diff/100001/tracing/tracing/ui/extra...
tracing/tracing/ui/extras/system_stats/system_stats_instance_track.html:350:
tr.ui.tracks.ObjectInstanceTrack.register(
Don't you still need to do this somewhere?

https://codereview.appspot.com/256760043/diff/100001/tracing/tracing/ui/extra...
File tracing/tracing/ui/extras/system_stats/system_stats_instance_track.html
(right):

https://codereview.appspot.com/256760043/diff/100001/tracing/tracing/ui/extra...
tracing/tracing/ui/extras/system_stats/system_stats_instance_track.html:41:
'meminfo': {
nit: the block below is not indented correctly.

https://codereview.appspot.com/256760043/diff/100001/tracing/tracing/ui/extra...
tracing/tracing/ui/extras/system_stats/system_stats_instance_track.html:148:
excludedStats);
this I think should be this.excludedStats_ (several times in this file).

https://codereview.appspot.com/256760043/diff/100001/tracing/tracing/ui/extra...
File tracing/tracing/ui/extras/tcmalloc/heap_instance_track.html (left):

https://codereview.appspot.com/256760043/diff/100001/tracing/tracing/ui/extra...
tracing/tracing/ui/extras/tcmalloc/heap_instance_track.html:169:
tr.ui.tracks.ObjectInstanceTrack.register(
Again, I think you will still need something like this.

https://codereview.appspot.com/256760043/diff/100001/tracing/tracing/ui/extra...
File tracing/tracing/ui/extras/tcmalloc/heap_instance_track.html (right):

https://codereview.appspot.com/256760043/diff/100001/tracing/tracing/ui/extra...
tracing/tracing/ui/extras/tcmalloc/heap_instance_track.html:152:
this.objectInstance_.selectedTraces[0] == keys[k]) {
s/==/===/ when you're already at it

https://codereview.appspot.com/256760043/diff/100001/tracing/tracing/ui/timel...
File tracing/tracing/ui/timeline_track_view.html (right):

https://codereview.appspot.com/256760043/diff/100001/tracing/tracing/ui/timel...
tracing/tracing/ui/timeline_track_view.html:204: this.selectionController_.
nit: the following might be easier to read (I always try to avoid breaking after
a dot):

this.selectionController_.removeEventListener(
    'change', this.onSelectionChanged_);

https://codereview.appspot.com/256760043/diff/100001/tracing/tracing/ui/timel...
tracing/tracing/ui/timeline_track_view.html:209: this.selectionController_.
ditto

https://codereview.appspot.com/256760043/diff/100001/tracing/tracing/ui/timel...
tracing/tracing/ui/timeline_track_view.html:219: if (!this.showHintText_)
I'm not sure how this is related to the change.

https://codereview.appspot.com/256760043/diff/100001/tracing/tracing/ui/timel...
tracing/tracing/ui/timeline_track_view.html:528: console.log('wheel');
:-)

https://codereview.appspot.com/256760043/diff/100001/tracing/tracing/ui/timel...
File tracing/tracing/ui/timeline_view.html (right):

https://codereview.appspot.com/256760043/diff/100001/tracing/tracing/ui/timel...
tracing/tracing/ui/timeline_view.html:152: this.railScoreSpan_ =
document.createElement(
Now that this is being Polymerized, how about always including the RAIL score
span in the shadow DOM and hiding it when appropriate?

https://codereview.appspot.com/256760043/diff/100001/tracing/tracing/ui/timel...
tracing/tracing/ui/timeline_view.html:200: this.$.drag_handle.target =
this.$.analysis;
I think this should be right before or after line 179.

https://codereview.appspot.com/256760043/diff/100001/tracing/tracing/ui/timel...
tracing/tracing/ui/timeline_view.html:243: this.showFlowEvents_ =
showFlowEvents;
Now that you're already modifying it, this should probably be:

this.showFlowEvents_ = !!showFlowEvents;

https://codereview.appspot.com/256760043/diff/100001/tracing/tracing/ui/timel...
tracing/tracing/ui/timeline_view.html:244: if (!this.$.timeline_track_view)
This can't happen anymore

https://codereview.appspot.com/256760043/diff/100001/tracing/tracing/ui/timel...
tracing/tracing/ui/timeline_view.html:254: this.highlightVSync_ =
highlightVSync;
Now that you're already modifying it, this should probably be:

this.highlightVSync_ = !!highlightVSync;

https://codereview.appspot.com/256760043/diff/100001/tracing/tracing/ui/timel...
tracing/tracing/ui/timeline_view.html:255: if (!this.$.timeline_track_view)
This can't happen anymore

https://codereview.appspot.com/256760043/diff/100001/tracing/tracing/ui/timel...
tracing/tracing/ui/timeline_view.html:345: return undefined;
This can't happen anymore

https://codereview.appspot.com/256760043/diff/100001/tracing/tracing/ui/timel...
tracing/tracing/ui/timeline_view.html:462: if (!this.$.timeline_track_view) {
I don't think this can ever happen now.

https://codereview.appspot.com/256760043/diff/100001/tracing/tracing/ui/timel...
File tracing/tracing/ui/timeline_viewport.html (right):

https://codereview.appspot.com/256760043/diff/100001/tracing/tracing/ui/timel...
tracing/tracing/ui/timeline_viewport.html:249: 
nit: no need for this blank line

https://codereview.appspot.com/256760043/diff/100001/tracing/tracing/ui/track...
File tracing/tracing/ui/tracks/chart_track.html (right):

https://codereview.appspot.com/256760043/diff/100001/tracing/tracing/ui/track...
tracing/tracing/ui/tracks/chart_track.html:9: <link rel="import"
href="/ui/tracks/heading_track.html">
Strictly speaking, if we extend <tr-ui-tracks-track>, then we should import
/ui/tracks/track.html

https://codereview.appspot.com/256760043/diff/100001/tracing/tracing/ui/track...
tracing/tracing/ui/tracks/chart_track.html:13: extends='tr-ui-tracks-track'>
Is there a reason why this doesn't extend <tr-ui-tracks-heading-track>? Is it
because of the custom style?

https://codereview.appspot.com/256760043/diff/100001/tracing/tracing/ui/track...
File tracing/tracing/ui/tracks/drawing_container.html (right):

https://codereview.appspot.com/256760043/diff/100001/tracing/tracing/ui/track...
tracing/tracing/ui/tracks/drawing_container.html:21: canvas {
maybe s/canvas/#canvas/?

https://codereview.appspot.com/256760043/diff/100001/tracing/tracing/ui/track...
tracing/tracing/ui/tracks/drawing_container.html:107: if (!(this.children[i]
instanceof TrUiTracksTrack))
See my comment on tracing/tracing/ui/tracks/container_track.html:23 about using
tagName instead

https://codereview.appspot.com/256760043/diff/100001/tracing/tracing/ui/track...
File tracing/tracing/ui/tracks/global_memory_dump_track.html (right):

https://codereview.appspot.com/256760043/diff/100001/tracing/tracing/ui/track...
tracing/tracing/ui/tracks/global_memory_dump_track.html:54: var track =
document.createElement('tr-ui-tracks-letter-dot-track');
It would probably be cleaner to always include all the tracks in the shadow DOM
and display/hide them when necessary.

https://codereview.appspot.com/256760043/diff/100001/tracing/tracing/ui/track...
File tracing/tracing/ui/tracks/heading_track.html (right):

https://codereview.appspot.com/256760043/diff/100001/tracing/tracing/ui/track...
tracing/tracing/ui/tracks/heading_track.html:118: String.fromCharCode(0x25BE); 
// down arrow
nit: I think that comments should start with an uppercase letter and end with a
fullstop even if they're not sentences.

https://codereview.appspot.com/256760043/diff/100001/tracing/tracing/ui/track...
File tracing/tracing/ui/tracks/model_track.html (right):

https://codereview.appspot.com/256760043/diff/100001/tracing/tracing/ui/track...
tracing/tracing/ui/tracks/model_track.html:37: setViewport: function(viewport) {
this could be a setter instead

https://codereview.appspot.com/256760043/diff/100001/tracing/tracing/ui/track...
tracing/tracing/ui/tracks/model_track.html:330: if (flowEvent.selectionState ===
tr.model.SelectionState.SELECTED) {
switch statement?

https://codereview.appspot.com/256760043/diff/100001/tracing/tracing/ui/track...
File tracing/tracing/ui/tracks/object_instance_track.html (right):

https://codereview.appspot.com/256760043/diff/100001/tracing/tracing/ui/track...
tracing/tracing/ui/tracks/object_instance_track.html:163:
tr.model.SelectionState.DIMMED) {
nit: I think that this should be indented further +2 spaces

https://codereview.appspot.com/256760043/diff/100001/tracing/tracing/ui/track...
File tracing/tracing/ui/tracks/process_memory_dump_track.html (right):

https://codereview.appspot.com/256760043/diff/100001/tracing/tracing/ui/track...
tracing/tracing/ui/tracks/process_memory_dump_track.html:51: var track =
document.createElement('tr-ui-tracks-chart-track');
How about using the shadow DOM + CSS display instead? This would also allow us
to define the height using CSS.

https://codereview.appspot.com/256760043/diff/100001/tracing/tracing/ui/track...
File tracing/tracing/ui/tracks/rect_track.html (right):

https://codereview.appspot.com/256760043/diff/100001/tracing/tracing/ui/track...
tracing/tracing/ui/tracks/rect_track.html:16: extends='tr-ui-tracks-track'>
Again, any chance this could extend <tr-ui-tracks-heading-track> directly
instead?

https://codereview.appspot.com/256760043/diff/100001/tracing/tracing/ui/track...
File tracing/tracing/ui/tracks/ruler_track.html (right):

https://codereview.appspot.com/256760043/diff/100001/tracing/tracing/ui/track...
tracing/tracing/ui/tracks/ruler_track.html:97: function log10(x) {
Could we perhaps switch to Math.log10 from ES6 already
(https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Obje...