OLD | NEW |
1 <!DOCTYPE html> | 1 <!DOCTYPE html> |
2 <!-- | 2 <!-- |
3 Copyright (c) 2015 The Chromium Authors. All rights reserved. | 3 Copyright (c) 2015 The Chromium Authors. All rights reserved. |
4 Use of this source code is governed by a BSD-style license that can be | 4 Use of this source code is governed by a BSD-style license that can be |
5 found in the LICENSE file. | 5 found in the LICENSE file. |
6 --> | 6 --> |
7 | 7 |
8 <link rel="import" href="/tracing/base/color_scheme.html"> | 8 <link rel="import" href="/tracing/base/color_scheme.html"> |
9 <link rel="import" href="/tracing/base/range.html"> | 9 <link rel="import" href="/tracing/base/math/range.html"> |
10 <link rel="import" href="/tracing/model/proxy_selectable_item.html"> | 10 <link rel="import" href="/tracing/model/proxy_selectable_item.html"> |
11 <link rel="import" href="/tracing/model/selection_state.html"> | 11 <link rel="import" href="/tracing/model/selection_state.html"> |
12 <link rel="import" href="/tracing/ui/base/event_presenter.html"> | 12 <link rel="import" href="/tracing/ui/base/event_presenter.html"> |
13 | 13 |
14 <script> | 14 <script> |
15 'use strict'; | 15 'use strict'; |
16 | 16 |
17 tr.exportTo('tr.ui.tracks', function() { | 17 tr.exportTo('tr.ui.tracks', function() { |
18 var ColorScheme = tr.b.ColorScheme; | 18 var ColorScheme = tr.b.ColorScheme; |
19 var EventPresenter = tr.ui.b.EventPresenter; | 19 var EventPresenter = tr.ui.b.EventPresenter; |
(...skipping 99 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
119 value = defaultValue; | 119 value = defaultValue; |
120 this[key + '_'] = value; | 120 this[key + '_'] = value; |
121 } | 121 } |
122 | 122 |
123 // Avoid unnecessary recomputation in getters. | 123 // Avoid unnecessary recomputation in getters. |
124 this.topPadding = this.bottomPadding = Math.max( | 124 this.topPadding = this.bottomPadding = Math.max( |
125 this.selectedPointSize_, this.unselectedPointSize_) / 2; | 125 this.selectedPointSize_, this.unselectedPointSize_) / 2; |
126 }, | 126 }, |
127 | 127 |
128 get range() { | 128 get range() { |
129 var range = new tr.b.Range(); | 129 var range = new tr.b.math.Range(); |
130 this.points.forEach(function(point) { | 130 this.points.forEach(function(point) { |
131 range.addValue(point.y); | 131 range.addValue(point.y); |
132 }, this); | 132 }, this); |
133 return range; | 133 return range; |
134 }, | 134 }, |
135 | 135 |
136 draw: function(ctx, transform, highDetails) { | 136 draw: function(ctx, transform, highDetails) { |
137 if (this.points === undefined || this.points.length === 0) | 137 if (this.points === undefined || this.points.length === 0) |
138 return; | 138 return; |
139 | 139 |
(...skipping 22 matching lines...) Expand all Loading... |
162 extraPixels = Math.max( | 162 extraPixels = Math.max( |
163 this.selectedPointSize_, this.unselectedPointSize_); | 163 this.selectedPointSize_, this.unselectedPointSize_); |
164 } | 164 } |
165 var pixelRatio = transform.pixelRatio; | 165 var pixelRatio = transform.pixelRatio; |
166 var leftViewX = transform.leftViewX - extraPixels * pixelRatio; | 166 var leftViewX = transform.leftViewX - extraPixels * pixelRatio; |
167 var rightViewX = transform.rightViewX + extraPixels * pixelRatio; | 167 var rightViewX = transform.rightViewX + extraPixels * pixelRatio; |
168 var leftTimestamp = transform.leftTimestamp - extraPixels; | 168 var leftTimestamp = transform.leftTimestamp - extraPixels; |
169 var rightTimestamp = transform.rightTimestamp + extraPixels; | 169 var rightTimestamp = transform.rightTimestamp + extraPixels; |
170 | 170 |
171 // Find the index of the first and last (partially) visible points. | 171 // Find the index of the first and last (partially) visible points. |
172 var firstVisibleIndex = tr.b.findLowIndexInSortedArray( | 172 var firstVisibleIndex = tr.b.math.findLowIndexInSortedArray( |
173 this.points, | 173 this.points, |
174 function(point) { return point.x; }, | 174 function(point) { return point.x; }, |
175 leftTimestamp); | 175 leftTimestamp); |
176 var lastVisibleIndex = tr.b.findLowIndexInSortedArray( | 176 var lastVisibleIndex = tr.b.math.findLowIndexInSortedArray( |
177 this.points, | 177 this.points, |
178 function(point) { return point.x; }, | 178 function(point) { return point.x; }, |
179 rightTimestamp); | 179 rightTimestamp); |
180 if (lastVisibleIndex >= this.points.length || | 180 if (lastVisibleIndex >= this.points.length || |
181 this.points[lastVisibleIndex].x > rightTimestamp) { | 181 this.points[lastVisibleIndex].x > rightTimestamp) { |
182 lastVisibleIndex--; | 182 lastVisibleIndex--; |
183 } | 183 } |
184 | 184 |
185 // Pre-calculate component style which does not depend on individual | 185 // Pre-calculate component style which does not depend on individual |
186 // points: | 186 // points: |
(...skipping 45 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
232 } | 232 } |
233 var visibleViewXRange = | 233 var visibleViewXRange = |
234 transform.worldXToViewX(this.points[lastVisibleIndex].x) - | 234 transform.worldXToViewX(this.points[lastVisibleIndex].x) - |
235 transform.worldXToViewX(this.points[firstVisibleIndex].x); | 235 transform.worldXToViewX(this.points[firstVisibleIndex].x); |
236 if (visibleViewXRange === 0) { | 236 if (visibleViewXRange === 0) { |
237 // Multiple visible points which all have the same timestamp. | 237 // Multiple visible points which all have the same timestamp. |
238 squareOpacity = 1; | 238 squareOpacity = 1; |
239 break; | 239 break; |
240 } | 240 } |
241 var density = visibleIndexRange / visibleViewXRange; | 241 var density = visibleIndexRange / visibleViewXRange; |
242 var clampedDensity = tr.b.clamp(density, | 242 var clampedDensity = tr.b.math.clamp(density, |
243 this.unselectedPointDensityOpaque_, | 243 this.unselectedPointDensityOpaque_, |
244 this.unselectedPointDensityTransparent_); | 244 this.unselectedPointDensityTransparent_); |
245 var densityRange = this.unselectedPointDensityTransparent_ - | 245 var densityRange = this.unselectedPointDensityTransparent_ - |
246 this.unselectedPointDensityOpaque_; | 246 this.unselectedPointDensityOpaque_; |
247 squareOpacity = | 247 squareOpacity = |
248 (this.unselectedPointDensityTransparent_ - clampedDensity) / | 248 (this.unselectedPointDensityTransparent_ - clampedDensity) / |
249 densityRange; | 249 densityRange; |
250 break; | 250 break; |
251 | 251 |
252 case ChartSeriesComponent.LINE: | 252 case ChartSeriesComponent.LINE: |
(...skipping 253 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
506 if (i === points.length - 1) | 506 if (i === points.length - 1) |
507 return LAST_POINT_WIDTH * viewPixWidthWorld; | 507 return LAST_POINT_WIDTH * viewPixWidthWorld; |
508 var nextPoint = points[i + 1]; | 508 var nextPoint = points[i + 1]; |
509 return nextPoint.x - point.x; | 509 return nextPoint.x - point.x; |
510 } | 510 } |
511 | 511 |
512 function selectPoint(point) { | 512 function selectPoint(point) { |
513 point.addToSelection(selection); | 513 point.addToSelection(selection); |
514 } | 514 } |
515 | 515 |
516 tr.b.iterateOverIntersectingIntervals( | 516 tr.b.math.iterateOverIntersectingIntervals( |
517 this.points, | 517 this.points, |
518 function(point) { return point.x; }, | 518 function(point) { return point.x; }, |
519 getPointWidth, | 519 getPointWidth, |
520 loWX, | 520 loWX, |
521 hiWX, | 521 hiWX, |
522 selectPoint); | 522 selectPoint); |
523 }, | 523 }, |
524 | 524 |
525 addEventNearToProvidedEventToSelection: function(event, offset, selection) { | 525 addEventNearToProvidedEventToSelection: function(event, offset, selection) { |
526 if (this.points === undefined) | 526 if (this.points === undefined) |
(...skipping 11 matching lines...) Expand all Loading... |
538 | 538 |
539 this.points[newIndex].addToSelection(selection); | 539 this.points[newIndex].addToSelection(selection); |
540 return true; | 540 return true; |
541 }, | 541 }, |
542 | 542 |
543 addClosestEventToSelection: function(worldX, worldMaxDist, loY, hiY, | 543 addClosestEventToSelection: function(worldX, worldMaxDist, loY, hiY, |
544 selection) { | 544 selection) { |
545 if (this.points === undefined) | 545 if (this.points === undefined) |
546 return; | 546 return; |
547 | 547 |
548 var item = tr.b.findClosestElementInSortedArray( | 548 var item = tr.b.math.findClosestElementInSortedArray( |
549 this.points, | 549 this.points, |
550 function(point) { return point.x; }, | 550 function(point) { return point.x; }, |
551 worldX, | 551 worldX, |
552 worldMaxDist); | 552 worldMaxDist); |
553 | 553 |
554 if (!item) | 554 if (!item) |
555 return; | 555 return; |
556 | 556 |
557 item.addToSelection(selection); | 557 item.addToSelection(selection); |
558 } | 558 } |
559 }; | 559 }; |
560 | 560 |
561 return { | 561 return { |
562 ChartSeries, | 562 ChartSeries, |
563 ChartSeriesType, | 563 ChartSeriesType, |
564 }; | 564 }; |
565 }); | 565 }); |
566 </script> | 566 </script> |
OLD | NEW |