| OLD | NEW |
|---|
| 1 <!DOCTYPE html> | 1 <!DOCTYPE html> |
| 2 <!-- | 2 <!-- |
| 3 Copyright (c) 2014 The Chromium Authors. All rights reserved. | 3 Copyright (c) 2014 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/math/range.html"> | 8 <link rel="import" href="/tracing/base/math/range.html"> |
| 9 <link rel="import" href="/tracing/ui/side_panel/side_panel.html"> | 9 <link rel="import" href="/tracing/ui/side_panel/side_panel.html"> |
| 10 <link rel="import" href="/tracing/ui/side_panel/side_panel_registry.html"> | 10 <link rel="import" href="/tracing/ui/side_panel/side_panel_registry.html"> |
| (...skipping 30 matching lines...) Expand all Loading... |
| 41 background-color: rgb(236, 236, 236); | 41 background-color: rgb(236, 236, 236); |
| 42 border-left: 1px solid black; | 42 border-left: 1px solid black; |
| 43 cursor: default; | 43 cursor: default; |
| 44 display: -webkit-flex; | 44 display: -webkit-flex; |
| 45 min-width: 18px; /* workaround for flexbox and writing-mode mixing bug */ | 45 min-width: 18px; /* workaround for flexbox and writing-mode mixing bug */ |
| 46 padding: 10px 0 10px 0; | 46 padding: 10px 0 10px 0; |
| 47 font-size: 12px; | 47 font-size: 12px; |
| 48 } | 48 } |
| 49 | 49 |
| 50 tab-strip > tab-strip-label { | 50 tab-strip > tab-strip-label { |
| 51 flex-shrink: 0; |
| 51 -webkit-writing-mode: vertical-rl; | 52 -webkit-writing-mode: vertical-rl; |
| 53 white-space: nowrap; |
| 52 display: inline; | 54 display: inline; |
| 53 margin-right: 1px; | 55 margin-right: 1px; |
| 54 min-height: 20px; | 56 min-height: 20px; |
| 55 padding: 15px 3px 15px 1px; | 57 padding: 15px 3px 15px 1px; |
| 56 } | 58 } |
| 57 | 59 |
| 58 tab-strip > | 60 tab-strip > |
| 59 tab-strip-label:not([enabled]) { | 61 tab-strip-label:not([enabled]) { |
| 60 color: rgb(128, 128, 128); | 62 color: rgb(128, 128, 128); |
| 61 } | 63 } |
| (...skipping 142 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 204 } | 206 } |
| 205 } | 207 } |
| 206 return undefined; | 208 return undefined; |
| 207 }, | 209 }, |
| 208 | 210 |
| 209 updateContents_() { | 211 updateContents_() { |
| 210 const previouslyActivePanelType = this.activePanelType; | 212 const previouslyActivePanelType = this.activePanelType; |
| 211 | 213 |
| 212 Polymer.dom(this.tabStrip_).textContent = ''; | 214 Polymer.dom(this.tabStrip_).textContent = ''; |
| 213 const supportedPanelTypes = []; | 215 const supportedPanelTypes = []; |
| 216 const panelTypeInfos = |
| 217 tr.ui.side_panel.SidePanelRegistry.getAllRegisteredTypeInfos(); |
| 218 const unsupportedLabelEls = []; |
| 214 | 219 |
| 215 for (const panelTypeInfo of | 220 for (const panelTypeInfo of panelTypeInfos) { |
| 216 tr.ui.side_panel.SidePanelRegistry.getAllRegisteredTypeInfos()) { | |
| 217 const labelEl = document.createElement('tab-strip-label'); | 221 const labelEl = document.createElement('tab-strip-label'); |
| 218 const panel = panelTypeInfo.constructor(); | 222 const panel = panelTypeInfo.constructor(); |
| 219 const panelType = panel.tagName; | 223 const panelType = panel.tagName; |
| 220 | 224 |
| 221 Polymer.dom(labelEl).textContent = panel.textLabel; | 225 Polymer.dom(labelEl).textContent = panel.textLabel; |
| 222 labelEl.panelType = panelType; | 226 labelEl.panelType = panelType; |
| 223 | 227 |
| 224 const supported = panel.supportsModel(this.model); | 228 const supported = panel.supportsModel(this.model); |
| 225 if (this.model && supported.supported) { | 229 if (this.model && supported.supported) { |
| 226 supportedPanelTypes.push(panelType); | 230 supportedPanelTypes.push(panelType); |
| 227 Polymer.dom(labelEl).setAttribute('enabled', true); | 231 Polymer.dom(labelEl).setAttribute('enabled', true); |
| 228 labelEl.addEventListener('click', function(panelType) { | 232 labelEl.addEventListener('click', function(panelType) { |
| 229 this.activePanelType = | 233 this.activePanelType = |
| 230 this.activePanelType === panelType ? undefined : panelType; | 234 this.activePanelType === panelType ? undefined : panelType; |
| 231 }.bind(this, panelType)); | 235 }.bind(this, panelType)); |
| 236 Polymer.dom(this.tabStrip_).appendChild(labelEl); |
| 232 } else { | 237 } else { |
| 233 if (this.activePanel) { | 238 if (this.activePanel) { |
| 234 this.activePanelContainer_.removeChild(this.activePanel); | 239 this.activePanelContainer_.removeChild(this.activePanel); |
| 235 } | 240 } |
| 236 this.removeAttribute('expanded'); | 241 this.removeAttribute('expanded'); |
| 242 unsupportedLabelEls.push(labelEl); |
| 237 } | 243 } |
| 244 } |
| 245 |
| 246 // Labels do not shrink, so when the user drags the analysis-view up, the |
| 247 // bottom labels are obscured first. |
| 248 // Append all unsupported panel labels after all supported panel labels so |
| 249 // that unsupported panel labels are obscured first. |
| 250 for (const labelEl of unsupportedLabelEls) { |
| 238 Polymer.dom(this.tabStrip_).appendChild(labelEl); | 251 Polymer.dom(this.tabStrip_).appendChild(labelEl); |
| 239 } | 252 } |
| 240 | 253 |
| 241 // Restore the active panel, or collapse | 254 // Restore the active panel, or collapse |
| 242 if (previouslyActivePanelType && | 255 if (previouslyActivePanelType && |
| 243 supportedPanelTypes.includes(previouslyActivePanelType)) { | 256 supportedPanelTypes.includes(previouslyActivePanelType)) { |
| 244 this.activePanelType = previouslyActivePanelType; | 257 this.activePanelType = previouslyActivePanelType; |
| 245 Polymer.dom(this).setAttribute('expanded', true); | 258 Polymer.dom(this).setAttribute('expanded', true); |
| 246 } else { | 259 } else { |
| 247 if (this.activePanel) { | 260 if (this.activePanel) { |
| (...skipping 11 matching lines...) Expand all Loading... |
| 259 if (range === undefined) { | 272 if (range === undefined) { |
| 260 throw new Error('Must not be undefined'); | 273 throw new Error('Must not be undefined'); |
| 261 } | 274 } |
| 262 this.rangeOfInterest_ = range; | 275 this.rangeOfInterest_ = range; |
| 263 if (this.activePanel) { | 276 if (this.activePanel) { |
| 264 this.activePanel.rangeOfInterest = range; | 277 this.activePanel.rangeOfInterest = range; |
| 265 } | 278 } |
| 266 } | 279 } |
| 267 }); | 280 }); |
| 268 </script> | 281 </script> |
| OLD | NEW |
|---|
Chromium Code Reviews
Issue 3001613002:
Fix trace-viewer's side-panel-container's tab-strip. (Closed)
