From df32545b07658626359405eeb97be2c86964dfc4 Mon Sep 17 00:00:00 2001 From: Lauri Ojansivu Date: Fri, 29 Mar 2019 14:27:37 +0200 Subject: Revert spinner etc fixes of Wekan v2.56, because of some new bugs. Thanks to gerroon ! Related #2250 --- client/components/lists/listBody.js | 89 ++++++++++++++++++++----------------- 1 file changed, 49 insertions(+), 40 deletions(-) (limited to 'client/components/lists/listBody.js') diff --git a/client/components/lists/listBody.js b/client/components/lists/listBody.js index 112b6379..7d767011 100644 --- a/client/components/lists/listBody.js +++ b/client/components/lists/listBody.js @@ -7,6 +7,28 @@ BlazeComponent.extendComponent({ this.cardlimit = new ReactiveVar(InfiniteScrollIter); }, + onRendered() { + const domElement = this.find('.js-perfect-scrollbar'); + + this.$(domElement).on('scroll', () => this.updateList(domElement)); + $(window).on(`resize.${this.data().listId}`, () => this.updateList(domElement)); + + // we add a Mutation Observer to allow propagations of cardlimit + // when the spinner stays in the current view (infinite scrolling) + this.mutationObserver = new MutationObserver(() => this.updateList(domElement)); + + this.mutationObserver.observe(domElement, { + childList: true, + }); + + this.updateList(domElement); + }, + + onDestroyed() { + $(window).off(`resize.${this.data().listId}`); + this.mutationObserver.disconnect(); + }, + mixins() { return [Mixins.PerfectScrollbar]; }, @@ -169,11 +191,38 @@ BlazeComponent.extendComponent({ }); }, + spinnerInView(container) { + const parentViewHeight = container.clientHeight; + const bottomViewPosition = container.scrollTop + parentViewHeight; + + const spinner = this.find('.sk-spinner-list'); + + const threshold = spinner.offsetTop; + + return bottomViewPosition > threshold; + }, + showSpinner(swimlaneId) { const list = Template.currentData(); return list.cards(swimlaneId).count() > this.cardlimit.get(); }, + updateList(container) { + // first, if the spinner is not rendered, we have reached the end of + // the list of cards, so skip and disable firing the events + const target = this.find('.sk-spinner-list'); + if (!target) { + this.$(container).off('scroll'); + $(window).off(`resize.${this.data().listId}`); + return; + } + + if (this.spinnerInView(container)) { + this.cardlimit.set(this.cardlimit.get() + InfiniteScrollIter); + Ps.update(container); + } + }, + canSeeAddCard() { return !this.reachedWipLimit() && Meteor.user() && Meteor.user().isBoardMember() && !Meteor.user().isCommentOnly(); }, @@ -612,43 +661,3 @@ BlazeComponent.extendComponent({ }]; }, }).register('searchElementPopup'); - -BlazeComponent.extendComponent({ - onCreated() { - this.spinnerShown = false; - this.cardlimit = this.parentComponent().cardlimit; - }, - - onRendered() { - const spinner = this.find('.sk-spinner-list'); - - if (spinner) { - const options = { - root: null, // we check if the spinner is on the current viewport - rootMargin: '0px', - threshold: 0.25, - }; - - this.observer = new IntersectionObserver((entries) => { - entries.forEach((entry) => { - this.spinnerShown = entry.isIntersecting; - this.updateList(); - }); - }, options); - - this.observer.observe(spinner); - } - }, - - onDestroyed() { - this.observer.disconnect(); - }, - - updateList() { - if (this.spinnerShown) { - this.cardlimit.set(this.cardlimit.get() + InfiniteScrollIter); - window.requestIdleCallback(() => this.updateList()); - } - }, - -}).register('spinnerList'); -- cgit v1.2.3-1-g7c22