Autoscroll Functionality

[ajschmaltz]

For some reason https://github.com/okgrow/router-autoscroll doesn't work with this package. Any suggestions on how to revive this functionality?

[dr-dimitru]

Hello @ajschmaltz ,

A quick look on router-autoscroll repository reveals it's being deprecated:

[DEPRECATED] Smart management of scroll position across route changes for iron and flow router

And it has dependency of original FR package.

But the good news are here - you can implement it easily:

import { FlowRouter } from 'meteor/ostrio:flow-router-extra';

const scrollToTop = () => {
  setTimeout(() => {
    if (!window.location.hash) {
      window.scroll(0, 0);
    }
  }, 25);
};

FlowRouter.triggers.enter([scrollToTop]);

Let me know if it works for you.

[dr-dimitru]

@ajschmaltz did you got a chance to implement it?

[tmpg]

Can this be built into the package? I can't seem to get this to work. Does it go on each route?

[dr-dimitru]

@tmpg

Does it go on each route?

Yes, FlowRouter.triggers registers global trigger and applied to each registered route.

I can't seem to get this to work.

Do you got any errors? Can you add .log to see if it's triggered

Can this be built into the package?

Looks overwhelming to me, as it can be done with few lines in a global trigger. Let's see if it will get up votes by community.

[coagmano]

Looking at okgrow/router-autoscroll, it should work perfectly fine. Just follow the instructions here for compatibility with packages that rely on the original FlowRouter

Even if you don't want to use the package, it's not hard to add to your project with a single global trigger. So I don't see any reason it should be part of the package

[dr-dimitru]

@coagmano well, autoscroll package has dependency of original FlowRouter. Having two packages won't harm your app, but wouldn't be good either. May cause conflicts and increase application size.

[coagmano]

It's a weak dependency, so it won't install automatically. By setting Package['kadira:flow-router'] = Package['ostrio:flow-router-extra']; before it loads, it will use this FlowRouter instead of the original

[dr-dimitru]

@coagmano you right, haven't noticed {weak: true}, my bad. Anyways, this is just 8 lines:

const scrollToTop = () => {
  setTimeout(() => {
    if (!window.location.hash) {
      window.scroll(0, 0);
    }
  }, 25);
};

FlowRouter.triggers.enter([scrollToTop]);

[dr-dimitru]

Shall we move it to the docs and close the ticket? @ajschmaltz @coagmano @mksh-su @tmpg

[dr-dimitru]

Added to docs