Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat(docs): add use-cases for progressbar component #4744

Merged
merged 1 commit into from
Oct 26, 2018
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
9 changes: 9 additions & 0 deletions docs/spec/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -147,6 +147,15 @@

## Progressbar

[Progressbar. Static](progressbar/progressbar.examples.static.use-case.md)

[Progressbar. Dynamic](progressbar/progressbar.examples.dynamic.use-case.md)

[Progressbar. Stacked](progressbar/progressbar.examples.stacked.use-case.md)

[Progressbar. Configuring defaults](progressbar/progressbar.examples.config-default.use-case.md)


## Rating

## Sortable
Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,18 @@
10.4: Progressbar configuring defaults example
==============================================
**Primary Actor**: User

**Scope**: Ngx-bootstrap DEMO / BS version 3&4

**Goal**: Show user how to configure defaults of progressbar

Main success scenario:
----------------------
1. User open Progressbar demo page
2. User click on Configuring defaults sub-menu
3. User see 1 progressbar with specific value and type as in Template src
4. Component src should be written with ProgressbarConfig

Variations:
-----------
2*. User scroll to Configuring defaults sub-menu
26 changes: 26 additions & 0 deletions docs/spec/progressbar/progressbar.examples.dynamic.use-case.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,26 @@
10.2: Progressbar dynamic example
=================================
**Primary Actor**: User

**Scope**: Ngx-bootstrap DEMO / BS version 3&4

**Goal**: Show user dynamic progressbar example

Main success scenario:
----------------------
1. User open Progressbar demo page
2. User click on Dynamic sub-menu
3. User see 3 progressbars with [value]="dynamic" and "Randomize" button
4. First should be default, second - type="success" and third - type depend on value
5. When user click "Randomize", then value of each progressbar changed
6. If value of third progressbar >= 25 && < 50, then text "info" shown

Extentions:
-----------
6*. If value of third progressbar >= 50 && < 75, then text "warning" shown
6**. If value of third progressbar < 25, then text "success" shown
6***. If value of third progressbar >= 75, then text "danger" shown

Variations:
-----------
2*. User scroll to Dynamic sub-menu
23 changes: 23 additions & 0 deletions docs/spec/progressbar/progressbar.examples.stacked.use-case.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,23 @@
10.3: Progressbar stacked example
=================================
**Primary Actor**: User

**Scope**: Ngx-bootstrap DEMO / BS version 3&4

**Goal**: Show user stacked progressbar example

Main success scenario:
----------------------
1. User open Progressbar demo page
2. User click on Stacked sub-menu
3. User see 1 progressbar with 4 bars inside and "Randomize" button
4. When user click "Randomize", then value of each bar changed
5. Each bar should have appropriate percentage

Extentions:
-----------
4*. When user click "Randomize", then amount of bars inside could be less than 4

Variations:
-----------
2*. User scroll to Stacked sub-menu
20 changes: 20 additions & 0 deletions docs/spec/progressbar/progressbar.examples.static.use-case.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,20 @@
10.1: Progressbar static example
================================
**Primary Actor**: User

**Scope**: Ngx-bootstrap DEMO / BS version 3&4

**Goal**: Show user static progressbar example

Main success scenario:
----------------------
1. User open Progressbar demo page
2. User click on Static sub-menu
3. User see 3 progressbars
4. Current progressbar value matches value from template src
5. Second progressbar should be with type="warning"
5. Third progressbar should be with type="danger" and with animation

Variations:
-----------
2*. User scroll to Static sub-menu