Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(149)

Side by Side Diff: third_party/WebKit/Source/devtools/front_end/ui/SuggestBox.js

Issue 1855363002: DevTools: [ux regression] There is no way to clear console history. (Closed) Base URL: https://chromium.googlesource.com/chromium/src.git@2661
Patch Set: Created 4 years, 8 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch
OLDNEW
1 /* 1 /*
2 * Copyright (C) 2013 Google Inc. All rights reserved. 2 * Copyright (C) 2013 Google Inc. All rights reserved.
3 * 3 *
4 * Redistribution and use in source and binary forms, with or without 4 * Redistribution and use in source and binary forms, with or without
5 * modification, are permitted provided that the following conditions are 5 * modification, are permitted provided that the following conditions are
6 * met: 6 * met:
7 * 7 *
8 * * Redistributions of source code must retain the above copyright 8 * * Redistributions of source code must retain the above copyright
9 * notice, this list of conditions and the following disclaimer. 9 * notice, this list of conditions and the following disclaimer.
10 * * Redistributions in binary form must reproduce the above 10 * * Redistributions in binary form must reproduce the above
(...skipping 52 matching lines...) Expand 10 before | Expand all | Expand 10 after
63 this._maybeHideBound = this._maybeHide.bind(this); 63 this._maybeHideBound = this._maybeHide.bind(this);
64 this._container = createElementWithClass("div", "suggest-box-container"); 64 this._container = createElementWithClass("div", "suggest-box-container");
65 this._element = this._container.createChild("div", "suggest-box"); 65 this._element = this._container.createChild("div", "suggest-box");
66 this._element.addEventListener("mousedown", this._onBoxMouseDown.bind(this), true); 66 this._element.addEventListener("mousedown", this._onBoxMouseDown.bind(this), true);
67 this._detailsPopup = this._container.createChild("div", "suggest-box details -popup monospace"); 67 this._detailsPopup = this._container.createChild("div", "suggest-box details -popup monospace");
68 this._detailsPopup.classList.add("hidden"); 68 this._detailsPopup.classList.add("hidden");
69 this._asyncDetailsCallback = null; 69 this._asyncDetailsCallback = null;
70 this._asyncDetailsPromises = /** @type {!Map<number, !Promise>} */ ({}); 70 this._asyncDetailsPromises = /** @type {!Map<number, !Promise>} */ ({});
71 } 71 }
72 72
73 /**
74 * @typedef Array.<{title: string, className: (string|undefined)}>
75 */
76 WebInspector.SuggestBox.Suggestions;
77
73 WebInspector.SuggestBox.prototype = { 78 WebInspector.SuggestBox.prototype = {
74 /** 79 /**
75 * @return {boolean} 80 * @return {boolean}
76 */ 81 */
77 visible: function() 82 visible: function()
78 { 83 {
79 return !!this._container.parentElement; 84 return !!this._container.parentElement;
80 }, 85 },
81 86
82 /** 87 /**
(...skipping 149 matching lines...) Expand 10 before | Expand all | Expand 10 after
232 _onItemMouseDown: function(event) 237 _onItemMouseDown: function(event)
233 { 238 {
234 this._selectedElement = event.currentTarget; 239 this._selectedElement = event.currentTarget;
235 this.acceptSuggestion(); 240 this.acceptSuggestion();
236 event.consume(true); 241 event.consume(true);
237 }, 242 },
238 243
239 /** 244 /**
240 * @param {string} prefix 245 * @param {string} prefix
241 * @param {string} text 246 * @param {string} text
247 * @param {string|undefined} className
242 * @param {number} index 248 * @param {number} index
243 */ 249 */
244 _createItemElement: function(prefix, text, index) 250 _createItemElement: function(prefix, text, className, index)
245 { 251 {
246 var element = createElementWithClass("div", "suggest-box-content-item so urce-code"); 252 var element = createElementWithClass("div", "suggest-box-content-item so urce-code " + (className || ""));
247 element.tabIndex = -1; 253 element.tabIndex = -1;
248 if (prefix && prefix.length && !text.indexOf(prefix)) { 254 if (prefix && prefix.length && !text.indexOf(prefix)) {
249 element.createChild("span", "prefix").textContent = prefix; 255 element.createChild("span", "prefix").textContent = prefix;
250 element.createChild("span", "suffix").textContent = text.substring(p refix.length).trimEnd(50); 256 element.createChild("span", "suffix").textContent = text.substring(p refix.length).trimEnd(50);
251 } else { 257 } else {
252 element.createChild("span", "suffix").textContent = text.trimEnd(50) ; 258 element.createChild("span", "suffix").textContent = text.trimEnd(50) ;
253 } 259 }
254 element.__fullValue = text; 260 element.__fullValue = text;
255 element.createChild("span", "spacer"); 261 element.createChild("span", "spacer");
256 element.addEventListener("mousedown", this._onItemMouseDown.bind(this), false); 262 element.addEventListener("mousedown", this._onItemMouseDown.bind(this), false);
257 return element; 263 return element;
258 }, 264 },
259 265
260 /** 266 /**
261 * @param {!Array.<string>} items 267 * @param {!WebInspector.SuggestBox.Suggestions} items
262 * @param {string} userEnteredText 268 * @param {string} userEnteredText
263 * @param {function(number): !Promise<{detail:string, description:string}>=} asyncDetails 269 * @param {function(number): !Promise<{detail:string, description:string}>=} asyncDetails
264 */ 270 */
265 _updateItems: function(items, userEnteredText, asyncDetails) 271 _updateItems: function(items, userEnteredText, asyncDetails)
266 { 272 {
267 this._length = items.length; 273 this._length = items.length;
268 this._asyncDetailsPromises = {}; 274 this._asyncDetailsPromises = {};
269 this._asyncDetailsCallback = asyncDetails; 275 this._asyncDetailsCallback = asyncDetails;
270 this._element.removeChildren(); 276 this._element.removeChildren();
271 delete this._selectedElement; 277 delete this._selectedElement;
272 278
273 for (var i = 0; i < items.length; ++i) { 279 for (var i = 0; i < items.length; ++i) {
274 var item = items[i]; 280 var item = items[i];
275 var currentItemElement = this._createItemElement(userEnteredText, it em, i); 281 var currentItemElement = this._createItemElement(userEnteredText, it em.title, item.className, i);
276 this._element.appendChild(currentItemElement); 282 this._element.appendChild(currentItemElement);
277 } 283 }
278 }, 284 },
279 285
280 /** 286 /**
281 * @param {number} index 287 * @param {number} index
282 * @return {!Promise<({detail: string, description: string}|undefined)>} 288 * @return {!Promise<({detail: string, description: string}|undefined)>}
283 */ 289 */
284 _asyncDetails: function(index) 290 _asyncDetails: function(index)
285 { 291 {
(...skipping 44 matching lines...) Expand 10 before | Expand all | Expand 10 after
330 * @this {WebInspector.SuggestBox} 336 * @this {WebInspector.SuggestBox}
331 */ 337 */
332 function showDetails(details) 338 function showDetails(details)
333 { 339 {
334 if (elem === this._selectedElement) 340 if (elem === this._selectedElement)
335 this._showDetailsPopup(details); 341 this._showDetailsPopup(details);
336 } 342 }
337 }, 343 },
338 344
339 /** 345 /**
340 * @param {!Array.<string>} completions 346 * @param {!WebInspector.SuggestBox.Suggestions} completions
341 * @param {boolean} canShowForSingleItem 347 * @param {boolean} canShowForSingleItem
342 * @param {string} userEnteredText 348 * @param {string} userEnteredText
343 */ 349 */
344 _canShowBox: function(completions, canShowForSingleItem, userEnteredText) 350 _canShowBox: function(completions, canShowForSingleItem, userEnteredText)
345 { 351 {
346 if (!completions || !completions.length) 352 if (!completions || !completions.length)
347 return false; 353 return false;
348 354
349 if (completions.length > 1) 355 if (completions.length > 1)
350 return true; 356 return true;
351 357
352 // Do not show a single suggestion if it is the same as user-entered pre fix, even if allowed to show single-item suggest boxes. 358 // Do not show a single suggestion if it is the same as user-entered pre fix, even if allowed to show single-item suggest boxes.
353 return canShowForSingleItem && completions[0] !== userEnteredText; 359 return canShowForSingleItem && completions[0].title !== userEnteredText;
354 }, 360 },
355 361
356 _ensureRowCountPerViewport: function() 362 _ensureRowCountPerViewport: function()
357 { 363 {
358 if (this._rowCountPerViewport) 364 if (this._rowCountPerViewport)
359 return; 365 return;
360 if (!this._element.firstChild) 366 if (!this._element.firstChild)
361 return; 367 return;
362 368
363 this._rowCountPerViewport = Math.floor(this._element.offsetHeight / this ._element.firstChild.offsetHeight); 369 this._rowCountPerViewport = Math.floor(this._element.offsetHeight / this ._element.firstChild.offsetHeight);
364 }, 370 },
365 371
366 /** 372 /**
367 * @param {!AnchorBox} anchorBox 373 * @param {!AnchorBox} anchorBox
368 * @param {!Array.<string>} completions 374 * @param {!WebInspector.SuggestBox.Suggestions} completions
369 * @param {number} selectedIndex 375 * @param {number} selectedIndex
370 * @param {boolean} canShowForSingleItem 376 * @param {boolean} canShowForSingleItem
371 * @param {string} userEnteredText 377 * @param {string} userEnteredText
372 * @param {function(number): !Promise<{detail:string, description:string}>=} asyncDetails 378 * @param {function(number): !Promise<{detail:string, description:string}>=} asyncDetails
373 */ 379 */
374 updateSuggestions: function(anchorBox, completions, selectedIndex, canShowFo rSingleItem, userEnteredText, asyncDetails) 380 updateSuggestions: function(anchorBox, completions, selectedIndex, canShowFo rSingleItem, userEnteredText, asyncDetails)
375 { 381 {
376 if (this._canShowBox(completions, canShowForSingleItem, userEnteredText) ) { 382 if (this._canShowBox(completions, canShowForSingleItem, userEnteredText) ) {
377 this._updateItems(completions, userEnteredText, asyncDetails); 383 this._updateItems(completions, userEnteredText, asyncDetails);
378 this._show(); 384 this._show();
(...skipping 133 matching lines...) Expand 10 before | Expand all | Expand 10 after
512 this.element.style.top = containerBox.y + "px"; 518 this.element.style.top = containerBox.y + "px";
513 this.element.style.height = containerBox.height + "px"; 519 this.element.style.height = containerBox.height + "px";
514 this.element.style.width = containerBox.width + "px"; 520 this.element.style.width = containerBox.width + "px";
515 }, 521 },
516 522
517 dispose: function() 523 dispose: function()
518 { 524 {
519 this.element.remove(); 525 this.element.remove();
520 } 526 }
521 } 527 }
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698