OLD | NEW |
1 // Copyright (c) 2013, the Dart project authors. Please see the AUTHORS file | 1 // Copyright (c) 2013, the Dart project authors. Please see the AUTHORS file |
2 // for details. All rights reserved. Use of this source code is governed by a | 2 // for details. All rights reserved. Use of this source code is governed by a |
3 // BSD-style license that can be found in the LICENSE file. | 3 // BSD-style license that can be found in the LICENSE file. |
4 | 4 |
5 import 'dart:async'; | 5 import 'dart:async'; |
6 import 'dart:html'; | 6 import 'dart:html'; |
7 import 'package:observatory/models.dart' as M; | 7 import 'package:observatory/models.dart' as M; |
8 import 'package:observatory/src/elements/helpers/rendering_scheduler.dart'; | 8 import 'package:observatory/src/elements/helpers/rendering_scheduler.dart'; |
9 import 'package:observatory/src/elements/helpers/tag.dart'; | 9 import 'package:observatory/src/elements/helpers/tag.dart'; |
10 | 10 |
11 enum ProfileTreeMode { | 11 enum ProfileTreeMode { code, function, } |
12 code, | |
13 function, | |
14 } | |
15 | 12 |
16 class StackTraceTreeConfigChangedEvent { | 13 class StackTraceTreeConfigChangedEvent { |
17 final StackTraceTreeConfigElement element; | 14 final StackTraceTreeConfigElement element; |
18 StackTraceTreeConfigChangedEvent(this.element); | 15 StackTraceTreeConfigChangedEvent(this.element); |
19 } | 16 } |
20 | 17 |
21 class StackTraceTreeConfigElement extends HtmlElement implements Renderable { | 18 class StackTraceTreeConfigElement extends HtmlElement implements Renderable { |
22 static const tag = | 19 static const tag = |
23 const Tag<StackTraceTreeConfigElement>('stack-trace-tree-config'); | 20 const Tag<StackTraceTreeConfigElement>('stack-trace-tree-config'); |
24 | 21 |
25 RenderingScheduler<StackTraceTreeConfigElement> _r; | 22 RenderingScheduler<StackTraceTreeConfigElement> _r; |
26 | 23 |
27 Stream<RenderedEvent<StackTraceTreeConfigElement>> get onRendered => | 24 Stream<RenderedEvent<StackTraceTreeConfigElement>> get onRendered => |
28 _r.onRendered; | 25 _r.onRendered; |
29 | 26 |
30 StreamController<StackTraceTreeConfigChangedEvent> _onModeChange = | 27 StreamController<StackTraceTreeConfigChangedEvent> _onModeChange = |
31 new StreamController<StackTraceTreeConfigChangedEvent>.broadcast(); | 28 new StreamController<StackTraceTreeConfigChangedEvent>.broadcast(); |
32 StreamController<StackTraceTreeConfigChangedEvent> _onDirectionChange = | 29 StreamController<StackTraceTreeConfigChangedEvent> _onDirectionChange = |
33 new StreamController<StackTraceTreeConfigChangedEvent>.broadcast(); | 30 new StreamController<StackTraceTreeConfigChangedEvent>.broadcast(); |
34 StreamController<StackTraceTreeConfigChangedEvent> _onFilterChange = | 31 StreamController<StackTraceTreeConfigChangedEvent> _onFilterChange = |
35 new StreamController<StackTraceTreeConfigChangedEvent>.broadcast(); | 32 new StreamController<StackTraceTreeConfigChangedEvent>.broadcast(); |
36 Stream<StackTraceTreeConfigChangedEvent> get onModeChange => | 33 Stream<StackTraceTreeConfigChangedEvent> get onModeChange => |
37 _onModeChange.stream; | 34 _onModeChange.stream; |
38 Stream<StackTraceTreeConfigChangedEvent> get onDirectionChange => | 35 Stream<StackTraceTreeConfigChangedEvent> get onDirectionChange => |
(...skipping 18 matching lines...) Expand all Loading... |
57 set showMode(bool value) => _showMode = _r.checkAndReact(_showMode, value); | 54 set showMode(bool value) => _showMode = _r.checkAndReact(_showMode, value); |
58 set showDirection(bool value) => | 55 set showDirection(bool value) => |
59 _showDirection = _r.checkAndReact(_showDirection, value); | 56 _showDirection = _r.checkAndReact(_showDirection, value); |
60 set showFilter(bool value) => | 57 set showFilter(bool value) => |
61 _showFilter = _r.checkAndReact(_showFilter, value); | 58 _showFilter = _r.checkAndReact(_showFilter, value); |
62 set mode(ProfileTreeMode value) => _mode = _r.checkAndReact(_mode, value); | 59 set mode(ProfileTreeMode value) => _mode = _r.checkAndReact(_mode, value); |
63 set direction(M.ProfileTreeDirection value) => | 60 set direction(M.ProfileTreeDirection value) => |
64 _direction = _r.checkAndReact(_direction, value); | 61 _direction = _r.checkAndReact(_direction, value); |
65 set filter(String value) => _filter = _r.checkAndReact(_filter, value); | 62 set filter(String value) => _filter = _r.checkAndReact(_filter, value); |
66 | 63 |
67 factory StackTraceTreeConfigElement({bool showMode: true, | 64 factory StackTraceTreeConfigElement( |
68 bool showDirection: true, bool showFilter: true, String filter: '', | 65 {bool showMode: true, |
| 66 bool showDirection: true, |
| 67 bool showFilter: true, |
| 68 String filter: '', |
69 ProfileTreeMode mode: ProfileTreeMode.function, | 69 ProfileTreeMode mode: ProfileTreeMode.function, |
70 M.ProfileTreeDirection direction: M.ProfileTreeDirection.exclusive, | 70 M.ProfileTreeDirection direction: M.ProfileTreeDirection.exclusive, |
71 RenderingQueue queue}) { | 71 RenderingQueue queue}) { |
72 assert(showMode != null); | 72 assert(showMode != null); |
73 assert(showDirection != null); | 73 assert(showDirection != null); |
74 assert(showFilter != null); | 74 assert(showFilter != null); |
75 assert(mode != null); | 75 assert(mode != null); |
76 assert(direction != null); | 76 assert(direction != null); |
77 assert(filter != null); | 77 assert(filter != null); |
78 StackTraceTreeConfigElement e = document.createElement(tag.name); | 78 StackTraceTreeConfigElement e = document.createElement(tag.name); |
(...skipping 10 matching lines...) Expand all Loading... |
89 StackTraceTreeConfigElement.created() : super.created(); | 89 StackTraceTreeConfigElement.created() : super.created(); |
90 | 90 |
91 @override | 91 @override |
92 void attached() { | 92 void attached() { |
93 super.attached(); | 93 super.attached(); |
94 _r.enable(); | 94 _r.enable(); |
95 } | 95 } |
96 | 96 |
97 @override | 97 @override |
98 void detached() { | 98 void detached() { |
99 super.detached(); _r.disable(notify: true); | 99 super.detached(); |
| 100 _r.disable(notify: true); |
100 children = const []; | 101 children = const []; |
101 } | 102 } |
102 | 103 |
103 void render() { | 104 void render() { |
104 children = [ | 105 children = [ |
105 new DivElement()..classes = ['content-centered-big'] | 106 new DivElement() |
| 107 ..classes = ['content-centered-big'] |
106 ..children = [ | 108 ..children = [ |
107 new HeadingElement.h2()..text = 'Tree display', | 109 new HeadingElement.h2()..text = 'Tree display', |
108 new HRElement(), | 110 new HRElement(), |
109 new DivElement()..classes = ['row'] | 111 new DivElement() |
| 112 ..classes = ['row'] |
110 ..children = [ | 113 ..children = [ |
111 new DivElement()..classes = ['memberList'] | 114 new DivElement() |
| 115 ..classes = ['memberList'] |
112 ..children = _createMembers() | 116 ..children = _createMembers() |
113 ] | 117 ] |
114 ] | 118 ] |
115 ]; | 119 ]; |
116 } | 120 } |
117 | 121 |
118 List<Element> _createMembers() { | 122 List<Element> _createMembers() { |
119 var members = <Element>[]; | 123 var members = <Element>[]; |
120 if (_showMode) { | 124 if (_showMode) { |
121 members.add( | 125 members.add(new DivElement() |
122 new DivElement()..classes = ['memberItem'] | 126 ..classes = ['memberItem'] |
123 ..children = [ | 127 ..children = [ |
124 new DivElement()..classes = ['memberName']..text = 'Mode', | 128 new DivElement() |
125 new DivElement()..classes = ['memberValue'] | 129 ..classes = ['memberName'] |
126 ..children = _createModeSelect() | 130 ..text = 'Mode', |
127 ] | 131 new DivElement() |
128 ); | 132 ..classes = ['memberValue'] |
| 133 ..children = _createModeSelect() |
| 134 ]); |
129 } | 135 } |
130 if (_showDirection) { | 136 if (_showDirection) { |
131 members.add( | 137 members.add(new DivElement() |
132 new DivElement()..classes = ['memberItem'] | 138 ..classes = ['memberItem'] |
133 ..children = [ | 139 ..children = [ |
134 new DivElement()..classes = ['memberName'] | 140 new DivElement() |
135 ..text = 'Call Tree Direction', | 141 ..classes = ['memberName'] |
136 new SpanElement()..classes = ['memberValue'] | 142 ..text = 'Call Tree Direction', |
137 ..children = _createDirectionSelect() | 143 new SpanElement() |
138 ] | 144 ..classes = ['memberValue'] |
139 ); | 145 ..children = _createDirectionSelect() |
| 146 ]); |
140 } | 147 } |
141 if (showFilter) { | 148 if (showFilter) { |
142 members.add( | 149 members.add(new DivElement() |
143 new DivElement()..classes = ['memberItem'] | 150 ..classes = ['memberItem'] |
144 ..children = [ | 151 ..children = [ |
145 new DivElement()..classes = ['memberName'] | 152 new DivElement() |
146 ..text = 'Call Tree Filter' | 153 ..classes = ['memberName'] |
147 ..title = 'case-sensitive substring match', | 154 ..text = 'Call Tree Filter' |
148 new SpanElement()..classes = ['memberValue'] | 155 ..title = 'case-sensitive substring match', |
149 ..children = _createFilter() | 156 new SpanElement() |
150 ] | 157 ..classes = ['memberValue'] |
151 ); | 158 ..children = _createFilter() |
| 159 ]); |
152 } | 160 } |
153 return members; | 161 return members; |
154 } | 162 } |
155 | 163 |
156 List<Element> _createModeSelect() { | 164 List<Element> _createModeSelect() { |
157 var s; | 165 var s; |
158 return [ | 166 return [ |
159 s = new SelectElement()..classes = ['mode-select'] | 167 s = new SelectElement() |
| 168 ..classes = ['mode-select'] |
160 ..value = modeToString(_mode) | 169 ..value = modeToString(_mode) |
161 ..children = ProfileTreeMode.values.map((mode) { | 170 ..children = ProfileTreeMode.values.map((mode) { |
162 return new OptionElement(value : modeToString(mode), | 171 return new OptionElement( |
163 selected: _mode == mode) | 172 value: modeToString(mode), |
164 ..text = modeToString(mode); | 173 selected: _mode == mode)..text = modeToString(mode); |
165 }).toList(growable: false) | 174 }).toList(growable: false) |
166 ..onChange.listen((_) { | 175 ..onChange.listen((_) { |
167 _mode = ProfileTreeMode.values[s.selectedIndex]; | 176 _mode = ProfileTreeMode.values[s.selectedIndex]; |
168 }) | 177 }) |
169 ..onChange.map(_toEvent).listen(_triggerModeChange), | 178 ..onChange.map(_toEvent).listen(_triggerModeChange), |
170 ]; | 179 ]; |
171 } | 180 } |
172 | 181 |
173 List<Element> _createDirectionSelect() { | 182 List<Element> _createDirectionSelect() { |
174 var s; | 183 var s; |
175 return [ | 184 return [ |
176 s = new SelectElement()..classes = ['direction-select'] | 185 s = new SelectElement() |
| 186 ..classes = ['direction-select'] |
177 ..value = directionToString(_direction) | 187 ..value = directionToString(_direction) |
178 ..children = M.ProfileTreeDirection.values.map((direction) { | 188 ..children = M.ProfileTreeDirection.values.map((direction) { |
179 return new OptionElement(value: directionToString(direction), | 189 return new OptionElement( |
180 selected: _direction == direction) | 190 value: directionToString(direction), |
181 ..text = directionToString(direction); | 191 selected: _direction == direction) |
182 }).toList(growable: false) | 192 ..text = directionToString(direction); |
| 193 }).toList(growable: false) |
183 ..onChange.listen((_) { | 194 ..onChange.listen((_) { |
184 _direction = M.ProfileTreeDirection.values[s.selectedIndex]; | 195 _direction = M.ProfileTreeDirection.values[s.selectedIndex]; |
185 }) | 196 }) |
186 ..onChange.map(_toEvent).listen(_triggerDirectionChange), | 197 ..onChange.map(_toEvent).listen(_triggerDirectionChange), |
187 new SpanElement()..text = 'Tree is rooted at ' + | 198 new SpanElement() |
188 (_direction == 'Down' ? '"main"' : 'function / code') + | 199 ..text = 'Tree is rooted at ' + |
189 '. Child nodes are callers.' | 200 (_direction == 'Down' ? '"main"' : 'function / code') + |
| 201 '. Child nodes are callers.' |
190 ]; | 202 ]; |
191 } | 203 } |
192 | 204 |
193 List<Element> _createFilter(){ | 205 List<Element> _createFilter() { |
194 var t; | 206 var t; |
195 return [ | 207 return [ |
196 t = new TextInputElement()..placeholder = 'Search filter' | 208 t = new TextInputElement() |
197 ..value = filter | 209 ..placeholder = 'Search filter' |
198 ..onChange.listen((_) { _filter = t.value; }) | 210 ..value = filter |
199 ..onChange.map(_toEvent).listen(_triggerFilterChange) | 211 ..onChange.listen((_) { |
| 212 _filter = t.value; |
| 213 }) |
| 214 ..onChange.map(_toEvent).listen(_triggerFilterChange) |
200 ]; | 215 ]; |
201 } | 216 } |
202 | 217 |
203 static String modeToString(ProfileTreeMode mode) { | 218 static String modeToString(ProfileTreeMode mode) { |
204 switch (mode) { | 219 switch (mode) { |
205 case ProfileTreeMode.code: return 'Code'; | 220 case ProfileTreeMode.code: |
206 case ProfileTreeMode.function: return 'Function'; | 221 return 'Code'; |
| 222 case ProfileTreeMode.function: |
| 223 return 'Function'; |
207 } | 224 } |
208 throw new Exception('Unknown ProfileTreeMode'); | 225 throw new Exception('Unknown ProfileTreeMode'); |
209 } | 226 } |
210 | 227 |
211 static String directionToString(M.ProfileTreeDirection direction) { | 228 static String directionToString(M.ProfileTreeDirection direction) { |
212 switch (direction) { | 229 switch (direction) { |
213 case M.ProfileTreeDirection.inclusive: return 'Top down'; | 230 case M.ProfileTreeDirection.inclusive: |
214 case M.ProfileTreeDirection.exclusive: return 'Bottom up'; | 231 return 'Top down'; |
| 232 case M.ProfileTreeDirection.exclusive: |
| 233 return 'Bottom up'; |
215 } | 234 } |
216 throw new Exception('Unknown ProfileTreeDirection'); | 235 throw new Exception('Unknown ProfileTreeDirection'); |
217 } | 236 } |
218 | 237 |
219 StackTraceTreeConfigChangedEvent _toEvent(_) { | 238 StackTraceTreeConfigChangedEvent _toEvent(_) { |
220 return new StackTraceTreeConfigChangedEvent(this); | 239 return new StackTraceTreeConfigChangedEvent(this); |
221 } | 240 } |
222 | 241 |
223 void _triggerModeChange(e) => _onModeChange.add(e); | 242 void _triggerModeChange(e) => _onModeChange.add(e); |
224 void _triggerDirectionChange(e) => _onDirectionChange.add(e); | 243 void _triggerDirectionChange(e) => _onDirectionChange.add(e); |
225 void _triggerFilterChange(e) => _onFilterChange.add(e); | 244 void _triggerFilterChange(e) => _onFilterChange.add(e); |
226 | |
227 | |
228 } | 245 } |
OLD | NEW |