From 83007b716669ff2d937f5b4883b3201260bf06dc Mon Sep 17 00:00:00 2001
From: Nikolaos Laskaris <laskarisn@di.uoa.gr>
Date: Thu, 9 Nov 2017 12:46:48 +0200
Subject: [PATCH] --

---
 .../src/app/form/dynamic-form.component.html  | 189 +++++++++---------
 .../src/app/form/dynamic-form.component.ts    |   5 +-
 2 files changed, 97 insertions(+), 97 deletions(-)

diff --git a/dmp-frontend/src/app/form/dynamic-form.component.html b/dmp-frontend/src/app/form/dynamic-form.component.html
index f1886194e..7cb8f93c5 100644
--- a/dmp-frontend/src/app/form/dynamic-form.component.html
+++ b/dmp-frontend/src/app/form/dynamic-form.component.html
@@ -1,107 +1,106 @@
-<div class="panel-body">
-		<div class="col-md-8 col-sm-9">
-				<form [formGroup]="form" (ngSubmit)="onSubmit()" novalidate>
-			
-					<div *ngFor = "let section of dataModel.sections; let i = index;">							
-							<div *ngIf="section.groupFields.length>0 else sectionHeader">												
-									<div  *ngIf="shouldIShow(section);"><h3>{{section.title}}</h3></div>
-									<div *ngFor="let group of section.groupFields">
-											<div *ngIf="shouldIShow(group);"	>	
-										<df-group [group]="group" [dataModel]="dataModel" [form]="getSubForm(group.key)"></df-group>
-											</div>
-									</div>					
-								
-						</div>
-						<ng-template *ngIf="shouldIShow(section);" #sectionHeader>     
-							<h2>{{section.title}}</h2>
-						</ng-template>			
-					</div>		
-			
-					<div *ngFor="let field of dataModel.fields">
-						<div [formGroup]="form" class="form-group">
-							<df-field [field]="field" [form]="form" [dataModel]="dataModel" ></df-field>
-						</div>
-					</div>
-			
-					<!-- <div *ngFor="let group of dataModel.groups">
-						<df-group [group]="group" [dataModel]="dataModel" [form]="getSubForm(group.key)"></df-group>
-					</div> -->
-			
-					<div>
-						<button type="submit" class="btn btn-default btncustom" [disabled]="!form.valid">Save</button>
-						<button type="button" class="btn btn-default btncustom" [disabled]="!form.valid" data-toggle="modal" data-target="#confirmModal">Finalize</button>
-					</div>
-			
-					<div *ngIf="payLoad" class="form-row">
-						<strong>Saved the following values</strong><br>{{payLoad}}
-					</div>
-			
-				</form>
-				<p>Form value: {{ form.value | json }}</p>
-			</div>
-			
-			<div class="col-md-4  col-sm-3">
-				<div ngDraggable style="top:60;"> <!--position:fixed; to ekana sxolio gia na ginetai responsive-->
-						<div class="panel panel-default" >
-							<div class="panel-heading" data-toggle="collapse" href="#collapse-panel">
-								<h4>Table of contents:</h4>
-							</div>
-							<div class="panel-body" id="collapse-panel" class="panel-collapse">
-									<div *ngIf="dataModel.groups.length">
-											<toc [dataModel]="dataModel"  (setPage)="setPage($event)"></toc>
-									</div>
-							</div>
-						</div>
+<div class="col-md-8 col-sm-9">
 
-					
-					
-				</div>
-			</div>
+
+	<div class="panel-body">
 		
-			<!--
-			<div class="col-md-4">
-					<h4>On this page:</h4>
-					<div *ngIf="dataModel.groups.length">
-							<toc [dataModel]="dataModel"></toc>
-					</div>
+		<form [formGroup]="form" (ngSubmit)="onSubmit()" novalidate>
+
+			<div *ngFor = "let section of dataModel.sections; let i = index;">							
+					<div *ngIf="section.groupFields.length>0 else sectionHeader">												
+							<div  *ngIf="shouldIShow(section);"><h3>{{section.title}}</h3></div>
+							<div *ngFor="let group of section.groupFields">
+									<div *ngIf="shouldIShow(group);"	>	
+								<df-group [group]="group" [dataModel]="dataModel" [form]="getSubForm(group.key)"></df-group>
+									</div>
+							</div>					
+						
 				</div>
-			-->
-</div>
+				<ng-template *ngIf="shouldIShow(section);" #sectionHeader>     
+					<h2>{{section.title}}</h2>
+				</ng-template>			
+			</div>		
+
+			<div *ngFor="let field of dataModel.fields">
+				<div [formGroup]="form" class="form-group">
+					<df-field [field]="field" [form]="form" [dataModel]="dataModel" ></df-field>
+				</div>
+			</div>
+
+			<!-- <div *ngFor="let group of dataModel.groups">
+				<df-group [group]="group" [dataModel]="dataModel" [form]="getSubForm(group.key)"></df-group>
+			</div> -->
+
+			<div>
+				<button type="submit" class="btn btn-default btncustom" [disabled]="!form.valid">Save</button>
+				<button type="button" class="btn btn-default btncustom" [disabled]="!form.valid" data-toggle="modal" data-target="#confirmModal">Finalize</button>
+			</div>
+
+			<div *ngIf="payLoad" class="form-row">
+				<strong>Saved the following values</strong><br>{{payLoad}}
+			</div>
+
+		</form>
+		<p>Form value: {{ form.value | json }}</p>
+
+			
+				<!--
+				<div class="col-md-4">
+						<h4>On this page:</h4>
+						<div *ngIf="dataModel.groups.length">
+								<toc [dataModel]="dataModel"></toc>
+						</div>
+					</div>
+				-->
+	</div>
 
 
 
-<div class="text-center">
-	<!-- pagination -->
-	<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 class="text-center">
+		<!-- pagination -->
+		<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 class="panel-footer">
-			<div class="progress">
-					<div class="progress-bar" role="progressbar" aria-valuenow= ""
-					aria-valuemin="0" aria-valuemax="100" [ngStyle]="{'width': dirtyValues + '%'}">
-					  {{dirtyValues}}%
-					</div>
-				  </div>
-			<!-- <button type="button" class="btn btn-info" onclick="signOut();">Sign out</button> -->
-			<a href="#" (click)="signOut2();">Sign out</a>
+		<div class="progress">
+			<div class="progress-bar" role="progressbar" aria-valuenow= "" aria-valuemin="0" aria-valuemax="100" [ngStyle]="{'width': dirtyValues + '%'}">
+				{{dirtyValues}}%
+			</div>
+		</div>
 	</div>
-	
+
+</div>	
+
+
+<div class="col-md-4  col-sm-3"  >  <!-- style="overflow:scroll; height: 100%;"        *ngIf="dataModel.groups.length" -->
+	<div  > <!--  ngDraggable  style="top:60; position:fixed;" to ekana sxolio gia na ginetai responsive-->
+		<div class="panel panel-default" >
+			<div class="panel-heading" data-toggle="collapse" href="#collapse-panel">
+				<h4>Table of contents:</h4>
+			</div>
+			<div class="panel-body" id="collapse-panel" class="panel-collapse">
+				<toc [dataModel]="dataModel"  (setPage)="setPage($event)"></toc>
+			</div>
+		</div>
+	</div>
+</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">
diff --git a/dmp-frontend/src/app/form/dynamic-form.component.ts b/dmp-frontend/src/app/form/dynamic-form.component.ts
index 5a4d9be40..2815630dd 100644
--- a/dmp-frontend/src/app/form/dynamic-form.component.ts
+++ b/dmp-frontend/src/app/form/dynamic-form.component.ts
@@ -51,8 +51,9 @@ export class DynamicFormComponent implements OnInit {
   private fragment: string;
   xml2jsonOBJ: any;
 
-
-
+  expandedForm : boolean = false;
+  expandedToc : boolean = true;
+  
 
   constructor(private qcs: FieldControlService, private serverService: ServerService, private dataModelService: dataModelBuilder, private router: Router,
     private route: ActivatedRoute, private pagerService: PaginationService, private tokenService: TokenService) {