Skip to content

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

ui changes

parent 4392d977
Show 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'; ...@@ -13,12 +13,9 @@ import { GroupboilComponent } from './components/groupboil/groupboil.component';
import { AddGroupboilComponent } from './components/add-groupboil/add-groupboil.component'; import { AddGroupboilComponent } from './components/add-groupboil/add-groupboil.component';
import { InstancesListComponent } from './components/instances-list/instances-list.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 = [ const routes: Routes = [
{ path: '', redirectTo: 'login', pathMatch: 'full' }, { path: '', redirectTo: 'groupboilerplates', pathMatch: 'full' },
{ path: 'login', component: LoginComponent }, { path: 'login', component: LoginComponent },
{ path: 'signup', component: SignupComponent }, { path: 'signup', component: SignupComponent },
{ path: 'groupboilerplates', component: GroupboilComponent, canActivate: [AuthGuard] }, { path: 'groupboilerplates', component: GroupboilComponent, canActivate: [AuthGuard] },
...@@ -27,10 +24,6 @@ const routes: Routes = [ ...@@ -27,10 +24,6 @@ const routes: Routes = [
{ path: 'groupboilerplates/:gb/boilerplates/add-boilerplate', component: AddBoilerplateComponent, canActivate: [AuthGuard] }, { path: 'groupboilerplates/:gb/boilerplates/add-boilerplate', component: AddBoilerplateComponent, canActivate: [AuthGuard] },
{ path: 'groupboilerplates/add-groupboil', component: AddGroupboilComponent, canActivate: [AuthGuard] }, { path: 'groupboilerplates/add-groupboil', component: AddGroupboilComponent, canActivate: [AuthGuard] },
{ path: 'dictionary', component: InstancesListComponent, 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 @@ ...@@ -2,49 +2,48 @@
<ol class="breadcrumb"> <ol class="breadcrumb">
<li class="breadcrumb-item"><a routerLink="../../../">Projects</a></li> <li class="breadcrumb-item"><a routerLink="../../../">Projects</a></li>
<li class="breadcrumb-item"><a routerLink="../">Boilerplate List</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> </ol>
</nav> </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"> <div class="form-group">
<label for="title">Requirement Title</label> <label for="title">Requirement Title</label>
<input <input type="text" class="form-control" id="title"
type="text"
class="form-control"
id="title"
required required
[(ngModel)]="boilerplate.title" [(ngModel)]="boilerplate.title" name="title">
name="title"
/>
</div> </div>
<div class="form-group"> <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 <input
type="checkbox" type="checkbox"
class="form-control" class="form-control"
id="has_prefix" id="has_prefix"
required
[(ngModel)]="boilerplate.has_prefix" [(ngModel)]="boilerplate.has_prefix"
name="has_prefix" name="has_prefix"
/> />
</div> </div>
<div class="form-group"> <div class="form-group" >
<label for="has_main">Main</label> <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 <input
type="checkbox" type="checkbox"
class="form-control" class="form-control"
id="has_main" id="has_main"
required
[(ngModel)]="boilerplate.has_main" [(ngModel)]="boilerplate.has_main"
name="has_main" name="has_main"
[disabled]="true"
/> />
</div> </div>
<div class="form-group"> <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 <input
type="checkbox" type="checkbox"
class="form-control" class="form-control"
...@@ -55,8 +54,36 @@ ...@@ -55,8 +54,36 @@
/> />
</div> </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> </div>
</mat-tab-group>
</div> </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 @@ ...@@ -2,3 +2,16 @@
max-width: 400px; max-width: 400px;
margin: auto; 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 { ...@@ -15,12 +15,14 @@ export class AddBoilerplateComponent implements OnInit {
group_of_boilerplate: this.route.snapshot.params.gb, group_of_boilerplate: this.route.snapshot.params.gb,
title: "", title: "",
has_prefix: false, has_prefix: false,
has_main: false, has_main: true,
has_suffix: false has_suffix: false
}; };
submitted = false; submitted = false;
private readonly notifier: NotifierService; private readonly notifier: NotifierService;
searchText = '';
constructor(private boilerplatelService: BoilerplateService, private route: ActivatedRoute, constructor(private boilerplatelService: BoilerplateService, private route: ActivatedRoute,
private router: Router, notifierService: NotifierService) { private router: Router, notifierService: NotifierService) {
this.notifier = notifierService; this.notifier = notifierService;
...@@ -63,4 +65,40 @@ export class AddBoilerplateComponent implements OnInit { ...@@ -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 @@ ...@@ -5,20 +5,21 @@
<ol class="breadcrumb"> <ol class="breadcrumb">
<li class="breadcrumb-item"><a routerLink="../../../../">Projects</a></li> <li class="breadcrumb-item"><a routerLink="../../../../">Projects</a></li>
<li class="breadcrumb-item"><a routerLink="../../">Boilerplate List</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> </ol>
</nav> </nav>
<mat-grid-list cols="2"> <mat-grid-list cols="2">
<div class="first"> <div class="first">
<div *ngIf="currentboilerplate.id" class="edit-form"> <div *ngIf="currentboilerplate.id" class="edit-form">
<form> <form ngNativeValidate>
<div class="form-group" style="display:flex; flex-direction: row; align-items: center"> <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 <input
name="title" name="title"
id="title" id="title"
type="text" type="text"
class="form-control" class="form-control"
required
[(ngModel)]="currentboilerplate.title" [(ngModel)]="currentboilerplate.title"
style="width: 63%;"/> style="width: 63%;"/>
</div> </div>
......
reqtool/ReqmanAngular11/src/app/components/login/login.component.html
View file @ 61c047f4
...@@ -31,13 +31,10 @@ ...@@ -31,13 +31,10 @@
<mat-form-field aclass="example-full-width"> <mat-form-field aclass="example-full-width">
<mat-label>Enter your password</mat-label> <mat-label>Enter your password</mat-label>
<input matInput [type]="hide ? 'password' : 'text'" [formControl]="password" required> <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-form-field>
</mat-card-content> </mat-card-content>
<!-- Sign in button --> <!-- 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 --> <!-- Register -->
<p>Not a member? <p>Not a member?
<a href="#">Register</a> <a href="#">Register</a>
......
reqtool/ReqmanAngular11/src/app/components/login/login.component.scss
View file @ 61c047f4
...@@ -10,6 +10,7 @@ ...@@ -10,6 +10,7 @@
.main-wrapper { .main-wrapper {
height: 100%; height: 100%;
padding-top:100px;
} }
.positronx { .positronx {
......
reqtool/ReqmanAngular11/src/app/components/main-details/main-details.component.html
View file @ 61c047f4
<div class="form-row"> <div class="form-row">
<div class="col"> <div class="col">
<form class="form-group form-inline"> <form class="form-group form-inline" ngNativeValidate>
<mat-form-field class="example-full-width"> <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> <mat-label *ngIf="this.subjectsControl.value !=null" >Subject : {{this.subjectsControl.value.slice(0, this.subjectsControl.value.indexOf(':'))}}</mat-label>
<input type="text" <input type="text"
...@@ -8,6 +8,7 @@ ...@@ -8,6 +8,7 @@
aria-label="Number" aria-label="Number"
matInput matInput
[formControl]="subjectsControl" [formControl]="subjectsControl"
required
[matAutocomplete]="automainsub" [matAutocomplete]="automainsub"
style="width: 100%;"> style="width: 100%;">
<mat-autocomplete autoActiveFirstOption #automainsub="matAutocomplete" showPanel="true" [displayWith]="displayFn"> <mat-autocomplete autoActiveFirstOption #automainsub="matAutocomplete" showPanel="true" [displayWith]="displayFn">
...@@ -67,6 +68,7 @@ ...@@ -67,6 +68,7 @@
aria-label="Number" aria-label="Number"
matInput matInput
[formControl]="shallControl" [formControl]="shallControl"
required
[matAutocomplete]="autoshall" [matAutocomplete]="autoshall"
> >
<mat-autocomplete autoActiveFirstOption #autoshall ="matAutocomplete" > <mat-autocomplete autoActiveFirstOption #autoshall ="matAutocomplete" >
...@@ -86,6 +88,7 @@ ...@@ -86,6 +88,7 @@
aria-label="Number" aria-label="Number"
matInput matInput
[formControl]="verbControl" [formControl]="verbControl"
required
[matAutocomplete]="autoverb" [matAutocomplete]="autoverb"
> >
<mat-autocomplete autoActiveFirstOption #autoverb ="matAutocomplete"> <mat-autocomplete autoActiveFirstOption #autoverb ="matAutocomplete">
...@@ -156,6 +159,7 @@ ...@@ -156,6 +159,7 @@
aria-label="Number" aria-label="Number"
matInput matInput
[formControl]="fifuintsysstatsetControl" [formControl]="fifuintsysstatsetControl"
required
[matAutocomplete]="autofifuintsysstatset" [matAutocomplete]="autofifuintsysstatset"
> >
<mat-autocomplete autoActiveFirstOption #autofifuintsysstatset ="matAutocomplete" showPanel="true" [displayWith]="displayFn"> <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="form-row">
<div class="col"> <div class="col">
<form class="form-group form-inline"> <form class="form-group form-inline" ngNativeValidate>
<mat-form-field class="example-full-width"> <mat-form-field class="example-full-width">
<mat-label>Prefix</mat-label> <mat-label>Prefix</mat-label>
<input type="text" <input type="text"
placeholder="Pick one" placeholder="Pick one"
aria-label="Number" aria-label="Number"
matInput matInput
required
[formControl]="simpleprefixControl" [formControl]="simpleprefixControl"
[matAutocomplete]="autosimpleprefix" [matAutocomplete]="autosimpleprefix"
> >
...@@ -26,6 +27,7 @@ ...@@ -26,6 +27,7 @@
placeholder="Pick one" placeholder="Pick one"
aria-label="Number" aria-label="Number"
matInput matInput
required
[formControl]="subjectsControl" [formControl]="subjectsControl"
[matAutocomplete]="autosub" [matAutocomplete]="autosub"
> >
...@@ -47,6 +49,7 @@ ...@@ -47,6 +49,7 @@
placeholder="Pick one" placeholder="Pick one"
aria-label="Number" aria-label="Number"
matInput matInput
required
[formControl]="verbsControl" [formControl]="verbsControl"
[matAutocomplete]="autoverb" [matAutocomplete]="autoverb"
> >
...@@ -68,6 +71,7 @@ ...@@ -68,6 +71,7 @@
placeholder="Pick one" placeholder="Pick one"
aria-label="Number" aria-label="Number"
matInput matInput
required
[formControl]="objectsControl" [formControl]="objectsControl"
[matAutocomplete]="autobjects" [matAutocomplete]="autobjects"
> >
......
reqtool/ReqmanAngular11/src/app/components/suffix-details/suffix-details.component.html
View file @ 61c047f4
<div class="form-row"> <div class="form-row">
<div class="col"> <div class="col">
<form class="form-group form-inline"> <form class="form-group form-inline" ngNativeValidate>
<mat-form-field class="example-full-width"> <mat-form-field class="example-full-width">
<mat-label>Suffix</mat-label> <mat-label>Suffix</mat-label>
<input type="text" <input type="text"
...@@ -8,6 +8,7 @@ ...@@ -8,6 +8,7 @@
aria-label="Number" aria-label="Number"
matInput matInput
[formControl]="suffixControl" [formControl]="suffixControl"
required
[matAutocomplete]="autosuffix" [matAutocomplete]="autosuffix"
> >
<mat-autocomplete autoActiveFirstOption #autosuffix="matAutocomplete"> <mat-autocomplete autoActiveFirstOption #autosuffix="matAutocomplete">
...@@ -35,6 +36,7 @@ ...@@ -35,6 +36,7 @@
aria-label="Number" aria-label="Number"
matInput matInput
[formControl]="mumerical_unitsControl" [formControl]="mumerical_unitsControl"
required
[matAutocomplete]="automumerical_units" [matAutocomplete]="automumerical_units"
> >
<mat-autocomplete autoActiveFirstOption #automumerical_units="matAutocomplete"> <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