| OLD | NEW |
|---|
| (Empty) |
| 1 <!DOCTYPE html> | |
| 2 <!-- | |
| 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 | |
| 5 found in the LICENSE file. | |
| 6 --> | |
| 7 | |
| 8 <link rel="stylesheet" href="/tracing/ui/base/list_and_associated_view.css"> | |
| 9 | |
| 10 <link rel="import" href="/tracing/ui/base/list_view.html"> | |
| 11 <link rel="import" href="/tracing/ui/base/ui.html"> | |
| 12 | |
| 13 <script> | |
| 14 'use strict'; | |
| 15 | |
| 16 /** | |
| 17 * @fileoverview A list of things, and a viewer for the currently selected | |
| 18 * thing. | |
| 19 */ | |
| 20 tr.exportTo('tr.ui.b', function() { | |
| 21 /** | |
| 22 * @constructor | |
| 23 */ | |
| 24 const ListAndAssociatedView = tr.ui.b.define('x-list-and-associated-view'); | |
| 25 ListAndAssociatedView.prototype = { | |
| 26 __proto__: HTMLDivElement.prototype, | |
| 27 | |
| 28 decorate() { | |
| 29 this.list_ = undefined; | |
| 30 this.listProperty_ = undefined; | |
| 31 this.view_ = undefined; | |
| 32 this.viewProperty_ = undefined; | |
| 33 this.listView_ = new tr.ui.b.ListView(); | |
| 34 this.listView_.addEventListener('selection-changed', | |
| 35 this.onSelectionChanged_.bind(this)); | |
| 36 this.placeholder_ = document.createElement('div'); | |
| 37 Polymer.dom(this).appendChild(this.listView_); | |
| 38 Polymer.dom(this).appendChild(this.placeholder_); | |
| 39 }, | |
| 40 | |
| 41 get listView() { | |
| 42 return this.listView_; | |
| 43 }, | |
| 44 | |
| 45 get list() { | |
| 46 return this.list_; | |
| 47 }, | |
| 48 | |
| 49 set list(list) { | |
| 50 this.list_ = list; | |
| 51 this.updateChildren_(); | |
| 52 }, | |
| 53 | |
| 54 get listProperty() { | |
| 55 return this.listProperty_; | |
| 56 }, | |
| 57 | |
| 58 set listProperty(listProperty) { | |
| 59 this.listProperty_ = listProperty; | |
| 60 this.updateChildren_(); | |
| 61 }, | |
| 62 | |
| 63 get view() { | |
| 64 return this.view_; | |
| 65 }, | |
| 66 | |
| 67 set view(view) { | |
| 68 this.view_ = view; | |
| 69 this.updateChildren_(); | |
| 70 }, | |
| 71 | |
| 72 get viewProperty() { | |
| 73 return this.viewProperty_; | |
| 74 }, | |
| 75 | |
| 76 set viewProperty(viewProperty) { | |
| 77 this.viewProperty_ = viewProperty; | |
| 78 this.updateChildren_(); | |
| 79 }, | |
| 80 | |
| 81 updateChildren_() { | |
| 82 const complete = this.list_ && | |
| 83 this.listProperty_ && | |
| 84 this.view_ && | |
| 85 this.viewProperty_; | |
| 86 if (!complete) { | |
| 87 this.replaceChild(this.placeholder_, | |
| 88 this.children[1]); | |
| 89 return; | |
| 90 } | |
| 91 | |
| 92 for (let i = 0; i < this.list_.length; i++) { | |
| 93 let itemEl; | |
| 94 if (i >= this.listView_.children.length) { | |
| 95 itemEl = document.createElement('div'); | |
| 96 Polymer.dom(this.listView_).appendChild(itemEl); | |
| 97 } else { | |
| 98 itemEl = this.listView_.children[i]; | |
| 99 } | |
| 100 itemEl.item = this.list_[i]; | |
| 101 const getter = this.list_[i].__lookupGetter__(this.listProperty_); | |
| 102 if (getter) { | |
| 103 Polymer.dom(itemEl).textContent = getter.call(this.list_[i]); | |
| 104 } else { | |
| 105 Polymer.dom(itemEl).textContent = this.list_[i][this.listProperty_]; | |
| 106 } | |
| 107 } | |
| 108 | |
| 109 if (this.children[1] === this.placeholder_) { | |
| 110 this.replaceChild(this.view_, | |
| 111 this.children[1]); | |
| 112 } | |
| 113 if (this.listView_.children.length && | |
| 114 !this.listView_.selectedElement) { | |
| 115 this.listView_.selectedElement = this.listView_.children[0]; | |
| 116 } | |
| 117 }, | |
| 118 | |
| 119 onSelectionChanged_(e) { | |
| 120 let setter = this.view_.__lookupSetter__(this.viewProperty_); | |
| 121 if (!setter) { | |
| 122 const prop = this.viewProperty_; | |
| 123 setter = function(value) { this[prop] = value; }; | |
| 124 } | |
| 125 if (this.listView_.selectedElement) { | |
| 126 setter.call(this.view_, | |
| 127 this.listView_.selectedElement.item); | |
| 128 } else { | |
| 129 setter.call(this.view_, | |
| 130 undefined); | |
| 131 } | |
| 132 } | |
| 133 }; | |
| 134 | |
| 135 return { | |
| 136 ListAndAssociatedView, | |
| 137 }; | |
| 138 }); | |
| 139 </script> | |
| OLD | NEW |
|---|
Chromium Code Reviews
Issue 3017523002:
Fix uses of /deep/ in trace viewer. (Closed)
