Skip to content

R
Requirement Formalization Tool
Commit 61c047f4 authored by Thodoris Nestoridis's avatar Thodoris Nestoridis
Browse files
Options

ui changes

parent 4392d977
Hide whitespace changes
Inline Side-by-side
Showing with 118 additions and 38 deletions
reqtool/ReqmanAngular11/src/app/app-routing.module.ts
View file @ 61c047f4
......@@ -13,12 +13,9 @@ import { GroupboilComponent } from './components/groupboil/groupboil.component';
import { AddGroupboilComponent } from './components/add-groupboil/add-groupboil.component';
import { InstancesListComponent } from './components/instances-list/instances-list.component';
/*import { PrefixListComponent } from './components/prefix-list/prefix-list.component';
import { PrefixDetailsComponent } from './components/prefix-details/prefix-details.component';
import { AddPrefixComponent } from './components/add-prefix/add-prefix.component';*/
const routes: Routes = [
{ path: '', redirectTo: 'login', pathMatch: 'full' },
{ path: '', redirectTo: 'groupboilerplates', pathMatch: 'full' },
{ path: 'login', component: LoginComponent },
{ path: 'signup', component: SignupComponent },
{ path: 'groupboilerplates', component: GroupboilComponent, canActivate: [AuthGuard] },
......@@ -27,10 +24,6 @@ const routes: Routes = [
{ path: 'groupboilerplates/:gb/boilerplates/add-boilerplate', component: AddBoilerplateComponent, canActivate: [AuthGuard] },
{ path: 'groupboilerplates/add-groupboil', component: AddGroupboilComponent, canActivate: [AuthGuard] },
{ path: 'dictionary', component: InstancesListComponent, canActivate: [AuthGuard] }
/*{ path: '', redirectTo: 'tutorials', pathMatch: 'full' },
{ path: 'prefix', component: PrefixListComponent },
{ path: 'prefix/:id', component: PrefixDetailsComponent },
{ path: 'add', component: AddPrefixComponent }*/
];
......
reqtool/ReqmanAngular11/src/app/components/add-boilerplate/add-boilerplate.component.html
View file @ 61c047f4
......@@ -2,49 +2,48 @@
<ol class="breadcrumb">
<li class="breadcrumb-item"><a routerLink="../../../">Projects</a></li>
<li class="breadcrumb-item"><a routerLink="../">Boilerplate List</a></li>
<li class="breadcrumb-item" aria-current="page">Add Boilerplate</li>
<li class="breadcrumb-item" aria-current="page">Add Requirement</li>
</ol>
</nav>
<div>
<div class="submit-form">
<mat-grid-list cols="2">
<div class="first">
<div class="submit-form">
<form name="myForm" ngNativeValidate>
<div class="form-group">
<label for="title">Requirement Title</label>
<input
type="text"
class="form-control"
id="title"
required
[(ngModel)]="boilerplate.title"
name="title"
/>
<input type="text" class="form-control" id="title"
required
[(ngModel)]="boilerplate.title" name="title">
</div>
<div class="form-group">
<label for="has_prefix">Prefix</label>
<label for="has_prefix" placement="left" ngbTooltip="A requirement may have a prefix that can be a simple one
or possibly combine multiple prefixes in sequence separated with a logic connective.">Prefix</label>
<input
type="checkbox"
class="form-control"
id="has_prefix"
required
[(ngModel)]="boilerplate.has_prefix"
name="has_prefix"
/>
</div>
<div class="form-group">
<label for="has_main">Main</label>
<div class="form-group" >
<label for="has_main" placement="left" ngbTooltip="A requirement shall always have a main clause. The syntax for the main clause,may be used for behavior definitions
for a System/Function, for specifying implementation details for a System/Interface or for subordinate design specifications">Main</label>
<input
type="checkbox"
class="form-control"
id="has_main"
required
[(ngModel)]="boilerplate.has_main"
name="has_main"
[disabled]="true"
/>
</div>
<div class="form-group">
<label for="has_suffix">Suffix</label>
<label for="has_suffix" placement="left" ngbTooltip="A requirement may have a suffix.">Suffix</label>
<input
type="checkbox"
class="form-control"
......@@ -55,8 +54,36 @@
/>
</div>
<button (click)="saveBoilerplate()" class="btn btn-success" >Submit</button>
<button (click)="saveBoilerplate()" class="btn btn-success">Submit</button>
</form>
</div>
</div>
<!-- Dictionary -->
<div class="second">
<div class="search-hero">
<input class="form-control" type="text" name="search" [(ngModel)]="searchText" autocomplete="off" placeholder="Start searching for the syntax of our boilerplate language.">
</div>
<mat-tab-group mat-align-tabs="center">
<div *ngFor="let items of systems| filter:searchText">
<mat-tab label={{items.pos}}>
<div *ngFor="let item of items.data| filter:searchText">
<mat-accordion>
<mat-expansion-panel>
<mat-expansion-panel-header>
<mat-panel-title>
{{ item.name }}
</mat-panel-title>
<mat-panel-description>
<h3>{{ item.details }}</h3>
</mat-panel-description>
</mat-expansion-panel-header>
<p>Details : {{item.explanation}}</p>
</mat-expansion-panel>
</mat-accordion>
</div>
</mat-tab>
</div>
</mat-tab-group>
</div>
</mat-grid-list>
\ No newline at end of file
reqtool/ReqmanAngular11/src/app/components/add-boilerplate/add-boilerplate.component.scss
View file @ 61c047f4
......@@ -2,3 +2,16 @@
max-width: 400px;
margin: auto;
}
.first{
width: 68%;
}
.second{
width: 40%;
position: absolute;
top: 1%;
right: 0px;
height:100%;
overflow:auto;
}
\ No newline at end of file
reqtool/ReqmanAngular11/src/app/components/add-boilerplate/add-boilerplate.component.ts
View file @ 61c047f4
......@@ -15,12 +15,14 @@ export class AddBoilerplateComponent implements OnInit {
group_of_boilerplate: this.route.snapshot.params.gb,
title: "",
has_prefix: false,
has_main: false,
has_main: true,
has_suffix: false
};
submitted = false;
private readonly notifier: NotifierService;
searchText = '';
constructor(private boilerplatelService: BoilerplateService, private route: ActivatedRoute,
private router: Router, notifierService: NotifierService) {
this.notifier = notifierService;
......@@ -63,4 +65,40 @@ export class AddBoilerplateComponent implements OnInit {
};
}
prefixs = [
{name: 'P1', details: "If/Unless <logical expression>", explanation: 'Expresses a logical condition. Paraphrases: in case, provided that, on condition that.'},
{name: 'P2', details: "As soon as <occuring functionality>", explanation: 'Expresses a temporal stimulation concerned with the point in time of an completed occuring functionality. Paraphrases: in the moment, immediately, once.'},
{name: 'P3', details: "As long as <occuring functionality>", explanation: 'Expresses a temporal condition concerned with a period. The pre x clause and the main clause take place simultaneously. Paraphrases: meanwhile'},
];
mains = [
{name: 'M1', details: "system/function shall [not] set [<quantifier>] item [to stateValue]", explanation: 'Sets item Paraphrases: initiate, reset, update.'},
{name: 'M2', details: "system/function shall [not] set state to stateValue", explanation: 'Sets state to value Paraphrases: initiate, reset, update.'},
{name: 'M3', details: "system/function shall [not] send [<quantifier>] item", explanation: 'Sends item Paraphrases: forward.'},
{name: 'M4', details: "system/function shall [not] receive [<quantifier>] item", explanation: 'Receives item Paraphrases: accept, acquire.'},
{name: 'M5', details: "system/function shall [not] ingest flow", explanation: 'Ingests flow. Paraphrases: get.'},
{name: 'M6', details: "system/function shall [not] emit flow", explanation: 'Emits flow. Paraphrases: produce.'},
{name: 'M7', details: "system shall [not] perform function", explanation: 'System requirement. Paraphrases: execute.'},
{name: 'M8', details: "function shall [not] invoke function", explanation: 'Function invokes another function. Paraphrases: call, request'},
{name: 'M9', details: "system shall [not] present interface [to system]", explanation: 'Presents interface. Paraphrases: provide'},
{name: 'M10', details: "system/interface shall [not] transfer flow/item", explanation: 'Transfers TraversingConcept. Paraphrases: transmit, broadcast'},
{name: 'M11', details: "system shall [not] interact with system [using <connection>] [as defined in <text>]", explanation: 'System requirement expressing interface interraction'},
{name: 'M12', details: "system shall [not] have state state [with values stateSet]", explanation: 'System requirement expressing system modes'},
{name: 'M13', details: "system state stateValue shall [not] have substate state [with values stateSet]", explanation: 'System requirement expressing system sub modes per mode'},
{name: 'M14', details: "system item shall [not] take values from stateSet", explanation: 'System requirement expressing item stateSet'},
{name: 'M15', details: "system item shall [not] be composed from item", explanation: 'System requirement expressing item decomposition stateSet'},
{name: 'M16', details: "system shall [not] contain system", explanation: 'System decomposition.'},
];
suffixs = [
{name: 'S1', details: "<numerical-afirmative> j <closed-interval> [per <time-unit>]", explanation: ''},
{name: 'S2', details: "after/before flow", explanation: ''},
{name: 'S3', details: "[every/for a period of/within/for at least] <number> <time-unit> [from flow]", explanation: ''},
{name: 'S4', details: "at the beginning/at the end", explanation: ''},
{name: 'S5', details: "at even intervals", explanation: ''},
{name: 'S6', details: "sequentially", explanation: ''},
];
systems = [{pos:"Prefix", data: this.prefixs}, {pos:"Main", data: this.mains}, {pos:"Suffix", data: this.suffixs}]
}
reqtool/ReqmanAngular11/src/app/components/boilerplate-details/boilerplate-details.component.html
View file @ 61c047f4
......@@ -5,20 +5,21 @@
<ol class="breadcrumb">
<li class="breadcrumb-item"><a routerLink="../../../../">Projects</a></li>
<li class="breadcrumb-item"><a routerLink="../../">Boilerplate List</a></li>
<li class="breadcrumb-item" aria-current="page">Edit Boilerplate</li>
<li class="breadcrumb-item" aria-current="page">Edit Requirement</li>
</ol>
</nav>
<mat-grid-list cols="2">
<div class="first">
<div *ngIf="currentboilerplate.id" class="edit-form">
<form>
<form ngNativeValidate>
<div class="form-group" style="display:flex; flex-direction: row; align-items: center">
<label for="title" style="margin-right: 50px;">Boilerplate title</label>
<label for="title" style="margin-right: 50px;">Requirement title</label>
<input
name="title"
id="title"
type="text"
class="form-control"
required
[(ngModel)]="currentboilerplate.title"
style="width: 63%;"/>
</div>
......
reqtool/ReqmanAngular11/src/app/components/login/login.component.html
View file @ 61c047f4
......@@ -31,13 +31,10 @@
<mat-form-field aclass="example-full-width">
<mat-label>Enter your password</mat-label>
<input matInput [type]="hide ? 'password' : 'text'" [formControl]="password" required>
<button mat-icon-button matSuffix (click)="hide = !hide" [attr.aria-label]="'Hide password'" [attr.aria-pressed]="hide">
<mat-icon>{{hide ? 'visibility_off' : 'visibility'}}</mat-icon>
</button>
</mat-form-field>
</mat-card-content>
<!-- Sign in button -->
<button mat-stroked-button color="primary" class="btn-block" type="submit" (click)="login(email.value, password.value)">Log in</button>
<button mat-stroked-button color="primary" class="btn-block" type="submit" (click)="login(email.value, password.value)" >Log in</button>
<!-- Register -->
<p>Not a member?
<a href="#">Register</a>
......
reqtool/ReqmanAngular11/src/app/components/login/login.component.scss
View file @ 61c047f4
......@@ -10,6 +10,7 @@
.main-wrapper {
height: 100%;
padding-top:100px;
}
.positronx {
......
reqtool/ReqmanAngular11/src/app/components/main-details/main-details.component.html
View file @ 61c047f4
<div class="form-row">
<div class="col">
<form class="form-group form-inline">
<form class="form-group form-inline" ngNativeValidate>
<mat-form-field class="example-full-width">
<mat-label *ngIf="this.subjectsControl.value !=null" >Subject : {{this.subjectsControl.value.slice(0, this.subjectsControl.value.indexOf(':'))}}</mat-label>
<input type="text"
......@@ -8,6 +8,7 @@
aria-label="Number"
matInput
[formControl]="subjectsControl"
required
[matAutocomplete]="automainsub"
style="width: 100%;">
<mat-autocomplete autoActiveFirstOption #automainsub="matAutocomplete" showPanel="true" [displayWith]="displayFn">
......@@ -67,6 +68,7 @@
aria-label="Number"
matInput
[formControl]="shallControl"
required
[matAutocomplete]="autoshall"
>
<mat-autocomplete autoActiveFirstOption #autoshall ="matAutocomplete" >
......@@ -86,6 +88,7 @@
aria-label="Number"
matInput
[formControl]="verbControl"
required
[matAutocomplete]="autoverb"
>
<mat-autocomplete autoActiveFirstOption #autoverb ="matAutocomplete">
......@@ -156,6 +159,7 @@
aria-label="Number"
matInput
[formControl]="fifuintsysstatsetControl"
required
[matAutocomplete]="autofifuintsysstatset"
>
<mat-autocomplete autoActiveFirstOption #autofifuintsysstatset ="matAutocomplete" showPanel="true" [displayWith]="displayFn">
......
reqtool/ReqmanAngular11/src/app/components/prefix-details/prefix-details.component.html
View file @ 61c047f4
<div class="form-row">
<div class="col">
<form class="form-group form-inline">
<form class="form-group form-inline" ngNativeValidate>
<mat-form-field class="example-full-width">
<mat-label>Prefix</mat-label>
<input type="text"
placeholder="Pick one"
aria-label="Number"
matInput
required
[formControl]="simpleprefixControl"
[matAutocomplete]="autosimpleprefix"
>
......@@ -26,6 +27,7 @@
placeholder="Pick one"
aria-label="Number"
matInput
required
[formControl]="subjectsControl"
[matAutocomplete]="autosub"
>
......@@ -47,6 +49,7 @@
placeholder="Pick one"
aria-label="Number"
matInput
required
[formControl]="verbsControl"
[matAutocomplete]="autoverb"
>
......@@ -68,6 +71,7 @@
placeholder="Pick one"
aria-label="Number"
matInput
required
[formControl]="objectsControl"
[matAutocomplete]="autobjects"
>
......
reqtool/ReqmanAngular11/src/app/components/suffix-details/suffix-details.component.html
View file @ 61c047f4
<div class="form-row">
<div class="col">
<form class="form-group form-inline">
<form class="form-group form-inline" ngNativeValidate>
<mat-form-field class="example-full-width">
<mat-label>Suffix</mat-label>
<input type="text"
......@@ -8,6 +8,7 @@
aria-label="Number"
matInput
[formControl]="suffixControl"
required
[matAutocomplete]="autosuffix"
>
<mat-autocomplete autoActiveFirstOption #autosuffix="matAutocomplete">
......@@ -35,6 +36,7 @@
aria-label="Number"
matInput
[formControl]="mumerical_unitsControl"
required
[matAutocomplete]="automumerical_units"
>
<mat-autocomplete autoActiveFirstOption #automumerical_units="matAutocomplete">
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment