Configurable tours

[elizavetaRa]

Description

Configurable tours

Following implemented:

• Property "tours" in "options" in config.js for linking json files for tours saved in packages/web-runtime/tours
  Example: "options": {"tours": ["https://localhost:9200/tours/tour1.json", "https://localhost:9200/tours/tour2.json"],..}

• Each json file in packages/web-runtime/tours is considered as a tour and has the following properties:

  • translations: object with language codes as keys and translatable tour options (tourName, tooltip, steps) as values
  • options of tour from shepherd.js
  • autostart option including location (route name) and timeout in ms to trigger. Only triggering once (when triggered, saved to localStorage)
  • allowLocations option: array with locations in which the tour will be available. If set, the tour will not be available in other locations
  • denyLocations option: array with locations in which the tour will not be available. If set is not set, the tour will be available in all locations except of these locations. Is not considered if allowLocations is set

• By one tour the button in the topbar will be the button to start this tour, by several the component will be shown

• Buttons inside each step have hard-coded options "back", `"next"

Related Issue

• Fixes <Guide through the interface>

How Has This Been Tested?

• test environment:
• test case 1:
• test case 2:

Screenshots:

Types of changes

• Bug fix (non-breaking change which fixes an issue)
• New feature (non-breaking change which adds functionality)
• Breaking change (fix or feature that would cause existing functionality to change)
• Technical debt
• Tests

Checklist:

• Code changes
• Unit tests added
• Acceptance tests added
• Documentation ticket raised:

Open tasks:

• automatize showing buttons "next" and "back"
• implement the possibility to attach events to steps

[update-docs]

Thanks for opening this pull request! The maintainers of this repository would appreciate it if you would create a changelog item based on your changes.

[elizavetaRa]

@pascalwengerter @fschade @kulmann please check the implementation and add ideas
@tbsbdr critique, ideas from you?

[diocas]

Btw, @kulmann I believe this PR can be closed. I've adapted it to an external extension by using the vue portal library you also use: cernbox@6215548
Would this make sense for you as a way of personalising the top bar?

[dschmidt]

I've added a link to your idea/suggestion to our Extension System Epic