New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add `stayVisible` prop. #105

Open
wants to merge 1 commit into
base: master
from

Conversation

Projects
None yet
8 participants
@jackfranklin

jackfranklin commented Nov 10, 2017

This is the PR for the suggestion I raised in #100 .

This makes the VisibilitySensor stay visible once it is visible for
the first time, even if it then is scrolled out of the viewport.

This means that onChange will only be called once, the first time it
becomes visible, and then never again.

Add `stayVisible` prop.
This makes the `VisibilitySensor` stay visible once it is visible for
the first time, even if it then is scrolled out of the viewport.

This means that `onChange` will only be called once, the first time it
becomes visible, and then never again.
@linrz

This comment has been minimized.

Show comment
Hide comment
@linrz

linrz Nov 12, 2017

What I thought was same as you.I hope this feature can be added into the package.Thanks a lot.

linrz commented Nov 12, 2017

What I thought was same as you.I hope this feature can be added into the package.Thanks a lot.

@dbx834

This comment has been minimized.

Show comment
Hide comment
@dbx834

dbx834 Nov 22, 2017

Thanks for this.

dbx834 commented Nov 22, 2017

Thanks for this.

@Klaasvaak

This comment has been minimized.

Show comment
Hide comment
@Klaasvaak

Klaasvaak Nov 29, 2017

Contributor

Can't you already do this with the active prop? When onChange is called with isVisible, you can set active to true.

Contributor

Klaasvaak commented Nov 29, 2017

Can't you already do this with the active prop? When onChange is called with isVisible, you can set active to true.

@CanRau

This comment has been minimized.

Show comment
Hide comment
@CanRau

CanRau Mar 20, 2018

@Klaasvaak but than you would have to manage state in your own component just for this (or am I missing sth?)
so this feature would make it easier to integrate it in more components without changing from functional to class just for this to work ;-)

CanRau commented Mar 20, 2018

@Klaasvaak but than you would have to manage state in your own component just for this (or am I missing sth?)
so this feature would make it easier to integrate it in more components without changing from functional to class just for this to work ;-)

@ml242

This comment has been minimized.

Show comment
Hide comment
@ml242

ml242 Apr 25, 2018

I just checked this and it works great. It would be nice to get it merged so I could leave my functional components as is. Thank you for the great work on this lib.

ml242 commented Apr 25, 2018

I just checked this and it works great. It would be nice to get it merged so I could leave my functional components as is. Thank you for the great work on this lib.

@joshwnj joshwnj added the enhancement label Jul 18, 2018

@strobox

This comment has been minimized.

Show comment
Hide comment
@strobox

strobox Sep 29, 2018

Who want quickly implement this feature and who use recomposer I suggest that utility HOC:

import {compose,withState,mapProps} from 'recompose';

export default compose(
	withState('active','setActive',true),// true sensor active
	mapProps(props => ({
		...props,
		onChange: (isVis,visRes) => {
			if(props.onChange) props.onChange(isVis,visRes);
			if(props.once && props.setActive) props.setActive(!isVis); // if became visible -> false for active
		} 
	})),
)

You should set once to true on your VisibilitySensor, otherwise it will work as original sensor

strobox commented Sep 29, 2018

Who want quickly implement this feature and who use recomposer I suggest that utility HOC:

import {compose,withState,mapProps} from 'recompose';

export default compose(
	withState('active','setActive',true),// true sensor active
	mapProps(props => ({
		...props,
		onChange: (isVis,visRes) => {
			if(props.onChange) props.onChange(isVis,visRes);
			if(props.once && props.setActive) props.setActive(!isVis); // if became visible -> false for active
		} 
	})),
)

You should set once to true on your VisibilitySensor, otherwise it will work as original sensor

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment