diff --git a/doc/01-Installation.md b/doc/01-Installation.md index fa6f555..3a8782d 100644 --- a/doc/01-Installation.md +++ b/doc/01-Installation.md @@ -1,5 +1,5 @@ -Installation -============ +Installation +===================================== Requirements ------------ diff --git a/doc/02-Getting-Started.md b/doc/02-Getting-Started.md index 873b7b2..90e58f4 100644 --- a/doc/02-Getting-Started.md +++ b/doc/02-Getting-Started.md @@ -77,4 +77,4 @@ But let's first have a look at our Dashboard once again: ![New on Dashboard](screenshot/02_getting-started/0210_new-on-dashboard.png) -Now let's move on and create some Nodes. +Now let's move on and [create your first Nodes](03-Create-your-first-process-node.md). diff --git a/doc/03-Create-your-first-process-node.md b/doc/03-Create-your-first-process-node.md new file mode 100644 index 0000000..d5a2d6d --- /dev/null +++ b/doc/03-Create-your-first-process-node.md @@ -0,0 +1,69 @@ +Create your first Business Process Node +================================================================================== + +A *Business Process Node* consists of a *name*, *title*, an *operator* and one or +more child nodes. It can be a Root Node, child node of other Business Process +Nodes - or both. + +![Empty Config](screenshot/03_first-root-node/0301_empty-config.png) + +Configuring our first node +-------------------------- + +To create our first *Business Process Node* we click the *Add* button. This +leads to the related configuration form: + +![Add new Node](screenshot/03_first-root-node/0302_add-new-node.png) + +First setting is the *Node name*, an identifier that must be unique throughout +all Nodes that are going to be defined. This identifier will be used in every +link and also in *Check Commands* referring this node from an Icinga *Service +Check*. + +### Set a title + +As uniqueness sometimes leads to not-so-beautiful names, you are additionally +allowed to specify a title. This is what the frontend is going to show: + +![Node Title](screenshot/03_first-root-node/0303_node-title.png) + +### Choose an operator + +Every Business Process requires an *Operator*. This operator defines it's +behaviour, this specifies how it's very own state is going to be calculated: + +![Operator](screenshot/03_first-root-node/0304_operator.png) + +### Specify where to display + +The form suggests to create a *Toplevel Process*. It does so as we are about +to create a new *root node*. We could alternatively also create a sub process. +As we are currently not adding it to another Node, this would lead to an *Unbound +Node* that could be linked later on. + +![Node Display](screenshot/03_first-root-node/0305_display.png) + +### Provide an optional Info URL + +One might also want to provide a link to additional information related to a +specific process. This could be instructions with more technical details or +hints telling what should happen if outage occurs. You might not want to do so +for every single Node, but it might come in handy for your most important (top +level?) nodes: + +![Node Info Url](screenshot/03_first-root-node/0306_info-url.png) + +That's it, your are ready to submit the form. + +### First Business Process Node ready + +You are now shown your first Business Process Node. A red bar reminds you that +your pending changes have not been stored yet: + +![First Node created](screenshot/03_first-root-node/0307_first-node-created.png) + +You could now *Store the Configuration* or move on with adding additional nodes +to complete your configuration. + +**Hint**: the blue arrow makes part of a breadcrumb showing your current position. + You might want to learn more about [breadcrumbs](12-Web-Components-Breadcrumb.md). \ No newline at end of file diff --git a/doc/12-Web-Components-Breadcrumb.md b/doc/12-Web-Components-Breadcrumb.md index dc7c21d..a41ebc5 100644 --- a/doc/12-Web-Components-Breadcrumb.md +++ b/doc/12-Web-Components-Breadcrumb.md @@ -1,5 +1,5 @@ -Web Components: Breadcrumb -========================== +Web Components: Breadcrumb +================================================================ All Business Process renderers show a **breadcrumb** component to always give you a quick indication of your current location. diff --git a/doc/screenshot/03_first-root-node/0301_empty-config.png b/doc/screenshot/03_first-root-node/0301_empty-config.png new file mode 100644 index 0000000..7273fb6 Binary files /dev/null and b/doc/screenshot/03_first-root-node/0301_empty-config.png differ diff --git a/doc/screenshot/03_first-root-node/0302_add-new-node.png b/doc/screenshot/03_first-root-node/0302_add-new-node.png new file mode 100644 index 0000000..0723bd7 Binary files /dev/null and b/doc/screenshot/03_first-root-node/0302_add-new-node.png differ diff --git a/doc/screenshot/03_first-root-node/0303_node-title.png b/doc/screenshot/03_first-root-node/0303_node-title.png new file mode 100644 index 0000000..3eaa431 Binary files /dev/null and b/doc/screenshot/03_first-root-node/0303_node-title.png differ diff --git a/doc/screenshot/03_first-root-node/0304_operator.png b/doc/screenshot/03_first-root-node/0304_operator.png new file mode 100644 index 0000000..f3f852a Binary files /dev/null and b/doc/screenshot/03_first-root-node/0304_operator.png differ diff --git a/doc/screenshot/03_first-root-node/0305_display.png b/doc/screenshot/03_first-root-node/0305_display.png new file mode 100644 index 0000000..368b95c Binary files /dev/null and b/doc/screenshot/03_first-root-node/0305_display.png differ diff --git a/doc/screenshot/03_first-root-node/0306_info-url.png b/doc/screenshot/03_first-root-node/0306_info-url.png new file mode 100644 index 0000000..f307dd0 Binary files /dev/null and b/doc/screenshot/03_first-root-node/0306_info-url.png differ diff --git a/doc/screenshot/03_first-root-node/0307_first-node-created.png b/doc/screenshot/03_first-root-node/0307_first-node-created.png new file mode 100644 index 0000000..041a459 Binary files /dev/null and b/doc/screenshot/03_first-root-node/0307_first-node-created.png differ