Configuration

The plugin allows for some extra configuration.

{
  enablePageTransitionOut: true,
  blockConfig: {
    maxFindParentPageCount: 50,
  },
  buttonConfig: {
    scrollToNextBlockDuration: 1000,
    scrollToNextBlockOffset: 0,
    maxFindParentBlockCount: 50,
  }
  api: {
    initCall: '/api/page/{page}',
    pageCall: '/api/page/init',
    stripLeadingSlash: false,
    axiosInstance: null,
    layoutCache: true,
  },
  debugLabelStyling: {
    font: '10px/1 sans-serif',
    backgroundColor: 'red',
    color: 'white',
    padding: '5px',
    position: 'absolute',
    top: '0px',
    left: '0px',
    },  
  },
}

enablePageTransitionOut

When this flag is disabled the transition of all the blocks will not be triggered and the route change start.

blockConfig

On block level you can change the following options

maxFindParentPageCount

This is the amount of levels the block will look for a page, you will most likely not change this.

buttonConfig

On button level you can change the following options

scrollToNextBlockDuration

This is the duration of the next block scroll animation in milliseconds

scrollToNextBlockOffset

This is the offset the scrollToNextBlock will apply (for example when you have a fixed header on top of your site)

maxFindParentBlockCount

This is the max amount of levels a button will look up to look for a block. If it exceeds this limit it wil stop and not find the next block.

api

On api level you can change the following options

initCall

This is the path to the init file.

pageCall

This is the path to the page, the {page} part will be replaced with the requested route

stripLeadingSlash

With this flag enabled the block system will always strip out the leading slash from page requests.

axiosInstance

If you want to you can provide your own custom axios instance to the block system. If it's not provided it will use a new instance

layoutCache

If you disable this flag the pages will not be cached in memory and every time the users navigates to the same page it will request it from the pageCall location

debugLabelStyling

All block can contain a debug label which makes it easier to identify which block is which. Here you can overwrite the default styling of the label. It will use Tweenlite to set the properties so you can use anything that TweenLite allows for.