OLD | NEW |
1 <!DOCTYPE html> | 1 <!DOCTYPE html> |
2 <!-- | 2 <!-- |
3 Copyright (c) 2013 The Chromium Authors. All rights reserved. | 3 Copyright (c) 2013 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/settings.html"> | 8 <link rel="import" href="/tracing/base/settings.html"> |
9 <link rel="import" href="/tracing/base/utils.html"> | 9 <link rel="import" href="/tracing/base/utils.html"> |
10 <link rel="import" href="/tracing/core/scripting_controller.html"> | 10 <link rel="import" href="/tracing/core/scripting_controller.html"> |
11 <link rel="import" href="/tracing/metrics/all_metrics.html"> | 11 <link rel="import" href="/tracing/metrics/all_metrics.html"> |
12 <link rel="import" href="/tracing/ui/analysis/analysis_view.html"> | 12 <link rel="import" href="/tracing/ui/analysis/analysis_view.html"> |
13 <link rel="import" href="/tracing/ui/base/dom_helpers.html"> | 13 <link rel="import" href="/tracing/ui/base/dom_helpers.html"> |
14 <link rel="import" href="/tracing/ui/base/drag_handle.html"> | 14 <link rel="import" href="/tracing/ui/base/drag_handle.html"> |
15 <link rel="import" href="/tracing/ui/base/dropdown.html"> | 15 <link rel="import" href="/tracing/ui/base/dropdown.html"> |
16 <link rel="import" href="/tracing/ui/base/favicons.html"> | 16 <link rel="import" href="/tracing/ui/base/favicons.html"> |
17 <link rel="import" href="/tracing/ui/base/hotkey_controller.html"> | 17 <link rel="import" href="/tracing/ui/base/hotkey_controller.html"> |
18 <link rel="import" href="/tracing/ui/base/info_bar_group.html"> | 18 <link rel="import" href="/tracing/ui/base/info_bar_group.html"> |
| 19 <link rel="import" href="/tracing/ui/base/mouse_mode_icon.html"> |
19 <link rel="import" href="/tracing/ui/base/overlay.html"> | 20 <link rel="import" href="/tracing/ui/base/overlay.html"> |
20 <link rel="import" href="/tracing/ui/base/toolbar_button.html"> | 21 <link rel="import" href="/tracing/ui/base/toolbar_button.html"> |
21 <link rel="import" href="/tracing/ui/base/utils.html"> | 22 <link rel="import" href="/tracing/ui/base/utils.html"> |
22 <link rel="import" href="/tracing/ui/brushing_state_controller.html"> | 23 <link rel="import" href="/tracing/ui/brushing_state_controller.html"> |
23 <link rel="import" href="/tracing/ui/find_control.html"> | 24 <link rel="import" href="/tracing/ui/find_control.html"> |
24 <link rel="import" href="/tracing/ui/find_controller.html"> | 25 <link rel="import" href="/tracing/ui/find_controller.html"> |
25 <link rel="import" href="/tracing/ui/scripting_control.html"> | 26 <link rel="import" href="/tracing/ui/scripting_control.html"> |
26 <link rel="import" href="/tracing/ui/side_panel/side_panel_container.html"> | 27 <link rel="import" href="/tracing/ui/side_panel/side_panel_container.html"> |
27 <link rel="import" href="/tracing/ui/timeline_track_view.html"> | 28 <link rel="import" href="/tracing/ui/timeline_track_view.html"> |
28 <link rel="import" href="/tracing/ui/timeline_view_help_overlay.html"> | 29 <link rel="import" href="/tracing/ui/timeline_view_help_overlay.html"> |
(...skipping 60 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
89 display: flex; | 90 display: flex; |
90 min-height: 0; | 91 min-height: 0; |
91 min-width: 0; | 92 min-width: 0; |
92 overflow-x: hidden; | 93 overflow-x: hidden; |
93 } | 94 } |
94 | 95 |
95 middle-container ::content track-view-container > * { flex: 1 1 auto; } | 96 middle-container ::content track-view-container > * { flex: 1 1 auto; } |
96 middle-container > x-timeline-view-side-panel-container { flex: 0 0 auto; } | 97 middle-container > x-timeline-view-side-panel-container { flex: 0 0 auto; } |
97 tr-ui-b-drag-handle { flex: 0 0 auto; } | 98 tr-ui-b-drag-handle { flex: 0 0 auto; } |
98 tr-ui-a-analysis-view { flex: 0 0 auto; } | 99 tr-ui-a-analysis-view { flex: 0 0 auto; } |
| 100 |
| 101 tr-ui-b-mouse-mode-icon { |
| 102 padding-right: 5px; |
| 103 } |
99 </style> | 104 </style> |
100 | 105 |
101 <tv-ui-b-hotkey-controller id="hkc"></tv-ui-b-hotkey-controller> | 106 <tv-ui-b-hotkey-controller id="hkc"></tv-ui-b-hotkey-controller> |
102 <div id="control"> | 107 <div id="control"> |
103 <div id="bar"> | 108 <div id="bar"> |
104 <div id="left_controls"></div> | 109 <div id="left_controls"></div> |
105 <div id="title">^_^</div> | 110 <div id="title">^_^</div> |
106 <div id="right_controls"> | 111 <div id="right_controls"> |
| 112 <tr-ui-b-mouse-mode-icon mode-name="SELECTION" title="selection (1)" |
| 113 on-click="onMouseModeButtonClick_"> |
| 114 </tr-ui-b-mouse-mode-icon> |
| 115 <tr-ui-b-mouse-mode-icon mode-name="PANSCAN" title="pan (2)" |
| 116 on-click="onMouseModeButtonClick_"> |
| 117 </tr-ui-b-mouse-mode-icon> |
| 118 <tr-ui-b-mouse-mode-icon mode-name="ZOOM" title="zoom (3)" |
| 119 on-click="onMouseModeButtonClick_"> |
| 120 </tr-ui-b-mouse-mode-icon> |
| 121 <tr-ui-b-mouse-mode-icon mode-name="TIMING" title="timing (4)" |
| 122 on-click="onMouseModeButtonClick_"> |
| 123 </tr-ui-b-mouse-mode-icon> |
107 <tr-ui-b-toolbar-button id="view_metadata_button"> | 124 <tr-ui-b-toolbar-button id="view_metadata_button"> |
108 M | 125 M |
109 </tr-ui-b-toolbar-button> | 126 </tr-ui-b-toolbar-button> |
110 <tr-ui-b-dropdown id="view_options_dropdown"></tr-ui-b-dropdown> | 127 <tr-ui-b-dropdown id="view_options_dropdown"></tr-ui-b-dropdown> |
111 <tr-ui-find-control id="view_find_control"></tr-ui-find-control> | 128 <tr-ui-find-control id="view_find_control"></tr-ui-find-control> |
112 <tr-ui-b-toolbar-button id="view_console_button"> | 129 <tr-ui-b-toolbar-button id="view_console_button"> |
113 » | 130 » |
114 </tr-ui-b-toolbar-button> | 131 </tr-ui-b-toolbar-button> |
115 <tr-ui-b-toolbar-button id="view_help_button"> | 132 <tr-ui-b-toolbar-button id="view_help_button"> |
116 ? | 133 ? |
(...skipping 16 matching lines...) Expand all Loading... |
133 <tr-v-ui-preferred-display-unit id="display_unit"> | 150 <tr-v-ui-preferred-display-unit id="display_unit"> |
134 </tr-v-ui-preferred-display-unit> | 151 </tr-v-ui-preferred-display-unit> |
135 </template> | 152 </template> |
136 </dom-module> | 153 </dom-module> |
137 <script> | 154 <script> |
138 'use strict'; | 155 'use strict'; |
139 | 156 |
140 Polymer({ | 157 Polymer({ |
141 is: 'tr-ui-timeline-view', | 158 is: 'tr-ui-timeline-view', |
142 | 159 |
| 160 created() { |
| 161 this.onKeyUp_ = this.onKeyUp_.bind(this); |
| 162 }, |
| 163 |
143 attached() { | 164 attached() { |
144 this.async(function() { | 165 this.async(function() { |
145 this.trackViewContainer_ = Polymer.dom(this).querySelector( | 166 this.trackViewContainer_ = Polymer.dom(this).querySelector( |
146 '#track_view_container'); | 167 '#track_view_container'); |
147 if (!this.trackViewContainer_) { | 168 if (!this.trackViewContainer_) { |
148 throw new Error('missing trackviewContainer'); | 169 throw new Error('missing trackviewContainer'); |
149 } | 170 } |
150 }); | 171 }); |
| 172 document.addEventListener('keyup', this.onKeyUp_); |
| 173 }, |
| 174 |
| 175 detached() { |
| 176 document.removeEventListener('keyup', this.onKeyUp_); |
| 177 }, |
| 178 |
| 179 onMouseModeButtonClick_(e) { |
| 180 this.trackView_.mouseMode = tr.ui.b.MOUSE_SELECTOR_MODE[e.target.modeName]; |
| 181 this.updateMouseModeButtons_(); |
| 182 }, |
| 183 |
| 184 onKeyUp_(e) { |
| 185 // Keys dispatched to INPUT elements still bubble, even when they're |
| 186 // handled. So, skip any events that targeted the input element. |
| 187 if (e.path[0].tagName === 'INPUT') return; |
| 188 |
| 189 switch (String.fromCharCode(e.keyCode)) { |
| 190 case '1': |
| 191 this.trackView_.mouseMode = |
| 192 tr.ui.b.MOUSE_SELECTOR_MODE.SELECTION; |
| 193 break; |
| 194 case '2': |
| 195 this.trackView_.mouseMode = |
| 196 tr.ui.b.MOUSE_SELECTOR_MODE.PANSCAN; |
| 197 break; |
| 198 case '3': |
| 199 this.trackView_.mouseMode = tr.ui.b.MOUSE_SELECTOR_MODE.ZOOM; |
| 200 break; |
| 201 case '4': |
| 202 this.trackView_.mouseMode = tr.ui.b.MOUSE_SELECTOR_MODE.TIMING; |
| 203 break; |
| 204 } |
| 205 this.updateMouseModeButtons_(); |
| 206 }, |
| 207 |
| 208 updateMouseModeButtons_() { |
| 209 for (const icon of |
| 210 this.shadowRoot.querySelectorAll('tr-ui-b-mouse-mode-icon')) { |
| 211 icon.active = (this.trackView_.mouseMode === |
| 212 tr.ui.b.MOUSE_SELECTOR_MODE[icon.modeName]); |
| 213 } |
151 }, | 214 }, |
152 | 215 |
153 ready() { | 216 ready() { |
154 this.tabIndex = 0; // Let the timeline able to receive key events. | 217 this.tabIndex = 0; // Let the timeline able to receive key events. |
155 | 218 |
156 this.titleEl_ = this.$.title; | 219 this.titleEl_ = this.$.title; |
157 this.leftControlsEl_ = this.$.left_controls; | 220 this.leftControlsEl_ = this.$.left_controls; |
158 this.rightControlsEl_ = this.$.right_controls; | 221 this.rightControlsEl_ = this.$.right_controls; |
159 this.collapsingControlsEl_ = this.$.collapsing_controls; | 222 this.collapsingControlsEl_ = this.$.collapsing_controls; |
160 this.sidePanelContainer_ = this.$.side_panel_container; | 223 this.sidePanelContainer_ = this.$.side_panel_container; |
(...skipping 232 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
393 this.trackView_.brushingStateController = undefined; | 456 this.trackView_.brushingStateController = undefined; |
394 this.trackView_.detach(); | 457 this.trackView_.detach(); |
395 this.trackView_ = undefined; | 458 this.trackView_ = undefined; |
396 } | 459 } |
397 this.brushingStateController_.modelWillChange(); | 460 this.brushingStateController_.modelWillChange(); |
398 } | 461 } |
399 | 462 |
400 // Create new trackView if needed. | 463 // Create new trackView if needed. |
401 if (modelValid && !this.trackView_) { | 464 if (modelValid && !this.trackView_) { |
402 this.trackView_ = document.createElement('tr-ui-timeline-track-view'); | 465 this.trackView_ = document.createElement('tr-ui-timeline-track-view'); |
| 466 this.updateMouseModeButtons_(); |
403 this.trackView_.timelineView = this; | 467 this.trackView_.timelineView = this; |
404 | 468 |
405 this.trackView.brushingStateController = this.brushingStateController_; | 469 this.trackView.brushingStateController = this.brushingStateController_; |
406 | 470 |
407 Polymer.dom(this.trackViewContainer_).appendChild(this.trackView_); | 471 Polymer.dom(this.trackViewContainer_).appendChild(this.trackView_); |
408 this.trackView_.viewport.addEventListener( | 472 this.trackView_.viewport.addEventListener( |
409 'change', this.onViewportChanged_); | 473 'change', this.onViewportChanged_); |
410 } | 474 } |
411 | 475 |
412 // Set the model. | 476 // Set the model. |
(...skipping 133 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
546 toggleHighlightVSync_() { | 610 toggleHighlightVSync_() { |
547 this.highlightVSyncCheckbox_.checked = | 611 this.highlightVSyncCheckbox_.checked = |
548 !this.highlightVSyncCheckbox_.checked; | 612 !this.highlightVSyncCheckbox_.checked; |
549 }, | 613 }, |
550 | 614 |
551 setFindCtlText(string) { | 615 setFindCtlText(string) { |
552 this.findCtl_.setText(string); | 616 this.findCtl_.setText(string); |
553 } | 617 } |
554 }); | 618 }); |
555 </script> | 619 </script> |
OLD | NEW |