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

Unified Diff: third_party/WebKit/Source/devtools/front_end/ui/ViewportControl.js

Issue 2339293003: DevTools: Buffer ViewportController to prevent whitespace on scroll. (Closed)
Patch Set: Fix math error Created 4 years, 3 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 side-by-side diff with in-line comments
Download patch
« no previous file with comments | « no previous file | no next file » | no next file with comments »
Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
Index: third_party/WebKit/Source/devtools/front_end/ui/ViewportControl.js
diff --git a/third_party/WebKit/Source/devtools/front_end/ui/ViewportControl.js b/third_party/WebKit/Source/devtools/front_end/ui/ViewportControl.js
index 6a79013a74e3f818b0a5ebc7d106f3706c76026f..5b18bfd1ee649ed1cb049b3fa99652b568f0ee39 100644
--- a/third_party/WebKit/Source/devtools/front_end/ui/ViewportControl.js
+++ b/third_party/WebKit/Source/devtools/front_end/ui/ViewportControl.js
@@ -54,8 +54,8 @@ WebInspector.ViewportControl = function(provider)
this.element.addEventListener("copy", this._onCopy.bind(this), false);
this.element.addEventListener("dragstart", this._onDragStart.bind(this), false);
- this._firstVisibleIndex = 0;
- this._lastVisibleIndex = -1;
+ this._firstActiveIndex = 0;
+ this._lastActiveIndex = -1;
this._renderedItems = [];
this._anchorSelection = null;
this._headSelection = null;
@@ -230,13 +230,13 @@ WebInspector.ViewportControl.prototype = {
return;
if (!this._itemCount)
return;
- var firstVisibleIndex = this._firstVisibleIndex;
- var lastVisibleIndex = this._lastVisibleIndex;
+ var firstActiveIndex = this._firstActiveIndex;
+ var lastActiveIndex = this._lastActiveIndex;
var height = 0;
this._cumulativeHeights = new Int32Array(this._itemCount);
for (var i = 0; i < this._itemCount; ++i) {
- if (firstVisibleIndex <= i && i <= lastVisibleIndex)
- height += this._renderedItems[i - firstVisibleIndex].element().offsetHeight;
+ if (firstActiveIndex <= i && i <= lastActiveIndex)
+ height += this._renderedItems[i - firstActiveIndex].element().offsetHeight;
else
height += this._provider.fastHeight(i);
this._cumulativeHeights[i] = height;
@@ -299,7 +299,7 @@ WebInspector.ViewportControl.prototype = {
var hasVisibleSelection = false;
for (var i = 0; i < this._renderedItems.length; ++i) {
if (range.intersectsNode(this._renderedItems[i].element())) {
- var index = i + this._firstVisibleIndex;
+ var index = i + this._firstActiveIndex;
firstSelected = Math.min(firstSelected, index);
lastSelected = Math.max(lastSelected, index);
hasVisibleSelection = true;
@@ -355,26 +355,26 @@ WebInspector.ViewportControl.prototype = {
{
var anchorElement = null;
var anchorOffset;
- if (this._firstVisibleIndex <= this._anchorSelection.item && this._anchorSelection.item <= this._lastVisibleIndex) {
+ if (this._firstActiveIndex <= this._anchorSelection.item && this._anchorSelection.item <= this._lastActiveIndex) {
anchorElement = this._anchorSelection.node;
anchorOffset = this._anchorSelection.offset;
} else {
- if (this._anchorSelection.item < this._firstVisibleIndex)
+ if (this._anchorSelection.item < this._firstActiveIndex)
anchorElement = this._topGapElement;
- else if (this._anchorSelection.item > this._lastVisibleIndex)
+ else if (this._anchorSelection.item > this._lastActiveIndex)
anchorElement = this._bottomGapElement;
anchorOffset = this._selectionIsBackward ? 1 : 0;
}
var headElement = null;
var headOffset;
- if (this._firstVisibleIndex <= this._headSelection.item && this._headSelection.item <= this._lastVisibleIndex) {
+ if (this._firstActiveIndex <= this._headSelection.item && this._headSelection.item <= this._lastActiveIndex) {
headElement = this._headSelection.node;
headOffset = this._headSelection.offset;
} else {
- if (this._headSelection.item < this._firstVisibleIndex)
+ if (this._headSelection.item < this._firstActiveIndex)
headElement = this._topGapElement;
- else if (this._headSelection.item > this._lastVisibleIndex)
+ else if (this._headSelection.item > this._lastActiveIndex)
headElement = this._bottomGapElement;
headOffset = this._selectionIsBackward ? 0 : 1;
}
@@ -402,8 +402,8 @@ WebInspector.ViewportControl.prototype = {
this._contentElement.removeChildren();
this._topGapElement.style.height = "0px";
this._bottomGapElement.style.height = "0px";
- this._firstVisibleIndex = -1;
- this._lastVisibleIndex = -1;
+ this._firstActiveIndex = -1;
+ this._lastActiveIndex = -1;
return;
}
@@ -416,28 +416,28 @@ WebInspector.ViewportControl.prototype = {
for (var i = 0; i < this._renderedItems.length; ++i) {
// Tolerate 1-pixel error due to double-to-integer rounding errors.
- if (this._cumulativeHeights && Math.abs(this._cachedItemHeight(this._firstVisibleIndex + i) - this._renderedItems[i].element().offsetHeight) > 1)
+ if (this._cumulativeHeights && Math.abs(this._cachedItemHeight(this._firstActiveIndex + i) - this._renderedItems[i].element().offsetHeight) > 1)
delete this._cumulativeHeights;
}
this._rebuildCumulativeHeightsIfNeeded();
- var oldFirstVisibleIndex = this._firstVisibleIndex;
- var oldLastVisibleIndex = this._lastVisibleIndex;
-
+ var oldFirstActiveIndex = this._firstActiveIndex;
+ var oldLastActiveIndex = this._lastActiveIndex;
+ var activeHeight = visibleHeight * 2;
// When the viewport is scrolled to the bottom, using the cumulative heights estimate is not
// precise enough to determine next visible indices. This stickToBottom check avoids extra
// calls to refresh in those cases.
if (this._stickToBottom) {
- this._firstVisibleIndex = Math.max(this._itemCount - Math.ceil(visibleHeight / this._provider.minimumRowHeight()), 0);
- this._lastVisibleIndex = this._itemCount - 1;
+ this._firstActiveIndex = Math.max(this._itemCount - Math.ceil(activeHeight / this._provider.minimumRowHeight()), 0);
+ this._lastActiveIndex = this._itemCount - 1;
} else {
- this._firstVisibleIndex = Math.max(Array.prototype.lowerBound.call(this._cumulativeHeights, visibleFrom + 1), 0);
+ this._firstActiveIndex = Math.max(Array.prototype.lowerBound.call(this._cumulativeHeights, visibleFrom + 1 - (activeHeight - visibleHeight) / 2), 0);
// Proactively render more rows in case some of them will be collapsed without triggering refresh. @see crbug.com/390169
- this._lastVisibleIndex = this._firstVisibleIndex + Math.ceil(visibleHeight / this._provider.minimumRowHeight()) - 1;
- this._lastVisibleIndex = Math.min(this._lastVisibleIndex, this._itemCount - 1);
+ this._lastActiveIndex = this._firstActiveIndex + Math.ceil(activeHeight / this._provider.minimumRowHeight()) - 1;
+ this._lastActiveIndex = Math.min(this._lastActiveIndex, this._itemCount - 1);
}
- var topGapHeight = this._cumulativeHeights[this._firstVisibleIndex - 1] || 0;
- var bottomGapHeight = this._cumulativeHeights[this._cumulativeHeights.length - 1] - this._cumulativeHeights[this._lastVisibleIndex];
+ var topGapHeight = this._cumulativeHeights[this._firstActiveIndex - 1] || 0;
+ var bottomGapHeight = this._cumulativeHeights[this._cumulativeHeights.length - 1] - this._cumulativeHeights[this._lastActiveIndex];
/**
* @this {WebInspector.ViewportControl}
@@ -454,7 +454,7 @@ WebInspector.ViewportControl.prototype = {
if (isInvalidating)
this._fullViewportUpdate(prepare.bind(this));
else
- this._partialViewportUpdate(oldFirstVisibleIndex, oldLastVisibleIndex, prepare.bind(this));
+ this._partialViewportUpdate(oldFirstActiveIndex, oldLastActiveIndex, prepare.bind(this));
this._contentElement.style.removeProperty("height");
// Should be the last call in the method as it might force layout.
if (shouldRestoreSelection)
@@ -473,7 +473,7 @@ WebInspector.ViewportControl.prototype = {
prepare();
this._renderedItems = [];
this._contentElement.removeChildren();
- for (var i = this._firstVisibleIndex; i <= this._lastVisibleIndex; ++i) {
+ for (var i = this._firstActiveIndex; i <= this._lastActiveIndex; ++i) {
var viewportElement = this._providerElement(i);
this._contentElement.appendChild(viewportElement.element());
this._renderedItems.push(viewportElement);
@@ -483,16 +483,16 @@ WebInspector.ViewportControl.prototype = {
},
/**
- * @param {number} oldFirstVisibleIndex
- * @param {number} oldLastVisibleIndex
+ * @param {number} oldFirstActiveIndex
+ * @param {number} oldLastActiveIndex
* @param {function()} prepare
*/
- _partialViewportUpdate: function(oldFirstVisibleIndex, oldLastVisibleIndex, prepare)
+ _partialViewportUpdate: function(oldFirstActiveIndex, oldLastActiveIndex, prepare)
{
var willBeHidden = [];
for (var i = 0; i < this._renderedItems.length; ++i) {
- var index = oldFirstVisibleIndex + i;
- if (index < this._firstVisibleIndex || this._lastVisibleIndex < index)
+ var index = oldFirstActiveIndex + i;
+ if (index < this._firstActiveIndex || this._lastActiveIndex < index)
willBeHidden.push(this._renderedItems[i]);
}
for (var i = 0; i < willBeHidden.length; ++i)
@@ -504,7 +504,7 @@ WebInspector.ViewportControl.prototype = {
this._renderedItems = [];
var anchor = this._contentElement.firstChild;
var wasShown = [];
- for (var i = this._firstVisibleIndex; i <= this._lastVisibleIndex; ++i) {
+ for (var i = this._firstActiveIndex; i <= this._lastActiveIndex; ++i) {
var viewportElement = this._providerElement(i);
var element = viewportElement.element();
if (element !== anchor) {
@@ -585,7 +585,12 @@ WebInspector.ViewportControl.prototype = {
*/
firstVisibleIndex: function()
{
- return this._firstVisibleIndex;
+ var firstVisibleIndex;
+ if (this._stickToBottom)
+ firstVisibleIndex = Math.max(this._itemCount - Math.ceil(this._visibleHeight() / this._provider.minimumRowHeight()), 0);
+ else
+ firstVisibleIndex = Math.max(Array.prototype.lowerBound.call(this._cumulativeHeights, this.element.scrollTop + 1), 0);
+ return Math.max(firstVisibleIndex, this._firstActiveIndex);
},
/**
@@ -593,7 +598,12 @@ WebInspector.ViewportControl.prototype = {
*/
lastVisibleIndex: function()
{
- return this._lastVisibleIndex;
+ var lastVisibleIndex;
+ if (this._stickToBottom)
+ lastVisibleIndex = this._itemCount - 1;
+ else
+ lastVisibleIndex = this.firstVisibleIndex() + Math.ceil(this._visibleHeight() / this._provider.minimumRowHeight()) - 1;
+ return Math.min(lastVisibleIndex, this._lastActiveIndex);
},
/**
@@ -601,11 +611,11 @@ WebInspector.ViewportControl.prototype = {
*/
renderedElementAt: function(index)
{
- if (index < this._firstVisibleIndex)
+ if (index < this._firstActiveIndex)
return null;
- if (index > this._lastVisibleIndex)
+ if (index > this._lastActiveIndex)
return null;
- return this._renderedItems[index - this._firstVisibleIndex].element();
+ return this._renderedItems[index - this._firstActiveIndex].element();
},
/**
@@ -614,13 +624,13 @@ WebInspector.ViewportControl.prototype = {
*/
scrollItemIntoView: function(index, makeLast)
{
- if (index > this._firstVisibleIndex && index < this._lastVisibleIndex)
+ if (index > this._firstActiveIndex && index < this._lastActiveIndex)
return;
if (makeLast)
this.forceScrollItemToBeLast(index);
- else if (index <= this._firstVisibleIndex)
+ else if (index <= this._firstActiveIndex)
this.forceScrollItemToBeFirst(index);
- else if (index >= this._lastVisibleIndex)
+ else if (index >= this._lastActiveIndex)
this.forceScrollItemToBeLast(index);
},
« no previous file with comments | « no previous file | no next file » | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698