Last updated on 13-May-2020 by Jakob Jakobsen Boysen

Jakob Jakobsen Boysen

Platform Lead
boysen@scifeon.com

, Thomas P. Boesen

Thomas P. Boesen

Founder
boesen@scifeon.com

With this plugin you can add routes to custom pages in Scifeon.

Definition

Routes are defined in the contributions.json file. A route is described by the following JSON:

{
  "id":     "string", // required
  "route":  "string", // required
  "title":  "string", // required
  "pageId": "string"  // required
}

• id Used for referencing.
• route The actual URL.
• title The title shown in the browser title.
• pageId The custom page to show when accessing this route.

Note: All elements are required in this definition.

Routing and parameters

The route defines the actual URL. If the route is custom/route, the absolute URL in Scifeon is https://{instance}.scifeon.cloud/#/custom/route, i.e. the route defined everything after /#/.

Parameters

Parameters can defined using colons like this: custom/route/:dynamic. Optional parameters are defined using a question mark, like this: custom/route/:dynamic? The parameters are accessible through the ScifeonUtils-class:

using { inject, Utils } from 'scifeon';
@inject(Utils)
export class CustomPage {
  constructor(utils) {
    if (utils.params.dynamic) {
      this.dynamic = utils.params.dynamic;
    }
  }
}

In the above this.dynamic is only set if the dynamic part of the route custom/route/:dynamic? was found.

Example

The following snippet defines the a custom page and adds a route referring to it. Notice how the pageId refers to the id of the defined page.

{
...
  "contributions": {
    "plugins": [
      {
        "id": "customPageId",
        "src": "src/pages/custom-page",
        "description": "This is a custom page.",
        "types": ["page"]
      }
    ],
    "routes": [
      {
        "id":     "customRouteId",
        "route":  "custom/route", 
        "title":  "Custom Route Page", 
        "pageId": "customPageId"
      }
    ]
  }
}