page watcher and page post render

app.ts

import { inject } from 'aurelia-framework';
import { Router, RouterConfiguration } from 'aurelia-router';

import { AppStorage } from './_resources/app-storage';
import { AuthorizeStep } from './_resources/authorize-step';
import { PagePostRender } from './_resources/page-post-render';
import { PageWatcher } from './_resources/page-watcher';

/**
 * App Class
 *
 * @module app
 */
export class App {

  // Class Fields ------------------------------------------------------------------------------------------------------

  private _body: Element;
  private _router: Router;

  // System Methods ----------------------------------------------------------------------------------------------------

  /**
   * Configures the router
   */
  protected configureRouter(config: RouterConfiguration, router: Router) {
    ...
    /** Add a watcher for updates and last location */
    config.addPipelineStep('preRender', PageWatcher);
    /** Add a watcher for updates and last location */
    config.addPipelineStep('postRender', PagePostRender);
    /** Add a class for the authorization step */
    config.addPipelineStep('authorize', AuthorizeStep);
    /** Configure the routes */
    config.map([
      ...
    ]);
    /** Handle unknown routes */
    config.mapUnknownRoutes('not-found');
    /** Set the router */
    this._router = router;
  }

  // Lifecycle Methods -------------------------------------------------------------------------------------------------

  protected activate(): any {

    /** Get the body element */
    this._body = this._body || document.querySelector('body');

    /** Listen to the window for a scroll event and added a class named scrolled if it has been scrolled */
    window.addEventListener('scroll', () => {
      if (window.pageYOffset > 30) {
        this._body.classList.add('scrolled');
      } else {
        this._body.classList.remove('scrolled');
      }
    }, false);

  }

}

page-post-render.ts

import { NavigationInstruction, Next } from 'aurelia-router';

/**
 * PagePostRender Class
 * @class
 */
export class PagePostRender {

  /**
   * Run method for the pipeline step
   * @param navigationInstruction - instruction
   * @param next - next
   */
  public run(navigationInstruction: NavigationInstruction, next: Next): Promise<any> {
    /** Scroll to top */
    window.scrollTo(0, 0);
    /** Run next instruction */
    return next();
  }

}

page-watcher.ts

import { NavigationInstruction, Next } from 'aurelia-router';

import { AppStorage } from './app-storage';
import { Notification } from './notification';
import { SystemService } from './services/system-service';
import { SystemVersionModel } from './models/system-version-model';

/**
 * PageWatcher Class
 *
 * @module resources/page-watcher
 */
export class PageWatcher {

  // System Methods ----------------------------------------------------------------------------------------------------

  public run(navigationInstruction: NavigationInstruction, next: Next): Promise<any> {
    /** Set last location */
    AppStorage.set('lastPage', navigationInstruction.fragment, null);
    /** Check for updates */
    SystemService.getVersion()
      .then((response: any) => {
        const localVer = AppStorage.get('ver');
        AppStorage.set('ver', (response as SystemVersionModel).version, null);
        /** See if the version has changed */
        if (localVer && String(localVer) !== String((response as SystemVersionModel).version)) {
          Notification.showInfo('<a href="javascript: location.reload();" >An update was released. Click HERE to refresh.</a>');
        }
      });
    /** Run next instruction */
    return next();
  }

}