blob: a4035973f2eab7bfe8c80c4c897c3b527a9ff41d [file] [log] [blame]
Blink Reformat4c46d092018-04-07 15:32:371// Copyright 2017 The Chromium Authors. All rights reserved.
2// Use of this source code is governed by a BSD-style license that can be
3// found in the LICENSE file.
4
5Console.ConsoleSidebar = class extends UI.VBox {
Tim van der Lippeb45d9a02019-11-05 17:24:416 constructor() {
Blink Reformat4c46d092018-04-07 15:32:377 super(true);
8 this.setMinimumSize(125, 0);
9
10 this._tree = new UI.TreeOutlineInShadow();
11 this._tree.registerRequiredCSS('console/consoleSidebar.css');
12 this._tree.addEventListener(UI.TreeOutline.Events.ElementSelected, this._selectionChanged.bind(this));
13 this.contentElement.appendChild(this._tree.element);
14 /** @type {?UI.TreeElement} */
15 this._selectedTreeElement = null;
16 /** @type {!Array<!Console.ConsoleSidebar.FilterTreeElement>} */
17 this._treeElements = [];
18 const selectedFilterSetting = Common.settings.createSetting('console.sidebarSelectedFilter', null);
19
20 const Levels = SDK.ConsoleMessage.MessageLevel;
21 const consoleAPIParsedFilters = [{
22 key: Console.ConsoleFilter.FilterType.Source,
23 text: SDK.ConsoleMessage.MessageSource.ConsoleAPI,
24 negative: false
25 }];
26 this._appendGroup(
Christy Chenc891ec62019-10-09 00:31:0727 Console.ConsoleSidebar._groupName.All, [], Console.ConsoleFilter.allLevelsFilterValue(),
Tim van der Lippeb45d9a02019-11-05 17:24:4128 UI.Icon.create('mediumicon-list'), selectedFilterSetting);
Blink Reformat4c46d092018-04-07 15:32:3729 this._appendGroup(
Christy Chenc891ec62019-10-09 00:31:0730 Console.ConsoleSidebar._groupName.ConsoleAPI, consoleAPIParsedFilters,
Tim van der Lippeb45d9a02019-11-05 17:24:4131 Console.ConsoleFilter.allLevelsFilterValue(), UI.Icon.create('mediumicon-account-circle'),
Blink Reformat4c46d092018-04-07 15:32:3732 selectedFilterSetting);
33 this._appendGroup(
Christy Chenc891ec62019-10-09 00:31:0734 Console.ConsoleSidebar._groupName.Error, [], Console.ConsoleFilter.singleLevelMask(Levels.Error),
Tim van der Lippeb45d9a02019-11-05 17:24:4135 UI.Icon.create('mediumicon-error-circle'), selectedFilterSetting);
Blink Reformat4c46d092018-04-07 15:32:3736 this._appendGroup(
Christy Chenc891ec62019-10-09 00:31:0737 Console.ConsoleSidebar._groupName.Warning, [], Console.ConsoleFilter.singleLevelMask(Levels.Warning),
Tim van der Lippeb45d9a02019-11-05 17:24:4138 UI.Icon.create('mediumicon-warning-triangle'), selectedFilterSetting);
Blink Reformat4c46d092018-04-07 15:32:3739 this._appendGroup(
Christy Chenc891ec62019-10-09 00:31:0740 Console.ConsoleSidebar._groupName.Info, [], Console.ConsoleFilter.singleLevelMask(Levels.Info),
Tim van der Lippeb45d9a02019-11-05 17:24:4141 UI.Icon.create('mediumicon-info-circle'), selectedFilterSetting);
Blink Reformat4c46d092018-04-07 15:32:3742 this._appendGroup(
Christy Chenc891ec62019-10-09 00:31:0743 Console.ConsoleSidebar._groupName.Verbose, [], Console.ConsoleFilter.singleLevelMask(Levels.Verbose),
Tim van der Lippeb45d9a02019-11-05 17:24:4144 UI.Icon.create('mediumicon-bug'), selectedFilterSetting);
Blink Reformat4c46d092018-04-07 15:32:3745 const selectedTreeElementName = selectedFilterSetting.get();
46 const defaultTreeElement =
47 this._treeElements.find(x => x.name() === selectedTreeElementName) || this._treeElements[0];
48 defaultTreeElement.select();
49 }
50
51 /**
52 * @param {string} name
53 * @param {!Array<!TextUtils.FilterParser.ParsedFilter>} parsedFilters
54 * @param {!Object<string, boolean>} levelsMask
55 * @param {!Element} icon
Blink Reformat4c46d092018-04-07 15:32:3756 * @param {!Common.Setting} selectedFilterSetting
57 */
Tim van der Lippeb45d9a02019-11-05 17:24:4158 _appendGroup(name, parsedFilters, levelsMask, icon, selectedFilterSetting) {
Blink Reformat4c46d092018-04-07 15:32:3759 const filter = new Console.ConsoleFilter(name, parsedFilters, null, levelsMask);
Tim van der Lippeb45d9a02019-11-05 17:24:4160 const treeElement = new Console.ConsoleSidebar.FilterTreeElement(filter, icon, selectedFilterSetting);
Blink Reformat4c46d092018-04-07 15:32:3761 this._tree.appendChild(treeElement);
62 this._treeElements.push(treeElement);
63 }
64
65 clear() {
Tim van der Lippe1d6e57a2019-09-30 11:55:3466 for (const treeElement of this._treeElements) {
Blink Reformat4c46d092018-04-07 15:32:3767 treeElement.clear();
Tim van der Lippe1d6e57a2019-09-30 11:55:3468 }
Blink Reformat4c46d092018-04-07 15:32:3769 }
70
71 /**
72 * @param {!Console.ConsoleViewMessage} viewMessage
73 */
74 onMessageAdded(viewMessage) {
Tim van der Lippe1d6e57a2019-09-30 11:55:3475 for (const treeElement of this._treeElements) {
Blink Reformat4c46d092018-04-07 15:32:3776 treeElement.onMessageAdded(viewMessage);
Tim van der Lippe1d6e57a2019-09-30 11:55:3477 }
Blink Reformat4c46d092018-04-07 15:32:3778 }
79
80 /**
81 * @param {!Console.ConsoleViewMessage} viewMessage
82 * @return {boolean}
83 */
84 shouldBeVisible(viewMessage) {
Tim van der Lippe1d6e57a2019-09-30 11:55:3485 if (!this._selectedTreeElement) {
Blink Reformat4c46d092018-04-07 15:32:3786 return true;
Tim van der Lippe1d6e57a2019-09-30 11:55:3487 }
Blink Reformat4c46d092018-04-07 15:32:3788 return this._selectedTreeElement._filter.shouldBeVisible(viewMessage);
89 }
90
91 /**
92 * @param {!Common.Event} event
93 */
94 _selectionChanged(event) {
95 this._selectedTreeElement = /** @type {!UI.TreeElement} */ (event.data);
96 this.dispatchEventToListeners(Console.ConsoleSidebar.Events.FilterSelected);
97 }
98};
99
100/** @enum {symbol} */
101Console.ConsoleSidebar.Events = {
102 FilterSelected: Symbol('FilterSelected')
103};
104
105Console.ConsoleSidebar.URLGroupTreeElement = class extends UI.TreeElement {
106 /**
107 * @param {!Console.ConsoleFilter} filter
Blink Reformat4c46d092018-04-07 15:32:37108 */
Tim van der Lippeb45d9a02019-11-05 17:24:41109 constructor(filter) {
Blink Reformat4c46d092018-04-07 15:32:37110 super(filter.name);
111 this._filter = filter;
112 this._countElement = this.listItemElement.createChild('span', 'count');
113 const leadingIcons = [UI.Icon.create('largeicon-navigator-file')];
Blink Reformat4c46d092018-04-07 15:32:37114 this.setLeadingIcons(leadingIcons);
115 this._messageCount = 0;
116 }
117
118 incrementAndUpdateCounter() {
119 this._messageCount++;
120 this._countElement.textContent = this._messageCount;
121 }
122};
123
124Console.ConsoleSidebar.FilterTreeElement = class extends UI.TreeElement {
125 /**
126 * @param {!Console.ConsoleFilter} filter
127 * @param {!Element} icon
Blink Reformat4c46d092018-04-07 15:32:37128 * @param {!Common.Setting} selectedFilterSetting
129 */
Tim van der Lippeb45d9a02019-11-05 17:24:41130 constructor(filter, icon, selectedFilterSetting) {
Blink Reformat4c46d092018-04-07 15:32:37131 super(filter.name);
132 this._filter = filter;
Blink Reformat4c46d092018-04-07 15:32:37133 this._selectedFilterSetting = selectedFilterSetting;
134 /** @type {!Map<?string, !Console.ConsoleSidebar.URLGroupTreeElement>} */
135 this._urlTreeElements = new Map();
136 this.setLeadingIcons([icon]);
137 this._messageCount = 0;
138 this._updateCounter();
139 }
140
141 clear() {
142 this._urlTreeElements.clear();
143 this.removeChildren();
144 this._messageCount = 0;
145 this._updateCounter();
146 }
147
148 /**
149 * @return {string}
150 */
151 name() {
152 return this._filter.name;
153 }
154
155 /**
156 * @param {boolean=} selectedByUser
157 * @return {boolean}
158 * @override
159 */
160 onselect(selectedByUser) {
161 this._selectedFilterSetting.set(this._filter.name);
162 return super.onselect(selectedByUser);
163 }
164
165 _updateCounter() {
Christy Chenc891ec62019-10-09 00:31:07166 if (!this._messageCount) {
167 this.title = Console.ConsoleSidebar._groupNoMessageTitleMap.get(this._filter.name);
168 } else if (this._messageCount === 1) {
169 this.title = Console.ConsoleSidebar._groupSingularTitleMap.get(this._filter.name);
170 } else {
171 this.title =
172 String.sprintf(Console.ConsoleSidebar._groupPluralTitleMap.get(this._filter.name), this._messageCount);
173 }
174
Blink Reformat4c46d092018-04-07 15:32:37175 this.setExpandable(!!this.childCount());
176 }
177
178 /**
179 * @param {!Console.ConsoleViewMessage} viewMessage
180 */
181 onMessageAdded(viewMessage) {
182 const message = viewMessage.consoleMessage();
183 const shouldIncrementCounter = message.type !== SDK.ConsoleMessage.MessageType.Command &&
184 message.type !== SDK.ConsoleMessage.MessageType.Result && !message.isGroupMessage();
Tim van der Lippe1d6e57a2019-09-30 11:55:34185 if (!this._filter.shouldBeVisible(viewMessage) || !shouldIncrementCounter) {
Blink Reformat4c46d092018-04-07 15:32:37186 return;
Tim van der Lippe1d6e57a2019-09-30 11:55:34187 }
Blink Reformat4c46d092018-04-07 15:32:37188 const child = this._childElement(message.url);
189 child.incrementAndUpdateCounter();
190 this._messageCount++;
191 this._updateCounter();
192 }
193
194 /**
195 * @param {string=} url
196 * @return {!Console.ConsoleSidebar.URLGroupTreeElement}
197 */
198 _childElement(url) {
199 const urlValue = url || null;
200 let child = this._urlTreeElements.get(urlValue);
Tim van der Lippe1d6e57a2019-09-30 11:55:34201 if (child) {
Blink Reformat4c46d092018-04-07 15:32:37202 return child;
Tim van der Lippe1d6e57a2019-09-30 11:55:34203 }
Blink Reformat4c46d092018-04-07 15:32:37204
205 const filter = this._filter.clone();
206 const parsedURL = urlValue ? urlValue.asParsedURL() : null;
Tim van der Lippe1d6e57a2019-09-30 11:55:34207 if (urlValue) {
Blink Reformat4c46d092018-04-07 15:32:37208 filter.name = parsedURL ? parsedURL.displayName : urlValue;
Tim van der Lippe1d6e57a2019-09-30 11:55:34209 } else {
Blink Reformat4c46d092018-04-07 15:32:37210 filter.name = Common.UIString('<other>');
Tim van der Lippe1d6e57a2019-09-30 11:55:34211 }
Blink Reformat4c46d092018-04-07 15:32:37212 filter.parsedFilters.push({key: Console.ConsoleFilter.FilterType.Url, text: urlValue, negative: false});
Tim van der Lippeb45d9a02019-11-05 17:24:41213 child = new Console.ConsoleSidebar.URLGroupTreeElement(filter);
Tim van der Lippe1d6e57a2019-09-30 11:55:34214 if (urlValue) {
Blink Reformat4c46d092018-04-07 15:32:37215 child.tooltip = urlValue;
Tim van der Lippe1d6e57a2019-09-30 11:55:34216 }
Blink Reformat4c46d092018-04-07 15:32:37217 this._urlTreeElements.set(urlValue, child);
218 this.appendChild(child);
219 return child;
220 }
221};
222
223/** @enum {string} */
Christy Chenc891ec62019-10-09 00:31:07224Console.ConsoleSidebar._groupName = {
225 ConsoleAPI: 'user message',
226 All: 'message',
227 Error: 'error',
228 Warning: 'warning',
229 Info: 'info',
230 Verbose: 'verbose'
Blink Reformat4c46d092018-04-07 15:32:37231};
232
233/** @const {!Map<string, string>} */
Christy Chenc891ec62019-10-09 00:31:07234Console.ConsoleSidebar._groupSingularTitleMap = new Map([
235 [Console.ConsoleSidebar._groupName.ConsoleAPI, ls`1 user message`],
236 [Console.ConsoleSidebar._groupName.All, ls`1 message`], [Console.ConsoleSidebar._groupName.Error, ls`1 error`],
237 [Console.ConsoleSidebar._groupName.Warning, ls`1 warning`], [Console.ConsoleSidebar._groupName.Info, ls`1 info`],
238 [Console.ConsoleSidebar._groupName.Verbose, ls`1 verbose`]
239]);
240
241/** @const {!Map<string, string>} */
242Console.ConsoleSidebar._groupPluralTitleMap = new Map([
243 [Console.ConsoleSidebar._groupName.ConsoleAPI, ls`%d user messages`],
244 [Console.ConsoleSidebar._groupName.All, ls`%d messages`], [Console.ConsoleSidebar._groupName.Error, ls`%d errors`],
245 [Console.ConsoleSidebar._groupName.Warning, ls`%d warnings`], [Console.ConsoleSidebar._groupName.Info, ls`%d info`],
246 [Console.ConsoleSidebar._groupName.Verbose, ls`%d verbose`]
247]);
248
249/** @const {!Map<string, string>} */
250Console.ConsoleSidebar._groupNoMessageTitleMap = new Map([
251 [Console.ConsoleSidebar._groupName.ConsoleAPI, ls`No user messages`],
252 [Console.ConsoleSidebar._groupName.All, ls`No messages`], [Console.ConsoleSidebar._groupName.Error, ls`No errors`],
253 [Console.ConsoleSidebar._groupName.Warning, ls`No warnings`], [Console.ConsoleSidebar._groupName.Info, ls`No info`],
254 [Console.ConsoleSidebar._groupName.Verbose, ls`No verbose`]
Blink Reformat4c46d092018-04-07 15:32:37255]);