Merge pull request #12464 from baloone/Fix_getVisibleElements_in_rtl_direction
Fix getVisibleElements helper in RTL-locales
This commit is contained in:
commit
0d1a874358
@ -639,12 +639,12 @@ describe("ui_utils", function () {
|
|||||||
// This function takes a fixed layout of pages and compares the system under
|
// This function takes a fixed layout of pages and compares the system under
|
||||||
// test to the slower implementation above, for a range of scroll viewport
|
// test to the slower implementation above, for a range of scroll viewport
|
||||||
// sizes and positions.
|
// sizes and positions.
|
||||||
function scrollOverDocument(pages, horizontally = false) {
|
function scrollOverDocument(pages, horizontally = false, rtl = false) {
|
||||||
const size = pages.reduce(function (max, { div }) {
|
const size = pages.reduce(function (max, { div }) {
|
||||||
return Math.max(
|
return Math.max(
|
||||||
max,
|
max,
|
||||||
horizontally
|
horizontally
|
||||||
? div.offsetLeft + div.clientLeft + div.clientWidth
|
? Math.abs(div.offsetLeft + div.clientLeft + div.clientWidth)
|
||||||
: div.offsetTop + div.clientTop + div.clientHeight
|
: div.offsetTop + div.clientTop + div.clientHeight
|
||||||
);
|
);
|
||||||
}, 0);
|
}, 0);
|
||||||
@ -652,7 +652,7 @@ describe("ui_utils", function () {
|
|||||||
// make scrollOverDocument tests faster, decrease them to make the tests
|
// make scrollOverDocument tests faster, decrease them to make the tests
|
||||||
// more scrupulous, and keep them coprime to reduce the chance of missing
|
// more scrupulous, and keep them coprime to reduce the chance of missing
|
||||||
// weird edge case bugs.
|
// weird edge case bugs.
|
||||||
for (let i = 0; i < size; i += 7) {
|
for (let i = -size; i < size; i += 7) {
|
||||||
// The screen height (or width) here (j - i) doubles on each inner loop
|
// The screen height (or width) here (j - i) doubles on each inner loop
|
||||||
// iteration; again, this is just to test an interesting range of cases
|
// iteration; again, this is just to test an interesting range of cases
|
||||||
// without slowing the tests down to check every possible case.
|
// without slowing the tests down to check every possible case.
|
||||||
@ -671,7 +671,7 @@ describe("ui_utils", function () {
|
|||||||
clientWidth: 10000,
|
clientWidth: 10000,
|
||||||
};
|
};
|
||||||
expect(
|
expect(
|
||||||
getVisibleElements(scroll, pages, false, horizontally)
|
getVisibleElements(scroll, pages, false, horizontally, rtl)
|
||||||
).toEqual(slowGetVisibleElements(scroll, pages));
|
).toEqual(slowGetVisibleElements(scroll, pages));
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@ -737,6 +737,17 @@ describe("ui_utils", function () {
|
|||||||
scrollOverDocument(pages, true);
|
scrollOverDocument(pages, true);
|
||||||
});
|
});
|
||||||
|
|
||||||
|
it("works with horizontal scrolling with RTL-documents", function () {
|
||||||
|
const pages = makePages([
|
||||||
|
[
|
||||||
|
[-10, 50],
|
||||||
|
[-20, 20],
|
||||||
|
[-30, 10],
|
||||||
|
],
|
||||||
|
]);
|
||||||
|
scrollOverDocument(pages, true, true);
|
||||||
|
});
|
||||||
|
|
||||||
it("handles `sortByVisibility` correctly", function () {
|
it("handles `sortByVisibility` correctly", function () {
|
||||||
const scrollEl = {
|
const scrollEl = {
|
||||||
scrollTop: 75,
|
scrollTop: 75,
|
||||||
|
@ -1006,6 +1006,10 @@ class BaseViewer {
|
|||||||
: this._scrollMode === ScrollMode.HORIZONTAL;
|
: this._scrollMode === ScrollMode.HORIZONTAL;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
get _isContainerRtl() {
|
||||||
|
return getComputedStyle(this.container).direction === "rtl";
|
||||||
|
}
|
||||||
|
|
||||||
get isInPresentationMode() {
|
get isInPresentationMode() {
|
||||||
return this.presentationModeState === PresentationModeState.FULLSCREEN;
|
return this.presentationModeState === PresentationModeState.FULLSCREEN;
|
||||||
}
|
}
|
||||||
@ -1055,7 +1059,8 @@ class BaseViewer {
|
|||||||
this.container,
|
this.container,
|
||||||
this._pages,
|
this._pages,
|
||||||
true,
|
true,
|
||||||
this._isScrollModeHorizontal
|
this._isScrollModeHorizontal,
|
||||||
|
this._isScrollModeHorizontal && this._isContainerRtl
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -442,7 +442,8 @@ function getVisibleElements(
|
|||||||
scrollEl,
|
scrollEl,
|
||||||
views,
|
views,
|
||||||
sortByVisibility = false,
|
sortByVisibility = false,
|
||||||
horizontal = false
|
horizontal = false,
|
||||||
|
rtl = false
|
||||||
) {
|
) {
|
||||||
const top = scrollEl.scrollTop,
|
const top = scrollEl.scrollTop,
|
||||||
bottom = top + scrollEl.clientHeight;
|
bottom = top + scrollEl.clientHeight;
|
||||||
@ -465,11 +466,11 @@ function getVisibleElements(
|
|||||||
element.offsetTop + element.clientTop + element.clientHeight;
|
element.offsetTop + element.clientTop + element.clientHeight;
|
||||||
return elementBottom > top;
|
return elementBottom > top;
|
||||||
}
|
}
|
||||||
function isElementRightAfterViewLeft(view) {
|
function isElementNextAfterViewHorizontally(view) {
|
||||||
const element = view.div;
|
const element = view.div;
|
||||||
const elementRight =
|
const elementLeft = element.offsetLeft + element.clientLeft;
|
||||||
element.offsetLeft + element.clientLeft + element.clientWidth;
|
const elementRight = elementLeft + element.clientWidth;
|
||||||
return elementRight > left;
|
return rtl ? elementLeft < right : elementRight > left;
|
||||||
}
|
}
|
||||||
|
|
||||||
const visible = [],
|
const visible = [],
|
||||||
@ -479,7 +480,9 @@ function getVisibleElements(
|
|||||||
? 0
|
? 0
|
||||||
: binarySearchFirstItem(
|
: binarySearchFirstItem(
|
||||||
views,
|
views,
|
||||||
horizontal ? isElementRightAfterViewLeft : isElementBottomAfterViewTop
|
horizontal
|
||||||
|
? isElementNextAfterViewHorizontally
|
||||||
|
: isElementBottomAfterViewTop
|
||||||
);
|
);
|
||||||
|
|
||||||
// Please note the return value of the `binarySearchFirstItem` function when
|
// Please note the return value of the `binarySearchFirstItem` function when
|
||||||
|
Loading…
x
Reference in New Issue
Block a user