no message

This commit is contained in:
Diamantis Tziotzios 2017-12-11 10:10:54 +02:00
parent c27ca22877
commit ccbd1644b4
14 changed files with 103 additions and 352 deletions

View File

@ -1,160 +1,22 @@
.hide{
display:none;
}
.show {
display:block;
}
.ng-valid[required], .ng-valid.required {
border-left: 5px solid #42A948; /* green */
}
.ng-invalid:not(form) {
border-left: 5px solid #a94442; /* red */
}
.navbar-center {
position: absolute;
.full-width {
width: 100%;
left: 0;
text-align: center;
vertical-align: middle;
margin:0 auto;
}
.invisible {
display:none;
}
.visible {
display:block;
}
.cursor{
cursor: pointer;
}
.navbar {
-webkit-box-shadow: 0px 0px 12px 2px rgba(0,0,0,0.73);
-moz-box-shadow: 0px 0px 12px 2px rgba(0,0,0,0.73);
box-shadow: 0px 0px 12px 2px rgba(0,0,0,0.73);
margin-bottom: 5px;
}
.navbar-title {
/*
width: 100%;
position: absolute;
left: 0;
*/
margin:0 auto;
text-align: center;
}
.navbar-toggle {
z-index:3;
}
.arrange-horizontally > * {
display: inline-block;
/*text-align: center;*/
white-space: nowrap
}
.arrange-vertically > * {
display: block;
}
/* FOR THE SIDEBAR */
.parent_div{
height:100%;
width:100%;
float:left;
}
.child_div_left{
height:100%;
float:left;
}
.child_div_right{
height:100%;
float:right;
}
.sidenav {
display:none;
border-radius: 15px;
z-index: 1;
width: 0px;
/*
top: 0px;
.full-height {
height: 100%;
left: 0px;
*/
overflow-x: hidden;
background-color: #f8f8f8;
transition: 0.5s;
padding-top: 60px;
}
.sidenav.expanded{
width: 15%;
html,
body {
height: 100%;
width: 100%;
}
app-root {
display: block;
border-style: solid;
border-width: thin;
border-radius: 15px;
padding-top: 60px;
height: 100%;
}
#appBody {
width : 100%;
transition: 0.5s;
}
#appBody.expanded{
width: 85%;
}
.sidenav a {
padding: 8px 8px 8px 32px;
text-decoration: none;
font-size: 25px;
color: #818181;
display: block;
transition: 0.5s;
}
.sidenav a:hover {
color: #000;
}
.sidenav .closebtn {
position: absolute;
top: 0;
right: 25px;
font-size: 36px;
margin-left: 50px;
}
#main {
transition: margin-left .5s;
/*padding: 16px;*/
}
@media screen and (max-height: 450px) {
.sidenav {padding-top: 15px;}
.sidenav a {font-size: 18px;}
}
html {
overflow-y: hidden
}

View File

@ -85,26 +85,4 @@
<breadcrumb></breadcrumb>
</div>
<div class="parent_div">
<div id="appSidebar" class="sidenav child_div_left">
<a class="cursor">My Workspace</a>
<a class="cursor">Orphan Datasets</a>
<a class="cursor">...</a>
<a class="cursor">Basically</a>
<a class="cursor">George</a>
<a class="cursor">tell us</a>
<a class="cursor">what to</a>
<a class="cursor">put here</a>
</div>
<div id="appBody" class="child_div_right">
<router-outlet></router-outlet>
</div>
</div>
<router-outlet></router-outlet>

View File

@ -1,4 +1,4 @@
import { Component, OnInit} from '@angular/core';
import { Component, OnInit, ViewEncapsulation} from '@angular/core';
import { ServerService } from './services/server.service';
import { JsonObjest } from '../app/entities/JsonObject.class';
import { TokenService, TokenProvider } from './services/login/token.service';
@ -16,7 +16,8 @@ declare var $ :any;
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css'],
providers: []
providers: [],
encapsulation: ViewEncapsulation.None
})
export class AppComponent implements OnInit {

View File

@ -3,10 +3,10 @@
}
.field-component {
border:1px solid grey;
/* border:1px solid grey;
border-radius: 2px;
padding: 10px;
margin-bottom: 10px;
margin-bottom: 10px; */
}
.field-extended-desc {

View File

@ -2,12 +2,14 @@
[ngSwitch]="field.viewStyle.renderStyle">
<h5 *ngIf="field.title">{{path + ' ' + field.title}}</h5>
<h5 *ngIf="field.description">{{field.description}}</h5>
<h5 *ngIf="field.extendedDescription" class="field-extended-desc">
<i>{{field.extendedDescription}}</i>
</h5>
<div class="content-left-margin">
<div [class.content-left-margin]="field.title">
<h5 *ngIf="field.description">{{field.description}}</h5>
<h5 *ngIf="field.extendedDescription" class="field-extended-desc">
<i>{{field.extendedDescription}}</i>
</h5>
<div *ngSwitchCase="'freetext'">
<input class="form-control" formControlName="value">
</div>

View File

@ -3,10 +3,10 @@
}
.fieldset-component {
border:1px solid grey;
/* border:1px solid grey;
border-radius: 2px;
padding: 10px;
margin-bottom: 10px;
margin-bottom: 10px; */
}
.fieldset-extended-desc {
@ -14,5 +14,5 @@
}
.content-left-margin {
margin-left: 10px;
/* margin-left: 10px; */
}

View File

@ -1,12 +1,18 @@
<div *ngIf="visibilityRulesService.isElementVisible(pathName,compositeField.id)" class="fieldset-component" [id]="compositeField.id" [formGroup]="form">
<h4 *ngIf="compositeField.title">{{compositeField.title}}</h4>
<div class="content-left-margin">
<h4 *ngIf="compositeField.description">{{compositeField.description}}</h4>
<h4 *ngIf="compositeField.extendedDescription" class="fieldset-extended-desc">
<i>{{compositeField.extendedDescription}}</i>
</h4>
<div *ngFor="let field of compositeField.fields; let i = index;">
<df-field [field]="field" [form]="form.get('fields').get(''+i)" [path]="path" [pathName]="pathName+'.fields.'+i"></df-field>
<div *ngIf="visibilityRulesService.isElementVisible(pathName,compositeField.id)" [id]="compositeField.id" [formGroup]="form">
<df-field *ngIf="compositeField.fields.length == 1" [field]="compositeField.fields[0]" [form]="form.get('fields').get(''+0)" [path]="path" [pathName]="pathName+'.fields.'+0"></df-field>
<div *ngIf="compositeField.fields.length > 1" class="fieldset-component">
<h4 *ngIf="compositeField.title">{{compositeField.title}}</h4>
<div class="content-left-margin">
<h4 *ngIf="compositeField.description">{{compositeField.description}}</h4>
<h4 *ngIf="compositeField.extendedDescription" class="fieldset-extended-desc">
<i>{{compositeField.extendedDescription}}</i>
</h4>
<div *ngFor="let field of compositeField.fields; let i = index;">
<df-field [field]="field" [form]="form.get('fields').get(''+i)" [path]="path" [pathName]="pathName+'.fields.'+i"></df-field>
</div>
</div>
</div>
</div>

View File

@ -7,10 +7,10 @@
}
.group-component {
border:1px solid grey;
/* border:1px solid grey;
border-radius: 2px;
padding: 10px;
margin-bottom: 10px;
margin-bottom: 10px; */
}
.group-extended-desc {
@ -18,5 +18,5 @@
}
.content-left-margin {
margin-left: 10px;
/* margin-left: 10px; */
}

View File

@ -1,12 +1,12 @@
<div *ngIf="visibilityRulesService.isElementVisible(pathName,group.id)" class="group-component" [id]="group.id" [formGroup]="form">
<h4>{{path + ' ' + group.title}}</h4>
<!-- <h4>{{path + ' ' + group.title}}</h4> -->
<div class="content-left-margin">
<h5 *ngIf="group.description">{{group.description}}</h5>
<!-- <h5 *ngIf="group.description">{{group.description}}</h5>
<h5 *ngIf="group.extendedDescription" class="group-extended-desc">
<i>{{group.extendedDescription}}</i>
</h5>
</h5> -->
<div *ngFor="let compositeField of group.compositeFields; let i = index;">
<df-composite-field [compositeField]="compositeField" [form]="form.get('compositeFields').get(''+i)" [path]="path+'.'+(i+1)"
<df-composite-field [compositeField]="compositeField" [form]="form.get('compositeFields').get(''+i)" [path]="path"
[pathName]="pathName+'.compositeFields.'+i"></df-composite-field>
</div>
</div>

View File

@ -1,22 +1,32 @@
<p-panel *ngIf="visibilityRulesService.isElementVisible(pathName,section.id)" class="section-component" [toggleable]="true">
<p-header>
<div class="ui-helper-clearfix">
<h2>{{path}} {{section.title}}</h2>
</div>
</p-header>
<div [id]="section.id" [formGroup]="form">
<h3 *ngIf="section.description">{{section.description}}</h3>
<h4 *ngIf="section.extendedDescription">{{section.extendedDescription}}</h4>
<div *ngIf="section.fieldGroups">
<div *ngFor="let group of section.fieldGroups; let j = index;">
<df-group [group]="group" [form]="form.get('fieldGroups').get(''+j)" [path]="path+'.'+(j+1)" [pathName]="pathName+'.fieldGroups.'+j"></df-group>
<div *ngIf="visibilityRulesService.isElementVisible(pathName,section.id)" class="panel-group" style="margin-top:10px;">
<div class="panel panel-default">
<div class="panel-heading clearfix">
<a data-toggle="collapse" href="#{{section.id}}" class="panel-title pull-left" style="padding-top: 7.5px;">{{path}} {{section.title}}</a>
<!-- <a *ngIf="!form.get('fieldGroups').get(''+i).get('title').value" data-toggle="collapse" href="#{{indexPath + 'g' + i}}" class="panel-title pull-left"
style="padding-top: 7.5px;">{{i + 1}}. Group {{i + 1}}</a> -->
<div class="btn-group pull-right">
<a data-toggle="collapse" href="#{{section.id}}" class="panel-title pull-left" style="margin-left:5px;padding-top: 7.5px;">
<span class="glyphicon glyphicon-minus"></span>
</a>
</div>
</div>
<div *ngIf="section.sections">
<div *ngFor="let itemsection of section.sections; let j = index;">
<df-section [section]="itemsection" [form]="form.get('sections').get(''+j)" [path]="path+'.'+(j+1)" [pathName]="pathName+'.sections.'+j"></df-section>
<div id="{{section.id}}" class="panel-collapse collapse in">
<div class="panel-body">
<div [id]="section.id" [formGroup]="form">
<h3 *ngIf="section.description">{{section.description}}</h3>
<h4 *ngIf="section.extendedDescription">{{section.extendedDescription}}</h4>
<div *ngIf="section.fieldGroups">
<div *ngFor="let group of section.fieldGroups; let j = index;">
<df-group [group]="group" [form]="form.get('fieldGroups').get(''+j)" [path]="path+'.'+(j+1)" [pathName]="pathName+'.fieldGroups.'+j"></df-group>
</div>
</div>
<div *ngIf="section.sections">
<div *ngFor="let itemsection of section.sections; let j = index;">
<df-section [section]="itemsection" [form]="form.get('sections').get(''+j)" [path]="path+'.'+(j+1)" [pathName]="pathName+'.sections.'+j"></df-section>
</div>
</div>
</div>
</div>
</div>
</div>
</p-panel>
</div>

View File

@ -1,34 +1,15 @@
.full-width {
width: 100%;
}
.ui-steps .ui-steps-item {
width: 25%;
}
.ui-steps.steps-custom {
margin-bottom: 30px;
}
.ui-steps.steps-custom .ui-steps-item .ui-menuitem-link {
height: 10px;
padding: 0 1em;
}
.ui-steps.steps-custom .ui-steps-item .ui-steps-number {
background-color: #0081c2;
color: #FFFFFF;
display: inline-block;
width: 36px;
border-radius: 50%;
margin-top: -14px;
margin-bottom: 10px;
}
.ui-steps.steps-custom .ui-steps-item .ui-steps-title {
color: #555555;
}
.ng-sidebar {
width: 40%;
}
.toc-container {
background: #f9f9f9 none repeat scroll 0 0;
border: 1px solid #aaa;
display: table;
font-size: 95%;
margin-bottom: 1em;
padding: 20px;
width: auto;
}

View File

@ -1,7 +1,7 @@
<div class="ui-g dynamic-form">
<ng-sidebar-container class="ui-g" style="height: 100vh;">
<ng-sidebar mode="push" style="height: 100vh;" position="right" [(opened)]="visibleSidebar">
<table-of-content [model]="dataModel"></table-of-content>
<div class="ui-g dynamic-formc full-width full-height">
<ng-sidebar-container>
<ng-sidebar mode="push" position="right" [(opened)]="visibleSidebar">
<table-of-content class="toc-container full-height" [model]="dataModel"></table-of-content>
</ng-sidebar>
<div class="ui-g" ng-sidebar-content>
@ -27,97 +27,4 @@
</div>
</div>
</ng-sidebar-container>
</div>
<!-- <div class="col-md-12 form-footer-container">
<div>
</div>
</div> -->
<!-- <div class="col-md-12 form-footer-seperator" >
</div>
<div>
<button type="button" class="btn btn-default btncustom" [disabled]="!form.valid || finalizeStatus" (click)="SaveForm();">Save</button>
<button type="button" class="btn btn-default btncustom" [disabled]="!form.valid || finalizeStatus" data-toggle="modal" data-target="#confirmModal">Finalize</button>
</div>
-->
<!--
<div *ngIf="payLoad" class="form-row">
<strong>Saved the following values</strong><br>{{payLoad}}
</div>
-->
<!-- <div class="text-center">
<ul *ngIf="pagination.pages && pagination.pages.length" class="pagination">
<li [ngClass]="{disabled:pagination.currentPage === 1}">
<a (click)="setPage(1)" class="cursor-link" >First</a>
</li>
<li [ngClass]="{disabled:pagination.currentPage === 1}">
<a (click)="setPage(pagination.currentPage - 1)" class="cursor-link">Previous</a>
</li>
<li *ngFor="let page of pagination.pages" [ngClass]="{active:pagination.currentPage === page}">
<a (click)="setPage(page)" class="cursor-link">{{page}}</a>
</li>
<li [ngClass]="{disabled:pagination.currentPage === pagination.totalPages}">
<a (click)="setPage(pagination.currentPage + 1)" class="cursor-link">Next</a>
</li>
<li [ngClass]="{disabled:pagination.currentPage === pagination.totalPages}">
<a (click)="setPage(pagination.totalPages)" class="cursor-link">Last</a>
</li>
</ul>
</div> -->
<!-- <div *ngIf="!expandedToc" class="collapsed-div-caret" (click)="toggleTOC()">
-->
<!--
<i class="fa toc-toggler" [ngClass]="{true:'fa-arrow-right', false:'fa-arrow-left'}[expandedToc]" aria-hidden="true" ><div>Show ToC</div></i>
-->
<!-- <i class="fa toc-toggler" aria-hidden="true" ><div>Show ToC</div></i>
</div>
<div *ngIf="expandedToc" class="col-md-12" style="width:200px; text-align: center;">
<h4 style="display: inline-block; text-align: center; width:150px;">Table of Contents</h4>
<div class="child-div-caret" style="display: inline-block; width:50px;" (click)="toggleTOC()"> -->
<!--
<i class="fa toc-toggler" [ngClass]="{true:'fa-arrow-right', false:'fa-arrow-left'}[expandedToc]" aria-hidden="true" ><div>Shrink</div></i>
-->
<!-- <i class="fa toc-toggler" aria-hidden="true"><div>(hide)</div></i>
</div>
</div>
-->
<!-- <div class="col-md-12 form-footer-container">
<button type="button" class="btn btn-primary" (click)="submit();">Save and Finalize</button>
</div> -->
<!--Modal for Confirmation -->
<!-- <div class="modal fade" id="confirmModal" tabindex="-1" role="dialog" aria-labelledby="newVersionDmpModalLabel" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Confirmation Message</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
<div class="modal-body">
<p>Are you sure you want to save and finalize?</p>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
<button type="button" class="btn btn-primary" (click)="SaveFinalizeForm();">Save and Finalize</button>
</div>
</div>
</div>
</div> -->
</div>

View File

@ -1,11 +1,15 @@
<!-- All contents in the first page -->
<a (click)="scrollToId(model.id,page)">{{path+' '+model.title}}</a>
<a (click)="scrollToId(model.id,page)">{{path + ' ' + model.title}}</a>
<div *ngIf="model.fieldGroups.length > 0">
<div *ngFor="let fieldsetModel of model.fieldGroups[0].compositeFields let i = index">
<table-of-contents-field *ngIf="model.fieldGroups[0].compositeFields[i].fields.length == 1" [page]='page' [model]="model.fieldGroups[0].compositeFields[i].fields[0]"
[index]="i" [path]="path+'.'+(i+1)"></table-of-contents-field>
<table-of-contents-fieldset *ngIf="model.fieldGroups[0].compositeFields[i].fields.length > 1" [page]='page' [model]="fieldsetModel"
[index]="i" [path]="path+'.'+(i+1)"> </table-of-contents-fieldset>
</div>
</div>
<ul>
<li *ngFor="let groupModel of model.fieldGroups let i = index">
<table-of-contents-group [page]='page' [model]="groupModel" [index]="i" [path]="path+'.'+(i+1)"> </table-of-contents-group>
</li>
</ul>
<!-- All contents in the first page -->
<ul>
<li *ngFor="let sectionModel of model.sections let i = index">

View File

@ -51,6 +51,6 @@
</head>
<body>
<app-root></app-root>
<app-root class="full-height full-width"></app-root>
</body>
</html>