diff --git a/guides/_subsections/getting-help.md b/guides/_subsections/getting-help.md new file mode 100644 index 00000000..af8033d6 --- /dev/null +++ b/guides/_subsections/getting-help.md @@ -0,0 +1,60 @@ +## [Getting Help](#getting-help) + +The **Cryostat** web application contains online help resources that you can use to learn more about +how to use **Cryostat** directly within its interface. + +### [Welcome Tour](#welcome-tour) + +The *Welcome Tour* is a first-run introduction to **Cryostat** that you will see the first time you log in. +If you clear your browser's local storage, use a private browsing window, or use a different browser, you will see the *Tour* again. + +{% include howto_step.html + summary="Welcome Tour" + image-name="2.4.0/welcome-tour.png" + caption="Click through the Welcome Tour to learn how to use **Cryostat**." + text="The Welcome Tour provides an introduction to **Cryostat**'s layout and indicates where further tutorials and help can be found." +%} + +If you have completed the tour previously, feel free to click Skip Tour and dive right in to **Cryostat**. +If you have not completed the tour previously and are unsure what **Cryostat** can do or how to use it, click Get Started +to begin the guided walkthrough of the **Cryostat Web** application. + +{% include howto_step.html + summary="Tour Begins" + image-name="2.4.0/guided-tour.png" + caption="Click Next through the Welcome Tour to learn how to use **Cryostat**." + text="Continue through the tour to learn how the UI is organized and where you can find additional help." +%} + +#### [Return to the Tour](#return-to-the-tour) + +You can return to the tour and revisit its contents at any time. + +Whenever you feel the need to return to the tour and revisit its contents, simply click the `?` Help icon in the +application masthead, then click Guided tour in the dropdown menu that appears. + +{% include howto_step.html + summary="Open Help Menu" + image-name="2.4.0/masthead-help.png" + caption="The ? Help menu on the application masthead contains additional resources." + text="Click Guided tour to relaunch the same tour." +%} + +### [Quick Starts](#quickstarts) + +**Cryostat** also includes some *Quick Start* online tutorials to guide you through some common tasks. These are more in-depth +and will directly guide you through the UI as you complete them by operating on your own real applications. + +{% include howto_step.html + summary="Open Help Menu" + image-name="2.4.0/masthead-help.png" + caption="The ? Help menu on the application masthead contains additional resources." + text="Click Quick Starts to view the tutorial catalog." +%} + +{% include howto_step.html + summary="View the Quick Start Catalog" + image-name="2.4.0/quick-start-catalog.png" + caption="The Quick Start catalog contains a series of tutorials you can follow to learn how to accomplish specific tasks." + text="Select and complete the tutorials which interest you. You can revisit this catalog at any time and re-do tutorials as many times as you like." +%} diff --git a/guides/_subsections/navigate-the-dashboard.md b/guides/_subsections/navigate-the-dashboard.md index 92facc72..1bc5245a 100644 --- a/guides/_subsections/navigate-the-dashboard.md +++ b/guides/_subsections/navigate-the-dashboard.md @@ -1,5 +1,5 @@ ## [Navigate the Dashboard](#navigate-the-dashboard) -The *Dashboard* is the first view you will see when you log into Cryostat. It provides a high-level overview of the state of your Cryostat instance and the target JVM applications it is monitoring. +The *Dashboard* is the first content view you will see when you log into Cryostat. It provides a high-level overview of the state of your Cryostat instance and the target JVM applications it is monitoring. {% include_relative _subsections/common/navigate-to-dashboard.md %} diff --git a/guides/index.md b/guides/index.md index 0677e302..e2585204 100644 --- a/guides/index.md +++ b/guides/index.md @@ -9,6 +9,8 @@ common actions and workflows of interest and why they are useful. * auto-gen TOC: {:toc} +{% include_relative _subsections/getting-help.md %} + {% include_relative _subsections/navigate-the-dashboard.md %} {% include_relative _subsections/use-topology-view.md %} diff --git a/images/2.4.0/guided-tour.png b/images/2.4.0/guided-tour.png new file mode 100644 index 00000000..5f12ecd8 Binary files /dev/null and b/images/2.4.0/guided-tour.png differ diff --git a/images/2.4.0/masthead-help.png b/images/2.4.0/masthead-help.png new file mode 100644 index 00000000..fff19623 Binary files /dev/null and b/images/2.4.0/masthead-help.png differ diff --git a/images/2.4.0/quick-start-catalog.png b/images/2.4.0/quick-start-catalog.png new file mode 100644 index 00000000..43212c12 Binary files /dev/null and b/images/2.4.0/quick-start-catalog.png differ diff --git a/images/2.4.0/welcome-tour.png b/images/2.4.0/welcome-tour.png new file mode 100644 index 00000000..bd8956d4 Binary files /dev/null and b/images/2.4.0/welcome-tour.png differ