diff --git a/app/search/client/provider/result.js b/app/search/client/provider/result.js index aa64d32da6ba..03367888e29c 100644 --- a/app/search/client/provider/result.js +++ b/app/search/client/provider/result.js @@ -1,4 +1,5 @@ import { Meteor } from 'meteor/meteor'; +import { Tracker } from 'meteor/tracker'; import { ReactiveVar } from 'meteor/reactive-var'; import { FlowRouter } from 'meteor/kadira:flow-router'; import { Session } from 'meteor/session'; @@ -39,9 +40,22 @@ Meteor.startup(function() { }); }); -Template.DefaultSearchResultTemplate.onCreated(function() { - const self = this; +Template.DefaultSearchResultTemplate.onRendered(function() { + const list = this.firstNode.parentNode.querySelector('.rocket-default-search-results'); + this.autorun(() => { + const result = this.data.result.get(); + if (result && this.hasMore.get()) { + Tracker.afterFlush(() => { + if (list.scrollHeight <= list.offsetHeight) { + this.data.payload.limit = (this.data.payload.limit || this.pageSize) + this.pageSize; + this.data.search(); + } + }); + } + }); +}); +Template.DefaultSearchResultTemplate.onCreated(function() { // paging this.pageSize = this.data.settings.PageSize; @@ -53,7 +67,7 @@ Template.DefaultSearchResultTemplate.onCreated(function() { this.autorun(() => { const result = this.data.result.get(); - self.hasMore.set(!(result && result.message.docs.length < (self.data.payload.limit || self.pageSize))); + this.hasMore.set(!(result && result.message.docs.length < (this.data.payload.limit || this.pageSize))); }); }); @@ -86,7 +100,7 @@ Template.DefaultSearchResultTemplate.helpers({ return Template.instance().hasMore.get(); }, message(msg) { - return { customClass: 'search', actionContext: 'search', ...msg }; + return { customClass: 'search', actionContext: 'search', ...msg, groupable: false }; }, messageContext, }); diff --git a/app/search/client/style/style.css b/app/search/client/style/style.css index 2b611bb6c241..93e7c4aa8d00 100644 --- a/app/search/client/style/style.css +++ b/app/search/client/style/style.css @@ -23,6 +23,7 @@ .rocket-search-result { display: flex; + overflow: hidden; flex-direction: column; flex: 1; } diff --git a/app/theme/client/imports/general/base.css b/app/theme/client/imports/general/base.css index 4c5467746743..f7b8eb0bc8f4 100644 --- a/app/theme/client/imports/general/base.css +++ b/app/theme/client/imports/general/base.css @@ -219,56 +219,3 @@ button { .hidden { display: none; } - -.loading-animation { - position: absolute; - top: 0; - right: 0; - bottom: 0; - left: 0; - - display: flex; - - text-align: center; - align-items: center; - justify-content: center; -} - -.loading-animation > .bounce { - display: inline-block; - - width: 10px; - height: 10px; - margin: 2px; - - animation: loading-bouncedelay 1.4s infinite ease-in-out both; - - border-radius: 100%; - background-color: rgba(255, 255, 255, 0.6); -} - -.loading-animation .bounce1 { - -webkit-animation-delay: -0.32s; - animation-delay: -0.32s; -} - -.loading-animation .bounce2 { - -webkit-animation-delay: -0.16s; - animation-delay: -0.16s; -} - -.file-picker-loading .loading-animation > .bounce { - background-color: #444444; -} - -@keyframes loading-bouncedelay { - 0%, - 80%, - 100% { - transform: scale(0); - } - - 40% { - transform: scale(1); - } -} diff --git a/app/ui-master/client/index.js b/app/ui-master/client/index.js index b5870d194100..67abd78bcfe5 100644 --- a/app/ui-master/client/index.js +++ b/app/ui-master/client/index.js @@ -1,4 +1,4 @@ -import './loading.html'; +import './loading'; import './error.html'; import './logoLayout.html'; import './main.html'; diff --git a/app/ui-master/client/loading/index.js b/app/ui-master/client/loading/index.js new file mode 100644 index 000000000000..66a769be942f --- /dev/null +++ b/app/ui-master/client/loading/index.js @@ -0,0 +1,2 @@ +import './loading.css'; +import './loading.html'; diff --git a/app/ui-master/client/loading/loading.css b/app/ui-master/client/loading/loading.css new file mode 100644 index 000000000000..29ab7c8125e7 --- /dev/null +++ b/app/ui-master/client/loading/loading.css @@ -0,0 +1,52 @@ +.loading-animation { + position: absolute; + top: 0; + right: 0; + bottom: 0; + left: 0; + + display: flex; + + text-align: center; + align-items: center; + justify-content: center; +} + +.loading-animation > .bounce { + display: inline-block; + + width: 10px; + height: 10px; + margin: 2px; + + animation: loading-bouncedelay 1.4s infinite ease-in-out both; + + border-radius: 100%; + background-color: rgba(255, 255, 255, 0.6); +} + +.loading-animation .bounce1 { + -webkit-animation-delay: -0.32s; + animation-delay: -0.32s; +} + +.loading-animation .bounce2 { + -webkit-animation-delay: -0.16s; + animation-delay: -0.16s; +} + +.file-picker-loading .loading-animation > .bounce { + background-color: #444444; +} + +@keyframes loading-bouncedelay { + 0%, + 80%, + 100% { + transform: scale(0); + } + + 40% { + transform: scale(1); + } +} diff --git a/app/ui-master/client/loading.html b/app/ui-master/client/loading/loading.html similarity index 100% rename from app/ui-master/client/loading.html rename to app/ui-master/client/loading/loading.html