mirror/php-flarum
1
0
Fork 0
mirror of https://github.com/flarum/core.git synced 2025-08-10 18:35:56 +02:00
Code Issues Releases Wiki Activity

Use same logic as in updateScrubber to calculate current post number

Browse Source
This commit is contained in:
Alexander Skvortsov
2020-07-06 23:54:38 -04:00
committed by Franz Liedke
parent 9f2540dbe3
commit 4bce030115
1 changed files with 14 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

23
js/src/forum/components/PostStream.js
View File

@@ -161,7 +161,7 @@ export default class PostStream extends Component {
// Throttle calculation of our position (start/end numbers of posts in the // Throttle calculation of our position (start/end numbers of posts in the
// viewport) to 100ms. // viewport) to 100ms.
clearTimeout(this.calculatePositionTimeout); clearTimeout(this.calculatePositionTimeout);
this.calculatePositionTimeout = setTimeout(this.calculatePosition.bind(this), 100); this.calculatePositionTimeout = setTimeout(this.calculatePosition.bind(this, top), 100);
this.updateScrubber(top); this.updateScrubber(top);
} }
@@ -176,7 +176,7 @@ export default class PostStream extends Component {
// seen if the browser were scrolled right up to the top of the page, // seen if the browser were scrolled right up to the top of the page,
// and the viewport had a height of 0. // and the viewport had a height of 0.
const $items = this.$('.PostStream-item[data-index]'); const $items = this.$('.PostStream-item[data-index]');
let index = null; let index;
let visible = 0; let visible = 0;
let period = ''; let period = '';
@@ -206,7 +206,7 @@ export default class PostStream extends Component {
const threeQuartersVisible = visibleTop / height < 0.75; const threeQuartersVisible = visibleTop / height < 0.75;
const coversQuarterOfViewport = (height - visibleTop) / viewportHeight > 0.25; const coversQuarterOfViewport = (height - visibleTop) / viewportHeight > 0.25;
if (index === null && (threeQuartersVisible || coversQuarterOfViewport)) { if (index === undefined && (threeQuartersVisible || coversQuarterOfViewport)) {
index = parseFloat($this.data('index')) + visibleTop / height; index = parseFloat($this.data('index')) + visibleTop / height;
} }
@@ -220,8 +220,6 @@ export default class PostStream extends Component {
if (time) period = time; if (time) period = time;
}); });
console.log(index);
const indexChanged = Math.floor(this.state.index) != Math.floor(index); const indexChanged = Math.floor(this.state.index) != Math.floor(index);
this.state.index = index; this.state.index = index;
this.state.visible = visible; this.state.visible = visible;
@@ -235,11 +233,13 @@ export default class PostStream extends Component {
* Work out which posts (by number) are currently visible in the viewport, and * Work out which posts (by number) are currently visible in the viewport, and
* fire an event with the information. * fire an event with the information.
*/ */
calculatePosition() { calculatePosition(top = window.pageYOffset) {
const marginTop = this.getMarginTop(); const marginTop = this.getMarginTop();
const $window = $(window); const $window = $(window);
const viewportHeight = $window.height() - marginTop; const viewportHeight = $window.height() - marginTop;
const scrollTop = $window.scrollTop() + marginTop; const scrollTop = $window.scrollTop() + marginTop;
const viewportTop = top + marginTop;
let startNumber; let startNumber;
let endNumber; let endNumber;
@@ -247,12 +247,15 @@ export default class PostStream extends Component {
const $item = $(this); const $item = $(this);
const top = $item.offset().top; const top = $item.offset().top;
const height = $item.outerHeight(true); const height = $item.outerHeight(true);
const visibleTop = Math.max(0, viewportTop - top);
if (top + height > scrollTop) { const threeQuartersVisible = visibleTop / height < 0.75;
if (!startNumber) { const coversQuarterOfViewport = (height - visibleTop) / viewportHeight > 0.25;
startNumber = endNumber = $item.data('number'); if (startNumber === undefined && (threeQuartersVisible || coversQuarterOfViewport)) {
startNumber = $item.data('number');
} }
if (top + height > scrollTop) {
if (top + height < scrollTop + viewportHeight) { if (top + height < scrollTop + viewportHeight) {
if ($item.data('number')) { if ($item.data('number')) {
endNumber = $item.data('number'); endNumber = $item.data('number');
@@ -262,7 +265,7 @@ export default class PostStream extends Component {
}); });
if (startNumber) { if (startNumber) {
this.props.positionHandler(startNumber || 1, endNumber); this.props.positionHandler(startNumber || 1, endNumber, startNumber);
} }
} }