Skip to content
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

Allow LazyLoad to use a custom ComponentObserver and visibility ranges #498

Closed
markhammond opened this issue Dec 6, 2023 · 5 comments · Fixed by #500
Closed

Allow LazyLoad to use a custom ComponentObserver and visibility ranges #498

markhammond opened this issue Dec 6, 2023 · 5 comments · Fixed by #500
Assignees
Labels
enhancement New feature or request

Comments

@markhammond
Copy link

Firstly, thank you for sharing LazyLoad and ComponentObserver. Working well with resize events after adapting LazyLoad to test partial visibility

Would be nice to make the default ComponentObserver policy used by LazyLoad more explicit. The default policy implies a threshold range of [0, 1] and requires observed components to become fully visible. For my case it was necessary to consider partially visible components, using a threshold range of 0.0 (consistent with the w3c default policy) and relax the test for fully visible components.

@vaadin-miki
Copy link
Owner

hello @markhammond and thank you for using my components! I am glad you found them useful :)

this sounds like a great feature to have, I will look into it - if it is not too much for my skills, I will include it in the next release (hopefully later this month) - otherwise it will require some time to be done

@vaadin-miki vaadin-miki self-assigned this Dec 8, 2023
@vaadin-miki vaadin-miki added the enhancement New feature or request label Dec 8, 2023
@vaadin-miki vaadin-miki added this to To do in Lazy Load and Intersection Observer via automation Dec 8, 2023
@vaadin-miki vaadin-miki added this to the Next release milestone Dec 8, 2023
vaadin-miki added a commit that referenced this issue Dec 11, 2023
vaadin-miki added a commit that referenced this issue Dec 11, 2023
Lazy Load and Intersection Observer automation moved this from To do to Done Dec 11, 2023
@vaadin-miki
Copy link
Owner

@markhammond current development branch has this feature merged, please feel free to try it out before I make a new release some time in the coming week - and of course please suggest improvements or report errors :)

basically how it works is that there is an additional parameter that can be passed to a LazyLoad constructor and that parameter is a Supplier<ComponentObserver> - by default it is simply ComponentObserver::new, but now you should be able to pass custom visibility ranges (new LazyLoad(content, () -> new ComponentObserver(start, end));)

@vaadin-miki vaadin-miki changed the title Improve LazyLoad flexibility by accepting custom ComponentObserver and policy. Allow LazyLoad to use a custom ComponentObserver Dec 11, 2023
@markhammond
Copy link
Author

Nice @vaadin-miki . The remaining issue is that isFullyVisible() tests for a visible proportion of 1.0. In my case I wanted to allow for partial visibility, that is, not equal to zero (consistent with the w3c default threshold of 0.0).

It is difficult to customise the current behaviour as the method performs the check is private.

@vaadin-miki
Copy link
Owner

@markhammond alrighty, let me think of a nice api for that, I am thinking of allowing custom triggers for considering if a component is visible or not, based on the ComponentObservationEvent (with defaults being isFullyVisible and isNotVisible)

@vaadin-miki vaadin-miki changed the title Allow LazyLoad to use a custom ComponentObserver Allow LazyLoad to use a custom ComponentObserver and visibility ranges Dec 15, 2023
@vaadin-miki
Copy link
Owner

@markhammond alrighty, current development now contains LazyLoad#setContentVisibilityRanges(forHiding, forShowing), which should be what you need :) by default the ranges are 0 and 1, so hiding on fully invisible and showing on fully visible, but now it should be possible to trigger hide/show on 0 and 0.5, for example

new release coming when #502 is done

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement New feature or request
Development

Successfully merging a pull request may close this issue.

2 participants