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

feat: add enableMouseWheelScrollHandler option to allow dynamic load #555

Merged
merged 3 commits into from
Nov 27, 2020

Conversation

ghiscoding
Copy link
Collaborator

  • when using TypeScript, we must always import the mousewheel jquery lib even if we don't need it because TypeScript does not yet support dynamic import. So providing a grid option to only use the mousewheel handler when we really want it is the only bulletproof way to only use that handler only when we really need it (typically when using a frozen grid)
  • ref Angular-Slickgrid issue

- when using TypeScript, we must always import the mousewheel jquery lib even if we don't need it because TypeScript does not yet support dynamic import. So providing a grid option to only use the mousewheel handler when we really want it is the only bulletproof way to only use that handler only when we really need it (typically when using a frozen grid)
- ref Angular-Slickgrid [issue](ghiscoding/Angular-Slickgrid#618)
@6pac
Copy link
Owner

6pac commented Nov 26, 2020

I get the first change, but what was the second one around the $viewport events even doing? Looks like some kind of workaround.

@ghiscoding
Copy link
Collaborator Author

You mean this code var viewportEvents = $._data($viewport[0], "events"); ?
It's a trick that I found out while googling on how to know what events are registered, see this SO, this returns all events registered on that jQuery element that you provide as first argument.

In the code that I added, it basically does the following:

  • check if the viewport element already has the mousewheel event handler associated
    • if Yes, then do nothing
    • if No, then add the mousewheel scroll handler

This avoids adding multiple event listeners for the same handler, which could be really bad and slow down the entire grid.

You might be wondering why am I doing that anyway? Because in my lib, we can add a freeze column at any point in time (see animated gif) and for that I use grid.setOptions({ frozenColumn: 2: enableMouseWheelScrollHandler: true }) to freeze at column 2 and when I remove it then I use the grid.setOptions({ frozenColumn: -1, enableMouseWheelScrollHandler: false }) which runs the 2nd piece of code that you were looking at... so basically dynamically adding the mousewheel scroll handler

hMkg3hCTo0

@6pac
Copy link
Owner

6pac commented Nov 27, 2020

OK, nice!

@6pac 6pac merged commit 5077d31 into master Nov 27, 2020
@6pac
Copy link
Owner

6pac commented Nov 27, 2020

And you'll be wanting a release?

@ghiscoding
Copy link
Collaborator Author

that would be nice too 😃

@ghiscoding ghiscoding deleted the bugfix/mousewheel-load-dynamically branch November 28, 2020 05:23
ghiscoding added a commit to ghiscoding/aurelia-slickgrid that referenced this pull request Dec 5, 2020
- this enables the use of the mousewheel scrolling event handler and that makes the mousewheel scroll to work from anywhere in the grid
- implement a permanent fix for issue #618 to replace temp fix made in PR #619
- requires the core lib [PR #555](6pac/SlickGrid#555) to be merged and released
ghiscoding added a commit to ghiscoding/aurelia-slickgrid that referenced this pull request Dec 5, 2020
- this enables the use of the mousewheel scrolling event handler and that makes the mousewheel scroll to work from anywhere in the grid
- implement a permanent fix for issue #618 to replace temp fix made in PR #619
- requires the core lib [PR #555](6pac/SlickGrid#555) to be merged and released
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants