Comments (12)
Inneresting. I think catering for every use case is outside of the scope of this library. However I think maybe we should make this hook public, so that people who want to control how this check works can easily override it.
@daniel-de-wit would u be down to submit a PR to make this public, and document your use case in the README?
from ember-infinity.
Thanks for your reply, I was on vacation so didn't see your message..
I believe there must be a proper way we can detect if the component is on screen. There are some jQuery plugins that work with nested scrollable divs, I think. Maybe I can extract a good solution for every use case since we just want it to fire when visible to the user on screen.
I definitely like your idea of making the hook public.
It might take me a little while to fix this as I have never actually commited something to an open-source project. But I will try to do it :)
Thanks again for making this wonderfull addon 👍
from ember-infinity.
I wonder if we can use this somehow?
https://github.com/poteto/ember-in-viewport-demo
On Tue, 1 Sep 2015 at 15:50 Daniel de Wit [email protected] wrote:
Thanks for your reply, I was on vacation so didn't see your message..
I believe there must be a proper way we can detect if the component is on
screen. There are some jQuery plugins that work with nested scrollable
divs, I think. Maybe I can extract a good solution for every use case since
we just want it to fire when visible to the user on screen.I definitely like your idea of making the hook public.
It might take me a little while to fix this as I have never actually
commited something to an open-source project. But I will try to do it :)Thanks again for making this wonderfull addon [image: 👍]
—
Reply to this email directly or view it on GitHub
#82 (comment).
from ember-infinity.
Sorry i mean this: https://github.com/dockyard/ember-in-viewport
from ember-infinity.
Yeah! We totally can...
wanna have a go at it? I can help with the OSS stuff 👍
from ember-infinity.
Yes sounds like a fun challenge ;)
I wonder if the ember-in-viewport supports nested scrollable divs. I'll go fiddle with it.
I'll keep you posted.
from ember-infinity.
awesome @daniel-de-wit !!!
from ember-infinity.
from ember-infinity.
pretty sure ember-in-viewport supports offsets out of the box 👍
from ember-infinity.
jah it does
export default Ember.Component.extend(InViewportMixin, {
viewportOptionsOverride: Ember.on('didInsertElement', function() {
Ember.setProperties(this, {
viewportUseRAF : true,
viewportSpy : false,
viewportScrollSensitivity : 1,
viewportRefreshRate : 150,
viewportTolerance: {
top : 50,
bottom : 50,
left : 20,
right : 20
}
});
})
});
from ember-infinity.
Cool :).
2015-09-01 16:16 GMT+02:00 Hugh Francis [email protected]:
jah it does
export default Ember.Component.extend(InViewportMixin, {
viewportOptionsOverride: Ember.on('didInsertElement', function() {
Ember.setProperties(this, {
viewportUseRAF : true,
viewportSpy : false,
viewportScrollSensitivity : 1,
viewportRefreshRate : 150,
viewportTolerance: {
top : 50,
bottom : 50,
left : 20,
right : 20
}
});
})
});—
Reply to this email directly or view it on GitHub
#82 (comment).
from ember-infinity.
I also was having an issue where the loading component was not triggering the loadMoreAction
when it came into view. I also tried the InViewportMixin
and it worked for me! Here is the code that I used to achieve the results that I needed (note that I start loading 1500px before the loader comes into the viewport):
import Ember from 'ember';
import InfinityLoaderComponent from 'ember-infinity/components/infinity-loader';
import InViewportMixin from 'ember-in-viewport';
export default InfinityLoaderComponent.extend(InViewportMixin, {
viewportOptionsOverride: Ember.on('didInsertElement', function() {
Ember.setProperties(this, {
viewportSpy: true,
viewportTolerance: {
bottom: 1500,
}
});
}),
didEnterViewport() {
this.sendAction('loadMoreAction')
},
});
from ember-infinity.
Related Issues (20)
- infinity-loader needs to unhide on model change HOT 7
- model.canLoadMore not updating HOT 6
- infinityLoader renders JSON response data twice HOT 4
- isVisible is deprecated in 3.15
- 2.1.0 throws an EEXIST: file already exists on app build HOT 8
- Is it possible to use this component with a horizontal list? HOT 6
- Ember Infinity not working with latest Ember Data 3.17.0 & 3.16.0 HOT 9
- Possible issue with ember-source 3.16.2 HOT 6
- Not working in "ember-cli": "~3.4.4"? HOT 2
- Could not find plugin "proposal-class-properties". Ensure there is an entry in ./available-plugins.js for it.
- Demo link goes to 404. HOT 1
- Non-blocking model hook breaks `reachedInfinity`
- Problem with ember-in-viewport HOT 5
- Update doc examples with ES6 Classes
- devDependencies and dependencies are out of date HOT 2
- Issue with loadPrevious and scrollable HOT 2
- Will the project be supported for ember 4? HOT 2
- Error: Could not find module `@ember/polyfills` imported from `ember-in-viewport/initializers/viewport-config`
- Caching unchanged content ExtendedInfinityModel
- Side effects due to transfer ownership
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from ember-infinity.